@cortexmemory/cli 0.26.2 → 0.27.3

package/templates/vercel-ai-quickstart/components/AdminSetup.tsx

@@ -0,0 +1,139 @@
+"use client";
+
+import { useState } from "react";
+import { useAuth } from "./AuthProvider";
+
+export function AdminSetup() {
+  const { setupAdmin, error, clearError } = useAuth();
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [localError, setLocalError] = useState<string | null>(null);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setLocalError(null);
+    clearError();
+
+    if (password.length < 4) {
+      setLocalError("Password must be at least 4 characters");
+      return;
+    }
+
+    if (password !== confirmPassword) {
+      setLocalError("Passwords do not match");
+      return;
+    }
+
+    setIsLoading(true);
+    await setupAdmin(password);
+    setIsLoading(false);
+  };
+
+  const displayError = localError || error;
+
+  return (
+    <div className="min-h-screen flex items-center justify-center p-4">
+      <div className="w-full max-w-md">
+        {/* Logo and Title */}
+        <div className="text-center mb-8">
+          <div className="w-20 h-20 mx-auto mb-6 rounded-2xl bg-gradient-to-br from-cortex-500 to-cortex-700 flex items-center justify-center shadow-lg shadow-cortex-500/20">
+            <span className="text-4xl">🧠</span>
+          </div>
+          <h1 className="text-3xl font-bold mb-2">Welcome to Cortex</h1>
+          <p className="text-gray-400">Set up your admin password to get started</p>
+        </div>
+
+        {/* Setup Form */}
+        <div className="glass rounded-2xl p-8">
+          <form onSubmit={handleSubmit} className="space-y-6">
+            <div>
+              <label
+                htmlFor="password"
+                className="block text-sm font-medium text-gray-300 mb-2"
+              >
+                Admin Password
+              </label>
+              <input
+                id="password"
+                type="password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                placeholder="Enter a secure password"
+                className="w-full px-4 py-3 bg-white/5 border border-white/10 rounded-xl focus:outline-none focus:border-cortex-500 transition-colors"
+                disabled={isLoading}
+                autoFocus
+              />
+            </div>
+
+            <div>
+              <label
+                htmlFor="confirmPassword"
+                className="block text-sm font-medium text-gray-300 mb-2"
+              >
+                Confirm Password
+              </label>
+              <input
+                id="confirmPassword"
+                type="password"
+                value={confirmPassword}
+                onChange={(e) => setConfirmPassword(e.target.value)}
+                placeholder="Confirm your password"
+                className="w-full px-4 py-3 bg-white/5 border border-white/10 rounded-xl focus:outline-none focus:border-cortex-500 transition-colors"
+                disabled={isLoading}
+              />
+            </div>
+
+            {displayError && (
+              <div className="p-3 bg-red-500/10 border border-red-500/20 rounded-xl text-red-400 text-sm">
+                {displayError}
+              </div>
+            )}
+
+            <button
+              type="submit"
+              disabled={isLoading || !password || !confirmPassword}
+              className="w-full py-3 bg-cortex-600 hover:bg-cortex-700 disabled:opacity-50 disabled:cursor-not-allowed rounded-xl font-medium transition-colors flex items-center justify-center gap-2"
+            >
+              {isLoading ? (
+                <>
+                  <svg
+                    className="animate-spin h-5 w-5"
+                    xmlns="http://www.w3.org/2000/svg"
+                    fill="none"
+                    viewBox="0 0 24 24"
+                  >
+                    <circle
+                      className="opacity-25"
+                      cx="12"
+                      cy="12"
+                      r="10"
+                      stroke="currentColor"
+                      strokeWidth="4"
+                    />
+                    <path
+                      className="opacity-75"
+                      fill="currentColor"
+                      d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
+                    />
+                  </svg>
+                  Setting up...
+                </>
+              ) : (
+                "Set Admin Password"
+              )}
+            </button>
+          </form>
+
+          <div className="mt-6 pt-6 border-t border-white/10">
+            <p className="text-xs text-gray-500 text-center">
+              This password will be used to manage the quickstart demo.
+              <br />
+              You can create additional user accounts after setup.
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

package/templates/vercel-ai-quickstart/components/AuthProvider.tsx

@@ -0,0 +1,283 @@
+"use client";
+
+import {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useCallback,
+  type ReactNode,
+} from "react";
+
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+// Types
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+export interface User {
+  id: string;
+  displayName: string;
+}
+
+export interface AuthState {
+  isLoading: boolean;
+  isAdminSetup: boolean | null;
+  isAuthenticated: boolean;
+  user: User | null;
+  error: string | null;
+}
+
+export interface AuthContextValue extends AuthState {
+  setupAdmin: (password: string) => Promise<boolean>;
+  login: (username: string, password: string) => Promise<boolean>;
+  register: (
+    username: string,
+    password: string,
+    displayName?: string
+  ) => Promise<boolean>;
+  logout: () => void;
+  clearError: () => void;
+}
+
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+// Context
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+const AuthContext = createContext<AuthContextValue | null>(null);
+
+const STORAGE_KEY = "cortex-quickstart-auth";
+
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+// Provider
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+export function AuthProvider({ children }: { children: ReactNode }) {
+  const [state, setState] = useState<AuthState>({
+    isLoading: true,
+    isAdminSetup: null,
+    isAuthenticated: false,
+    user: null,
+    error: null,
+  });
+
+  // Check admin setup status and restore session on mount
+  useEffect(() => {
+    const init = async () => {
+      try {
+        // Check if admin is set up
+        const checkResponse = await fetch("/api/auth/check");
+        const checkData = await checkResponse.json();
+
+        // Try to restore session from localStorage
+        let user: User | null = null;
+        let sessionToken: string | null = null;
+
+        if (typeof window !== "undefined") {
+          const stored = localStorage.getItem(STORAGE_KEY);
+          if (stored) {
+            try {
+              const parsed = JSON.parse(stored);
+              user = parsed.user;
+              sessionToken = parsed.sessionToken;
+            } catch {
+              localStorage.removeItem(STORAGE_KEY);
+            }
+          }
+        }
+
+        setState({
+          isLoading: false,
+          isAdminSetup: checkData.isSetup,
+          isAuthenticated: !!user && !!sessionToken,
+          user,
+          error: null,
+        });
+      } catch (error) {
+        console.error("Auth init error:", error);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          error: "Failed to initialize authentication",
+        }));
+      }
+    };
+
+    init();
+  }, []);
+
+  // Setup admin password
+  const setupAdmin = useCallback(async (password: string): Promise<boolean> => {
+    setState((prev) => ({ ...prev, error: null }));
+
+    try {
+      const response = await fetch("/api/auth/setup", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ password }),
+      });
+
+      const data = await response.json();
+
+      if (!response.ok) {
+        setState((prev) => ({ ...prev, error: data.error }));
+        return false;
+      }
+
+      setState((prev) => ({
+        ...prev,
+        isAdminSetup: true,
+      }));
+
+      return true;
+    } catch (error) {
+      console.error("Setup error:", error);
+      setState((prev) => ({
+        ...prev,
+        error: "Failed to setup admin password",
+      }));
+      return false;
+    }
+  }, []);
+
+  // Login
+  const login = useCallback(
+    async (username: string, password: string): Promise<boolean> => {
+      setState((prev) => ({ ...prev, error: null }));
+
+      try {
+        const response = await fetch("/api/auth/login", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ username, password }),
+        });
+
+        const data = await response.json();
+
+        if (!response.ok) {
+          setState((prev) => ({ ...prev, error: data.error }));
+          return false;
+        }
+
+        // Store session
+        if (typeof window !== "undefined") {
+          localStorage.setItem(
+            STORAGE_KEY,
+            JSON.stringify({
+              user: data.user,
+              sessionToken: data.sessionToken,
+            })
+          );
+        }
+
+        setState((prev) => ({
+          ...prev,
+          isAuthenticated: true,
+          user: data.user,
+        }));
+
+        return true;
+      } catch (error) {
+        console.error("Login error:", error);
+        setState((prev) => ({
+          ...prev,
+          error: "Failed to login",
+        }));
+        return false;
+      }
+    },
+    []
+  );
+
+  // Register
+  const register = useCallback(
+    async (
+      username: string,
+      password: string,
+      displayName?: string
+    ): Promise<boolean> => {
+      setState((prev) => ({ ...prev, error: null }));
+
+      try {
+        const response = await fetch("/api/auth/register", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ username, password, displayName }),
+        });
+
+        const data = await response.json();
+
+        if (!response.ok) {
+          setState((prev) => ({ ...prev, error: data.error }));
+          return false;
+        }
+
+        // Store session
+        if (typeof window !== "undefined") {
+          localStorage.setItem(
+            STORAGE_KEY,
+            JSON.stringify({
+              user: data.user,
+              sessionToken: data.sessionToken,
+            })
+          );
+        }
+
+        setState((prev) => ({
+          ...prev,
+          isAuthenticated: true,
+          user: data.user,
+        }));
+
+        return true;
+      } catch (error) {
+        console.error("Register error:", error);
+        setState((prev) => ({
+          ...prev,
+          error: "Failed to register",
+        }));
+        return false;
+      }
+    },
+    []
+  );
+
+  // Logout
+  const logout = useCallback(() => {
+    if (typeof window !== "undefined") {
+      localStorage.removeItem(STORAGE_KEY);
+    }
+
+    setState((prev) => ({
+      ...prev,
+      isAuthenticated: false,
+      user: null,
+    }));
+  }, []);
+
+  // Clear error
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: null }));
+  }, []);
+
+  const value: AuthContextValue = {
+    ...state,
+    setupAdmin,
+    login,
+    register,
+    logout,
+    clearError,
+  };
+
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
+}
+
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+// Hook
+// ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+
+export function useAuth(): AuthContextValue {
+  const context = useContext(AuthContext);
+  if (!context) {
+    throw new Error("useAuth must be used within an AuthProvider");
+  }
+  return context;
+}