feat(web): add icons/emoji to selectors, sync bot enable status and plugin list in sidebar

- Bot adapter selector: show adapter icon in trigger and dropdown items
- Knowledge engine selector: show plugin icon derived from plugin_id
- Pipeline binding selector: show pipeline emoji in trigger and dropdown items
- Knowledge base selectors (single/multi): show KB emoji in all views
- Sidebar bot entries: show green/gray status dot on adapter icon for enable/disable state
- Sidebar plugin list: sync after install/uninstall from all entry points (PluginInstalledComponent, plugins page, marketplace page)
- Pipeline form: add cursor-pointer to left-side tab list buttons
- Clean up unused onBotDeleted prop from BotForm

web/src/app/home/bots/components/bot-form/BotForm.tsx

@@ -65,13 +65,11 @@ const getFormSchema = (t: (key: string) => string) =>
 export default function BotForm({
   initBotId,
   onFormSubmit,
-  onBotDeleted,
   onNewBotCreated,
   onDirtyChange,
 }: {
   initBotId?: string;
   onFormSubmit: (value: z.infer<ReturnType<typeof getFormSchema>>) => void;
-  onBotDeleted: () => void;
   onNewBotCreated: (botId: string) => void;
   onDirtyChange?: (dirty: boolean) => void;
 }) {
@@ -234,6 +232,7 @@ export default function BotForm({
         return {
           label: item.name,
           value: item.uuid ?? '',
+          emoji: item.emoji,
         };
       }),
     );
@@ -461,13 +460,40 @@ export default function BotForm({
                     <FormControl>
                       <Select onValueChange={field.onChange} {...field}>
                         <SelectTrigger>
-                          <SelectValue placeholder={t('bots.selectPipeline')} />
+                          {field.value ? (
+                            (() => {
+                              const pipeline = pipelineNameList.find(
+                                (p) => p.value === field.value,
+                              );
+                              return (
+                                <div className="flex items-center gap-2">
+                                  {pipeline?.emoji && (
+                                    <span className="text-sm shrink-0">
+                                      {pipeline.emoji}
+                                    </span>
+                                  )}
+                                  <span>{pipeline?.label ?? field.value}</span>
+                                </div>
+                              );
+                            })()
+                          ) : (
+                            <SelectValue
+                              placeholder={t('bots.selectPipeline')}
+                            />
+                          )}
                         </SelectTrigger>
                         <SelectContent>
                           <SelectGroup>
                             {pipelineNameList.map((item) => (
                               <SelectItem key={item.value} value={item.value}>
-                                {item.label}
+                                <div className="flex items-center gap-2">
+                                  {item.emoji && (
+                                    <span className="text-sm shrink-0">
+                                      {item.emoji}
+                                    </span>
+                                  )}
+                                  <span>{item.label}</span>
+                                </div>
                               </SelectItem>
                             ))}
                           </SelectGroup>
@@ -508,13 +534,35 @@ export default function BotForm({
                       value={field.value}
                     >
                       <SelectTrigger className="w-[240px]">
-                        <SelectValue placeholder={t('bots.selectAdapter')} />
+                        {field.value ? (
+                          <div className="flex items-center gap-2">
+                            <img
+                              src={httpClient.getAdapterIconURL(field.value)}
+                              alt=""
+                              className="h-5 w-5 rounded"
+                            />
+                            <span>
+                              {adapterNameList.find(
+                                (a) => a.value === field.value,
+                              )?.label ?? field.value}
+                            </span>
+                          </div>
+                        ) : (
+                          <SelectValue placeholder={t('bots.selectAdapter')} />
+                        )}
                       </SelectTrigger>
                       <SelectContent>
                         <SelectGroup>
                           {adapterNameList.map((item) => (
                             <SelectItem key={item.value} value={item.value}>
-                              {item.label}
+                              <div className="flex items-center gap-2">
+                                <img
+                                  src={httpClient.getAdapterIconURL(item.value)}
+                                  alt=""
+                                  className="h-5 w-5 rounded"
+                                />
+                                <span>{item.label}</span>
+                              </div>
                             </SelectItem>
                           ))}
                         </SelectGroup>

web/src/app/home/bots/components/bot-form/ChooseEntity.ts

@@ -6,4 +6,5 @@ export interface IChooseAdapterEntity {
 export interface IPipelineEntity {
   label: string;
   value: string;
+  emoji?: string;
 }