Merge pull request #4818 from continuedev/pe/assistant-polish2

feat: assistant polish pt 2

Author: sestinj

gui/src/components/gui/Tooltip.tsx

@@ -25,7 +25,7 @@ export function ToolTip(props: any) {
   return (
     tooltipPortalDiv &&
     ReactDOM.createPortal(
-      <Tooltip {...props} style={combinedStyles} opacity={1} delayShow={400} />,
+      <Tooltip {...props} style={combinedStyles} opacity={1} delayShow={200} />,
       tooltipPortalDiv,
     )
   );

gui/src/components/mainInput/InputToolbar/bottom/ToolDropdownItem.tsx

@@ -31,7 +31,7 @@ function ToolDropdownItem(props: ToolDropdownItemProps) {
 
   return (
     <div
-      className="flex items-center justify-between gap-2 px-2 py-0.5"
+      className="hover:bg-list-active hover:text-list-active-foreground -mx-2 flex cursor-pointer items-center justify-between gap-2 rounded-md px-2 py-0.5"
       style={{
         fontSize: fontSize(-3),
       }}
@@ -74,7 +74,7 @@ function ToolDropdownItem(props: ToolDropdownItemProps) {
               className="h-4 w-4"
             />
           )}
-          {props.tool.function.name}{" "}
+          <pre className="my-0.5 text-[11px]">{props.tool.function.name}</pre>
         </span>
       </div>
       {props.excluded ? (

gui/src/components/mainInput/InputToolbar/bottom/ToolPermissionsDialog.tsx

@@ -43,7 +43,7 @@ export const ToolPermissionsDialog = () => {
     <>
       {toolsByGroup.map(([groupName, tools]) => (
         <div key={groupName} className="mt-2 flex flex-col pr-1">
-          <div className="flex flex-row items-center justify-between px-1 pr-3">
+          <div className="flex flex-row items-center justify-between px-1">
             <h3
               className="m-0 p-0 font-bold"
               style={{

gui/src/components/mainInput/Lump/index.tsx

@@ -69,7 +69,7 @@ export function Lump(props: LumpProps) {
         />
 
         <ContentDiv
-          className="thin-scrollbar pr-0.5"
+          className="no-scrollbar pr-0.5"
           hasSection={!!selectedSection}
           isVisible={isVisible}
         >

gui/src/components/mainInput/Lump/sections/RulesSection.tsx

@@ -65,7 +65,7 @@ const RuleCard: React.FC<RuleCardProps> = ({ index, rule, onClick, title }) => {
               {rule}
             </div>
           </div>
-          <div className="flex items-center gap-2">
+          <div className="flex items-center gap-1">
             <HeaderButtonWithToolTip onClick={onClickExpand} text="Expand">
               <ArrowsPointingOutIcon className="h-3 w-3 text-gray-400" />
             </HeaderButtonWithToolTip>{" "}

gui/src/components/mainInput/Lump/sections/docs/DocsIndexingStatus.tsx

@@ -90,12 +90,6 @@ function DocsIndexingStatus({
             }
           }}
         >
-          <StatusIndicator
-            status={status?.status}
-            hoverMessage={
-              status?.status === "failed" ? status?.debugInfo : undefined
-            }
-          />
           {docConfig.faviconUrl ? (
             <img
               src={docConfig.faviconUrl}
@@ -114,7 +108,7 @@ function DocsIndexingStatus({
         </div>
 
         <div className="flex flex-row items-center gap-2">
-          <div className="flex flex-row items-center gap-1 text-gray-400">
+          <div className="flex flex-row items-center gap-2 text-gray-400">
             {status?.status === "indexing" && (
               <span
                 className="text-xs"
@@ -144,7 +138,12 @@ function DocsIndexingStatus({
               />
             )}
 
-            {/* Removed StatusIndicator from here */}
+            <StatusIndicator
+              status={status?.status}
+              hoverMessage={
+                status?.status === "failed" ? status?.debugInfo : undefined
+              }
+            />
           </div>
         </div>
       </div>

gui/src/components/mainInput/Lump/sections/docs/DocsSection.tsx

@@ -53,7 +53,7 @@ function DocsIndexingStatuses() {
 
   return (
     <div className="flex flex-col gap-1">
-      <div className="flex flex-col gap-1 overflow-y-auto overflow-x-hidden pr-2">
+      <div className="flex flex-col overflow-y-auto overflow-x-hidden pr-2">
         {sortedConfigDocs.map((docConfig) => {
           return (
             <div

gui/src/pages/config/AccountButton.tsx

@@ -1,4 +1,4 @@
-import { UserCircleIcon } from "@heroicons/react/24/outline";
+import { UserCircleIcon } from "@heroicons/react/24/solid";
 
 import { SecondaryButton } from "../../components";
 import {
@@ -8,10 +8,13 @@ import {
   Transition,
 } from "../../components/ui";
 import { useAuth } from "../../context/Auth";
+import { selectSelectedOrganization } from "../../redux";
+import { useAppSelector } from "../../redux/hooks";
 import { ScopeSelect } from "./ScopeSelect";
 
 export function AccountButton() {
   const { session, logout, login, organizations } = useAuth();
+  const selectedOrg = useAppSelector(selectSelectedOrganization);
 
   if (!session) {
     return (
@@ -26,8 +29,13 @@ export function AccountButton() {
 
   return (
     <Popover className="relative">
-      <PopoverButton className="bg-vsc-background hover:bg-vsc-input-background text-vsc-foreground flex h-8 w-8 cursor-pointer items-center justify-center rounded-full border-none">
-        <UserCircleIcon className="h-6 w-6" />
+      <PopoverButton className="bg-vsc-background hover:bg-vsc-input-background text-vsc-foreground my-0.5 flex cursor-pointer rounded-md border-none px-2">
+        <div className="flex items-center gap-1.5">
+          <span className="font-medium">
+            {selectedOrg === null ? "Personal" : selectedOrg.name}
+          </span>
+          <UserCircleIcon className="h-6 w-6" />{" "}
+        </div>
       </PopoverButton>
 
       <Transition>
@@ -39,15 +47,17 @@ export function AccountButton() {
                 {session.account.id}
               </span>
             </div>
+
             {organizations.length > 0 && (
               <div className="flex flex-col gap-1">
-                <label className="text-vsc-foreground text-sm">
+                <label className="text-vsc-foreground text-xs">
                   Organization
                 </label>
                 <ScopeSelect />
               </div>
             )}
-            <SecondaryButton onClick={logout} className="">
+
+            <SecondaryButton onClick={logout} className="!mx-0 w-full">
               Sign out
             </SecondaryButton>
           </div>

gui/src/pages/config/ScopeSelect.tsx

@@ -1,8 +1,8 @@
 import {
   BuildingOfficeIcon,
   ChevronUpDownIcon,
-  UserCircleIcon,
 } from "@heroicons/react/24/outline";
+import { UserCircleIcon } from "@heroicons/react/24/solid";
 import {
   Listbox,
   ListboxButton,