feat: enhance stale instance handling and update theme colors

web/default/src/features/system-info/components/system-instances-panel.tsx

@@ -513,6 +513,7 @@ export function SystemInstancesPanel() {
   const staleInstances = instances.filter(
   const staleInstances = instances.filter(
     (instance) => instance.status === 'stale'
     (instance) => instance.status === 'stale'
   )
   )
+  const hasStaleInstances = staleInstances.length > 0
   const loading = instancesQuery.isLoading
   const loading = instancesQuery.isLoading
   const refreshing = instancesQuery.isFetching && !instancesQuery.isLoading
   const refreshing = instancesQuery.isFetching && !instancesQuery.isLoading
 
 
@@ -650,32 +651,32 @@ export function SystemInstancesPanel() {
                 seconds: INSTANCE_POLL_INTERVAL_MS / 1000,
                 seconds: INSTANCE_POLL_INTERVAL_MS / 1000,
               })}
               })}
             </span>
             </span>
-            <Button
-              type='button'
-              variant='destructive'
-              size='sm'
-              onClick={() => setDeleteAllConfirmOpen(true)}
-              disabled={
-                staleInstances.length === 0 ||
-                isMutatingInstance ||
-                deleteStaleInstancesMutation.isPending
-              }
-            >
-              {deleteStaleInstancesMutation.isPending ? (
-                <Loader2
-                  data-icon='inline-start'
-                  className='size-3.5 animate-spin'
-                  aria-hidden='true'
-                />
-              ) : (
-                <Trash2
-                  data-icon='inline-start'
-                  className='size-3.5'
-                  aria-hidden='true'
-                />
-              )}
-              {t('Delete all stale')}
-            </Button>
+            {hasStaleInstances ? (
+              <Button
+                type='button'
+                variant='destructive'
+                size='sm'
+                onClick={() => setDeleteAllConfirmOpen(true)}
+                disabled={
+                  isMutatingInstance || deleteStaleInstancesMutation.isPending
+                }
+              >
+                {deleteStaleInstancesMutation.isPending ? (
+                  <Loader2
+                    data-icon='inline-start'
+                    className='size-3.5 animate-spin'
+                    aria-hidden='true'
+                  />
+                ) : (
+                  <Trash2
+                    data-icon='inline-start'
+                    className='size-3.5'
+                    aria-hidden='true'
+                  />
+                )}
+                {t('Delete all stale')}
+              </Button>
+            ) : null}
             <Button
             <Button
               type='button'
               type='button'
               variant='outline'
               variant='outline'

web/default/src/styles/theme.css

@@ -109,7 +109,7 @@ For commercial licensing, please contact support@quantumnous.com
   --card-foreground: oklch(0.145 0 0);
   --card-foreground: oklch(0.145 0 0);
   --popover: oklch(1 0 0);
   --popover: oklch(1 0 0);
   --popover-foreground: oklch(0.145 0 0);
   --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.58 0.2 250);
+  --primary: oklch(0.692 0.141 243.716);
   --primary-foreground: oklch(1 0 0);
   --primary-foreground: oklch(1 0 0);
   --secondary: oklch(0.95 0 0);
   --secondary: oklch(0.95 0 0);
   --secondary-foreground: oklch(0.42 0.16 250);
   --secondary-foreground: oklch(0.42 0.16 250);
@@ -129,7 +129,7 @@ For commercial licensing, please contact support@quantumnous.com
   --neutral-foreground: oklch(0.145 0 0);
   --neutral-foreground: oklch(0.145 0 0);
   --border: oklch(0.93 0 0);
   --border: oklch(0.93 0 0);
   --input: oklch(0.93 0 0);
   --input: oklch(0.93 0 0);
-  --ring: oklch(0.58 0.2 250);
+  --ring: oklch(0.708 0.16 249.003);
   --chart-1: oklch(0.72 0.18 250);
   --chart-1: oklch(0.72 0.18 250);
   --chart-2: oklch(0.65 0.15 200);
   --chart-2: oklch(0.65 0.15 200);
   --chart-3: oklch(0.7 0.12 280);
   --chart-3: oklch(0.7 0.12 280);
@@ -140,10 +140,10 @@ For commercial licensing, please contact support@quantumnous.com
   --overview-accent-3: oklch(0.7 0.12 280);
   --overview-accent-3: oklch(0.7 0.12 280);
   --sidebar: color-mix(in oklch, var(--foreground) 0.5%, var(--background));
   --sidebar: color-mix(in oklch, var(--foreground) 0.5%, var(--background));
   --sidebar-foreground: oklch(0.145 0 0);
   --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.58 0.2 250);
