mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: reset table column resizing on ViewBar Cancel button click (#1520)

Browse Source 
* feat: reset table column resizing on ViewBar Cancel button click

Closes #1500

* Fix according to PR

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Thaïs
2023-09-11 03:51:24 +02:00
committed by GitHub
parent c808eeca79
commit 8ea4e6a51c
3 changed files with 52 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
front/src/modules/ui/table/table-header/components/TableHeader.tsx
View File

@ -1,11 +1,12 @@
import { useCallback } from 'react';
import { useRecoilCallback, useRecoilValue, useSetRecoilState } from 'recoil';
import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil';
import { DropdownRecoilScopeContext } from '@/ui/dropdown/states/recoil-scope-contexts/DropdownRecoilScopeContext';
import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope';
import { useContextScopeId } from '@/ui/utilities/recoil-scope/hooks/useContextScopeId';
import { useRecoilScopedState } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedState';
import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
import { ViewBar, type ViewBarProps } from '@/ui/view-bar/components/ViewBar';
import { ViewBar, ViewBarProps } from '@/ui/view-bar/components/ViewBar';
import { currentViewIdScopedState } from '@/ui/view-bar/states/currentViewIdScopedState';
import { TableOptionsDropdown } from '../../options/components/TableOptionsDropdown';
@ -38,14 +39,18 @@ export function TableHeader<SortField>({
const canPersistTableColumns = useRecoilValue(
canPersistTableColumnsScopedFamilySelector([tableScopeId, currentViewId]),
);
const tableColumns = useRecoilScopedValue(
const [tableColumns, setTableColumns] = useRecoilScopedState(
tableColumnsScopedState,
TableRecoilScopeContext,
);
const setSavedTableColumns = useSetRecoilState(
const [savedTableColumns, setSavedTableColumns] = useRecoilState(
savedTableColumnsFamilyState(currentViewId),
);
function handleViewBarReset() {
setTableColumns(savedTableColumns);
}
const handleViewSelect = useRecoilCallback(
({ set, snapshot }) =>
async (viewId: string) => {
@ -57,11 +62,13 @@ export function TableHeader<SortField>({
[tableScopeId],
);
const handleViewSubmit = async () => {
if (canPersistTableColumns) setSavedTableColumns(tableColumns);
async function handleViewSubmit() {
if (canPersistTableColumns) {
setSavedTableColumns(tableColumns);
}
await onViewSubmit?.();
};
}
const OptionsDropdownButton = useCallback(
() => (
@ -79,6 +86,7 @@ export function TableHeader<SortField>({
<ViewBar
{...props}
canPersistViewFields={canPersistTableColumns}
onReset={handleViewBarReset}
onViewSelect={handleViewSelect}
onViewSubmit={handleViewSubmit}
OptionsDropdownButton={OptionsDropdownButton}