bot-backend
e70f5da82b
Imports tradein-mvp/frontend (38 components) to a claude.ai/design design-system project. Synth-entry build (Next.js app, no dist): - overrides/source-kit.mjs: process.env shim for browser IIFE - preview-provider.tsx: seeded TanStack Query provider (mirrors the repo's offline ui-preview client) so fetch-coupled + auth-gated cards render - previews/*.tsx: authored preview compositions (real fixture data) - conventions.md: README header for the design agent - config.json + NOTES.md: reproducible re-sync inputs
61 lines
2.3 KiB
TypeScript
61 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
// Seeded provider for design-sync preview cards. Mirrors the repo's own offline
|
|
// preview client (tradein-mvp/frontend/src/app/ui-preview/estimate/page.tsx):
|
|
// a QueryClient pre-filled with the FIXTURE_* data + a fake authorized user, so
|
|
// fetch-coupled cards (HouseAnalyticsSection, PlacementHistoryCard, StreetDealsCard)
|
|
// and auth-gated ones (RouteGuard, UserMenu) render offline. Bundled into
|
|
// window.<GLOBAL> via cfg.extraEntries → shares the SAME react-query instance as
|
|
// the components (context identity), which a second copy in a preview would break.
|
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
import { useState } from "react";
|
|
|
|
import {
|
|
FIXTURE_ANALYTICS,
|
|
FIXTURE_ESTIMATE,
|
|
FIXTURE_PLACEMENT,
|
|
FIXTURE_SALES,
|
|
FIXTURE_SELLTIME,
|
|
} from "../tradein-mvp/frontend/src/app/ui-preview/estimate/fixture";
|
|
|
|
// Inlined to avoid importing @/lib/useMe → @/lib/api, which reads process.env
|
|
// at module top-level; in an extraEntries module that evaluates before the
|
|
// synth-entry process shim and aborts the whole bundle. Key must match
|
|
// useMe.ts's ME_QUERY_KEY exactly.
|
|
const ME_QUERY_KEY = ["auth", "me"] as const;
|
|
const PREVIEW_ID = FIXTURE_ESTIMATE.estimate_id;
|
|
|
|
const PREVIEW_USER = {
|
|
username: "preview",
|
|
role: "admin",
|
|
allowed_paths: ["/**"],
|
|
deny_paths: [],
|
|
brand: null,
|
|
};
|
|
|
|
export function PreviewProvider({ children }: { children: React.ReactNode }) {
|
|
const [client] = useState(() => {
|
|
const qc = new QueryClient({
|
|
defaultOptions: {
|
|
queries: { retry: false, staleTime: Infinity, refetchOnWindowFocus: false },
|
|
},
|
|
});
|
|
qc.setQueryData(ME_QUERY_KEY, PREVIEW_USER);
|
|
qc.setQueryData(["trade-in", "estimate", PREVIEW_ID, "placement-history"], FIXTURE_PLACEMENT);
|
|
qc.setQueryData(["trade-in", "estimate", PREVIEW_ID, "house-analytics"], FIXTURE_ANALYTICS);
|
|
qc.setQueryData(["trade-in", "estimate", PREVIEW_ID, "sell-time-sensitivity"], FIXTURE_SELLTIME);
|
|
qc.setQueryData(["trade-in", "estimate", PREVIEW_ID, "cian-price-changes"], []);
|
|
qc.setQueryData(
|
|
[
|
|
"trade-in",
|
|
"sales-vs-listings",
|
|
FIXTURE_ESTIMATE.target_address,
|
|
FIXTURE_ESTIMATE.area_m2,
|
|
FIXTURE_ESTIMATE.rooms,
|
|
],
|
|
FIXTURE_SALES,
|
|
);
|
|
return qc;
|
|
});
|
|
return <QueryClientProvider client={client}>{children}</QueryClientProvider>;
|
|
}
|