Refactor/db ts canonical - #51
Open
skaftorai wants to merge 20 commits into
Open
Conversation
Establish the Purple & White theme as centralized design tokens and make it selectable/applyable without a page reload. - app/theme/design-tokens.css: CSS custom-property tokens for the palette + semantic status colors (success/error/warning/info), with documented WCAG contrast ratios. :root holds the existing default (blue) look; the [data-theme="purple-white"] block overrides it with the purple/white palette. - tailwind.config.ts: register a daisyUI "purple-white" theme (restyles daisyUI navbar/buttons/cards/modals/badges via data-theme) and bind a brand.* color scale to the token vars so updating a token re-colors every page with no per-page edits. - app/theme/themes.ts: theme registry (single source of truth for selectable themes, storage key, default). - app/theme/ThemeProvider.tsx: applies data-theme on <html>, persists to localStorage, applies instantly with no reload; falls back to the default when nothing is selected. - app/layout.tsx: pre-paint inline script applies the stored theme before hydration to avoid a flash / default fallback. - components/ThemeSwitcher.tsx + app/(dashboard)/admin/settings/page.tsx: Settings > Appearance UI exposing "Purple & White" alongside the default, with select + Apply. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Replace the hardcoded legacy blue (#3B82F6) in the base stylesheet with the theme design tokens so the daisyUI range slider and checkbox controls follow the active theme, and add a token-driven ::selection highlight. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Apply the theme palette to the shared interactive components — buttons, inputs and their hover/active/disabled states — replacing hardcoded blue: - CustomButton, AddToCartSingleProductBtn, BuyNowSingleProductBtn - Pagination controls - QuantityInput (+/- buttons and number field) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Apply the purple/white palette to the primary navigation surfaces: - HeaderTop bar and CategoryMenu nav band (bg-brand-primary) - SearchInput submit button - Cart and wishlist count badges - Admin DashboardSidebar background + hover states - Footer section headings Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Apply the purple/white palette to the admin data views: - Themed table header rows for the products and orders tables - StatsElement stat cards and the dashboard visitor-count panel now use brand tokens instead of hardcoded blue Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Map the brand/info blue accents in the notification UI to theme tokens while preserving the semantic priority colors (low=gray, high=orange, urgent=red, success=green): - NotificationCard (unread/selected states, type + priority accents, dot) - NotificationBell dropdown (actions, focus rings, links) - Notifications page (search, filters, bulk-select banner, checkboxes) Note: the repo has no transactional email templates (only a CSV product- template generator), so there were no email templates to rebrand. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Refresh the storefront marketing surfaces to the theme palette: - Hero banner + CTA buttons - IntroducingSection gradient, wordmark accent, and CTA - ProductsSection band - Newsletter and SimpleSlider CTAs: legacy custom-yellow accent -> the theme-aware brand-accent token (unchanged yellow in the default theme, purple in the Purple & White theme) Note: binary static assets (favicon.ico, product images) can't be recolored in a code change and there is no vector logo/wordmark asset to retheme. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Add an automated WCAG contrast validator that parses the real theme tokens from design-tokens.css and gates on AA (4.5:1) for every text pair the UI renders, per theme. Runnable via 'npm run test:a11y' (exit non-zero on fail). QA fixes/findings: - Default theme primary was blue-500 (#3b82f6, 3.68:1 on white — below AA); bumped to blue-600 (#2563eb, 5.17:1). Purple & White primary is 7.10:1. - Decorative hairlines reported as non-gating [INFO] (WCAG 1.4.11 exempts decorative dividers). - All 24 gating checks pass across both themes. Add scripts/accessibility/QA-REPORT.md documenting contrast results, status- indicator distinguishability, and a cross-browser smoke matrix. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
…or-palette-and-de WO-01: Define purple/white color palette and design tokens
…t-and-css-theme-v WO-02: Update global stylesheet and CSS/theme variables
…nts-buttons-input WO-03: Restyle core UI components (buttons, inputs, links)
…er-and-sidebar-br WO-04: Restyle navigation, header, and sidebar branding
…-charts-visualiza WO-05: Restyle data tables and charts/visualizations
…and-notification WO-06: Update email templates and notification styling
…g-pages-and-stati WO-07: Update marketing/landing pages and static brand assets
…cessibility-contr WO-08: Cross-browser QA and accessibility contrast validation
server/utills/db.ts was orphaned: the Express server is CommonJS, and
require("../utills/db") resolves to db.js (.ts is not in Node's resolution
set), so every controller/route/test/script loads db.js. Nothing anywhere
imports db.ts — it was a silent decoy where future edits to the DB singleton
invariant (URL validation, SSL, pooling) would ship nothing while appearing
applied.
- Delete server/utills/db.ts (db.js is the real, root-client-aware module).
- Fix the misleading '// Use shared connection with SSL' comment in
products.js: the shared connection is db.js's singleton, and SSL is
governed entirely by DATABASE_URL, not the PrismaClient options.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Remove dead server/utills/db.ts; fix misleading db comment
Previously the Express server (CommonJS) resolved require('../utills/db') to
db.js, and db.ts was unreachable dead code. This makes db.ts the single source
of truth and has the server actually execute it.
- db.ts: switch to 'export = prisma' so require() returns the client directly
(not { default }).
- Delete db.js.
- Add server/utills/register-ts.js: registers the ts-node loader
(transpileOnly, inline commonjs options) so CommonJS entry points can require
the .ts module. app.js requires it first, before any controller/route.
- Prepend the loader to the 9 standalone scripts/tests that run via bare
'node' and load ../utills/db, so they keep working.
- Add server/tsconfig.json and ts-node + typescript to server deps (and root,
which is the installed node_modules location).
- products.js: require('../utills/db') unchanged, comment corrected; no
new PrismaClient() (there never was one).
Verified: require.resolve('./utills/db') -> db.ts; require returns a live
PrismaClient; products controller and standalone-script chains load cleanly;
app.js syntax OK.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The root Next app uses bun (bun.lock); adding ts-node to the root package.json broke 'bun install --frozen-lockfile' because bun.lock wasn't regenerated. ts-node is a server concern, so: - Revert root package.json/package-lock.json to match the committed bun.lock. - Keep ts-node + typescript in server/package.json and record them in server/package-lock.json (the server uses npm). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.