AgendaPro DevandClaude Opus 5
4c19244df9
Adds a public funnel landing at `/` and moves the login to `/login`, rebuilt around the panel's own colors instead of an invented palette. Landing (`src/components/landing/`, one section per file, no props): - Seven funnel sections composed by `LandingPage`. The hero's eight swatches are literally `PIE_COLORS` from `DashboardPage`, the same hex values the seed hands to avatars and services, so "your colors become your numbers" is literal. - `BrandMark` becomes the single source for the logo, replicating `public/favicon.svg`. Blue is the action surface, orange only ever marks. - `NotebookVisual` is the one deliberate exception to the palette: it is what the product replaces. - Copy drops all system vocabulary; motion comes from `src/lib/motion.ts` with a single easing, and reduced-motion resolves `initial` to the final state so a never-firing `whileInView` cannot leave a section invisible forever. Routing and bundle: - `homePathFor` is the single definition of each role's destination. - Landing, login, dashboard and calendar load lazily. Eager, the login dragged framer-motion (~40 KB gz) into every panel load and the landing downloaded recharts + FullCalendar (~187 KB gz) without charting anything. `clsx` is pinned to the `react` chunk because Rollup otherwise assigns it to `charts`, making the entry import 111 KB gz for a 200-byte utility. Responsiveness (iPhone/iPad), verified with `npm run audit:responsive`: - No touch form field below 16px, `dvh` height utilities, safe-area insets, and 40px touch targets keyed off `pointer: coarse` rather than `sm:`. - New `.ld-gutter`: `.safe-x` lives outside `@layer` and beats Tailwind's `px-*`, so it left the login's side padding at 0 on anything but an iPhone in landscape. No overflow check could see it — there was no overflow, just zero margin. The audit now guards it with a `gutter` check. - `shell-height` no longer fires on pages that legitimately scroll; the static `raw-viewport-unit` scan covers those instead. Production build: - The Dockerfile now sets `VITE_DEMO_UI=1` as a build arg. `DEMO` is a build-time constant, so without it Vite eliminated the magic login and the "Ver como…" switcher: the deployed landing promised "no registration" and led to an empty form. Verified by building both ways and diffing the bundle. - Service worker cache bumped to v2 so the orphaned pre-landing chunks get purged from returning visitors' caches. Verified: typecheck clean; unit 39/39, e2e 33/33, admin 17/17, booking 12/12, landing 13/13 (WebKit), PWA passed against the real production build. Co-Authored-By: Claude Opus 5 (1M context) <[email protected]>
63 lines
2.1 KiB
TypeScript
63 lines
2.1 KiB
TypeScript
import { defineConfig } from "vite";
|
|
import react from "@vitejs/plugin-react";
|
|
import { fileURLToPath, URL } from "node:url";
|
|
|
|
const srcDir = fileURLToPath(new URL("./src", import.meta.url));
|
|
const apiTarget = process.env.API_URL || "http://127.0.0.1:3000";
|
|
const webPort = Number(process.env.VITE_PORT) || 5173;
|
|
|
|
export default defineConfig({
|
|
plugins: [react()],
|
|
resolve: {
|
|
alias: {
|
|
"@": srcDir,
|
|
},
|
|
},
|
|
server: {
|
|
host: process.env.VITE_HOST || "127.0.0.1",
|
|
port: webPort,
|
|
strictPort: true,
|
|
proxy: {
|
|
"/api": {
|
|
target: apiTarget,
|
|
changeOrigin: true,
|
|
},
|
|
},
|
|
},
|
|
build: {
|
|
outDir: "dist",
|
|
sourcemap: false,
|
|
chunkSizeWarningLimit: 1200,
|
|
rollupOptions: {
|
|
output: {
|
|
manualChunks: {
|
|
// Base vendor: se descarga en toda visita. `clsx` va aquí a propósito y
|
|
// no por afinidad temática: lo usan `lib/format.ts` y también recharts,
|
|
// así que sin fijarlo Rollup lo asigna al chunk `charts` y el chunk de
|
|
// entrada acaba importando 111 KB gzip de recharts para obtener una
|
|
// utilidad de 200 bytes. Eso lo pagaba incluso la landing.
|
|
react: ["react", "react-dom", "react-router-dom", "clsx"],
|
|
calendar: [
|
|
"@fullcalendar/core",
|
|
"@fullcalendar/react",
|
|
"@fullcalendar/daygrid",
|
|
"@fullcalendar/timegrid",
|
|
"@fullcalendar/interaction",
|
|
],
|
|
charts: ["recharts"],
|
|
query: ["@tanstack/react-query"],
|
|
icons: ["lucide-react"],
|
|
// Solo las páginas públicas animan. Sin este chunk, Rollup mete
|
|
// framer-motion en el bundle compartido y sus ~40 KB gzip se cobran en
|
|
// cada carga del panel, que nunca lo usa.
|
|
//
|
|
// Se llama `framer` y no `motion` a propósito: `src/lib/motion.ts` genera
|
|
// su propio chunk compartido entre landing y login, y dos `motion-*.js`
|
|
// distintos en dist/ son una trampa al depurar.
|
|
framer: ["framer-motion"],
|
|
},
|
|
},
|
|
},
|
|
},
|
|
});
|