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:
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;
|
||||
Reference in new issue
Block a user