@flowselections/twinfield-authenticatie-module-15-06-2026 1.3.6 → 1.3.8

package/dist-lib/components/settings/TwinfieldAuthSettingsCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TwinfieldAuthSettingsCard.d.ts","sourceRoot":"","sources":["../../../src/components/settings/TwinfieldAuthSettingsCard.tsx"],"names":[],"mappings":"AAmTA,wBAAgB,yBAAyB,CAAC,EACxC,eAAsB,GACvB,GAAE;IACD,eAAe,CAAC,EAAE,OAAO,CAAC;CACtB,+BA6UL"}
+{"version":3,"file":"TwinfieldAuthSettingsCard.d.ts","sourceRoot":"","sources":["../../../src/components/settings/TwinfieldAuthSettingsCard.tsx"],"names":[],"mappings":"AA0WA,wBAAgB,yBAAyB,CAAC,EACxC,eAAsB,GACvB,GAAE;IACD,eAAe,CAAC,EAAE,OAAO,CAAC;CACtB,+BA6UL"}

package/dist-lib/components/settings/TwinfieldAuthSettingsCard.js

@@ -50,7 +50,13 @@ function ConnectionCard({ conn, onChanged, onDisconnected, }) {
     const saveOffice = useServerFn(setTwinfieldConnectionOffice);
     const disconnect = useServerFn(disconnectTwinfieldConnection);
     const trigger = useServerFn(triggerTwinfieldSync);
+    const startOAuthForCard = useServerFn(startTwinfieldOAuth);
     const [offices, setOffices] = useState([]);
+    const [officesStatus, setOfficesStatus] = useState("empty");
+    const [officesMessage, setOfficesMessage] = useState(null);
+    const [needsReauth, setNeedsReauth] = useState(false);
+    const [reauthorizing, setReauthorizing] = useState(false);
+    const [officesReload, setOfficesReload] = useState(0);
     const [loadingOffices, setLoadingOffices] = useState(false);
     const [savingOffice, setSavingOffice] = useState(false);
     const [optimisticOffice, setOptimisticOffice] = useState(null);
@@ -65,10 +71,19 @@ function ConnectionCard({ conn, onChanged, onDisconnected, }) {
                 if (!cancelled) {
                     const list = Array.isArray(res?.offices) ? res.offices : [];
                     setOffices(list);
+                    setOfficesStatus(res?.status ??
+                        (list.length > 0 ? "ok" : "empty"));
+                    setOfficesMessage(res?.message ?? null);
+                    setNeedsReauth(Boolean(res?.needsReauth));
                 }
             }
             catch {
-                /* silent */
+                if (!cancelled) {
+                    setOffices([]);
+                    setOfficesStatus("error");
+                    setOfficesMessage("Administraties konden niet opgehaald worden.");
+                    setNeedsReauth(false);
+                }
             }
             finally {
                 if (!cancelled)
@@ -78,7 +93,20 @@ function ConnectionCard({ conn, onChanged, onDisconnected, }) {
         return () => {
             cancelled = true;
         };
-    }, [conn.id, loadOffices]);
+    }, [conn.id, loadOffices, officesReload]);
+    const handleReauthorize = async () => {
+        setReauthorizing(true);
+        try {
+            const res = await startOAuthForCard({ data: undefined });
+            if (!res?.url)
+                throw new Error("Kon geen koppelingsverzoek starten.");
+            window.location.href = res.url;
+        }
+        catch (e) {
+            toast.error(e?.message ?? "Autoriseren niet gelukt.");
+            setReauthorizing(false);
+        }
+    };
     // Wanneer server-waarde overeenkomt met optimistische keuze: opruimen.
     useEffect(() => {
         if (optimisticOffice && conn.office_code === optimisticOffice.code) {
@@ -147,12 +175,13 @@ function ConnectionCard({ conn, onChanged, onDisconnected, }) {
     const effectiveOfficeCode = conn.office_code ?? optimisticOffice?.code ?? null;
     const effectiveOfficeName = conn.company_name ?? optimisticOffice?.name ?? null;
     const displayName = effectiveOfficeName ?? effectiveOfficeCode ?? conn.company_code ?? "Nog geen administratie gekozen";
-    return (_jsxs("div", { className: "rounded-lg border p-4 space-y-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("span", { className: "font-semibold text-foreground truncate", children: displayName }), _jsx(Badge, { variant: conn.connected ? "default" : "secondary", className: "font-normal", children: conn.connected ? "Verbonden" : "Onvolledig" }), _jsx(Badge, { variant: "outline", className: "font-normal", children: conn.environment === "sandbox" ? "Test" : "Live" })] }), _jsxs("div", { className: "mt-1 text-xs text-muted-foreground", children: [effectiveOfficeCode ? (_jsx("span", { className: "font-mono", children: effectiveOfficeCode })) : (_jsx("span", { children: "Kies hieronder een administratie om te kunnen synchroniseren." })), conn.connected_at && (_jsxs("span", { className: "ml-2", children: ["\u00B7 gekoppeld ", relativeTime(conn.connected_at)] }))] })] }), _jsxs(Button, { size: "sm", variant: "ghost", onClick: handleDisconnect, disabled: disconnecting, className: "text-muted-foreground hover:text-destructive", children: [_jsx(Unlink, { className: "h-4 w-4 mr-1.5" }), disconnecting ? "Bezig…" : "Verbreken"] })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "text-xs font-medium text-muted-foreground", children: "Administratie" }), offices.length > 0 ? (_jsxs(Select, { value: effectiveOfficeCode ?? undefined, onValueChange: handleOfficeChange, disabled: savingOffice, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies een administratie", children: (() => {
+    return (_jsxs("div", { className: "rounded-lg border p-4 space-y-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [_jsx("span", { className: "font-semibold text-foreground truncate", children: displayName }), _jsx(Badge, { variant: needsReauth ? "destructive" : conn.connected ? "default" : "secondary", className: "font-normal", children: needsReauth ? "Autorisatie vereist" : conn.connected ? "Verbonden" : "Onvolledig" }), _jsx(Badge, { variant: "outline", className: "font-normal", children: conn.environment === "sandbox" ? "Test" : "Live" })] }), _jsxs("div", { className: "mt-1 text-xs text-muted-foreground", children: [effectiveOfficeCode ? (_jsx("span", { className: "font-mono", children: effectiveOfficeCode })) : (_jsx("span", { children: "Kies hieronder een administratie om te kunnen synchroniseren." })), conn.connected_at && (_jsxs("span", { className: "ml-2", children: ["\u00B7 gekoppeld ", relativeTime(conn.connected_at)] }))] })] }), _jsxs(Button, { size: "sm", variant: "ghost", onClick: handleDisconnect, disabled: disconnecting, className: "text-muted-foreground hover:text-destructive", children: [_jsx(Unlink, { className: "h-4 w-4 mr-1.5" }), disconnecting ? "Bezig…" : "Verbreken"] })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "text-xs font-medium text-muted-foreground", children: "Administratie" }), offices.length > 0 ? (_jsxs(Select, { value: effectiveOfficeCode ?? undefined, onValueChange: handleOfficeChange, disabled: savingOffice, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies een administratie", children: (() => {
                                         const selected = offices.find((o) => o.code === effectiveOfficeCode);
                                         if (!selected)
                                             return null;
                                         return (_jsxs("span", { className: "flex items-baseline gap-2 truncate", children: [_jsx("span", { className: "truncate", children: selected.name ?? selected.code }), _jsx("span", { className: "text-[11px] text-muted-foreground font-mono", children: selected.code })] }));
-                                    })() }) }), _jsx(SelectContent, { children: offices.map((o) => (_jsx(SelectItem, { value: o.code, children: _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { children: o.name ?? o.code }), _jsx("span", { className: "text-[11px] text-muted-foreground font-mono", children: o.code })] }) }, o.code))) })] })) : (_jsx("div", { className: "text-xs text-muted-foreground", children: loadingOffices ? "Administraties ophalen…" : "Geen administraties gevonden." }))] }), effectiveOfficeCode && (_jsxs("div", { className: "flex flex-wrap gap-2 pt-1", children: [_jsx(Button, { size: "sm", variant: "outline", onClick: () => runSync("customers"), disabled: busy === "customers", children: busy === "customers" ? "Debiteuren…" : "Debiteuren bijwerken" }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => runSync("invoices"), disabled: busy === "invoices", children: busy === "invoices" ? "Facturen…" : "Facturen bijwerken" })] }))] }));
+                                    })() }) }), _jsx(SelectContent, { children: offices.map((o) => (_jsx(SelectItem, { value: o.code, children: _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { children: o.name ?? o.code }), _jsx("span", { className: "text-[11px] text-muted-foreground font-mono", children: o.code })] }) }, o.code))) })] })) : loadingOffices ? (_jsx("div", { className: "text-xs text-muted-foreground", children: "Administraties ophalen\u2026" })) : officesStatus === "error" ? (_jsxs("div", { className: "space-y-1.5", children: [_jsx("div", { className: "text-xs text-destructive", children: officesMessage ?? "Administraties konden niet opgehaald worden." }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { size: "sm", variant: "outline", onClick: () => setOfficesReload((n) => n + 1), children: "Opnieuw proberen" }), needsReauth && (_jsxs(Button, { size: "sm", onClick: handleReauthorize, disabled: reauthorizing, children: [_jsx(Link2, { className: "h-4 w-4 mr-1.5" }), reauthorizing ? "Bezig…" : "Opnieuw autoriseren"] }))] })] })) : (_jsx("div", { className: "text-xs text-muted-foreground", children: officesMessage ??
+                            "Dit Twinfield-account heeft geen administraties. Koppel een account met toegang tot een administratie." }))] }), effectiveOfficeCode && (_jsxs("div", { className: "flex flex-wrap gap-2 pt-1", children: [_jsx(Button, { size: "sm", variant: "outline", onClick: () => runSync("customers"), disabled: busy === "customers", children: busy === "customers" ? "Debiteuren…" : "Debiteuren bijwerken" }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => runSync("invoices"), disabled: busy === "invoices", children: busy === "invoices" ? "Facturen…" : "Facturen bijwerken" })] }))] }));
 }
 export function TwinfieldAuthSettingsCard({ defaultExpanded = true, } = {}) {
     const startOAuth = useServerFn(startTwinfieldOAuth);
@@ -193,7 +222,7 @@ export function TwinfieldAuthSettingsCard({ defaultExpanded = true, } = {}) {
                 }
             }
             const [connRes, stateRes, queueRes] = await Promise.all([
-                listConnections(),
+                listConnections().catch(() => null),
                 getSyncState().catch(() => null),
                 fetchPushQueue().catch(() => null),
             ]);

