@ifc-lite/viewer 1.17.4 → 1.18.0

package/src/components/viewer/UpgradePage.tsx

@@ -1,71 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
-
-import { PricingTable, SignInButton, SignedIn, SignedOut } from '@clerk/clerk-react';
-import { useEffect, useMemo } from 'react';
-import { ArrowLeft } from 'lucide-react';
-import { Button } from '@/components/ui/button';
-import { useViewerStore } from '@/store';
-import { hasDesktopPro } from '@/lib/desktop-product';
-import { navigateToPath } from '@/services/app-navigation';
-
-export function UpgradePage() {
-  const desktopEntitlement = useViewerStore((s) => s.desktopEntitlement);
-  const hasPro = hasDesktopPro(desktopEntitlement);
-  const returnTo = useMemo(() => {
-    const params = new URLSearchParams(window.location.search);
-    const candidate = params.get('returnTo');
-    return candidate && candidate.startsWith('/') ? candidate : '/';
-  }, []);
-
-  const navigateBack = () => {
-    navigateToPath(returnTo, { replace: true });
-  };
-
-  // Automatically return to the previous app view once upgrade is active.
-  useEffect(() => {
-    if (!hasPro) return;
-    const timer = window.setTimeout(() => {
-      navigateBack();
-    }, 400);
-    return () => window.clearTimeout(timer);
-  }, [hasPro]);
-
-  return (
-    <div className="min-h-screen bg-background text-foreground">
-      <div className="mx-auto w-full max-w-5xl px-6 py-8">
-        <div className="mb-6 flex items-center justify-between">
-          <Button variant="ghost" size="sm" onClick={navigateBack}>
-            <ArrowLeft className="mr-2 h-4 w-4" />
-            Back to Viewer
-          </Button>
-        </div>
-
-        <div className="rounded-lg border bg-card p-6 shadow-sm">
-          <h1 className="text-2xl font-semibold">Upgrade to Pro</h1>
-          <p className="mt-2 text-sm text-muted-foreground">
-            Free keeps the core desktop viewer available. Pro unlocks advanced desktop features, plus the AI assistant with the same monthly limits and routing used on web.
-          </p>
-
-          <div className="mt-6">
-            <SignedOut>
-              <div className="flex items-center justify-center py-12">
-                <SignInButton
-                  mode="modal"
-                  fallbackRedirectUrl={returnTo}
-                  forceRedirectUrl={returnTo}
-                >
-                  <Button>Sign in to continue</Button>
-                </SignInButton>
-              </div>
-            </SignedOut>
-            <SignedIn>
-              <PricingTable />
-            </SignedIn>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

package/src/lib/desktop/ClerkDesktopEntitlementSync.tsx

@@ -1,175 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
-
-import { useEffect } from 'react';
-import { useAuth, useUser } from '@clerk/clerk-react';
-import { getDefaultDesktopEntitlement, type DesktopEntitlement } from '@/lib/desktop-product';
-import { resolveDesktopEntitlement } from '@/lib/desktop-entitlement';
-import { useViewerStore } from '@/store';
-import { DESKTOP_ENTITLEMENT_REFRESH_EVENT } from './desktopEntitlementEvents';
-
-/**
- * Sync Clerk auth + entitlement state into the viewer store.
- * Desktop plan state is authoritative here; chat inherits only the AI-specific permission.
- */
-const ENTITLEMENT_REFRESH_INTERVAL_MS = 24 * 60 * 60 * 1000;
-
-function entitlementsEqual(left: DesktopEntitlement, right: DesktopEntitlement): boolean {
-  return left.tier === right.tier
-    && left.status === right.status
-    && left.source === right.source
-    && left.userId === right.userId
-    && left.validatedAt === right.validatedAt
-    && left.graceUntil === right.graceUntil
-    && left.trialEndsAt === right.trialEndsAt;
-}
-
-export function ClerkDesktopEntitlementSync() {
-  const { isLoaded, isSignedIn, userId, getToken, has } = useAuth();
-  const { user } = useUser();
-  const setChatAuthToken = useViewerStore((s) => s.setChatAuthToken);
-  const switchChatUserContext = useViewerStore((s) => s.switchChatUserContext);
-  const setDesktopEntitlement = useViewerStore((s) => s.setDesktopEntitlement);
-
-  useEffect(() => {
-    if (!isLoaded) return;
-
-    if (!isSignedIn) {
-      const state = useViewerStore.getState();
-      const next = (
-        state.desktopEntitlement.tier === 'pro'
-        && state.desktopEntitlement.graceUntil
-        && state.desktopEntitlement.graceUntil > Date.now()
-      )
-        ? {
-            ...state.desktopEntitlement,
-            status: 'grace_offline' as const,
-            source: 'cached' as const,
-          }
-        : {
-            ...getDefaultDesktopEntitlement(),
-            status: 'signed_out' as const,
-            source: 'cached' as const,
-          };
-      if (!entitlementsEqual(state.desktopEntitlement, next)) {
-        setDesktopEntitlement(next);
-      }
-      if (next.status === 'grace_offline') {
-        switchChatUserContext(next.userId, false, {
-          clearPersistedCurrent: false,
-          restoreMessages: true,
-        });
-      } else {
-        switchChatUserContext(null, false, {
-          clearPersistedCurrent: state.chatStorageUserId !== null,
-          restoreMessages: false,
-        });
-      }
-      setChatAuthToken(null);
-      return;
-    }
-
-    let cancelled = false;
-
-    const syncAuth = async () => {
-      try {
-        const token = await getToken({ skipCache: true });
-        const { entitlement, aiAssistantEnabled } = resolveDesktopEntitlement({
-          userId: userId ?? null,
-          token,
-          has,
-          publicMetadata: (user?.publicMetadata ?? null) as Record<string, unknown> | null,
-        });
-
-        if (cancelled) {
-          return;
-        }
-
-        const state = useViewerStore.getState();
-        if (!entitlementsEqual(state.desktopEntitlement, entitlement)) {
-          setDesktopEntitlement(entitlement);
-        }
-        if (state.chatStorageUserId !== (userId ?? null) || state.chatHasPro !== aiAssistantEnabled) {
-          switchChatUserContext(userId ?? null, aiAssistantEnabled, {
-            clearPersistedCurrent: state.chatStorageUserId !== null && state.chatStorageUserId !== userId,
-            restoreMessages: true,
-          });
-        }
-        setChatAuthToken(token ?? null);
-      } catch {
-        if (cancelled) {
-          return;
-        }
-
-        const state = useViewerStore.getState();
-        if (
-          state.desktopEntitlement.tier === 'pro'
-          && state.desktopEntitlement.graceUntil
-          && state.desktopEntitlement.graceUntil > Date.now()
-        ) {
-          const next = {
-            ...state.desktopEntitlement,
-            status: 'grace_offline',
-            source: 'cached',
-          } satisfies DesktopEntitlement;
-          if (!entitlementsEqual(state.desktopEntitlement, next)) {
-            setDesktopEntitlement(next);
-          }
-          if (state.chatStorageUserId !== (userId ?? null) || state.chatHasPro !== true) {
-            switchChatUserContext(userId ?? null, true, {
-              clearPersistedCurrent: false,
-              restoreMessages: true,
-            });
-          }
-          return;
-        }
-
-        const next = {
-          ...getDefaultDesktopEntitlement(),
-          userId: userId ?? null,
-          status: 'signed_out' as const,
-          source: 'cached' as const,
-        };
-        if (!entitlementsEqual(state.desktopEntitlement, next)) {
-          setDesktopEntitlement(next);
-        }
-      }
-    };
-
-    void syncAuth();
-    const timer = window.setInterval(() => {
-      void syncAuth();
-    }, ENTITLEMENT_REFRESH_INTERVAL_MS);
-    const onWindowFocus = () => {
-      void syncAuth();
-    };
-    const onManualRefresh = (event: Event) => {
-      const detail = (event as CustomEvent<{ resolve: () => void; reject: (error?: unknown) => void }>).detail;
-      void syncAuth()
-        .then(() => detail?.resolve())
-        .catch((error) => detail?.reject(error));
-    };
-    window.addEventListener('focus', onWindowFocus);
-    window.addEventListener(DESKTOP_ENTITLEMENT_REFRESH_EVENT, onManualRefresh);
-
-    return () => {
-      cancelled = true;
-      window.clearInterval(timer);
-      window.removeEventListener('focus', onWindowFocus);
-      window.removeEventListener(DESKTOP_ENTITLEMENT_REFRESH_EVENT, onManualRefresh);
-    };
-  }, [
-    getToken,
-    has,
-    isLoaded,
-    isSignedIn,
-    setChatAuthToken,
-    setDesktopEntitlement,
-    switchChatUserContext,
-    user?.publicMetadata,
-    userId,
-  ]);
-
-  return null;
-}

package/src/lib/llm/ClerkChatSync.tsx

@@ -1,74 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
-
-import { useEffect } from 'react';
-import { useAuth } from '@clerk/clerk-react';
-import { useViewerStore } from '@/store';
-
-/**
- * Sync Clerk session state into chat store for authenticated LLM requests.
- * Keeps chat UX decoupled from auth/billing details.
- */
-export function ClerkChatSync() {
-  const { isLoaded, isSignedIn, userId, getToken, has } = useAuth();
-  const setChatAuthToken = useViewerStore((s) => s.setChatAuthToken);
-  const switchChatUserContext = useViewerStore((s) => s.switchChatUserContext);
-  const currentChatUserId = useViewerStore((s) => s.chatStorageUserId);
-  const currentChatHasPro = useViewerStore((s) => s.chatHasPro);
-
-  useEffect(() => {
-    if (!isLoaded) return;
-
-    if (!isSignedIn) {
-      switchChatUserContext(null, false, {
-        clearPersistedCurrent: currentChatUserId !== null,
-        restoreMessages: false,
-      });
-      setChatAuthToken(null);
-      return;
-    }
-
-    let cancelled = false;
-
-    const syncAuth = async () => {
-      try {
-        const token = await getToken({ skipCache: true });
-        const proPlan = has?.({ plan: 'pro' }) ?? false;
-        const proFeature = has?.({ feature: 'pro_models' }) ?? false;
-        const nextHasPro = proPlan || proFeature;
-        if (!cancelled) {
-          // Avoid resetting chat usage/messages on routine token refreshes for
-          // the same signed-in user. Only switch context when identity or
-          // entitlement actually changes.
-          if (currentChatUserId !== (userId ?? null) || currentChatHasPro !== nextHasPro) {
-            switchChatUserContext(userId ?? null, nextHasPro, {
-              clearPersistedCurrent: currentChatUserId !== null && currentChatUserId !== userId,
-              restoreMessages: true,
-            });
-          }
-          if (token) {
-            setChatAuthToken(token);
-          }
-        }
-      } catch {
-        if (!cancelled) {
-          // Preserve the current signed-in chat context on transient token
-          // refresh failures. Explicit sign-out is handled above.
-        }
-      }
-    };
-
-    void syncAuth();
-    // Keep short-lived JWTs fresh so chat/usage polling doesn't reuse expired tokens.
-    const timer = window.setInterval(() => {
-      void syncAuth();
-    }, 15_000);
-    return () => {
-      cancelled = true;
-      window.clearInterval(timer);
-    };
-  }, [currentChatHasPro, currentChatUserId, getToken, has, isLoaded, isSignedIn, setChatAuthToken, switchChatUserContext, userId]);
-
-  return null;
-}

package/src/lib/llm/clerk-auth.ts

@@ -1,62 +0,0 @@
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
-
-/**
- * Auth helpers for the LLM chat integration.
- *
- * Setup:
- * 1. Install: pnpm add @clerk/clerk-react
- * 2. Set VITE_CLERK_PUBLISHABLE_KEY in .env
- * 3. Create plans in dashboard:
- *    - Free plan (slug: 'free', features: ['llm_chat', 'free_models'])
- *    - Pro plan (slug: 'pro', $8/month, features: ['llm_chat', 'free_models', 'pro_models'])
- * 4. Wrap app with <ClerkProvider>
- *
- * Usage in components:
- *
- * ```tsx
- * import { useAuth, useUser, Protect } from '@clerk/clerk-react';
- *
- * const { has } = useAuth();
- * const hasPro = has?.({ feature: 'pro_models' }) ?? false;
- *
- * const { getToken } = useAuth();
- * const token = await getToken();
- * ```
- */
-
-/**
- * Subscription tiers and their features.
- */
-export const SUBSCRIPTION_PLANS = {
-  free: {
-    slug: 'free',
-    name: 'Free',
-    features: ['llm_chat', 'free_models'],
-    description: 'AI chat with free models',
-  },
-  pro: {
-    slug: 'pro',
-    name: 'Pro',
-    features: ['llm_chat', 'free_models', 'pro_models'],
-    description: 'All models with monthly credits ($8/month)',
-  },
-} as const;
-
-/**
- * Feature flags that map to plan features.
- */
-export const FEATURES = {
-  LLM_CHAT: 'llm_chat',
-  FREE_MODELS: 'free_models',
-  PRO_MODELS: 'pro_models',
-} as const;
-
-/**
- * Check if auth is configured (publishable key present).
- * When not configured, the chat works in anonymous free-tier mode.
- */
-export function isClerkConfigured(): boolean {
-  return Boolean(import.meta.env.VITE_CLERK_PUBLISHABLE_KEY);
-}