一键导入
sif-initial-data-loader
Mønster for å kombinere flere API-hooks til én asynkron laster (useInitialData + InitialDataLoader) i sif-soknad-apper.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Mønster for å kombinere flere API-hooks til én asynkron laster (useInitialData + InitialDataLoader) i sif-soknad-apper.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | sif-initial-data-loader |
| type | referanse |
| description | Mønster for å kombinere flere API-hooks til én asynkron laster (useInitialData + InitialDataLoader) i sif-soknad-apper. |
useInitialData).src/useInitialData.ts — samler bootstrap-queries med loading/error/success-kontraktApp.tsx via SøknadDataWrapper-mønsteretapps/aktivitetspenger-soknad/src/useInitialData.tsuseInitialData.ts legges i src/ (rot for appen), ikke i src/app/. Dette er et entrypoint-nivå-concern — det kjøres før AppContext og Soknad initialiseres.
Merk: Mellomlagring håndteres av
SøknadRouterfra@sif/soknad-app.useInitialDataskal IKKE hente mellomlagring.
src/
App.tsx ← SøknadAppProvider + SøknadDataWrapper
useInitialData.ts ← bootstrap-queries
app/
context/AppContext.tsx ← app-spesifikk datakontekst
Soknad.tsx ← SøknadRouter (håndterer mellomlagring selv)
SøknadDataWrapper i App.tsx kaller useInitialData() og switcher på status:
loading → <LoadingPage />error → <ErrorPage />success → <AppContextProvider value={data}><Søknad /></AppContextProvider>Søknad mottar ikke lenger props — data leveres via AppContext.
useInitialData@sif/api-hooks.InitialDataResult.data-objekt ved suksess.Ikke hente mellomlagring her — det håndteres av SøknadRouter.
interface InitialData {
søker: Søker;
barn: RegistrertBarn[];
// legg til ytelse-spesifikke felt her
}
type InitialDataResult =
| { status: 'loading' }
| { status: 'error'; errors: unknown[] }
| { status: 'success'; data: InitialData };
søker, registrerteBarn): Appen er i loading-tilstand til alle er ferdig.kontonummer): Venter på isLoading, men returnerer fallback-verdi ved manglende data.export const useInitialData = (): InitialDataResult => {
const søker = useSøker();
const registrerteBarn = useRegistrerteBarn();
const kontonummer = useKontonummer(); // optional
const requiredQueries = [søker, registrerteBarn];
if (requiredQueries.some((q) => q.isLoading) || kontonummer.isLoading) {
return { status: 'loading' };
}
const errors = requiredQueries.filter((q) => q.isError).map((q) => q.error);
if (errors.length > 0) {
return { status: 'error', errors };
}
if (!søker.data || !registrerteBarn.data) {
return { status: 'error', errors: [new Error('Nødvendig data mangler')] };
}
return {
status: 'success',
data: {
søker: søker.data,
barn: registrerteBarn.data,
kontonummer: kontonummer.data ?? kontonummerFallback,
},
};
};
@sif/api — se sif-api for full hook-tabell og klient-init.useInitialData.requiredQueries-arrayen.isLoading separat, bruk fallback-verdi i data-objektet.InitialData-interfacet.<Søknad />.| Feil | Diagnose |
|---|---|
| Appen er stuck i loading | En hook er aldri ferdig (isFetched forblir false). Sjekk at API-klient er initialisert og env-variabler er satt. |
| Mellomlagring ignoreres | metadata er ikke klart når useYtelseMellomlagring kalles. Sjekk useMemo-avhengighetene. |
| Feilside vises selv om API svarer | En query i requiredQueries eller mellomlagring har isError: true. Logg errors i dev-mode for å finne hvilken. |
| Ugyldig steg ved retur til søknad | getValidertMellomlagring filtrerer ikke riktig — sjekk at søknadStepConfig er importert korrekt. |
Legg til et nytt steg i en søknadsapp som bruker @sif/soknad og @sif/rhf — oppretter alle filer og oppdaterer config/routing/i18n.
Arkitekturreferanse og beslutningslogg for @sif/soknad-app — rammeverket for søknadsapper i sif-brukerdialog.
Sett opp OppsummeringSteg i en v2-app — DTO-basert oppsummering med FormSummary, bekreftelsescheckbox og i18n-nøkler.
Veiledning for oppsett av en ny søknadsapp med @sif/soknad-app — SøknadRouter, SøknadAppProvider, AppContext og routing shell.
Implementer et vedleggssteg i en v2-app — VedleggPanel, PersistedVedlegg, hydration og MSW-handlere.
Bruk denne skillen for å fange opp og rette feilaktig datoparsing fra backend i v2-apper — tidssoneproblemer, feil bruk av Date/dayjs og blandede ISODate/ISODateTime-verdier i frontend.