fix(board): make SectionContext optional for view mode

Add useOptionalSectionContext to gracefully handle rendering outside
GridStack (view mode). The item menu now uses optional chaining for
gridstack access instead of throwing when context is absent.
This commit is contained in:
Thomas Camlong committed 2026-05-22 11:37:39 +02:00
1 parent 121cff20d7
commit f53527e2e7
2 files changed
+8 -3

No files matched your search

@@ -12,7 +12,7 @@ import { widgetImports } from "@homarr/widgets";
import { WidgetEditModal } from "@homarr/widgets/modals";
import type { SectionItem } from "~/app/[locale]/boards/_types";
import { useSectionContext } from "../sections/section-context";
import { useOptionalSectionContext } from "../sections/section-context";
import { useItemActions } from "./item-actions";
import { ItemMoveModal } from "./item-move-modal";
@@ -41,7 +41,8 @@ const BoardItemMenuInner = ({ offset, item, resetErrorBoundary }: BoardItemMenuP
useItemActions();
const { data: integrationData, isPending } = clientApi.integration.all.useQuery();
const currentDefinition = useMemo(() => widgetImports[item.kind].definition, [item.kind]);
const { gridstack } = useSectionContext().refs;
const sectionContext = useOptionalSectionContext();
const gridstack = sectionContext?.refs.gridstack;
const settings = useSettings();
// Reset error boundary on next render if item has been edited
@@ -119,7 +120,7 @@ const BoardItemMenuInner = ({ offset, item, resetErrorBoundary }: BoardItemMenuP
<Menu.Item
leftSection={<IconLayoutKanban size={16} />}
onClick={() => {
if (!gridstack.current) return;
if (!gridstack?.current) return;
openMoveModal({ item, columnCount: gridstack.current.getColumn(), gridStack: gridstack.current });
}}
>
@@ -20,4 +20,8 @@ export const useSectionContext = () => {
return context;
};
export const useOptionalSectionContext = () => {
return useContext(SectionContext);
};
export const SectionProvider = SectionContext.Provider;