Merge branch 'rc/new-plugin' into refactor/new-plugin-system

web/src/app/home/bots/BotDetailDialog.tsx

@@ -127,10 +127,8 @@ export default function BotDetailDialog({
                 <BotForm
                   initBotId={undefined}
                   onFormSubmit={handleFormSubmit}
-                  onFormCancel={handleFormCancel}
                   onBotDeleted={handleBotDeleted}
                   onNewBotCreated={handleNewBotCreated}
-                  hideButtons={true}
                 />
               </div>
               <DialogFooter className="px-6 py-4 border-t shrink-0">
@@ -161,7 +159,7 @@ export default function BotDetailDialog({
           <SidebarProvider className="items-start w-full flex">
             <Sidebar
               collapsible="none"
-              className="hidden md:flex h-[80vh] w-40 min-w-[120px] border-r bg-white"
+              className="hidden md:flex h-[80vh] w-40 min-w-[120px] border-r bg-white dark:bg-black"
             >
               <SidebarContent>
                 <SidebarGroup>
@@ -199,10 +197,8 @@ export default function BotDetailDialog({
                   <BotForm
                     initBotId={botId}
                     onFormSubmit={handleFormSubmit}
-                    onFormCancel={handleFormCancel}
                     onBotDeleted={handleBotDeleted}
                     onNewBotCreated={handleNewBotCreated}
-                    hideButtons={true}
                   />
                 )}
                 {activeMenu === 'logs' && botId && (

web/src/app/home/bots/components/bot-card/botCard.module.css

@@ -6,12 +6,22 @@
   box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.2);
   padding: 1.2rem;
   cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+:global(.dark) .cardContainer {
+  background-color: #1f1f22;
+  box-shadow: 0;
 }
 
 .cardContainer:hover {
   box-shadow: 0px 2px 8px 0 rgba(0, 0, 0, 0.1);
 }
 
+:global(.dark) .cardContainer:hover {
+  box-shadow: 0;
+}
+
 .iconBasicInfoContainer {
   width: 100%;
   height: 100%;
@@ -47,6 +57,11 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
+  color: #1a1a1a;
+}
+
+:global(.dark) .basicInfoName {
+  color: #f0f0f0;
 }
 
 .basicInfoDescription {
@@ -58,6 +73,10 @@
   text-overflow: ellipsis;
 }
 
+:global(.dark) .basicInfoDescription {
+  color: #888888;
+}
+
 .basicInfoAdapterContainer {
   display: flex;
   flex-direction: row;
@@ -71,12 +90,20 @@
   color: #626262;
 }
 
+:global(.dark) .basicInfoAdapterIcon {
+  color: #a0a0a0;
+}
+
 .basicInfoAdapterLabel {
   font-size: 1.2rem;
   font-weight: 500;
   color: #626262;
 }
 
+:global(.dark) .basicInfoAdapterLabel {
+  color: #a0a0a0;
+}
+
 .basicInfoPipelineContainer {
   display: flex;
   flex-direction: row;
@@ -90,12 +117,20 @@
   margin-top: 0.2rem;
 }
 
+:global(.dark) .basicInfoPipelineIcon {
+  color: #a0a0a0;
+}
+
 .basicInfoPipelineLabel {
   font-size: 1.2rem;
   font-weight: 500;
   color: #626262;
 }
 
+:global(.dark) .basicInfoPipelineLabel {
+  color: #a0a0a0;
+}
+
 .bigText {
   white-space: nowrap;
   overflow: hidden;

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

@@ -64,17 +64,13 @@ const getFormSchema = (t: (key: string) => string) =>
 export default function BotForm({
   initBotId,
   onFormSubmit,
-  onFormCancel,
   onBotDeleted,
   onNewBotCreated,
-  hideButtons = false,
 }: {
   initBotId?: string;
   onFormSubmit: (value: z.infer<ReturnType<typeof getFormSchema>>) => void;
-  onFormCancel: () => void;
   onBotDeleted: () => void;
   onNewBotCreated: (botId: string) => void;
-  hideButtons?: boolean;
 }) {
   const { t } = useTranslation();
   const formSchema = getFormSchema(t);
@@ -214,6 +210,7 @@ export default function BotForm({
     });
     setAdapterNameToDynamicConfigMap(adapterNameToDynamicConfigMap);
   }
+
   async function getBotConfig(
     botId: string,
   ): Promise<z.infer<typeof formSchema>> {
@@ -397,7 +394,7 @@ export default function BotForm({
                       <FormLabel>{t('bots.bindPipeline')}</FormLabel>
                       <FormControl>
                         <Select onValueChange={field.onChange} {...field}>
-                          <SelectTrigger>
+                          <SelectTrigger className="bg-[#ffffff] dark:bg-[#2a2a2e]">
                             <SelectValue
                               placeholder={t('bots.selectPipeline')}
                             />
@@ -470,7 +467,7 @@ export default function BotForm({
                         }}
                         value={field.value}
                       >
-                        <SelectTrigger className="w-[180px]">
+                        <SelectTrigger className="w-[180px] bg-[#ffffff] dark:bg-[#2a2a2e]">
                           <SelectValue placeholder={t('bots.selectAdapter')} />
                         </SelectTrigger>
                         <SelectContent className="fixed z-[1000]">
@@ -527,45 +524,6 @@ export default function BotForm({
               </div>
             )}
           </div>
-
-          {!hideButtons && (
-            <div className="sticky bottom-0 left-0 right-0 bg-background border-t p-4 mt-4">
-              <div className="flex justify-end gap-2">
-                {!initBotId && (
-                  <Button
-                    type="submit"
-                    onClick={form.handleSubmit(onDynamicFormSubmit)}
-                  >
-                    {t('common.submit')}
-                  </Button>
-                )}
-                {initBotId && (
-                  <>
-                    <Button
-                      type="button"
-                      variant="destructive"
-                      onClick={() => setShowDeleteConfirmModal(true)}
-                    >
-                      {t('common.delete')}
-                    </Button>
-                    <Button
-                      type="button"
-                      onClick={form.handleSubmit(onDynamicFormSubmit)}
-                    >
-                      {t('common.save')}
-                    </Button>
-                  </>
-                )}
-                <Button
-                  type="button"
-                  variant="outline"
-                  onClick={() => onFormCancel()}
-                >
-                  {t('common.cancel')}
-                </Button>
-              </div>
-            </div>
-          )}
         </form>
       </Form>
     </div>

web/src/app/home/bots/components/bot-log/view/botLog.module.css

@@ -18,6 +18,11 @@
   cursor: pointer;
 }
 
+:global(.dark) .botLogCardContainer {
+  background-color: #1f1f22;
+  border: 1px solid #2a2a2e;
+}
+
 .listHeader {
   width: 100%;
   height: 2.5rem;

web/src/app/home/bots/page.tsx

@@ -92,7 +92,7 @@ export default function BotConfigPage() {
   }
 
   return (
-    <div className={styles.configPageContainer}>
+    <div>
       <BotDetailDialog
         open={detailDialogOpen}
         onOpenChange={setDetailDialogOpen}