feat: persist resized column widths (#1017)

* feat: persist resized column widths

Closes #981

* test: mock company and person view fields

front/src/testing/graphqlMocks.ts

@@ -13,6 +13,7 @@ import {
   SEARCH_USER_QUERY,
 } from '@/search/queries/search';
 import { GET_CURRENT_USER } from '@/users/queries';
+import { GET_VIEW_FIELDS } from '@/views/queries/select';
 import {
   GetCompaniesQuery,
   GetPeopleQuery,
@@ -24,8 +25,11 @@ import {
 } from '~/generated/graphql';
 
 import { mockedActivities } from './mock-data/activities';
-import { mockedCompaniesData } from './mock-data/companies';
-import { mockedPeopleData } from './mock-data/people';
+import {
+  mockedCompaniesData,
+  mockedCompanyViewFields,
+} from './mock-data/companies';
+import { mockedPeopleData, mockedPersonViewFields } from './mock-data/people';
 import { mockedPipelineProgressData } from './mock-data/pipeline-progress';
 import { mockedPipelinesData } from './mock-data/pipelines';
 import { mockedUsersData } from './mock-data/users';
@@ -206,4 +210,20 @@ export const graphqlMocks = [
       }),
     );
   }),
+  graphql.query(getOperationName(GET_VIEW_FIELDS) ?? '', (req, res, ctx) => {
+    const {
+      where: {
+        objectName: { equals: objectName },
+      },
+    } = req.variables;
+
+    return res(
+      ctx.data({
+        viewFields:
+          objectName === 'company'
+            ? mockedCompanyViewFields
+            : mockedPersonViewFields,
+      }),
+    );
+  }),
 ];

front/src/testing/mock-data/companies.ts

@@ -1,4 +1,5 @@
-import { Company, User } from '../../generated/graphql';
+import { companyViewFields } from '@/companies/constants/companyViewFields';
+import { Company, User, ViewField } from '~/generated/graphql';
 
 type MockedCompany = Pick<
   Company,
@@ -118,3 +119,15 @@ export const mockedCompaniesData: Array<MockedCompany> = [
     __typename: 'Company',
   },
 ];
+
+export const mockedCompanyViewFields = companyViewFields.map<ViewField>(
+  (viewFieldDefinition) => ({
+    __typename: 'ViewField',
+    fieldName: viewFieldDefinition.columnLabel,
+    id: viewFieldDefinition.id,
+    index: viewFieldDefinition.columnOrder,
+    isVisible: true,
+    objectName: 'company',
+    sizeInPx: viewFieldDefinition.columnSize,
+  }),
+);

front/src/testing/mock-data/people.ts

@@ -1,4 +1,5 @@
-import { Company, Person } from '~/generated/graphql';
+import { peopleViewFields } from '@/people/constants/peopleViewFields';
+import { Company, Person, ViewField } from '~/generated/graphql';
 
 type RequiredAndNotNull<T> = {
   [P in keyof T]-?: Exclude<T[P], null | undefined>;
@@ -116,3 +117,15 @@ export const mockedPeopleData: MockedPerson[] = [
     city: 'Paris',
   },
 ];
+
+export const mockedPersonViewFields = peopleViewFields.map<ViewField>(
+  (viewFieldDefinition) => ({
+    __typename: 'ViewField',
+    fieldName: viewFieldDefinition.columnLabel,
+    id: viewFieldDefinition.id,
+    index: viewFieldDefinition.columnOrder,
+    isVisible: true,
+    objectName: 'person',
+    sizeInPx: viewFieldDefinition.columnSize,
+  }),
+);