package/dist-lib/integrations/supabase/auth-attacher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auth-attacher.d.ts","sourceRoot":"","sources":["../../../src/integrations/supabase/auth-attacher.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,kBAAkB,mHAS9B,CAAA"}
+{"version":3,"file":"auth-attacher.d.ts","sourceRoot":"","sources":["../../../src/integrations/supabase/auth-attacher.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,kBAAkB,mHAgB9B,CAAA"}

package/dist-lib/integrations/supabase/auth-attacher.js

@@ -5,7 +5,15 @@
 import { createMiddleware } from '@tanstack/react-start';
 export const attachSupabaseAuth = createMiddleware({ type: 'function' }).client(async ({ next }) => {
     const { supabase } = await import('./client');
-    const { data } = await supabase.auth.getSession();
+    let { data } = await supabase.auth.getSession();
+    // Proactief verversen: een token dat binnen 60s verloopt geeft server-side
+    // een 401 Response, wat als "Error: [object Response]" op het scherm belandt.
+    const expiresAt = data.session?.expires_at ?? 0;
+    if (data.session && expiresAt * 1000 - Date.now() < 60000) {
+        const refreshed = await supabase.auth.refreshSession().catch(() => null);
+        if (refreshed?.data?.session)
+            data = refreshed.data;
+    }
     const token = data.session?.access_token;
     return next({
         headers: token ? { Authorization: `Bearer ${token}` } : {},