In user-key mode a browser with no stored Ollama key now gets a polished gate instead of the app shell: one masked input with a show/hide toggle, a single Continue button, inline validation errors, and a "?" help sheet with the steps to a free key. - Validates the draft key through /api/health (real 1-token probe) before saving; invalid-key and network failures read differently. - Key still lives only in this browser's localStorage; nothing server-side. - Gate wraps /, /create and deck study; server-key and local-daemon modes skip it; removing the key in Settings brings it back. - Removes the now-redundant dashboard/create API-key banner. - Monochrome corner glows (dark near-black / light near-white), 24px card, 48px field and button, gentle fade/slide-in, reduced-motion aware. - Help modal: centred dialog on desktop, bottom sheet on mobile, closes via X, Escape or backdrop. - README and browser suites updated (34 gate checks, 15 key-flow checks, 12 shipped-default checks; ui/folders/docs/pwa/security/contrast green).
87 lines
2.5 KiB
TypeScript
87 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
/**
|
|
* Browser-side settings, including the user's own Ollama API key.
|
|
*
|
|
* The key lives ONLY here, in this browser's localStorage. It is never sent
|
|
* anywhere except to Freezmo's own API routes on this server (in the
|
|
* `x-ollama-key` header), which forward it to Ollama for that single request
|
|
* and never write it to disk, a log, a cookie or the environment.
|
|
*/
|
|
|
|
const STORAGE_KEY = "freezmo.settings.v1";
|
|
|
|
/** Header that carries the browser's key to Freezmo's own API routes. */
|
|
export const API_KEY_HEADER = "x-ollama-key";
|
|
|
|
export type BrowserSettings = {
|
|
/**
|
|
* The user's own Ollama API key. Nothing else is stored here — the endpoint
|
|
* and model names always come from the server's .env, never from the client.
|
|
*/
|
|
apiKey: string;
|
|
};
|
|
|
|
const EMPTY: BrowserSettings = { apiKey: "" };
|
|
|
|
let cached: BrowserSettings | null = null;
|
|
const listeners = new Set<() => void>();
|
|
|
|
function read(): BrowserSettings {
|
|
if (typeof window === "undefined") return EMPTY;
|
|
try {
|
|
const raw = window.localStorage.getItem(STORAGE_KEY);
|
|
if (!raw) return EMPTY;
|
|
const parsed = JSON.parse(raw) as Partial<BrowserSettings>;
|
|
return { apiKey: typeof parsed.apiKey === "string" ? parsed.apiKey.slice(0, 512) : "" };
|
|
} catch {
|
|
return EMPTY;
|
|
}
|
|
}
|
|
|
|
function write(next: BrowserSettings): void {
|
|
cached = next;
|
|
try {
|
|
if (next.apiKey) {
|
|
window.localStorage.setItem(STORAGE_KEY, JSON.stringify({ apiKey: next.apiKey }));
|
|
} else {
|
|
window.localStorage.removeItem(STORAGE_KEY);
|
|
}
|
|
} catch (error) {
|
|
console.warn("[freezmo] could not save settings (storage disabled?)", error);
|
|
}
|
|
listeners.forEach((listener) => listener());
|
|
}
|
|
|
|
export const settingsStore = {
|
|
subscribe(listener: () => void): () => void {
|
|
if (cached === null) cached = read();
|
|
listeners.add(listener);
|
|
return () => listeners.delete(listener);
|
|
},
|
|
getSnapshot(): BrowserSettings {
|
|
if (cached === null) cached = read();
|
|
return cached;
|
|
},
|
|
getServerSnapshot(): BrowserSettings {
|
|
return EMPTY;
|
|
},
|
|
};
|
|
|
|
export function getApiKey(): string {
|
|
return settingsStore.getSnapshot().apiKey;
|
|
}
|
|
|
|
export function saveSettings(next: BrowserSettings): void {
|
|
write(next);
|
|
}
|
|
|
|
export function clearApiKey(): void {
|
|
write({ apiKey: "" });
|
|
}
|
|
|
|
/** Header used to hand the key to our own API routes for one request. */
|
|
export function authHeaders(): Record<string, string> {
|
|
const { apiKey } = settingsStore.getSnapshot();
|
|
return apiKey ? { [API_KEY_HEADER]: apiKey } : {};
|
|
}
|