feat: create view from current table columns + persist view fields on… (#1308)

feat: create view from current table columns + persist view fields on Update View button click

Closes #1302, Closes #1307

front/src/modules/ui/table/states/savedTableColumnsScopedState.ts

@@ -0,0 +1,14 @@
+import { atomFamily } from 'recoil';
+
+import type {
+  ViewFieldDefinition,
+  ViewFieldMetadata,
+} from '@/ui/editable-field/types/ViewField';
+
+export const savedTableColumnsScopedState = atomFamily<
+  ViewFieldDefinition<ViewFieldMetadata>[],
+  string | undefined
+>({
+  key: 'savedTableColumnsScopedState',
+  default: [],
+});

front/src/modules/ui/table/states/selectors/canPersistTableColumnsScopedSelector.ts

@@ -0,0 +1,17 @@
+import { selectorFamily } from 'recoil';
+
+import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
+
+import { savedTableColumnsScopedState } from '../savedTableColumnsScopedState';
+import { tableColumnsScopedState } from '../tableColumnsScopedState';
+
+export const canPersistTableColumnsScopedSelector = selectorFamily({
+  key: 'canPersistTableColumnsScopedSelector',
+  get:
+    ([scopeId, viewId]: [string, string | undefined]) =>
+    ({ get }) =>
+      !isDeeplyEqual(
+        get(savedTableColumnsScopedState(viewId)),
+        get(tableColumnsScopedState(scopeId)),
+      ),
+});

front/src/modules/ui/table/states/selectors/hiddenTableColumnsScopedSelector.ts

@@ -0,0 +1,13 @@
+import { selectorFamily } from 'recoil';
+
+import { tableColumnsScopedState } from '../tableColumnsScopedState';
+
+export const hiddenTableColumnsScopedSelector = selectorFamily({
+  key: 'hiddenTableColumnsScopedSelector',
+  get:
+    (scopeId: string) =>
+    ({ get }) =>
+      get(tableColumnsScopedState(scopeId)).filter(
+        (column) => !column.isVisible,
+      ),
+});

front/src/modules/ui/table/states/selectors/numberOfTableColumnsScopedSelector.ts

@@ -0,0 +1,11 @@
+import { selectorFamily } from 'recoil';
+
+import { tableColumnsScopedState } from '../tableColumnsScopedState';
+
+export const numberOfTableColumnsScopedSelector = selectorFamily({
+  key: 'numberOfTableColumnsScopedSelector',
+  get:
+    (scopeId: string) =>
+    ({ get }) =>
+      get(tableColumnsScopedState(scopeId)).length,
+});

front/src/modules/ui/table/states/selectors/savedTableColumnsByIdScopedSelector.ts

@@ -0,0 +1,18 @@
+import { selectorFamily } from 'recoil';
+
+import type {
+  ViewFieldDefinition,
+  ViewFieldMetadata,
+} from '@/ui/editable-field/types/ViewField';
+
+import { savedTableColumnsScopedState } from '../savedTableColumnsScopedState';
+
+export const savedTableColumnsByIdScopedSelector = selectorFamily({
+  key: 'savedTableColumnsByIdScopedSelector',
+  get:
+    (viewId: string | undefined) =>
+    ({ get }) =>
+      get(savedTableColumnsScopedState(viewId)).reduce<
+        Record<string, ViewFieldDefinition<ViewFieldMetadata>>
+      >((result, column) => ({ ...result, [column.id]: column }), {}),
+});

front/src/modules/ui/table/states/selectors/tableColumnsByIdScopedSelector.ts

@@ -0,0 +1,18 @@
+import { selectorFamily } from 'recoil';
+
+import type {
+  ViewFieldDefinition,
+  ViewFieldMetadata,
+} from '@/ui/editable-field/types/ViewField';
+
+import { tableColumnsScopedState } from '../tableColumnsScopedState';
+
+export const tableColumnsByIdScopedSelector = selectorFamily({
+  key: 'tableColumnsByIdScopedSelector',
+  get:
+    (scopeId: string) =>
+    ({ get }) =>
+      get(tableColumnsScopedState(scopeId)).reduce<
+        Record<string, ViewFieldDefinition<ViewFieldMetadata>>
+      >((result, column) => ({ ...result, [column.id]: column }), {}),
+});

front/src/modules/ui/table/states/selectors/visibleTableColumnsScopedSelector.ts

@@ -0,0 +1,13 @@
+import { selectorFamily } from 'recoil';
+
+import { tableColumnsScopedState } from '../tableColumnsScopedState';
+
+export const visibleTableColumnsScopedSelector = selectorFamily({
+  key: 'visibleTableColumnsScopedSelector',
+  get:
+    (scopeId: string) =>
+    ({ get }) =>
+      get(tableColumnsScopedState(scopeId)).filter(
+        (column) => column.isVisible,
+      ),
+});

front/src/modules/ui/table/states/tableColumnsScopedState.ts

@@ -0,0 +1,14 @@
+import { atomFamily } from 'recoil';
+
+import type {
+  ViewFieldDefinition,
+  ViewFieldMetadata,
+} from '@/ui/editable-field/types/ViewField';
+
+export const tableColumnsScopedState = atomFamily<
+  ViewFieldDefinition<ViewFieldMetadata>[],
+  string
+>({
+  key: 'tableColumnsScopedState',
+  default: [],
+});

front/src/modules/ui/table/states/tableColumnsState.ts

@@ -1,37 +0,0 @@
-import { atom, selector } from 'recoil';
-
-import type {
-  ViewFieldDefinition,
-  ViewFieldMetadata,
-} from '@/ui/editable-field/types/ViewField';
-
-export const tableColumnsState = atom<ViewFieldDefinition<ViewFieldMetadata>[]>(
-  {
-    key: 'tableColumnsState',
-    default: [],
-  },
-);
-
-export const tableColumnsByIdState = selector({
-  key: 'tableColumnsByIdState',
-  get: ({ get }) =>
-    get(tableColumnsState).reduce<
-      Record<string, ViewFieldDefinition<ViewFieldMetadata>>
-    >((result, column) => ({ ...result, [column.id]: column }), {}),
-});
-
-export const numberOfTableColumnsState = selector<number>({
-  key: 'numberOfTableColumnsState',
-  get: ({ get }) => get(tableColumnsState).length,
-});
-
-export const visibleTableColumnsState = selector({
-  key: 'visibleTableColumnsState',
-  get: ({ get }) => get(tableColumnsState).filter((column) => column.isVisible),
-});
-
-export const hiddenTableColumnsState = selector({
-  key: 'hiddenTableColumnsState',
-  get: ({ get }) =>
-    get(tableColumnsState).filter((column) => !column.isVisible),
-});