add selection indicators

css/style.css

@@ -24,4 +24,4 @@ div.row-widget.stRadio > div[role="radiogroup"] > label[data-baseweb="radio"]:ha
 /*hide the circle of the radio button*/
 div.row-widget.stRadio > div[role="radiogroup"] > label[data-baseweb="radio"] > div:first-child {
     display: none;
-}
+}

pages/Gallery.py

@@ -34,6 +34,11 @@ class GalleryApp:
         if 'selected_dict' not in st.session_state:
             st.session_state['selected_dict'] = {}
 
+        # clear up empty entries in seleted_dict
+        for prompt_id in list(st.session_state.selected_dict.keys()):
+            if len(st.session_state.selected_dict[prompt_id]) == 0:
+                st.session_state.selected_dict.pop(prompt_id)
+
         if 'gallery_focus' not in st.session_state:
             st.session_state.gallery_focus = {'tag': None, 'prompt': None}
 
@@ -261,6 +266,23 @@ class GalleryApp:
 
         # return prompt_tags, tag, prompt_id, items
 
+    def text_coloring_add(self, tobe_colored:list, total_items, color_name='orange'):
+        if color_name in ['orange', 'red', 'green', 'blue', 'violet', 'yellow']:
+            colored = [f':{color_name}[{item}]' if item in tobe_colored else item for item in total_items]
+        else:
+            colored = [f'[{color_name}] {item}' if item in tobe_colored else item for item in total_items]
+        return colored
+
+    def text_coloring_remove(self, tobe_removed):
+        if isinstance(tobe_removed, str):
+            if tobe_removed.startswith(':'):
+                tobe_removed = tobe_removed.split('[')[-1][:-1]
+
+            elif tobe_removed.startswith('['):
+                tobe_removed = tobe_removed.split(']')[-1][1:]
+        return tobe_removed
+
+
     def app(self):
         # print(st.session_state.gallery_focus)
         st.write('### Model Visualization and Retrieval')
@@ -279,8 +301,17 @@ class GalleryApp:
         else:
             tag_focus_idx = prompt_tags.index(st.session_state.gallery_focus['tag'])
 
+        # add coloring to tag based on selection
+        tags_tobe_colored = self.promptBook[self.promptBook['prompt_id'].isin(st.session_state.selected_dict.keys())]['tag'].unique()
+        # colored_prompt_tags = [f':orange[{tag}]' if tag in tags_tobe_colored else tag for tag in prompt_tags]
+        colored_prompt_tags = self.text_coloring_add(tags_tobe_colored, prompt_tags, color_name='orange')
+
         # save tag to session state on change
-        tag = st.radio('Select a tag', prompt_tags, index=tag_focus_idx, horizontal=True, key='tag', label_visibility='collapsed')
+        tag = st.radio('Select a tag', colored_prompt_tags, index=tag_focus_idx, horizontal=True, key='tag', label_visibility='collapsed')
+
+        # remove coloring from tag
+        tag = self.text_coloring_remove(tag)
+        print('tag: ', tag)
 
         # print('current state: ', st.session_state.gallery_state)
 
@@ -299,8 +330,17 @@ class GalleryApp:
             # st.caption('Select a prompt')
             subset_selector = st.columns([3, 1])
             with subset_selector[0]:
-                selected_prompt = selectbox('Select prompt', prompts, key=f'prompt_{tag}', no_selection_label='---', label_visibility='collapsed', index=prompt_focus_idx)
-                # st.session_state.prompt_idx_last_time = prompts.index(selected_prompt) if selected_prompt else 0
+
+                # add coloring to prompt based on selection
+                prompts_tobe_colored = self.promptBook[self.promptBook['prompt_id'].isin(st.session_state.selected_dict.keys())]['prompt'].unique()
+                colored_prompts = self.text_coloring_add(prompts_tobe_colored, prompts, color_name='✅')
+
+                selected_prompt = selectbox('Select prompt', colored_prompts, key=f'prompt_{tag}', no_selection_label='---', label_visibility='collapsed', index=prompt_focus_idx)
+
+                # remove coloring from prompt
+                selected_prompt = self.text_coloring_remove(selected_prompt)
+                print('selected_prompt: ', selected_prompt)
+                st.session_state.prompt_idx_last_time = prompts.index(selected_prompt) if selected_prompt else 0
 
             if selected_prompt is None:
                 # st.markdown(':orange[Please select a prompt above👆]')
@@ -417,6 +457,11 @@ class GalleryApp:
                         if select:
                             st.session_state.selected_dict[item['prompt_id']].append(item['modelVersion_id'])
                             self.remove_ranking_states(item['prompt_id'])
+
+                            # add focus to session state
+                            st.session_state.gallery_focus['tag'] = item['tag']
+                            st.session_state.gallery_focus['prompt'] = item['prompt']
+
                             st.experimental_rerun()
 
                     # st.write(item)