+  --sidebar-primary: oklch(0.64 0.197 253.892);
   --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-accent: color-mix(in oklch, var(--primary) 12%, var(--background));
   --sidebar-accent: color-mix(in oklch, var(--primary) 12%, var(--background));
-  --sidebar-accent-foreground: oklch(0.42 0.16 250);
+  --sidebar-accent-foreground: oklch(0.579 0.196 255.909);
   --sidebar-border: oklch(0.93 0 0);
   --sidebar-border: oklch(0.93 0 0);
   --sidebar-ring: oklch(0.58 0.2 250);
   --sidebar-ring: oklch(0.58 0.2 250);
   --skeleton-base: oklch(0.97 0 0);
   --skeleton-base: oklch(0.97 0 0);
@@ -182,7 +182,7 @@ For commercial licensing, please contact support@quantumnous.com
   --card-foreground: oklch(0.965 0 0);
   --card-foreground: oklch(0.965 0 0);
   --popover: oklch(0.305 0 0);
   --popover: oklch(0.305 0 0);
   --popover-foreground: oklch(0.965 0 0);
   --popover-foreground: oklch(0.965 0 0);
-  --primary: oklch(0.66 0.17 250);
+  --primary: oklch(0.54 0.142 248.516);
   --primary-foreground: oklch(1 0 0);
   --primary-foreground: oklch(1 0 0);
   --secondary: oklch(0.335 0 0);
   --secondary: oklch(0.335 0 0);
   --secondary-foreground: oklch(0.9 0.05 250);
   --secondary-foreground: oklch(0.9 0.05 250);
@@ -196,13 +196,13 @@ For commercial licensing, please contact support@quantumnous.com
   --success-foreground: oklch(0.145 0 0);
   --success-foreground: oklch(0.145 0 0);
   --warning: oklch(0.769 0.188 70.08);
   --warning: oklch(0.769 0.188 70.08);
   --warning-foreground: oklch(0.145 0 0);
   --warning-foreground: oklch(0.145 0 0);
-  --info: oklch(0.68 0.17 237.323);
+  --info: oklch(0.613 0.14 239.919);
   --info-foreground: oklch(0.145 0 0);
   --info-foreground: oklch(0.145 0 0);
   --neutral: oklch(0.76 0 0);
   --neutral: oklch(0.76 0 0);
   --neutral-foreground: oklch(0.155 0 0);
   --neutral-foreground: oklch(0.155 0 0);
   --border: oklch(1 0 0 / 10%);
   --border: oklch(1 0 0 / 10%);
   --input: oklch(1 0 0 / 17%);
   --input: oklch(1 0 0 / 17%);
-  --ring: oklch(0.66 0.17 250);
+  --ring: oklch(0.554 0.148 250.726);
   --chart-1: oklch(0.76 0.14 250);
   --chart-1: oklch(0.76 0.14 250);
   --chart-2: oklch(0.76 0.13 200);
   --chart-2: oklch(0.76 0.13 200);
   --chart-3: oklch(0.76 0.13 285);
   --chart-3: oklch(0.76 0.13 285);
@@ -210,12 +210,12 @@ For commercial licensing, please contact support@quantumnous.com
   --chart-5: oklch(0.76 0.14 155);
   --chart-5: oklch(0.76 0.14 155);
   --sidebar: oklch(0.225 0 0);
   --sidebar: oklch(0.225 0 0);
   --sidebar-foreground: oklch(0.95 0 0);
   --sidebar-foreground: oklch(0.95 0 0);
-  --sidebar-primary: oklch(0.66 0.17 250);
+  --sidebar-primary: oklch(0.588 0.123 246.488);
   --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-accent: color-mix(in oklch, var(--primary) 20%, var(--background));
   --sidebar-accent: color-mix(in oklch, var(--primary) 20%, var(--background));
   --sidebar-accent-foreground: oklch(0.9 0.05 250);
   --sidebar-accent-foreground: oklch(0.9 0.05 250);
   --sidebar-border: oklch(1 0 0 / 11%);
   --sidebar-border: oklch(1 0 0 / 11%);
-  --sidebar-ring: oklch(0.66 0.17 250);
+  --sidebar-ring: oklch(0.7 0.17 250);
   --skeleton-base: oklch(0.335 0 0);
   --skeleton-base: oklch(0.335 0 0);
   --skeleton-highlight: oklch(0.44 0 0);
   --skeleton-highlight: oklch(0.44 0 0);
   --table-row: var(--background);
   --table-row: var(--background);