diff --git a/apps/client/src/features/cuesheet/cuesheet-table-elements/CuesheetHeader.tsx b/apps/client/src/features/cuesheet/cuesheet-table-elements/CuesheetHeader.tsx index f9d4455ab..cd6bcd905 100644 --- a/apps/client/src/features/cuesheet/cuesheet-table-elements/CuesheetHeader.tsx +++ b/apps/client/src/features/cuesheet/cuesheet-table-elements/CuesheetHeader.tsx @@ -1,4 +1,4 @@ -import { memo } from 'react'; +import { memo, useEffect } from 'react'; import { Tooltip } from '@chakra-ui/react'; import { closestCenter, @@ -31,6 +31,12 @@ function CuesheetHeader(props: CuesheetHeaderProps) { const { headerGroups } = props; const [columnOrder, saveColumnOrder] = useLocalStorage('table-order', initialColumnOrder); + useEffect(() => { + if (!localStorage.getItem('table-order')) { + saveColumnOrder(initialColumnOrder); + } + }, [saveColumnOrder]); + const handleOnDragEnd = (event: DragEndEvent) => { const { delta, active, over } = event;