Private
Public Access
ksmithandClaude Sonnet 5
bd3e621e9f
Replaces the single custom_theme_colors blob (one palette per user) with a proper CustomTheme table -- users can now save, name, and switch between as many custom palettes as they like, not just one. Data model: users.active_custom_theme_id references whichever saved CustomTheme (if any) is currently active; theme='custom' + that id together determine what's rendered. The migration data-migrates any already-saved single palette into a named CustomTheme row on upgrade, and best-effort backfills the active one back into the old column shape on downgrade. New endpoints under /api/custom-themes: list, create, rename/recolor, delete (falls back the user to a preset if the deleted theme was active, so the two theme columns can never disagree), and activate. UserRead.active_custom_theme is only populated when theme == 'custom' even though the DB deliberately keeps the id set while a preset is active, so switching to a preset and back doesn't lose the saved palette. ProfileModal now lists saved themes as swatches (click to activate, pencil to edit -- active or not, trash to delete with a confirm), plus a "+ New" button that creates, activates, and opens the editor for a fresh theme immediately. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
import { apiFetch } from './client'
|
|
import type { CustomTheme, CustomThemeColors, User } from '../types'
|
|
|
|
export function listCustomThemes(): Promise<CustomTheme[]> {
|
|
return apiFetch<CustomTheme[]>('/api/custom-themes')
|
|
}
|
|
|
|
export function createCustomTheme(name: string, colors: CustomThemeColors): Promise<CustomTheme> {
|
|
return apiFetch<CustomTheme>('/api/custom-themes', {
|
|
method: 'POST',
|
|
body: JSON.stringify({ name, colors }),
|
|
})
|
|
}
|
|
|
|
// Each field independently optional-and-settable, same convention as
|
|
// updateProfile -- a rename shouldn't require resending all 12 colors.
|
|
export function updateCustomTheme(
|
|
id: string,
|
|
data: { name?: string; colors?: CustomThemeColors },
|
|
): Promise<CustomTheme> {
|
|
return apiFetch<CustomTheme>(`/api/custom-themes/${id}`, {
|
|
method: 'PATCH',
|
|
body: JSON.stringify(data),
|
|
})
|
|
}
|
|
|
|
export function deleteCustomTheme(id: string): Promise<void> {
|
|
return apiFetch<void>(`/api/custom-themes/${id}`, { method: 'DELETE' })
|
|
}
|
|
|
|
export function activateCustomTheme(id: string): Promise<User> {
|
|
return apiFetch<User>(`/api/custom-themes/${id}/activate`, { method: 'POST' })
|
|
}
|