diff --git a/craft/src/panels/sections/SectionLibraryModal.test.tsx b/craft/src/panels/sections/SectionLibraryModal.test.tsx index de11027..328e94c 100644 --- a/craft/src/panels/sections/SectionLibraryModal.test.tsx +++ b/craft/src/panels/sections/SectionLibraryModal.test.tsx @@ -100,4 +100,18 @@ describe('SectionLibraryModal', () => { h.act(() => { ($('.section-lib-delete') as HTMLElement).click(); }); expect(extrasApi.get('customSections', [])).toHaveLength(0); }); + test('sections loaded silently after mount (replaceAll) appear in My sections on open', () => { + mount(); + // Mirrors useWhpApi: the project load calls replaceAll, which does not re-render. + h.act(() => { + extrasApi.replaceAll({ + customSections: [{ + id: 'custom-loaded', name: 'Loaded hero', family: 'custom', createdAt: 1, + tree: { type: { resolvedName: 'Section' }, props: {} }, + }], + }); + }); + h.act(() => openSectionLibrary()); + expect($$('.section-lib-card').map((c) => c.dataset.sectionId)).toContain('custom-loaded'); + }); }); diff --git a/craft/src/panels/sections/SectionLibraryModal.tsx b/craft/src/panels/sections/SectionLibraryModal.tsx index 8383464..21b2dd2 100644 --- a/craft/src/panels/sections/SectionLibraryModal.tsx +++ b/craft/src/panels/sections/SectionLibraryModal.tsx @@ -66,7 +66,7 @@ export const SectionLibraryModal: React.FC = () => { const extras = useProjectExtras(); const { notify } = useNotices(); const [version, setVersion] = useState(0); - const sections = useSections(version); + const sections = useSections(version, open); const [family, setFamily] = useState(null); const [q, setQ] = useState(''); const [saveName, setSaveName] = useState(''); diff --git a/craft/src/sections/catalog.ts b/craft/src/sections/catalog.ts index 2f8044a..b148889 100644 --- a/craft/src/sections/catalog.ts +++ b/craft/src/sections/catalog.ts @@ -64,12 +64,13 @@ export function getSections(custom: CustomSection[] = []): SectionDef[] { /** Built-ins plus the site's own saved sections. Reads extras at render time * (extras are ref-backed; callers that mutate them re-render themselves). */ -export function useSections(version = 0): SectionDef[] { +export function useSections(version = 0, open = true): SectionDef[] { const extras = useProjectExtras(); return useMemo( () => getSections(extras.get(CUSTOM_SECTIONS_KEY, [])), // eslint-disable-next-line react-hooks/exhaustive-deps - [extras, version], + // `open` re-reads after a silent extras.replaceAll (project load) that never re-rendered us. + [extras, version, open], ); }