Merge branch 'main' of https://github.com/devforth/adminforth-agent

Author: NoOne7135

custom/CustomAutoScrollContainer.vue

@@ -4,6 +4,7 @@
     class="auto-scroll-container mask-y"
     :wrapperStyle = "wrapperStyle" 
     :contentStyle = "contentStyle"
+    :autoHide = "scrollBarAutoHide"
     @scroll="handleScroll"
   >
     <slot />
@@ -28,10 +29,12 @@ const props = withDefaults(defineProps<{
   behavior?: ScrollBehavior
   wrapperStyle?: Record<string, string>
   contentStyle?: Record<string, string>
+  scrollBarAutoHide?: boolean
 }>(), {
   enabled: true,
   threshold: 50,
-  behavior: 'instant'
+  behavior: 'instant',
+  scrollBarAutoHide: true
 })
 
 const containerRef = ref<HTMLDivElement | null>(null)
@@ -153,4 +156,8 @@ defineExpose({
       transparent
     );
   }
+
+  .scrollbar__thumb {
+    border-radius: 0.25rem;
+  }
 </style>

custom/conversation_area/ProcessingTimeline.vue

@@ -21,8 +21,9 @@
         v-show="isExpanded"
         :threshold="5"
         :wrapperStyle="{
-          marginRight: '8rem',
+          marginRight: '1rem',
         }"
+        :scrollBarAutoHide="false"
       >
         <ol class="ml-8 my-2 relative border-l border-l-2 border-black border-default border-listTableHeadingText dark:border-darkListTableHeadingText">
           <template v-for="(part, index) in ToolOrReasoningParts" :key="index">

custom/conversation_area/ReasoningRenderer.vue

@@ -17,17 +17,12 @@
       />
     </h3>
     <transition name="expand">
-      <CustomAutoScrollContainer
-        v-if="isExpanded" v-show="isExpanded" class="text-sm max-h-64 pl-4"
-        :wrapperStyle="{
-          marginRight: '8rem',
-        }"
-        :enabled="isStreaming"
-      >
-        <IncremarkContent
-          :content="reasoningText"
-        />
-      </CustomAutoScrollContainer>
+      <IncremarkContent
+        v-if="isExpanded" 
+        v-show="isExpanded"
+        class="pl-4 text-sm"
+        :content="reasoningText"
+      />
     </transition>    
   </li>
 </template>

custom/conversation_area/TextRenderer.vue

@@ -1,10 +1,10 @@
 <template>
   <div
-    class="max-w-[80%] flex px-4 m-2 rounded-xl border border-gray-200 dark:border-gray-700"
+    class="flex px-4 m-2 rounded-xl border border-gray-200 dark:border-gray-700"
     @click="handleMarkdownLinkClick"
     :class="[
       hasVegaLite ? 'w-full' : '',
-      props.role === 'user' ? 'bg-lightListTableHeading dark:bg-darkListTableHeading self-end' 
+      props.role === 'user' ? 'bg-lightListTableHeading dark:bg-darkListTableHeading self-end max-w-[80%]' 
         : 'border-none self-start'
     ]"
   >

custom/conversation_area/ToolRenderer.vue

@@ -51,7 +51,7 @@
           </header>
           <div class="select-all grid grid-cols-[auto,1fr] gap-x-3 gap-y-1 px-3 py-3 font-mono text-xs leading-5 text-gray-700 dark:text-gray-200">
             <template v-for="line in section.lines" :key="`${section.label}-${line.number}`">
-              <span class=" text-[0.7rem] text-gray-400 dark:text-gray-500">{{ line.number }}</span>
+              <span class=" text-[0.7rem] text-gray-400 dark:text-gray-500 select-none">{{ line.number }}</span>
               <span class="whitespace-pre-wrap break-words">{{ line.content || ' ' }}</span>
             </template>
           </div>