mirror of
https://github.com/Sea-Haven-Industries/shoc-frontend-new.git
synced 2026-10-07 16:19:01 +00:00
vendor-portal-provider.tsx and task-templates.tsx mixed data-fetching,
state, and rendering in one file, with no caching and hand-rolled form
state. This is a pure refactor with no behavior change.
- vendor-portal-provider.tsx: replace manual useEffect/useState fetch
with useVendorPortalSession (useQuery), closing the token race
condition the old key={token} remount was working around
- task-templates.tsx: split into useTaskTemplateEditor hook plus 4
presentational components; replace hand-rolled form state with
react-hook-form + zod validation; replace the "new" string sentinel
with a NEW_TEMPLATE_ID constant
- add 29 tests (hook, component, and full-page integration) confirming
identical behavior to the original code
28 lines
957 B
TypeScript
28 lines
957 B
TypeScript
import { useMemo, type ReactNode } from "react";
|
|
import { useParams } from "react-router";
|
|
import { useVendorPortalSession } from "@/domain/vendor-portal/use-cases/use-vendor-portal-session";
|
|
import {
|
|
VendorPortalContext,
|
|
type VendorPortalContextValue,
|
|
} from "@/app/v/_components/vendor-portal-context";
|
|
|
|
function VendorPortalSessionLoader({ token, children }: { token: string; children: ReactNode }) {
|
|
const { vendor, status, error } = useVendorPortalSession(token);
|
|
|
|
const value = useMemo<VendorPortalContextValue>(
|
|
() => ({ token, vendor, status, error }),
|
|
[token, vendor, status, error],
|
|
);
|
|
|
|
return <VendorPortalContext.Provider value={value}>{children}</VendorPortalContext.Provider>;
|
|
}
|
|
|
|
export function VendorPortalProvider({ children }: { children: ReactNode }) {
|
|
const { token = "" } = useParams();
|
|
|
|
return (
|
|
<VendorPortalSessionLoader key={token} token={token}>
|
|
{children}
|
|
</VendorPortalSessionLoader>
|
|
);
|
|
}
|