From 1cb832473c32197261708af19b37b0ed396013cc Mon Sep 17 00:00:00 2001
From: Chaim <chaim@marcus-law.co.il>
Date: Mon, 4 May 2026 07:01:42 +0000
Subject: [PATCH] fix(settings): unknown drift state when Infisical unavailable
 + RTL drawer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- DriftBadge shows 'Unknown' (not 'Synced') when infisical_available=false
- Plumb infisicalAvailable from EnvironmentTab through EnvVarRow → DriftBadge
- Add dir='rtl' to ToolDetailDrawer SheetContent for Hebrew descriptions
---
 .../app/settings/_components/drift-badge.tsx  | 22 +++++++++++++++++--
 .../app/settings/_components/env-var-row.tsx  |  4 +++-
 .../settings/_components/environment-tab.tsx  |  2 ++
 .../_components/tool-detail-drawer.tsx        |  2 +-
 4 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/web-ui/src/app/settings/_components/drift-badge.tsx b/web-ui/src/app/settings/_components/drift-badge.tsx
index 90af4bc..34eaf91 100644
--- a/web-ui/src/app/settings/_components/drift-badge.tsx
+++ b/web-ui/src/app/settings/_components/drift-badge.tsx
@@ -1,9 +1,27 @@
 "use client";
 
-import { AlertTriangle, CheckCircle2 } from "lucide-react";
+import { AlertTriangle, CheckCircle2, HelpCircle } from "lucide-react";
 import { Badge } from "@/components/ui/badge";
 
-export function DriftBadge({ drift }: { drift: boolean }) {
+type Props = {
+  drift: boolean;
+  // When false, Infisical was unreachable: drift state is unknown, not "synced".
+  infisicalAvailable?: boolean;
+};
+
+export function DriftBadge({ drift, infisicalAvailable = true }: Props) {
+  if (!infisicalAvailable) {
+    return (
+      <Badge
+        variant="outline"
+        className="text-ink-muted border-rule gap-1"
+        title="Infisical לא זמין — מצב ה-drift לא ידוע"
+      >
+        <HelpCircle className="w-3 h-3" />
+        Unknown
+      </Badge>
+    );
+  }
   if (drift) {
     return (
       <Badge variant="outline" className="text-warn border-warn/40 gap-1">
diff --git a/web-ui/src/app/settings/_components/env-var-row.tsx b/web-ui/src/app/settings/_components/env-var-row.tsx
index 454a82a..f6f1e45 100644
--- a/web-ui/src/app/settings/_components/env-var-row.tsx
+++ b/web-ui/src/app/settings/_components/env-var-row.tsx
@@ -14,6 +14,7 @@ type Props = {
   spec: McpEnvVar;
   infisicalProjectId: string;
   infisicalEnv: string;
+  infisicalAvailable: boolean;
   onPendingRedeploy: () => void;
 };
 
@@ -21,6 +22,7 @@ export function EnvVarRow({
   spec,
   infisicalProjectId,
   infisicalEnv,
+  infisicalAvailable,
   onPendingRedeploy,
 }: Props) {
   const [draft, setDraft] = useState<string>(spec.infisical_value ?? "");
@@ -60,7 +62,7 @@ export function EnvVarRow({
                 secret
               </Badge>
             )}
-            <DriftBadge drift={spec.drift} />
+            <DriftBadge drift={spec.drift} infisicalAvailable={infisicalAvailable} />
           </div>
           <p className="text-sm text-ink-muted mt-1">{spec.description}</p>
         </div>
diff --git a/web-ui/src/app/settings/_components/environment-tab.tsx b/web-ui/src/app/settings/_components/environment-tab.tsx
index 3a1c758..303540c 100644
--- a/web-ui/src/app/settings/_components/environment-tab.tsx
+++ b/web-ui/src/app/settings/_components/environment-tab.tsx
@@ -67,6 +67,7 @@ export function EnvironmentTab() {
   }
   if (!data) return null;
 
+  const infisicalAvailable = data.errors.length === 0;
   const driftCount = data.vars.filter((v) => v.drift).length;
 
   return (
@@ -122,6 +123,7 @@ export function EnvironmentTab() {
                     spec={v}
                     infisicalProjectId={data.infisical_project_id}
                     infisicalEnv={data.infisical_environment}
+                    infisicalAvailable={infisicalAvailable}
                     onPendingRedeploy={() => setPendingRedeploy(true)}
                   />
                 ))}
diff --git a/web-ui/src/app/settings/_components/tool-detail-drawer.tsx b/web-ui/src/app/settings/_components/tool-detail-drawer.tsx
index 7f74e14..66cf23a 100644
--- a/web-ui/src/app/settings/_components/tool-detail-drawer.tsx
+++ b/web-ui/src/app/settings/_components/tool-detail-drawer.tsx
@@ -19,7 +19,7 @@ type Props = {
 export function ToolDetailDrawer({ tool, open, onOpenChange }: Props) {
   return (
     <Sheet open={open} onOpenChange={onOpenChange}>
-      <SheetContent side="left" className="sm:max-w-xl overflow-y-auto">
+      <SheetContent dir="rtl" side="left" className="sm:max-w-xl overflow-y-auto">
         {tool && (
           <>
             <SheetHeader>