Skip to content

Commit

Permalink
fix(mutations): update v3 to use v4 interface for updating/deleting m…
Browse files Browse the repository at this point in the history 
…utation layouts (#13375)

* fix(useFormLayoutMutationV3): update v3 to use v4 interface for updating layout
  • Loading branch information
@framitdavid
framitdavid authored Aug 15, 2024
1 parent ef393fb commit 7672a78
Show file tree
Hide file tree
Showing 10 changed files with 83 additions and 56 deletions.
3 changes: 1 addition & 2 deletions frontend/packages/shared/src/api/mutations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,6 @@ import type { ApplicationAttachmentMetadata } from 'app-shared/types/Application
import type { CreateDeploymentPayload } from 'app-shared/types/api/CreateDeploymentPayload';
import type { CreateReleasePayload } from 'app-shared/types/api/CreateReleasePayload';
import type { CreateRepoCommitPayload } from 'app-shared/types/api/CreateRepoCommitPayload';
import type { ExternalFormLayoutV3 } from 'app-shared/types/api/FormLayoutsResponseV3';
import type { LayoutSetPayload } from 'app-shared/types/api/LayoutSetsResponse';
import type { ILayoutSettings, ITextResourcesObjectFormat } from 'app-shared/types/global';
import type { RuleConfig } from 'app-shared/types/RuleConfig';
Expand Down Expand Up @@ -95,7 +94,7 @@ export const pushRepoChanges = (org: string, app: string) => post(repoPushPath(o
export const resetRepoChanges = (org: string, app: string) => get(repoResetPath(org, app)); //Technically a mutation, but currently only implemented as a GET
export const saveDataModel = (org: string, app: string, modelPath: string, payload: JsonSchema) => put<void, JsonSchema>(dataModelPath(org, app, modelPath, true), payload);
export const saveFormLayout = (org: string, app: string, layoutName: string, layoutSetName: string, payload: FormLayoutRequest) => post<void, FormLayoutRequest>(formLayoutPath(org, app, layoutName, layoutSetName), payload);
export const saveFormLayoutV3 = (org: string, app: string, layoutName: string, layoutSetName: string, payload: ExternalFormLayoutV3) => post<void, ExternalFormLayoutV3>(formLayoutPath(org, app, layoutName, layoutSetName), payload);
export const saveFormLayoutV3 = (org: string, app: string, layoutName: string, layoutSetName: string, payload: FormLayoutRequest) => post<void, FormLayoutRequest>(formLayoutPath(org, app, layoutName, layoutSetName), payload);
export const saveFormLayoutSettings = (org: string, app: string, layoutSetName: string, payload: ILayoutSettings) => post<ILayoutSettings>(layoutSettingsPath(org, app, layoutSetName), payload);
export const saveRuleConfig = (org: string, app: string, layoutSetName: string, payload: RuleConfig) => post<RuleConfig>(ruleConfigPath(org, app, layoutSetName), payload);
export const setStarredRepo = (org: string, app: string) => put(userStarredRepoPath(org, app), {});
Expand Down
20 changes: 12 additions & 8 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useAddLayoutMutation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,12 @@ describe('useAddLayoutMutation', () => {
layoutName,
selectedLayoutSet,
{
$schema: 'https://altinncdn.no/schemas/json/layout/layout.schema.v1.json',
data: {
layout: [expect.objectContaining({ type: ComponentTypeV3.NavigationButtons })],
hidden: undefined,
layout: {
$schema: 'https://altinncdn.no/schemas/json/layout/layout.schema.v1.json',
data: {
layout: [expect.objectContaining({ type: ComponentTypeV3.NavigationButtons })],
hidden: undefined,
},
},
},
);
Expand All @@ -66,10 +68,12 @@ describe('useAddLayoutMutation', () => {
formLayoutSettingsMock.receiptLayoutName,
selectedLayoutSet,
{
$schema: 'https://altinncdn.no/schemas/json/layout/layout.schema.v1.json',
data: {
layout: [],
hidden: undefined,
layout: {
$schema: 'https://altinncdn.no/schemas/json/layout/layout.schema.v1.json',
data: {
layout: [],
hidden: undefined,
},
},
},
);
Expand Down
5 changes: 4 additions & 1 deletion frontend/packages/ux-editor-v3/src/hooks/mutations/useAddLayoutMutation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import { useFormLayoutSettingsQuery } from '../queries/useFormLayoutSettingsQuer
import type { ILayoutSettings } from 'app-shared/types/global';
import { addOrRemoveNavigationButtons } from '../../utils/formLayoutsUtils';
import { internalLayoutToExternal } from '../../converters/formLayoutConverters';
import { type FormLayoutRequest } from 'app-shared/types/api/FormLayoutRequest';

export interface AddLayoutMutationArgs {
layoutName: string;
Expand All @@ -29,7 +30,9 @@ export const useAddLayoutMutation = (org: string, app: string, layoutSetName: st

const save = async (updatedLayoutName: string, updatedLayout: IInternalLayout) => {
const convertedLayout: ExternalFormLayoutV3 = internalLayoutToExternal(updatedLayout);
return await saveFormLayoutV3(org, app, updatedLayoutName, layoutSetName, convertedLayout);
return await saveFormLayoutV3(org, app, updatedLayoutName, layoutSetName, {
layout: convertedLayout,
} as unknown as FormLayoutRequest);
};

return useMutation({
Expand Down
6 changes: 4 additions & 2 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useDeleteFormComponentMutation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@ describe('useDeleteFormComponentMutation', () => {
layout1NameMock,
selectedLayoutSet,
expect.objectContaining({
data: expect.objectContaining({
layout: expect.not.arrayContaining([expect.objectContaining({ id: component2IdMock })]),
layout: expect.objectContaining({
data: expect.objectContaining({
layout: expect.not.arrayContaining([expect.objectContaining({ id: component2IdMock })]),
}),
}),
}),
);
Expand Down
6 changes: 4 additions & 2 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useDeleteFormContainerMutation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,10 @@ describe('useDeleteFormContainerMutation', () => {
layout1NameMock,
selectedLayoutSet,
expect.objectContaining({
data: expect.objectContaining({
layout: expect.not.arrayContaining([expect.objectContaining({ id })]),
layout: expect.objectContaining({
data: expect.objectContaining({
layout: expect.not.arrayContaining([expect.objectContaining({ id })]),
}),
}),
}),
);
Expand Down
5 changes: 4 additions & 1 deletion frontend/packages/ux-editor-v3/src/hooks/mutations/useDeleteLayoutMutation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import { useAddLayoutMutation } from './useAddLayoutMutation';
import { useText } from '../useText';
import { selectedLayoutNameSelector } from '../../selectors/formLayoutSelectors';
import { internalLayoutToExternal } from '../../converters/formLayoutConverters';
import { type FormLayoutRequest } from 'app-shared/types/api/FormLayoutRequest';

export const useDeleteLayoutMutation = (org: string, app: string, layoutSetName: string) => {
const { deleteFormLayout, saveFormLayoutV3 } = useServicesContext();
Expand All @@ -31,7 +32,9 @@ export const useDeleteLayoutMutation = (org: string, app: string, layoutSetName:

const saveLayout = async (updatedLayoutName: string, updatedLayout: IInternalLayout) => {
const convertedLayout: ExternalFormLayoutV3 = internalLayoutToExternal(updatedLayout);
return await saveFormLayoutV3(org, app, updatedLayoutName, layoutSetName, convertedLayout);
return await saveFormLayoutV3(org, app, updatedLayoutName, layoutSetName, {
layout: convertedLayout,
} as unknown as FormLayoutRequest);
};

return useMutation({
Expand Down
30 changes: 16 additions & 14 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useFormLayoutMutation.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -62,20 +62,22 @@ describe('useFormLayoutMutation', () => {
layoutName,
selectedLayoutSet,
expect.objectContaining({
data: {
layout: [
{
id: containerId,
type: ComponentTypeV3.Group,
children: [componentId],
},
{
id: componentId,
type: componentType,
dataModelBindings: {},
},
],
},
layout: expect.objectContaining({
data: {
layout: [
{
id: containerId,
type: ComponentTypeV3.Group,
children: [componentId],
},
{
id: componentId,
type: componentType,
dataModelBindings: {},
},
],
},
}),
}),
);
});
Expand Down
8 changes: 7 additions & 1 deletion frontend/packages/ux-editor-v3/src/hooks/mutations/useFormLayoutMutation.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { usePreviewConnection } from 'app-shared/providers/PreviewConnectionCont
import type { ExternalFormLayoutV3 } from 'app-shared/types/api/FormLayoutsResponseV3';
import { useAppContext } from '../useAppContext';
import { internalLayoutToExternal } from '../../converters/formLayoutConverters';
import type { FormLayoutRequest } from 'app-shared/types/api/FormLayoutRequest';

export const useFormLayoutMutation = (
org: string,
Expand All @@ -21,7 +22,12 @@ export const useFormLayoutMutation = (
return useMutation({
mutationFn: (layout: IInternalLayout) => {
const convertedLayout: ExternalFormLayoutV3 = internalLayoutToExternal(layout);
return saveFormLayoutV3(org, app, layoutName, layoutSetName, convertedLayout).then(

const requestPayload = {
layout: convertedLayout,
} as unknown as FormLayoutRequest;

return saveFormLayoutV3(org, app, layoutName, layoutSetName, requestPayload).then(
() => layout,
);
},
Expand Down
38 changes: 21 additions & 17 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useUpdateFormComponentMutation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,14 +55,16 @@ describe('useUpdateFormComponentMutation', () => {
layout1NameMock,
selectedLayoutSet,
expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
id,
type,
dataModelBindings,
},
]),
layout: expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
id,
type,
dataModelBindings,
},
]),
}),
}),
}),
);
Expand Down Expand Up @@ -128,15 +130,17 @@ describe('useUpdateFormComponentMutation', () => {
layout1NameMock,
selectedLayoutSet,
expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
id,
type: componentType,
dataModelBindings,
...optionsProp,
},
]),
layout: expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
id,
type: componentType,
dataModelBindings,
...optionsProp,
},
]),
}),
}),
}),
);
Expand Down
18 changes: 10 additions & 8 deletions frontend/packages/ux-editor-v3/src/hooks/mutations/useUpdateFormContainerMutation.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,14 +49,16 @@ describe('useUpdateFormContainerMutation', () => {
layout1NameMock,
selectedLayoutSet,
expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
...layout1Mock.data.layout[0],
id: updatedContainer.id,
maxCount,
},
]),
layout: expect.objectContaining({
data: expect.objectContaining({
layout: expect.arrayContaining([
{
...layout1Mock.data.layout[0],
id: updatedContainer.id,
maxCount,
},
]),
}),
}),
}),
);
Expand Down

0 comments on commit 7672a78

Please sign in to comment.