Recursively turn relation connection into records (#3334)

* Use new ObjectRecordConnection

* Use new records without connection in GraphQLView

* Added playwright for storybook tests

* Fixed lint

* Fixed test and tsc

* Fixed storybook tests

* wip tests

* Added useMapConnectionToRecords unit test

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Lucas Bordeau
2024-01-11 20:27:59 +01:00
committed by GitHub
parent 299bed511f
commit e2bdf0ce45
24 changed files with 1252 additions and 266 deletions

View File

@ -41,6 +41,7 @@ export const ViewBarEffect = () => {
type: { eq: viewType },
objectMetadataId: { eq: viewObjectMetadataId },
},
useRecordsWithoutConnection: true,
});
useEffect(() => {

View File

@ -284,33 +284,11 @@ describe('useViewBar', () => {
viewBar.setAvailableSortDefinitions([sortDefinition]);
viewBar.loadViewSorts(
{
edges: [
{
node: viewSort,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
mockedUuid,
);
viewBar.loadViewSorts([viewSort], mockedUuid);
viewBar.setAvailableFilterDefinitions([filterDefinition]);
viewBar.loadViewFilters(
{
edges: [
{
node: viewFilter,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
mockedUuid,
);
viewBar.loadViewFilters([viewFilter], mockedUuid);
return { viewBar };
}, renderHookConfig);

View File

@ -159,18 +159,7 @@ describe('useViewBar > viewFields', () => {
await act(async () => {
result.current.viewBar.setAvailableFieldDefinitions([fieldDefinition]);
await result.current.viewBar.loadViewFields(
{
edges: [
{
node: viewField,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
await result.current.viewBar.loadViewFields([viewField], currentViewId);
result.current.viewBar.setCurrentViewId(currentViewId);
});

View File

@ -69,18 +69,7 @@ describe('useViewBar > viewFilters', () => {
await act(async () => {
result.current.viewBar.setAvailableFilterDefinitions([filterDefinition]);
await result.current.viewBar.loadViewFilters(
{
edges: [
{
node: viewFilter,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
await result.current.viewBar.loadViewFilters([viewFilter], currentViewId);
result.current.viewBar.setCurrentViewId(currentViewId);
});
@ -93,18 +82,7 @@ describe('useViewBar > viewFilters', () => {
viewBar.setAvailableFilterDefinitions([filterDefinition]);
viewBar.loadViewFilters(
{
edges: [
{
node: viewFilter,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
viewBar.loadViewFilters([viewFilter], currentViewId);
viewBar.setCurrentViewId(currentViewId);
const { currentViewFiltersState } = useViewScopedStates({
@ -174,18 +152,7 @@ describe('useViewBar > viewFilters', () => {
viewBar.setAvailableFilterDefinitions([filterDefinition]);
viewBar.loadViewFilters(
{
edges: [
{
node: viewFilter,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
viewBar.loadViewFilters([viewFilter], currentViewId);
viewBar.setCurrentViewId(currentViewId);
const { currentViewFiltersState } = useViewScopedStates({

View File

@ -65,18 +65,7 @@ describe('View Sorts', () => {
await act(async () => {
result.current.viewBar.setAvailableSortDefinitions([sortDefinition]);
await result.current.viewBar.loadViewSorts(
{
edges: [
{
node: viewSort,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
await result.current.viewBar.loadViewSorts([viewSort], currentViewId);
result.current.viewBar.setCurrentViewId(currentViewId);
});
@ -89,18 +78,7 @@ describe('View Sorts', () => {
viewBar.setAvailableSortDefinitions([sortDefinition]);
viewBar.loadViewSorts(
{
edges: [
{
node: viewSort,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
viewBar.loadViewSorts([viewSort], currentViewId);
viewBar.setCurrentViewId(currentViewId);
const { currentViewSortsState } = useViewScopedStates({
@ -161,18 +139,7 @@ describe('View Sorts', () => {
viewBar.setAvailableSortDefinitions([sortDefinition]);
viewBar.loadViewSorts(
{
edges: [
{
node: viewSort,
cursor: '',
},
],
pageInfo: { hasNextPage: false, startCursor: '', endCursor: '' },
},
currentViewId,
);
viewBar.loadViewSorts([viewSort], currentViewId);
viewBar.setCurrentViewId(currentViewId);
const { currentViewSortsState } = useViewScopedStates({

View File

@ -3,7 +3,6 @@ import { useSearchParams } from 'react-router-dom';
import { useRecoilCallback, useRecoilState, useSetRecoilState } from 'recoil';
import { v4 } from 'uuid';
import { PaginatedRecordTypeResults } from '@/object-record/types/PaginatedRecordTypeResults';
import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
import { ViewField } from '@/views/types/ViewField';
import { ViewFilter } from '@/views/types/ViewFilter';
@ -93,10 +92,7 @@ export const useViewBar = (props?: UseViewProps) => {
const loadViewFields = useRecoilCallback(
({ snapshot, set }) =>
async (
data: PaginatedRecordTypeResults<ViewField>,
currentViewId: string,
) => {
async (viewFields: ViewField[], currentViewId: string) => {
const {
availableFieldDefinitions,
onViewFieldsChange,
@ -119,8 +115,8 @@ export const useViewBar = (props?: UseViewProps) => {
return;
}
const queriedViewFields = data.edges
.map((viewField) => viewField.node)
const queriedViewFields = viewFields
.map((viewField) => viewField)
.filter(assertNotNull);
if (isPersistingView) {
@ -138,10 +134,7 @@ export const useViewBar = (props?: UseViewProps) => {
const loadViewFilters = useRecoilCallback(
({ snapshot, set }) =>
async (
data: PaginatedRecordTypeResults<Required<ViewFilter>>,
currentViewId: string,
) => {
async (viewFilters: ViewFilter[], currentViewId: string) => {
const {
availableFilterDefinitions,
savedViewFilters,
@ -163,18 +156,18 @@ export const useViewBar = (props?: UseViewProps) => {
return;
}
const queriedViewFilters = data.edges
.map(({ node }) => {
const queriedViewFilters = viewFilters
.map((viewFilter) => {
const availableFilterDefinition = availableFilterDefinitions.find(
(filterDefinition) =>
filterDefinition.fieldMetadataId === node.fieldMetadataId,
filterDefinition.fieldMetadataId === viewFilter.fieldMetadataId,
);
if (!availableFilterDefinition) return null;
return {
...node,
displayValue: node.displayValue ?? node.value,
...viewFilter,
displayValue: viewFilter.displayValue ?? viewFilter.value,
definition: availableFilterDefinition,
};
})
@ -191,10 +184,7 @@ export const useViewBar = (props?: UseViewProps) => {
const loadViewSorts = useRecoilCallback(
({ snapshot, set }) =>
async (
data: PaginatedRecordTypeResults<Required<ViewSort>>,
currentViewId: string,
) => {
async (viewSorts: Required<ViewSort>[], currentViewId: string) => {
const { availableSortDefinitions, savedViewSorts, onViewSortsChange } =
getViewScopedStateValuesFromSnapshot({
snapshot,
@ -213,18 +203,18 @@ export const useViewBar = (props?: UseViewProps) => {
return;
}
const queriedViewSorts = data.edges
.map(({ node }) => {
const queriedViewSorts = viewSorts
.map((viewSort) => {
const availableSortDefinition = availableSortDefinitions.find(
(sort) => sort.fieldMetadataId === node.fieldMetadataId,
(sort) => sort.fieldMetadataId === viewSort.fieldMetadataId,
);
if (!availableSortDefinition) return null;
return {
id: node.id,
fieldMetadataId: node.fieldMetadataId,
direction: node.direction,
id: viewSort.id,
fieldMetadataId: viewSort.fieldMetadataId,
direction: viewSort.direction,
definition: availableSortDefinition,
};
})

View File

@ -1,4 +1,3 @@
import { PaginatedRecordTypeResults } from '@/object-record/types/PaginatedRecordTypeResults';
import { ViewField } from '@/views/types/ViewField';
import { ViewFilter } from '@/views/types/ViewFilter';
import { ViewSort } from '@/views/types/ViewSort';
@ -7,7 +6,7 @@ export type GraphQLView = {
id: string;
name: string;
objectMetadataId: string;
viewFields: PaginatedRecordTypeResults<ViewField>;
viewFilters: PaginatedRecordTypeResults<ViewFilter>;
viewSorts: PaginatedRecordTypeResults<ViewSort>;
viewFields: ViewField[];
viewFilters: ViewFilter[];
viewSorts: ViewSort[];
};