From 1ffb34975968844d4f963b408a2ec2f0b07421d4 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Thu, 11 Apr 2024 12:37:10 +0200 Subject: [PATCH 01/25] enable layout with duplicated ids to return --- .../packages/shared/src/utils/objectUtils.ts | 22 ++++++++++++------- .../ux-editor/src/utils/formLayoutsUtils.ts | 6 +---- 2 files changed, 15 insertions(+), 13 deletions(-) diff --git a/frontend/packages/shared/src/utils/objectUtils.ts b/frontend/packages/shared/src/utils/objectUtils.ts index 6567f40a8f0..0c061aed290 100644 --- a/frontend/packages/shared/src/utils/objectUtils.ts +++ b/frontend/packages/shared/src/utils/objectUtils.ts @@ -1,5 +1,4 @@ import type { KeyValuePairs } from 'app-shared/types/KeyValuePairs'; -import { areItemsUnique } from 'app-shared/utils/arrayUtils'; /** * Checks if two objects are equal (shallow comparison). @@ -19,19 +18,26 @@ export const areObjectsEqual = (obj1: T, obj2: T): boolean => /** * Maps an array of objects to a key-value pair object, where the key is the value of the given property. - * Requires that the values of the given property are unique. * @param objectList * @param property + * @returns An object with the values of the given property as keys and the objects as values. */ export const mapByProperty = ( objectList: T[], property: keyof T, ): KeyValuePairs => { - const keys = objectList.map((object) => object[property]); - if (!areItemsUnique(keys)) { - throw new Error( - 'The values of the given property in the mapByProperty function should be unique.', - ); - } return Object.fromEntries(objectList.map((object) => [object[property], object])); }; + +/** + * Flattens the values of an object. + * @param object The object to flatten. + * @returns An array of the values of the object. + */ +export const flattenObjectValues = (object: T): string[] => { + return Object.entries(object) + .map(([, value]) => { + return value; + }) + .flat(); +}; diff --git a/frontend/packages/ux-editor/src/utils/formLayoutsUtils.ts b/frontend/packages/ux-editor/src/utils/formLayoutsUtils.ts index 3585120d6b3..c312b4810ba 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutsUtils.ts +++ b/frontend/packages/ux-editor/src/utils/formLayoutsUtils.ts @@ -75,11 +75,7 @@ export const convertExternalLayoutsToInternalFormat = ( if (!layout || !layout.data) { convertedLayouts[name] = createEmptyLayout(); } else { - try { - convertedLayouts[name] = externalLayoutToInternal(layouts[name]); - } catch (err) { - console.error(err); - } + convertedLayouts[name] = externalLayoutToInternal(layouts[name]); } }); return convertedLayouts; From 4759dc8ac60af7b30f34dcf23f24845ddd1f4545 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Thu, 11 Apr 2024 12:46:07 +0200 Subject: [PATCH 02/25] display error if the layout contains duplicated ids --- .../src/containers/DesignView/DesignView.tsx | 14 ++++++---- .../ux-editor/src/utils/formLayoutUtils.ts | 28 ++++++++++++++++++- 2 files changed, 36 insertions(+), 6 deletions(-) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index 2803f272b16..9972445c207 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -1,6 +1,5 @@ import type { ReactNode } from 'react'; import React from 'react'; -import { useFormLayoutsQuery } from '../../hooks/queries/useFormLayoutsQuery'; import classes from './DesignView.module.css'; import { useTranslation } from 'react-i18next'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; @@ -12,9 +11,10 @@ import { PlusIcon } from '@navikt/aksel-icons'; import { useAddLayoutMutation } from '../../hooks/mutations/useAddLayoutMutation'; import { PageAccordion } from './PageAccordion'; import { ReceiptContent } from './ReceiptContent'; -import { useAppContext } from '../../hooks'; +import { useAppContext, useFormLayouts } from '../../hooks'; import { FormLayout } from './FormLayout'; import { StudioButton } from '@studio/components'; +import { haveComponentsUniqueIds } from '../../utils/formLayoutUtils'; /** * Maps the IFormLayouts object to a list of FormLayouts @@ -41,7 +41,7 @@ export const DesignView = (): ReactNode => { app, selectedFormLayoutSetName, ); - const { data: layouts } = useFormLayoutsQuery(org, app, selectedFormLayoutSetName); + const layouts = useFormLayouts(); const { data: formLayoutSettings } = useFormLayoutSettingsQuery( org, app, @@ -53,7 +53,6 @@ export const DesignView = (): ReactNode => { const { t } = useTranslation(); const formLayoutData = mapFormLayoutsToFormLayoutPages(layouts); - /** * Handles the click of an accordion. It updates the URL and sets the * local storage for which page view that is open @@ -88,7 +87,10 @@ export const DesignView = (): ReactNode => { // If the layout does not exist, return null if (layout === undefined) return null; - return ( + // Check if the layout has unique component IDs + const isValidLayout = haveComponentsUniqueIds(layout); + + return isValidLayout ? ( { > {layout.page === selectedFormLayoutName && } + ) : ( + 'feil' ); }); diff --git a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts index b2eb26b49e2..487f7ccf552 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts +++ b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts @@ -6,7 +6,11 @@ import type { } from '../types/global'; import { BASE_CONTAINER_ID, MAX_NESTED_GROUP_LEVEL } from 'app-shared/constants'; import { ObjectUtils } from '@studio/pure-functions'; -import { insertArrayElementAtPos, removeItemByValue } from 'app-shared/utils/arrayUtils'; +import { + insertArrayElementAtPos, + removeItemByValue, + areItemsUnique, +} from 'app-shared/utils/arrayUtils'; import { ComponentType } from 'app-shared/types/ComponentType'; import type { FormComponent } from '../types/FormComponent'; import { generateFormItem } from './component'; @@ -16,6 +20,8 @@ import type { FormContainer } from '../types/FormContainer'; import type { FormItem } from '../types/FormItem'; import * as formItemUtils from './formItemUtils'; import type { ContainerComponentType } from '../types/ContainerComponent'; +import type { FormLayoutPage } from '../types/FormLayoutPage'; +import { flattenObjectValues } from 'app-shared/utils/objectUtils'; export const mapComponentToToolbarElement = ( c: FormItemConfigs[T], @@ -406,3 +412,23 @@ export const isItemChildOfContainer = ( export const idExistsInLayout = (id: string, layout: IInternalLayout): boolean => Object.keys(layout.components || {}).some((key) => key.toUpperCase() === id.toUpperCase()) || Object.keys(layout.containers || {}).some((key) => key.toUpperCase() === id.toUpperCase()); + +/** + * Checks if all components in the given layout have unique ids. + * @param layout The layout to check. + * @returns True if all items in the array are unique and false otherwise. + */ +export const haveComponentsUniqueIds = (layout: FormLayoutPage): boolean => { + const idsInLayout = flattenObjectValues(layout.data.order); + return areItemsUnique(idsInLayout); +}; + +/** + * Get the duplicated ids in the layout + * @param layout The layout to check + * @returns An array of duplicated ids + */ +export const getDuplicatedIds = (layout: FormLayoutPage): string[] => { + const idsInLayout = flattenObjectValues(layout.data.order); + return idsInLayout.filter((id, index) => idsInLayout.indexOf(id) !== index); +}; From 4ad8a103169cb9d138cf25e32bce1a991aef6881 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Thu, 11 Apr 2024 14:32:31 +0200 Subject: [PATCH 03/25] some adjustments of styling in accordion header --- .../DesignView/PageAccordion/PageAccordion.module.css | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css index 0ccb840c02a..8030eabf402 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css @@ -1,9 +1,8 @@ .navigationMenu { display: flex; - justify-content: flex-start; - align-items: stretch; + align-items: center; padding-block: 12px; - margin-left: 10px; + padding: 3px; background-color: var(--background-color); } @@ -31,5 +30,4 @@ .accordionHeaderRow { display: flex; - background-color: var(--background-color); } From dbafdee8da7ac4a627fd000478cbd9b98a984c8b Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Thu, 11 Apr 2024 15:18:40 +0200 Subject: [PATCH 04/25] Display duplicated ids in the warning message --- .../src/containers/DesignView/DesignView.tsx | 30 +++++++++---------- .../containers/DesignView/FormLayout.test.tsx | 1 + .../src/containers/DesignView/FormLayout.tsx | 17 +++++++---- .../DesignView/FormLayoutWarning.tsx | 18 +++++++++++ .../ux-editor/src/utils/formLayoutUtils.ts | 9 +++--- 5 files changed, 48 insertions(+), 27 deletions(-) create mode 100644 frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index 9972445c207..f333093c539 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -88,19 +88,19 @@ export const DesignView = (): ReactNode => { if (layout === undefined) return null; // Check if the layout has unique component IDs - const isValidLayout = haveComponentsUniqueIds(layout); - - return isValidLayout ? ( - handleClickAccordion(layout.page)} - > - {layout.page === selectedFormLayoutName && } - - ) : ( - 'feil' + const isValidLayout = haveComponentsUniqueIds(layout.data); + return ( + + handleClickAccordion(layout.page)} + > + {layout.page === selectedFormLayoutName && ( + + )} + + ); }); @@ -108,9 +108,7 @@ export const DesignView = (): ReactNode => {
-
- {displayPageAccordions} -
+
{displayPageAccordions}
{ diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.tsx index c75842d45ca..8578838cf5c 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.tsx @@ -4,17 +4,22 @@ import React from 'react'; import { hasMultiPageGroup } from '../../utils/formLayoutUtils'; import { useTranslation } from 'react-i18next'; import { Alert, Paragraph } from '@digdir/design-system-react'; +import { FormLayoutWarning } from './FormLayoutWarning'; export interface FormLayoutProps { layout: IInternalLayout; + isValid: boolean; } -export const FormLayout = ({ layout }: FormLayoutProps) => ( - <> - {hasMultiPageGroup(layout) && } - - -); +export const FormLayout = ({ layout, isValid }: FormLayoutProps) => + isValid ? ( + <> + {hasMultiPageGroup(layout) && } + + + ) : ( + + ); const MultiPageWarning = () => { const { t } = useTranslation(); diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx new file mode 100644 index 00000000000..63e8f578d78 --- /dev/null +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -0,0 +1,18 @@ +import React from 'react'; +import type { IInternalLayout } from '../../types/global'; +import { getDuplicatedIds } from '../../utils/formLayoutUtils'; + +interface FormLayoutWarningProps { + layout: IInternalLayout; +} + +export const FormLayoutWarning = ({ layout }: FormLayoutWarningProps) => { + const duplicatedIds = getDuplicatedIds(layout); + return ( +
+ {duplicatedIds.map((id) => ( +
{id}
+ ))} +
+ ); +}; diff --git a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts index 487f7ccf552..1b8fbfbdfb7 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts +++ b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts @@ -20,7 +20,6 @@ import type { FormContainer } from '../types/FormContainer'; import type { FormItem } from '../types/FormItem'; import * as formItemUtils from './formItemUtils'; import type { ContainerComponentType } from '../types/ContainerComponent'; -import type { FormLayoutPage } from '../types/FormLayoutPage'; import { flattenObjectValues } from 'app-shared/utils/objectUtils'; export const mapComponentToToolbarElement = ( @@ -418,8 +417,8 @@ export const idExistsInLayout = (id: string, layout: IInternalLayout): boolean = * @param layout The layout to check. * @returns True if all items in the array are unique and false otherwise. */ -export const haveComponentsUniqueIds = (layout: FormLayoutPage): boolean => { - const idsInLayout = flattenObjectValues(layout.data.order); +export const haveComponentsUniqueIds = (layout: IInternalLayout): boolean => { + const idsInLayout = flattenObjectValues(layout.order); return areItemsUnique(idsInLayout); }; @@ -428,7 +427,7 @@ export const haveComponentsUniqueIds = (layout: FormLayoutPage): boolean => { * @param layout The layout to check * @returns An array of duplicated ids */ -export const getDuplicatedIds = (layout: FormLayoutPage): string[] => { - const idsInLayout = flattenObjectValues(layout.data.order); +export const getDuplicatedIds = (layout: IInternalLayout): string[] => { + const idsInLayout = flattenObjectValues(layout.order); return idsInLayout.filter((id, index) => idsInLayout.indexOf(id) !== index); }; From 6f817fb57a36e313a283b9a01c201ae3259f5658 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 12 Apr 2024 10:33:08 +0200 Subject: [PATCH 05/25] Add warning content in accordion when duplicated ids --- .../DesignView/FormLayoutWarning.module.css | 11 ++++++++++ .../DesignView/FormLayoutWarning.tsx | 21 ++++++++++++++----- .../PageAccordion/PageAccordion.module.css | 1 + 3 files changed, 28 insertions(+), 5 deletions(-) create mode 100644 frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css new file mode 100644 index 00000000000..bafd656865a --- /dev/null +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css @@ -0,0 +1,11 @@ +.warningWrapper { + display: flex; + flex-direction: column; + gap: 10px; + padding: 10px 15px; +} + +.duplicatedId { + color: var(--fds-semantic-text-danger-default); + text-wrap: nowrap; +} diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx index 63e8f578d78..a8dd7b66401 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -1,18 +1,29 @@ import React from 'react'; import type { IInternalLayout } from '../../types/global'; import { getDuplicatedIds } from '../../utils/formLayoutUtils'; - +import { Paragraph } from '@digdir/design-system-react'; +import classes from './FormLayoutWarning.module.css'; interface FormLayoutWarningProps { layout: IInternalLayout; } export const FormLayoutWarning = ({ layout }: FormLayoutWarningProps) => { const duplicatedIds = getDuplicatedIds(layout); + const severalDuplicatedIds = duplicatedIds.length > 1; + return ( -
- {duplicatedIds.map((id) => ( -
{id}
- ))} +
+ + Denne IDen er brukt i flere komponenter: + {duplicatedIds.map((id) => ( + + {` ${id}${severalDuplicatedIds && ', '}`} + + ))} + + + Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen. +
); }; diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css index 8030eabf402..ae84776b81a 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css @@ -17,6 +17,7 @@ .accordionContent { padding: 0; + background-color: var(--fds-semantic-surface-neutral-default); } .accordionItem { From 869a96d416fc06928c4dee8f072e433d8384d798 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 12 Apr 2024 14:57:39 +0200 Subject: [PATCH 06/25] add content to configWarning ++ --- .../PageConfigPanel.module.css | 24 +++++++++ .../PageConfigPanel/PageConfigPanel.tsx | 50 ++++++++++++++++++- .../DesignView/FormLayoutWarning.tsx | 13 ++--- .../ux-editor/src/utils/formLayoutUtils.ts | 1 + 4 files changed, 77 insertions(+), 11 deletions(-) create mode 100644 frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css new file mode 100644 index 00000000000..6105a74b9c2 --- /dev/null +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css @@ -0,0 +1,24 @@ +.configWarningWrapper { + padding: var(--spacing-6) 0; +} + +.configWarningHeader { + align-items: center; +} + +.configWarningContent { + margin: var(--fds-spacing-2) var(--fds-spacing-4); + padding: var(--fds-spacing-6) var(--fds-spacing-4); + border: 1px solid var(--fds-semantic-border-neutral-subtle); + border-radius: var(--fds-border_radius-large); + background-color: var(--fds-semantic-surface-neutral-default); +} + +.configWarningList { + margin-top: var(--fds-spacing-2); +} + +.duplicatedId { + font-weight: bold; + text-wrap: nowrap; +} diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index 1e3715f4960..f3d981c070f 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -1,14 +1,16 @@ import React from 'react'; -import { Accordion } from '@digdir/design-system-react'; +import { Accordion, List, Link, Heading, Alert } from '@digdir/design-system-react'; import { FileIcon } from '@navikt/aksel-icons'; import { StudioSectionHeader } from '@studio/components'; -import { useText, useTextResourcesSelector, useAppContext } from '../../../hooks'; +import { useText, useTextResourcesSelector, useAppContext, useFormLayouts } from '../../../hooks'; import { DEFAULT_LANGUAGE, DEFAULT_SELECTED_LAYOUT_NAME } from 'app-shared/constants'; import { HiddenExpressionOnLayout } from './HiddenExpressionOnLayout'; import { TextResource } from '../../TextResource/TextResource'; import { EditPageId } from './EditPageId'; import { textResourceByLanguageAndIdSelector } from '../../../selectors/textResourceSelectors'; import type { ITextResource } from 'app-shared/types/global'; +import { haveComponentsUniqueIds, getDuplicatedIds } from '../../../utils/formLayoutUtils'; +import classes from './PageConfigPanel.module.css'; export const PageConfigPanel = () => { const { selectedFormLayoutName } = useAppContext(); @@ -17,6 +19,10 @@ export const PageConfigPanel = () => { const layoutIsSelected = selectedFormLayoutName !== DEFAULT_SELECTED_LAYOUT_NAME && selectedFormLayoutName !== undefined; + // check if the layout has duplicated ids and show a warning if it does + const layout = useFormLayouts()[selectedFormLayoutName]; + const hasDuplicatedIds = !haveComponentsUniqueIds(layout); + const layoutNameTextResourceSelector = textResourceByLanguageAndIdSelector( DEFAULT_LANGUAGE, selectedFormLayoutName, @@ -30,6 +36,46 @@ export const PageConfigPanel = () => { ? t('right_menu.content_empty') : layoutNameText ?? selectedFormLayoutName; + if (layoutIsSelected && hasDuplicatedIds) { + const duplicatedIds = getDuplicatedIds(layout) + .map((id) => `<${id}>`) + .join(', '); + + return ( +
+ + + Du har den samme ID-en på flere komponenter + + +
+ + For å fikse problemet, må du gjøre dette: + + + + Lagre endringene i Altinn Studio med `Last opp dine endringer`. + + Gå til Gitea for å endre filen med feil. + + I filen, velg blyanten øverst til høyre for å redigere filen. + + Finn de ID-ene som er like flere steder: + {duplicatedIds}. + + Endre en eller flere ID-er, slik at hver av dem blir unike. + Klikk på `Commit endringer` nederst på siden. + + Gå tilbake til Altinn Studio og velg `Hent endringer` for å laste inn endringene du + har gjort i koden. + + + +
+
+ ); + } + return ( <> { - const duplicatedIds = getDuplicatedIds(layout); - const severalDuplicatedIds = duplicatedIds.length > 1; + const duplicatedIds = getDuplicatedIds(layout).join(', '); return (
- + Denne IDen er brukt i flere komponenter: - {duplicatedIds.map((id) => ( - - {` ${id}${severalDuplicatedIds && ', '}`} - - ))} + {duplicatedIds} - + Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen.
diff --git a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts index 1b8fbfbdfb7..58c59149bc7 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts +++ b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts @@ -418,6 +418,7 @@ export const idExistsInLayout = (id: string, layout: IInternalLayout): boolean = * @returns True if all items in the array are unique and false otherwise. */ export const haveComponentsUniqueIds = (layout: IInternalLayout): boolean => { + if (!layout?.order) return; const idsInLayout = flattenObjectValues(layout.order); return areItemsUnique(idsInLayout); }; From bc164917351e4cf5e7a19c610cb9c7fc9daddb03 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 12 Apr 2024 15:15:32 +0200 Subject: [PATCH 07/25] add endpoint for the specific layout in gitea --- frontend/packages/shared/src/api/paths.js | 1 + .../Properties/PageConfigPanel/PageConfigPanel.tsx | 8 ++++++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/frontend/packages/shared/src/api/paths.js b/frontend/packages/shared/src/api/paths.js index ae80ccdba21..655ffd87a60 100644 --- a/frontend/packages/shared/src/api/paths.js +++ b/frontend/packages/shared/src/api/paths.js @@ -48,6 +48,7 @@ export const frontendLangPath = (locale) => `/designer/frontend/lang/${locale}.j export const gitCommitPath = (org, app, commitId) => `/repos/${org}/${app}/commit/${commitId}`; export const repositoryGitPath = (org, app) => `/repos/${org}/${app}.git`; export const repositoryPath = (org, app) => `/repos/${org}/${app}`; +export const repositoryLayoutPath = (org, app, layout) => `/repos/${org}/${app}/src/branch/master/App/ui/form/layouts/${layout}.json`; export const publishPath = (org, app) => `/editor/${org}/${app}/deploy`; export const repositoryOwnerPath = (org) => `/repos/${org}`; export const repositoryBasePath = () => `/repos`; diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index f3d981c070f..5f081ebe830 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -11,11 +11,13 @@ import { textResourceByLanguageAndIdSelector } from '../../../selectors/textReso import type { ITextResource } from 'app-shared/types/global'; import { haveComponentsUniqueIds, getDuplicatedIds } from '../../../utils/formLayoutUtils'; import classes from './PageConfigPanel.module.css'; +import { repositoryLayoutPath } from 'app-shared/api/paths'; +import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; export const PageConfigPanel = () => { const { selectedFormLayoutName } = useAppContext(); const t = useText(); - + const { org, app } = useStudioUrlParams(); const layoutIsSelected = selectedFormLayoutName !== DEFAULT_SELECTED_LAYOUT_NAME && selectedFormLayoutName !== undefined; @@ -56,7 +58,9 @@ export const PageConfigPanel = () => { Lagre endringene i Altinn Studio med `Last opp dine endringer`. - Gå til Gitea for å endre filen med feil. + + Gå til Gitea for å endre filen med feil. + I filen, velg blyanten øverst til høyre for å redigere filen. From ac941b1f095c082118dc8b4a8bee3e09ccbb53b9 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 12 Apr 2024 15:17:20 +0200 Subject: [PATCH 08/25] open link in new window --- .../components/Properties/PageConfigPanel/PageConfigPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index 5f081ebe830..ced7de64fcd 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -58,7 +58,7 @@ export const PageConfigPanel = () => { Lagre endringene i Altinn Studio med `Last opp dine endringer`. - + Gå til Gitea for å endre filen med feil. From a999a5609dd06ba4715872b2dace25a13cc65492 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 12 Apr 2024 15:25:39 +0200 Subject: [PATCH 09/25] resize to small for list items + update text --- .../components/Properties/PageConfigPanel/PageConfigPanel.tsx | 2 +- .../ux-editor/src/containers/DesignView/FormLayoutWarning.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index ced7de64fcd..cfa90944f3f 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -54,7 +54,7 @@ export const PageConfigPanel = () => { For å fikse problemet, må du gjøre dette: - + Lagre endringene i Altinn Studio med `Last opp dine endringer`. diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx index cc5e2ea5af1..923eab12825 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -13,7 +13,7 @@ export const FormLayoutWarning = ({ layout }: FormLayoutWarningProps) => { return (
- Denne IDen er brukt i flere komponenter: + Du har brukt samme ID på flere komponenter: {duplicatedIds} From 3e85017f7729ded2c1aa8b5d020bafc0bb3ecfb3 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Sat, 13 Apr 2024 10:04:20 +0200 Subject: [PATCH 10/25] move pageconfig warning content to a separated file --- .../PageConfigPanel/PageConfigPanel.tsx | 57 +++---------------- ...odule.css => PageConfigWarning.module.css} | 0 .../PageConfigPanel/PageConfigWarning.tsx | 56 ++++++++++++++++++ 3 files changed, 64 insertions(+), 49 deletions(-) rename frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/{PageConfigPanel.module.css => PageConfigWarning.module.css} (100%) create mode 100644 frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index cfa90944f3f..7720d5df907 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Accordion, List, Link, Heading, Alert } from '@digdir/design-system-react'; +import { Accordion } from '@digdir/design-system-react'; import { FileIcon } from '@navikt/aksel-icons'; import { StudioSectionHeader } from '@studio/components'; import { useText, useTextResourcesSelector, useAppContext, useFormLayouts } from '../../../hooks'; @@ -9,22 +9,16 @@ import { TextResource } from '../../TextResource/TextResource'; import { EditPageId } from './EditPageId'; import { textResourceByLanguageAndIdSelector } from '../../../selectors/textResourceSelectors'; import type { ITextResource } from 'app-shared/types/global'; -import { haveComponentsUniqueIds, getDuplicatedIds } from '../../../utils/formLayoutUtils'; -import classes from './PageConfigPanel.module.css'; -import { repositoryLayoutPath } from 'app-shared/api/paths'; -import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; +import { haveComponentsUniqueIds } from '../../../utils/formLayoutUtils'; +import { PageConfigWarning } from './PageConfigWarning'; export const PageConfigPanel = () => { const { selectedFormLayoutName } = useAppContext(); const t = useText(); - const { org, app } = useStudioUrlParams(); + const layoutIsSelected = selectedFormLayoutName !== DEFAULT_SELECTED_LAYOUT_NAME && selectedFormLayoutName !== undefined; - // check if the layout has duplicated ids and show a warning if it does - const layout = useFormLayouts()[selectedFormLayoutName]; - const hasDuplicatedIds = !haveComponentsUniqueIds(layout); - const layoutNameTextResourceSelector = textResourceByLanguageAndIdSelector( DEFAULT_LANGUAGE, selectedFormLayoutName, @@ -38,46 +32,11 @@ export const PageConfigPanel = () => { ? t('right_menu.content_empty') : layoutNameText ?? selectedFormLayoutName; - if (layoutIsSelected && hasDuplicatedIds) { - const duplicatedIds = getDuplicatedIds(layout) - .map((id) => `<${id}>`) - .join(', '); + const layout = useFormLayouts()[selectedFormLayoutName]; + const hasDuplicatedIds = !haveComponentsUniqueIds(layout); - return ( -
- - - Du har den samme ID-en på flere komponenter - - -
- - For å fikse problemet, må du gjøre dette: - - - - Lagre endringene i Altinn Studio med `Last opp dine endringer`. - - - Gå til Gitea for å endre filen med feil. - - - I filen, velg blyanten øverst til høyre for å redigere filen. - - Finn de ID-ene som er like flere steder: - {duplicatedIds}. - - Endre en eller flere ID-er, slik at hver av dem blir unike. - Klikk på `Commit endringer` nederst på siden. - - Gå tilbake til Altinn Studio og velg `Hent endringer` for å laste inn endringene du - har gjort i koden. - - - -
-
- ); + if (layoutIsSelected && hasDuplicatedIds) { + return ; } return ( diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css similarity index 100% rename from frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.module.css rename to frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx new file mode 100644 index 00000000000..5c395166086 --- /dev/null +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -0,0 +1,56 @@ +import React from 'react'; +import { List, Link, Heading, Alert } from '@digdir/design-system-react'; +import { repositoryLayoutPath } from 'app-shared/api/paths'; +import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; +import { getDuplicatedIds } from '../../../utils/formLayoutUtils'; +import classes from './PageConfigWarning.module.css'; +import type { IInternalLayout } from '../../../types/global'; + +type PageConfigWarningProps = { + layout: IInternalLayout; + selectedFormLayoutName: string; +}; + +export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfigWarningProps) => { + const { org, app } = useStudioUrlParams(); + + const duplicatedIds = getDuplicatedIds(layout) + .map((id) => `<${id}>`) + .join(', '); + + return ( +
+ + + Du har den samme ID-en på flere komponenter + + +
+ + For å fikse problemet, må du gjøre dette: + + + + Lagre endringene i Altinn Studio med `Last opp dine endringer`. + + + Gå til Gitea for å endre filen med feil. + + + I filen, velg blyanten øverst til høyre for å redigere filen. + + Finn de ID-ene som er like flere steder: + {duplicatedIds}. + + Endre en eller flere ID-er, slik at hver av dem blir unike. + Klikk på `Commit endringer` nederst på siden. + + Gå tilbake til Altinn Studio og velg `Hent endringer` for å laste inn endringene du + har gjort i koden. + + + +
+
+ ); +}; From 6432e524d02cb42e2331ad105c139a108a613967 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Sat, 13 Apr 2024 10:30:29 +0200 Subject: [PATCH 11/25] Make sure duplicated ids only display once --- .../Properties/PageConfigPanel/PageConfigWarning.module.css | 1 - .../src/containers/DesignView/FormLayoutWarning.module.css | 1 - frontend/packages/ux-editor/src/utils/formLayoutUtils.ts | 6 ++++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css index 6105a74b9c2..40075ff204e 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css @@ -20,5 +20,4 @@ .duplicatedId { font-weight: bold; - text-wrap: nowrap; } diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css index bafd656865a..bbb3b74fa11 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css @@ -7,5 +7,4 @@ .duplicatedId { color: var(--fds-semantic-text-danger-default); - text-wrap: nowrap; } diff --git a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts index 58c59149bc7..f0aaf7468a5 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts +++ b/frontend/packages/ux-editor/src/utils/formLayoutUtils.ts @@ -426,9 +426,11 @@ export const haveComponentsUniqueIds = (layout: IInternalLayout): boolean => { /** * Get the duplicated ids in the layout * @param layout The layout to check - * @returns An array of duplicated ids + * @returns An array of unique duplicated ids */ export const getDuplicatedIds = (layout: IInternalLayout): string[] => { const idsInLayout = flattenObjectValues(layout.order); - return idsInLayout.filter((id, index) => idsInLayout.indexOf(id) !== index); + const duplicatedIds = idsInLayout.filter((id, index) => idsInLayout.indexOf(id) !== index); + const uniqueDuplicatedIds = Array.from(new Set(duplicatedIds)); + return uniqueDuplicatedIds; }; From 66ce04244258c01c3915549d9af32b5fa8445b07 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Sat, 13 Apr 2024 12:55:10 +0200 Subject: [PATCH 12/25] add text to text resources --- frontend/language/src/nb.json | 11 ++++++++ .../PageConfigPanel/PageConfigWarning.tsx | 26 +++++++++---------- .../DesignView/FormLayoutWarning.tsx | 9 +++---- 3 files changed, 27 insertions(+), 19 deletions(-) diff --git a/frontend/language/src/nb.json b/frontend/language/src/nb.json index 6fd1dd1471d..36d26cbdd6a 100644 --- a/frontend/language/src/nb.json +++ b/frontend/language/src/nb.json @@ -1677,6 +1677,15 @@ "ux_editor.component_title.TextArea": "Langt svar", "ux_editor.component_unknown": "Ukjent komponent", "ux_editor.conditional_rendering_connection_header": "Betingede renderingstilkoblinger", + "ux_editor.config.warning_duplicates.heading": "Du har den samme ID-en på flere komponenter", + "ux_editor.config.warning_duplicates.heading2": "For å fikse problemet, må du gjøre dette:", + "ux_editor.config.warning_duplicates.list1": "Lagre endringene i Altinn Studio med 'Last opp dine endringer'.", + "ux_editor.config.warning_duplicates.list2": "Gå til Gitea for å endre filen med feil.", + "ux_editor.config.warning_duplicates.list3": "I filen, velg blyanten øverst til høyre for å redigere filen.", + "ux_editor.config.warning_duplicates.list4": "Finn de ID-ene som er like flere steder: ", + "ux_editor.config.warning_duplicates.list5": "Endre en eller flere ID-er, slik at hver av dem blir unike.", + "ux_editor.config.warning_duplicates.list6": "Klikk på 'Commit endringer' nederst på siden.", + "ux_editor.config.warning_duplicates.list7": "Gå tilbake til Altinn Studio og velg 'Hent endringer' for å laste inn endringene du har gjort i koden.", "ux_editor.container_empty": "Tomt, dra noe inn her...", "ux_editor.container_not_editable_info": "Noen egenskaper for denne komponenten er ikke redigerbare for øyeblikket. Du kan legge til underkomponenter i kolonnen til venstre.", "ux_editor.edit_component.id_help_text": "The component ID. Must be unique within all layouts/pages in a layout-set. Cannot end with .", @@ -1690,6 +1699,8 @@ "ux_editor.file_upload_component.display_mode": "Type", "ux_editor.file_upload_component.settings": "Innstillinger for filopplastingskomponent", "ux_editor.file_upload_component.valid_file_endings": "Innstillinger for filopplastingskomponent", + "ux_editor.formLayout.warning_duplicates.text1": "Du har den samme ID-en på flere komponenter: ", + "ux_editor.formLayout.warning_duplicates.text2": "Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen.", "ux_editor.form_designer": "Skjemadesigner", "ux_editor.id_identifier": "ID: {{item}}", "ux_editor.image_component.settings": "Innstillinger for bilde", diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx index 5c395166086..2592a409579 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -3,8 +3,9 @@ import { List, Link, Heading, Alert } from '@digdir/design-system-react'; import { repositoryLayoutPath } from 'app-shared/api/paths'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; import { getDuplicatedIds } from '../../../utils/formLayoutUtils'; -import classes from './PageConfigWarning.module.css'; import type { IInternalLayout } from '../../../types/global'; +import { useTranslation } from 'react-i18next'; +import classes from './PageConfigWarning.module.css'; type PageConfigWarningProps = { layout: IInternalLayout; @@ -13,7 +14,7 @@ type PageConfigWarningProps = { export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfigWarningProps) => { const { org, app } = useStudioUrlParams(); - + const { t } = useTranslation(); const duplicatedIds = getDuplicatedIds(layout) .map((id) => `<${id}>`) .join(', '); @@ -22,32 +23,29 @@ export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfig
- Du har den samme ID-en på flere komponenter + {t('ux_editor.config.warning_duplicates.heading')}
- For å fikse problemet, må du gjøre dette: + {t('ux_editor.config.warning_duplicates.heading2')} - Lagre endringene i Altinn Studio med `Last opp dine endringer`. + {t('ux_editor.config.warning_duplicates.list1')} - Gå til Gitea for å endre filen med feil. + {t('ux_editor.config.warning_duplicates.list2')} - I filen, velg blyanten øverst til høyre for å redigere filen. + {t('ux_editor.config.warning_duplicates.list3')} - Finn de ID-ene som er like flere steder: + {t('ux_editor.config.warning_duplicates.list4')} {duplicatedIds}. - Endre en eller flere ID-er, slik at hver av dem blir unike. - Klikk på `Commit endringer` nederst på siden. - - Gå tilbake til Altinn Studio og velg `Hent endringer` for å laste inn endringene du - har gjort i koden. - + {t('ux_editor.config.warning_duplicates.list5')} + {t('ux_editor.config.warning_duplicates.list6')} + {t('ux_editor.config.warning_duplicates.list7')}
diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx index 923eab12825..f82fe0449b5 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -2,6 +2,7 @@ import React from 'react'; import type { IInternalLayout } from '../../types/global'; import { getDuplicatedIds } from '../../utils/formLayoutUtils'; import { Paragraph } from '@digdir/design-system-react'; +import { useTranslation } from 'react-i18next'; import classes from './FormLayoutWarning.module.css'; interface FormLayoutWarningProps { layout: IInternalLayout; @@ -9,16 +10,14 @@ interface FormLayoutWarningProps { export const FormLayoutWarning = ({ layout }: FormLayoutWarningProps) => { const duplicatedIds = getDuplicatedIds(layout).join(', '); - + const { t } = useTranslation(); return (
- Du har brukt samme ID på flere komponenter: + {t('ux_editor.formLayout.warning_duplicates.text1')} {duplicatedIds} - - Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen. - + {t('ux_editor.formLayout.warning_duplicates.text2')}
); }; From e05b606bfe7edf0e8944eca5a31f0f6ed2f253c8 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 15 Apr 2024 13:08:54 +0200 Subject: [PATCH 13/25] change alert with sectionHeader, add new icon, keep the same warning color on accordion header and sectionHeader --- .../react/icons/SectionHeaderWarningIcon.tsx | 17 +++++++++++++++++ .../libs/studio-icons/src/react/icons/index.ts | 1 + .../PageConfigWarning.module.css | 4 ++++ .../PageConfigPanel/PageConfigWarning.tsx | 17 +++++++++++------ .../containers/DesignView/DesignView.module.css | 8 ++++++++ .../src/containers/DesignView/DesignView.tsx | 3 ++- .../PageAccordion/PageAccordion.module.css | 8 ++++---- .../DesignView/PageAccordion/PageAccordion.tsx | 8 +++++++- 8 files changed, 54 insertions(+), 12 deletions(-) create mode 100644 frontend/libs/studio-icons/src/react/icons/SectionHeaderWarningIcon.tsx diff --git a/frontend/libs/studio-icons/src/react/icons/SectionHeaderWarningIcon.tsx b/frontend/libs/studio-icons/src/react/icons/SectionHeaderWarningIcon.tsx new file mode 100644 index 00000000000..710f072d135 --- /dev/null +++ b/frontend/libs/studio-icons/src/react/icons/SectionHeaderWarningIcon.tsx @@ -0,0 +1,17 @@ +import React from 'react'; +import type { IconProps } from '../types'; +import { SvgTemplate } from './SvgTemplate'; + +export const SectionHeaderWarningIcon = (props: IconProps): React.ReactElement => { + return ( + + + + + ); +}; diff --git a/frontend/libs/studio-icons/src/react/icons/index.ts b/frontend/libs/studio-icons/src/react/icons/index.ts index f0a23826a93..812529c094f 100644 --- a/frontend/libs/studio-icons/src/react/icons/index.ts +++ b/frontend/libs/studio-icons/src/react/icons/index.ts @@ -20,6 +20,7 @@ export { PropertyIcon } from './PropertyIcon'; export { RadioButtonIcon } from './RadioButtonIcon'; export { ReferenceIcon } from './ReferenceIcon'; export { RepeatingGroupIcon } from './RepeatingGroupIcon'; +export { SectionHeaderWarningIcon } from './SectionHeaderWarningIcon'; export { SelectIcon } from './SelectIcon'; export { ShortTextIcon } from './ShortTextIcon'; export { SignTaskIcon } from './SignTaskIcon'; diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css index 40075ff204e..367d6ce6c77 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.module.css @@ -6,6 +6,10 @@ align-items: center; } +.configWarningHeader { + background-color: var(--fds-semantic-surface-danger-subtle); +} + .configWarningContent { margin: var(--fds-spacing-2) var(--fds-spacing-4); padding: var(--fds-spacing-6) var(--fds-spacing-4); diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx index 2592a409579..5fcb821dbc6 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -1,10 +1,12 @@ import React from 'react'; -import { List, Link, Heading, Alert } from '@digdir/design-system-react'; +import { List, Link, Heading } from '@digdir/design-system-react'; import { repositoryLayoutPath } from 'app-shared/api/paths'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; import { getDuplicatedIds } from '../../../utils/formLayoutUtils'; import type { IInternalLayout } from '../../../types/global'; import { useTranslation } from 'react-i18next'; +import { StudioSectionHeader } from '@studio/components'; +import { SectionHeaderWarningIcon } from '@studio/icons'; import classes from './PageConfigWarning.module.css'; type PageConfigWarningProps = { @@ -21,11 +23,14 @@ export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfig return (
- - - {t('ux_editor.config.warning_duplicates.heading')} - - + } + heading={{ + text: t('ux_editor.config.warning_duplicates.heading'), + level: 2, + }} + className={classes.configWarningHeader} + />
{t('ux_editor.config.warning_duplicates.heading2')} diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css index 4b68a52d424..d0a6725cf87 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css @@ -37,3 +37,11 @@ .accordionWrapper { flex: 1; } +/* +.accordionNeutralColor { + background-color: var(--fds-semantic-surface-neutral-default); +} + +.accordionWarningColor { + background-color: var(--fds-semantic-surface-danger-subtle) !important; +} */ diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index f333093c539..48ed41423df 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -90,11 +90,12 @@ export const DesignView = (): ReactNode => { // Check if the layout has unique component IDs const isValidLayout = haveComponentsUniqueIds(layout.data); return ( - + handleClickAccordion(layout.page)} + isValid={isValidLayout} > {layout.page === selectedFormLayoutName && ( diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css index ae84776b81a..a300edfa4b7 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css @@ -6,13 +6,13 @@ background-color: var(--background-color); } -.accordionHeader { +.accordionHeader, +.accordionHeaderWarning { flex: 1; } -.accordionHeader button { - border: none; - background-color: var(--background-color); +.accordionHeaderWarning button { + background-color: var(--fds-semantic-surface-danger-subtle) !important; } .accordionContent { diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx index a58b89afcb4..0c72901d5d6 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx @@ -18,6 +18,7 @@ export type PageAccordionProps = { isOpen: boolean; onClick: () => void; pageIsReceipt?: boolean; + isValid: boolean; }; /** @@ -39,6 +40,7 @@ export const PageAccordion = ({ isOpen, onClick, pageIsReceipt, + isValid, }: PageAccordionProps): ReactNode => { const { t } = useTranslation(); const { org, app } = useStudioUrlParams(); @@ -62,7 +64,11 @@ export const PageAccordion = ({ open={isOpen} >
- + {pageName}
From fa28cd430814f835d417bbc31f7f4c1ddd9db002 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 15 Apr 2024 14:47:47 +0200 Subject: [PATCH 14/25] remove comments --- .../src/containers/DesignView/DesignView.module.css | 8 -------- 1 file changed, 8 deletions(-) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css index d0a6725cf87..4b68a52d424 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.module.css @@ -37,11 +37,3 @@ .accordionWrapper { flex: 1; } -/* -.accordionNeutralColor { - background-color: var(--fds-semantic-surface-neutral-default); -} - -.accordionWarningColor { - background-color: var(--fds-semantic-surface-danger-subtle) !important; -} */ From c054573864397409e65f11d5b61971ae2d056c41 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 15 Apr 2024 14:50:33 +0200 Subject: [PATCH 15/25] let isValid prop be optional --- .../src/containers/DesignView/PageAccordion/PageAccordion.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx index 0c72901d5d6..c6bc8dfdd61 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.tsx @@ -18,7 +18,7 @@ export type PageAccordionProps = { isOpen: boolean; onClick: () => void; pageIsReceipt?: boolean; - isValid: boolean; + isValid?: boolean; }; /** From e62e56f8ae24a1d36bc843c4b71afdcf8aa67e69 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 15 Apr 2024 15:02:01 +0200 Subject: [PATCH 16/25] Remove some text --- frontend/language/src/nb.json | 13 ++++++------- .../PageConfigPanel/PageConfigWarning.tsx | 1 - 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/frontend/language/src/nb.json b/frontend/language/src/nb.json index c4b8b1f34be..8266693c607 100644 --- a/frontend/language/src/nb.json +++ b/frontend/language/src/nb.json @@ -1679,13 +1679,12 @@ "ux_editor.conditional_rendering_connection_header": "Betingede renderingstilkoblinger", "ux_editor.config.warning_duplicates.heading": "Du har den samme ID-en på flere komponenter", "ux_editor.config.warning_duplicates.heading2": "For å fikse problemet, må du gjøre dette:", - "ux_editor.config.warning_duplicates.list1": "Lagre endringene i Altinn Studio med 'Last opp dine endringer'.", - "ux_editor.config.warning_duplicates.list2": "Gå til Gitea for å endre filen med feil.", - "ux_editor.config.warning_duplicates.list3": "I filen, velg blyanten øverst til høyre for å redigere filen.", - "ux_editor.config.warning_duplicates.list4": "Finn de ID-ene som er like flere steder: ", - "ux_editor.config.warning_duplicates.list5": "Endre en eller flere ID-er, slik at hver av dem blir unike.", - "ux_editor.config.warning_duplicates.list6": "Klikk på 'Commit endringer' nederst på siden.", - "ux_editor.config.warning_duplicates.list7": "Gå tilbake til Altinn Studio og velg 'Hent endringer' for å laste inn endringene du har gjort i koden.", + "ux_editor.config.warning_duplicates.list1": "Gå til Gitea for å endre filen med feil.", + "ux_editor.config.warning_duplicates.list2": "I filen, velg blyanten øverst til høyre for å redigere filen.", + "ux_editor.config.warning_duplicates.list3": "Finn de ID-ene som er like flere steder: ", + "ux_editor.config.warning_duplicates.list4": "Endre en eller flere ID-er, slik at hver av dem blir unike.", + "ux_editor.config.warning_duplicates.list5": "Klikk på 'Commit endringer' nederst på siden.", + "ux_editor.config.warning_duplicates.list6": "Gå tilbake til Altinn Studio og velg 'Hent endringer' for å laste inn endringene du har gjort i koden.", "ux_editor.container_empty": "Tomt, dra noe inn her...", "ux_editor.container_not_editable_info": "Noen egenskaper for denne komponenten er ikke redigerbare for øyeblikket. Du kan legge til underkomponenter i kolonnen til venstre.", "ux_editor.edit_component.id_help_text": "The component ID. Must be unique within all layouts/pages in a layout-set. Cannot end with .", diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx index 5fcb821dbc6..5e3a4bb9667 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -37,7 +37,6 @@ export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfig - {t('ux_editor.config.warning_duplicates.list1')} {t('ux_editor.config.warning_duplicates.list2')} From 9b4e249e18bfa110f10a98bcc87eb1969c0c62fa Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 15 Apr 2024 16:04:51 +0200 Subject: [PATCH 17/25] fix some tests + add objectutils test for flattenObjectValues --- .../shared/src/utils/objectUtils.test.ts | 17 ++++++++++------- .../PageConfigPanel/PageConfigPanel.tsx | 4 ++-- .../src/containers/DesignView/DesignView.tsx | 4 ++-- .../ux-editor/src/utils/formLayoutUtils.ts | 10 +++++----- 4 files changed, 19 insertions(+), 16 deletions(-) diff --git a/frontend/packages/shared/src/utils/objectUtils.test.ts b/frontend/packages/shared/src/utils/objectUtils.test.ts index 06b58f50f35..811cb426854 100644 --- a/frontend/packages/shared/src/utils/objectUtils.test.ts +++ b/frontend/packages/shared/src/utils/objectUtils.test.ts @@ -1,4 +1,4 @@ -import { areObjectsEqual, mapByProperty } from 'app-shared/utils/objectUtils'; +import { areObjectsEqual, mapByProperty, flattenObjectValues } from 'app-shared/utils/objectUtils'; describe('objectUtils', () => { describe('areObjectsEqual', () => { @@ -33,13 +33,16 @@ describe('objectUtils', () => { [value3]: object3, }); }); + }); - it('Throws an error if the values of the given property are not unique', () => { - const object4 = { [property]: value1 }; - const objectList = [object1, object2, object3, object4]; - const expectedError = - 'The values of the given property in the mapByProperty function should be unique.'; - expect(() => mapByProperty(objectList, property)).toThrowError(expectedError); + describe('flattenObjectValues', () => { + it('Flattens the values of an object', () => { + const object = { + a: 'value1', + b: 'value2', + c: 'value3', + }; + expect(flattenObjectValues(object)).toEqual(['value1', 'value2', 'value3']); }); }); }); diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index 7720d5df907..81f222aa86d 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -9,7 +9,7 @@ import { TextResource } from '../../TextResource/TextResource'; import { EditPageId } from './EditPageId'; import { textResourceByLanguageAndIdSelector } from '../../../selectors/textResourceSelectors'; import type { ITextResource } from 'app-shared/types/global'; -import { haveComponentsUniqueIds } from '../../../utils/formLayoutUtils'; +import { duplicatedIdsExistsInLayout } from '../../../utils/formLayoutUtils'; import { PageConfigWarning } from './PageConfigWarning'; export const PageConfigPanel = () => { @@ -33,7 +33,7 @@ export const PageConfigPanel = () => { : layoutNameText ?? selectedFormLayoutName; const layout = useFormLayouts()[selectedFormLayoutName]; - const hasDuplicatedIds = !haveComponentsUniqueIds(layout); + const hasDuplicatedIds = duplicatedIdsExistsInLayout(layout); if (layoutIsSelected && hasDuplicatedIds) { return ; diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index 48ed41423df..c28c7ae5b8b 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -14,7 +14,7 @@ import { ReceiptContent } from './ReceiptContent'; import { useAppContext, useFormLayouts } from '../../hooks'; import { FormLayout } from './FormLayout'; import { StudioButton } from '@studio/components'; -import { haveComponentsUniqueIds } from '../../utils/formLayoutUtils'; +import { duplicatedIdsExistsInLayout } from '../../utils/formLayoutUtils'; /** * Maps the IFormLayouts object to a list of FormLayouts @@ -88,7 +88,7 @@ export const DesignView = (): ReactNode => { if (layout === undefined) return null; // Check if the layout has unique component IDs - const isValidLayout = haveComponentsUniqueIds(layout.data); + const isValidLayout = !duplicatedIdsExistsInLayout(layout.data); return ( key.toUpperCase() === id.toUpperCase()); /** - * Checks if all components in the given layout have unique ids. + * Checks if there are components with duplicated ids in the layout. * @param layout The layout to check. - * @returns True if all items in the array are unique and false otherwise. + * @returns True if some items in the array are duplicated and false otherwise. */ -export const haveComponentsUniqueIds = (layout: IInternalLayout): boolean => { - if (!layout?.order) return; +export const duplicatedIdsExistsInLayout = (layout: IInternalLayout): boolean => { + if (!layout?.order) return false; const idsInLayout = flattenObjectValues(layout.order); - return areItemsUnique(idsInLayout); + return !areItemsUnique(idsInLayout); }; /** From 041f8d8e08417c2534099824fad5e9a6853a7023 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Tue, 16 Apr 2024 09:06:28 +0200 Subject: [PATCH 18/25] Add tests in pageConfigPanel --- .../PageConfigPanel/PageConfigPanel.test.tsx | 26 +++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.test.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.test.tsx index 0c145bc960e..2311cac453d 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.test.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.test.tsx @@ -14,6 +14,7 @@ import { layout1NameMock, layoutMock, layoutSetsMock } from '../../../testing/la const app = 'app'; const org = 'org'; const layoutSet = layoutSetsMock.sets[0].id; +const duplicatedLayout = 'duplicatedLayout'; const defaultTexts: ITextResources = { [DEFAULT_LANGUAGE]: [ @@ -24,6 +25,16 @@ const defaultTexts: ITextResources = { }; const layouts: IFormLayouts = { [layout1NameMock]: layoutMock, + [duplicatedLayout]: { + components: {}, + containers: {}, + order: { + ['idContainer']: ['idContainer1', 'idContainer2', 'idContainer3'], + ['idContainer1']: ['idContainer', 'idContainer1', 'idContainer2'], + }, + customRootProperties: {}, + customDataProperties: {}, + }, }; describe('PageConfigPanel', () => { @@ -60,6 +71,21 @@ describe('PageConfigPanel', () => { screen.getByRole('heading', { name: newVisualPageName }); screen.getByRole('button', { name: textMock('ux_editor.id_identifier') }); }); + + it('render warning when layout is selected and has duplicated ids', () => { + renderPageConfigPanel(duplicatedLayout); + screen.getByRole('heading', { name: textMock('ux_editor.config.warning_duplicates.heading') }); + }); + + it('should display duplicated ids in the document', () => { + renderPageConfigPanel(duplicatedLayout); + + const duplicatedIds = screen.getByText(/, /i); + expect(duplicatedIds).toBeInTheDocument(); + + const uniqueIds = screen.queryByText(/, /i); + expect(uniqueIds).not.toBeInTheDocument(); + }); }); const renderPageConfigPanel = ( From 844e015841ec1b476313513ef8275f6111172524 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Tue, 16 Apr 2024 09:34:49 +0200 Subject: [PATCH 19/25] add tests to new formlayout utilities --- .../src/utils/formLayoutUtils.test.tsx | 33 +++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/frontend/packages/ux-editor/src/utils/formLayoutUtils.test.tsx b/frontend/packages/ux-editor/src/utils/formLayoutUtils.test.tsx index 3aa6fc32b2d..e4d4123f7c9 100644 --- a/frontend/packages/ux-editor/src/utils/formLayoutUtils.test.tsx +++ b/frontend/packages/ux-editor/src/utils/formLayoutUtils.test.tsx @@ -4,9 +4,11 @@ import { addItemOfType, addNavigationButtons, createEmptyLayout, + duplicatedIdsExistsInLayout, findParentId, getChildIds, getDepth, + getDuplicatedIds, getItem, hasMultiPageGroup, hasNavigationButtons, @@ -575,4 +577,35 @@ describe('formLayoutUtils', () => { expect(hasMultiPageGroup(mockInternal)).toBe(false); }); }); + + describe('duplicatedIdsExistsInLayout', () => { + it('Returns true if the layout contains duplicated ids', () => { + const layout = { + ...mockInternal, + order: { + ...mockInternal.order, + [groupId]: [paragraphInGroupId, paragraphInGroupId], + }, + }; + expect(duplicatedIdsExistsInLayout(layout)).toBe(true); + }); + + it('Returns false if the layout does not contain duplicated ids', () => { + expect(duplicatedIdsExistsInLayout(mockInternal)).toBe(false); + }); + }); + + describe('getDuplicatedIds', () => { + it('Returns the duplicated ids in the layout', () => { + const layout = { + ...mockInternal, + order: { + ...mockInternal.order, + [groupId]: [paragraphInGroupId, paragraphInGroupId, paragraphInGroupId], + }, + }; + const duplicatedIds = getDuplicatedIds(layout); + expect(duplicatedIds).toEqual([paragraphInGroupId]); + }); + }); }); From ee6da021261dc97417bb5fff4d3f8708dc0d6d72 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Tue, 16 Apr 2024 09:51:07 +0200 Subject: [PATCH 20/25] add test to formlayout --- .../containers/DesignView/FormLayout.test.tsx | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx index 6438cc8e4ef..5fd5648f808 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx @@ -30,6 +30,31 @@ describe('FormLayout', () => { render(); expect(screen.queryByText(textMock('ux_editor.multi_page_warning'))).not.toBeInTheDocument(); }); + + it('Displays warning about duplicated ids when the layout has such ids', () => { + const layoutWithDuplicatedIds = { + ...layoutMock, + order: { + ['idContainer']: ['idContainer1', 'idContainer2', 'idContainer3'], + ['idContainer1']: ['idContainer1', 'idContainer2', 'idContainer2'], + }, + }; + + render({ layout: layoutWithDuplicatedIds, isValid: false }); + + expect( + screen.getByText(textMock('ux_editor.formLayout.warning_duplicates.text1')), + ).toBeInTheDocument(); + expect( + screen.getByText(textMock('ux_editor.formLayout.warning_duplicates.text2')), + ).toBeInTheDocument(); + + const duplicatedIds = screen.getByText(/idContainer1, idContainer2/i); + expect(duplicatedIds).toBeInTheDocument(); + + const uniqueIds = screen.queryByText(/idContainer3/i); + expect(uniqueIds).not.toBeInTheDocument(); + }); }); const render = (props?: Partial) => From 13b79070151193a6b6b249c2112006514b5e3124 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Tue, 16 Apr 2024 10:26:02 +0200 Subject: [PATCH 21/25] fix text --- .../Properties/PageConfigPanel/PageConfigWarning.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx index 5e3a4bb9667..f9063a8e107 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -39,17 +39,17 @@ export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfig - {t('ux_editor.config.warning_duplicates.list2')} + {t('ux_editor.config.warning_duplicates.list1')} - {t('ux_editor.config.warning_duplicates.list3')} + {t('ux_editor.config.warning_duplicates.list2')} - {t('ux_editor.config.warning_duplicates.list4')} + {t('ux_editor.config.warning_duplicates.list3')} {duplicatedIds}. + {t('ux_editor.config.warning_duplicates.list4')} {t('ux_editor.config.warning_duplicates.list5')} {t('ux_editor.config.warning_duplicates.list6')} - {t('ux_editor.config.warning_duplicates.list7')}
From a0978c0e77f42c91afd46546ead70fd6dec28726 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 26 Apr 2024 13:29:52 +0200 Subject: [PATCH 22/25] feedback - change naming of text resources --- frontend/language/src/nb.json | 18 +++++++++--------- .../PageConfigPanel/PageConfigWarning.tsx | 14 +++++++------- .../containers/DesignView/FormLayout.test.tsx | 4 ++-- .../DesignView/FormLayoutWarning.tsx | 6 ++++-- 4 files changed, 22 insertions(+), 20 deletions(-) diff --git a/frontend/language/src/nb.json b/frontend/language/src/nb.json index c859f63c84d..66048c1f6c4 100644 --- a/frontend/language/src/nb.json +++ b/frontend/language/src/nb.json @@ -1684,13 +1684,13 @@ "ux_editor.component_unknown": "Ukjent komponent", "ux_editor.conditional_rendering_connection_header": "Betingede renderingstilkoblinger", "ux_editor.config.warning_duplicates.heading": "Du har den samme ID-en på flere komponenter", - "ux_editor.config.warning_duplicates.heading2": "For å fikse problemet, må du gjøre dette:", - "ux_editor.config.warning_duplicates.list1": "Gå til Gitea for å endre filen med feil.", - "ux_editor.config.warning_duplicates.list2": "I filen, velg blyanten øverst til høyre for å redigere filen.", - "ux_editor.config.warning_duplicates.list3": "Finn de ID-ene som er like flere steder: ", - "ux_editor.config.warning_duplicates.list4": "Endre en eller flere ID-er, slik at hver av dem blir unike.", - "ux_editor.config.warning_duplicates.list5": "Klikk på 'Commit endringer' nederst på siden.", - "ux_editor.config.warning_duplicates.list6": "Gå tilbake til Altinn Studio og velg 'Hent endringer' for å laste inn endringene du har gjort i koden.", + "ux_editor.config.warning_duplicates.solution_gitea": "Gå til Gitea for å endre filen med feil.", + "ux_editor.config.warning_duplicates.solution_gitea_commit": "Klikk på 'Commit endringer' nederst på siden.", + "ux_editor.config.warning_duplicates.solution_gitea_edit": "Endre en eller flere ID-er, slik at hver av dem blir unike.", + "ux_editor.config.warning_duplicates.solution_gitea_locate": "Finn de ID-ene som er like flere steder: ", + "ux_editor.config.warning_duplicates.solution_gitea_pencel": "I filen, velg blyanten øverst til høyre for å redigere filen.", + "ux_editor.config.warning_duplicates.solution_heading": "For å fikse problemet, må du gjøre dette:", + "ux_editor.config.warning_duplicates.solution_studio_import": "Gå tilbake til Altinn Studio og velg 'Hent endringer' for å laste inn endringene du har gjort i koden.", "ux_editor.container_empty": "Tomt, dra noe inn her...", "ux_editor.container_not_editable_info": "Noen egenskaper for denne komponenten er ikke redigerbare for øyeblikket. Du kan legge til underkomponenter i kolonnen til venstre.", "ux_editor.edit_component.id_help_text": "The component ID. Must be unique within all layouts/pages in a layout-set. Cannot end with .", @@ -1704,8 +1704,8 @@ "ux_editor.file_upload_component.display_mode": "Type", "ux_editor.file_upload_component.settings": "Innstillinger for filopplastingskomponent", "ux_editor.file_upload_component.valid_file_endings": "Innstillinger for filopplastingskomponent", - "ux_editor.formLayout.warning_duplicates.text1": "Du har den samme ID-en på flere komponenter: ", - "ux_editor.formLayout.warning_duplicates.text2": "Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen.", + "ux_editor.formLayout.warning_duplicates": "Du har den samme ID-en på flere komponenter: ", + "ux_editor.formLayout.warning_duplicates.cannot_publish": "Du kan ikke publisere appen eller konfigurere komponentene før du har rettet opp feilen.", "ux_editor.form_designer": "Skjemadesigner", "ux_editor.id_identifier": "ID: {{item}}", "ux_editor.image_component.settings": "Innstillinger for bilde", diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx index f9063a8e107..915a9e0ec98 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigWarning.tsx @@ -33,23 +33,23 @@ export const PageConfigWarning = ({ layout, selectedFormLayoutName }: PageConfig />
- {t('ux_editor.config.warning_duplicates.heading2')} + {t('ux_editor.config.warning_duplicates.solution_heading')} - {t('ux_editor.config.warning_duplicates.list1')} + {t('ux_editor.config.warning_duplicates.solution_gitea')} - {t('ux_editor.config.warning_duplicates.list2')} + {t('ux_editor.config.warning_duplicates.solution_gitea_pencel')} - {t('ux_editor.config.warning_duplicates.list3')} + {t('ux_editor.config.warning_duplicates.solution_gitea_locate')} {duplicatedIds}. - {t('ux_editor.config.warning_duplicates.list4')} - {t('ux_editor.config.warning_duplicates.list5')} - {t('ux_editor.config.warning_duplicates.list6')} + {t('ux_editor.config.warning_duplicates.solution_gitea_edit')} + {t('ux_editor.config.warning_duplicates.solution_gitea_commit')} + {t('ux_editor.config.warning_duplicates.solution_studio_import')}
diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx index 5fd5648f808..c7aa2a40381 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayout.test.tsx @@ -43,10 +43,10 @@ describe('FormLayout', () => { render({ layout: layoutWithDuplicatedIds, isValid: false }); expect( - screen.getByText(textMock('ux_editor.formLayout.warning_duplicates.text1')), + screen.getByText(textMock('ux_editor.formLayout.warning_duplicates')), ).toBeInTheDocument(); expect( - screen.getByText(textMock('ux_editor.formLayout.warning_duplicates.text2')), + screen.getByText(textMock('ux_editor.formLayout.warning_duplicates.cannot_publish')), ).toBeInTheDocument(); const duplicatedIds = screen.getByText(/idContainer1, idContainer2/i); diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx index f82fe0449b5..20e463409ba 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -14,10 +14,12 @@ export const FormLayoutWarning = ({ layout }: FormLayoutWarningProps) => { return (
- {t('ux_editor.formLayout.warning_duplicates.text1')} + {t('ux_editor.formLayout.warning_duplicates')} {duplicatedIds} - {t('ux_editor.formLayout.warning_duplicates.text2')} + + {t('ux_editor.formLayout.warning_duplicates.cannot_publish')} +
); }; From fc59991dde59ba8d58682d30240f26f745e26464 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 26 Apr 2024 13:49:54 +0200 Subject: [PATCH 23/25] replace @navikt/aksel-icons imports with @studio/icons in whole project --- .../SchemaGenerationErrorsPanel.tsx | 2 +- .../TopToolbar/CreateNewWrapper.tsx | 2 +- .../SchemaEditorWithToolbar/TopToolbar/DeleteWrapper.tsx | 2 +- .../TopToolbar/GenerateModelsButton.tsx | 2 +- .../features/overview/components/Documentation.tsx | 2 +- .../app-development/layout/AppBar/appBarConfig.test.ts | 2 +- frontend/app-development/layout/AppBar/appBarConfig.ts | 2 +- .../SettingsModalButton/SettingsModal/SettingsModal.tsx | 2 +- .../components/Tabs/AboutTab/CreatedFor/CreatedFor.tsx | 2 +- .../SettingsModal/utils/settingsModalUtils.test.tsx | 2 +- .../layout/SettingsModalButton/SettingsModalButton.tsx | 2 +- .../src/components/AppBarConfig/AppPreviewBarConfig.tsx | 2 +- frontend/dashboard/components/RepoList/RepoList.tsx | 8 +------- frontend/dashboard/pages/Dashboard/Dashboard.tsx | 2 +- .../StudioIconTextfield/StudioIconTextfield.test.tsx | 2 +- .../StudioToggleableTextfield.stories.tsx | 2 +- .../StudioToggleableTextfieldSchema.stories.tsx | 2 +- .../src/components/CardButton/CardButton.tsx | 2 +- .../ExpandablePolicyCard/ExpandablePolicyCard.tsx | 2 +- .../ExpandablePolicyElement/ExpandablePolicyElement.tsx | 2 +- .../PolicyResourceFields/PolicyResourceFields.tsx | 2 +- .../ResourceNarrowingList/ResourceNarrowingList.tsx | 2 +- .../ConfigPanel/ConfigEndEvent/ConfigEndEvent.tsx | 2 +- .../src/components/SchemaInspector/CustomProperties.tsx | 2 +- .../SchemaInspector/ItemFieldsTab/ItemFieldsTab.tsx | 2 +- .../SchemaNode/ActionButtons/AddPropertyMenu.tsx | 2 +- .../src/components/TypesInspector/TypeItem.tsx | 2 +- .../src/components/TypesInspector/TypesInspector.tsx | 2 +- .../schema-editor/src/components/common/ActionMenu.tsx | 2 +- frontend/packages/shared/src/components/FileSelector.tsx | 2 +- .../LocalChangesModal/DeleteModal/DeleteModal.tsx | 2 +- .../LocalChangesModal/LocalChanges/LocalChanges.tsx | 2 +- .../LocalChangesActionButton.test.tsx | 2 +- .../ThreeDotsMenu/LocalChangesModal/LocalChangesModal.tsx | 2 +- .../GiteaHeader/ThreeDotsMenu/ThreeDotsMenu.tsx | 2 +- .../FetchChangesButton/FetchChangesButton.tsx | 2 +- .../ShareChangesButton/ShareChangesButton.tsx | 2 +- .../LeftNavigationBar/GoBackButton/GoBackButton.tsx | 2 +- .../LeftNavigationBar/LeftNavigationBar.test.tsx | 2 +- .../src/components/LeftNavigationBar/Tab/Tab.test.tsx | 2 +- .../PreviewLimitationsInfo/PreviewLimitationsInfo.tsx | 2 +- frontend/packages/text-editor/src/Variables.tsx | 2 +- .../src/components/FormComponent/FormComponent.tsx | 2 +- .../src/components/Properties/Calculations.tsx | 2 +- .../src/components/Properties/ConditionalRendering.tsx | 2 +- .../src/components/Properties/OldDynamicsInfo.tsx | 2 +- .../packages/ux-editor-v3/src/components/TextResource.tsx | 8 +------- .../ux-editor-v3/src/components/TextResourceEdit.tsx | 2 +- .../components/config/ConditionalRenderingComponent.tsx | 2 +- .../ExpressionEditMode/ExpressionEditMode.tsx | 2 +- .../SimpleExpression/SubExpressionContent.tsx | 2 +- .../ExpressionPreview/ExpressionPreview.tsx | 2 +- .../ExpressionPreview/SimpleExpressionPreview.tsx | 2 +- .../components/config/Expressions/NewExpressionButton.tsx | 2 +- .../ux-editor-v3/src/components/config/RuleComponent.tsx | 2 +- .../config/componentSpecificContent/Map/MapComponent.tsx | 2 +- .../src/components/config/editModal/EditOptions.tsx | 2 +- .../ux-editor-v3/src/components/toolbar/RuleButton.tsx | 2 +- .../src/components/toolbar/ToolbarItemComponent.tsx | 2 +- .../ux-editor-v3/src/containers/DesignView/DesignView.tsx | 2 +- .../PageAccordion/NavigationMenu/NavigationMenu.tsx | 2 +- .../src/components/FormComponent/FormComponent.tsx | 2 +- .../ux-editor/src/components/Properties/Calculations.tsx | 2 +- .../src/components/Properties/ConditionalRendering.tsx | 2 +- .../src/components/Properties/OldDynamicsInfo.tsx | 2 +- .../components/Properties/PageConfigPanel/EditPageId.tsx | 2 +- .../Properties/PageConfigPanel/PageConfigPanel.tsx | 2 +- .../EditComponentIdRow/EditComponentIdRow.tsx | 2 +- .../src/components/TextResource/TextResource.tsx | 2 +- .../components/config/ConditionalRenderingComponent.tsx | 2 +- .../NewExpressionButton/NewExpressionButton.tsx | 2 +- .../ux-editor/src/components/config/RuleComponent.tsx | 2 +- .../config/componentSpecificContent/Map/MapComponent.tsx | 2 +- .../components/config/editModal/EditOption/EditOption.tsx | 2 +- .../ux-editor/src/components/toolbar/RuleButton.tsx | 2 +- .../src/components/toolbar/ToolbarItemComponent.tsx | 2 +- .../ux-editor/src/containers/DesignView/DesignView.tsx | 2 +- .../PageAccordion/NavigationMenu/NavigationMenu.tsx | 2 +- frontend/studio-root/pages/Contact/Contact.tsx | 2 +- 79 files changed, 79 insertions(+), 91 deletions(-) diff --git a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/SchemaGenerationErrorsPanel.tsx b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/SchemaGenerationErrorsPanel.tsx index df41c0494cb..e4158409049 100644 --- a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/SchemaGenerationErrorsPanel.tsx +++ b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/SchemaGenerationErrorsPanel.tsx @@ -2,7 +2,7 @@ import classes from './SchemaGenerationErrorsPanel.module.css'; import React from 'react'; import { Alert, ErrorMessage, Paragraph } from '@digdir/design-system-react'; import { Trans, useTranslation } from 'react-i18next'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { StudioButton } from '@studio/components'; export interface SchemaGenerationErrorsPanelProps { diff --git a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/CreateNewWrapper.tsx b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/CreateNewWrapper.tsx index f95b44e1004..e2485ec668c 100644 --- a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/CreateNewWrapper.tsx +++ b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/CreateNewWrapper.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { ErrorMessage, Textfield, LegacyPopover } from '@digdir/design-system-react'; import { useTranslation } from 'react-i18next'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { extractModelNamesFromMetadataList } from '../../../../utils/metadataUtils'; import type { DatamodelMetadata } from 'app-shared/types/DatamodelMetadata'; import { StudioButton } from '@studio/components'; diff --git a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/DeleteWrapper.tsx b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/DeleteWrapper.tsx index 170599f8cfc..69b3f34ebed 100644 --- a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/DeleteWrapper.tsx +++ b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/DeleteWrapper.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useTranslation } from 'react-i18next'; import { StudioButton } from '@studio/components'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import { useDeleteDatamodelMutation } from '../../../../hooks/mutations'; import type { MetadataOption } from '../../../../types/MetadataOption'; import { AltinnConfirmDialog } from 'app-shared/components'; diff --git a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/GenerateModelsButton.tsx b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/GenerateModelsButton.tsx index 99fefe66440..e4ff00351e6 100644 --- a/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/GenerateModelsButton.tsx +++ b/frontend/app-development/features/dataModelling/SchemaEditorWithToolbar/TopToolbar/GenerateModelsButton.tsx @@ -1,5 +1,5 @@ import { Spinner } from '@digdir/design-system-react'; -import { CogIcon } from '@navikt/aksel-icons'; +import { CogIcon } from '@studio/icons'; import React from 'react'; import { useTranslation } from 'react-i18next'; import { useSchemaQuery } from '../../../../hooks/queries'; diff --git a/frontend/app-development/features/overview/components/Documentation.tsx b/frontend/app-development/features/overview/components/Documentation.tsx index 134ba577315..331b88f4986 100644 --- a/frontend/app-development/features/overview/components/Documentation.tsx +++ b/frontend/app-development/features/overview/components/Documentation.tsx @@ -1,7 +1,7 @@ import React from 'react'; import classes from './Documentation.module.css'; import { Heading, Link } from '@digdir/design-system-react'; -import { ExternalLinkIcon } from '@navikt/aksel-icons'; +import { ExternalLinkIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; export const Documentation = () => { diff --git a/frontend/app-development/layout/AppBar/appBarConfig.test.ts b/frontend/app-development/layout/AppBar/appBarConfig.test.ts index 789fdddf411..8e3f7b4a05f 100644 --- a/frontend/app-development/layout/AppBar/appBarConfig.test.ts +++ b/frontend/app-development/layout/AppBar/appBarConfig.test.ts @@ -4,7 +4,7 @@ import { typedLocalStorage } from 'app-shared/utils/webStorage'; import { TopBarMenu } from 'app-shared/enums/TopBarMenu'; import type { TopBarMenuItem } from 'app-shared/types/TopBarMenuItem'; import { RoutePaths } from 'app-development/enums/RoutePaths'; -import { DatabaseIcon } from '@navikt/aksel-icons'; +import { DatabaseIcon } from '@studio/icons'; describe('getTopBarMenu', () => { it('should return all items when provided repository type is "App" which is not hidden behind feature-flags', () => { diff --git a/frontend/app-development/layout/AppBar/appBarConfig.ts b/frontend/app-development/layout/AppBar/appBarConfig.ts index 9cc07b78311..1196b02f5eb 100644 --- a/frontend/app-development/layout/AppBar/appBarConfig.ts +++ b/frontend/app-development/layout/AppBar/appBarConfig.ts @@ -1,6 +1,6 @@ import { RepositoryType } from 'app-shared/types/global'; import { shouldDisplayFeature } from 'app-shared/utils/featureToggleUtils'; -import { DatabaseIcon, Density3Icon, PencilIcon, TenancyIcon } from '@navikt/aksel-icons'; +import { DatabaseIcon, Density3Icon, PencilIcon, TenancyIcon } from '@studio/icons'; import { RoutePaths } from 'app-development/enums/RoutePaths'; import { TopBarMenu } from 'app-shared/enums/TopBarMenu'; import type { TopBarMenuItem } from 'app-shared/types/TopBarMenuItem'; diff --git a/frontend/app-development/layout/SettingsModalButton/SettingsModal/SettingsModal.tsx b/frontend/app-development/layout/SettingsModalButton/SettingsModal/SettingsModal.tsx index b760acb10d7..e44fda9d731 100644 --- a/frontend/app-development/layout/SettingsModalButton/SettingsModal/SettingsModal.tsx +++ b/frontend/app-development/layout/SettingsModalButton/SettingsModal/SettingsModal.tsx @@ -8,7 +8,7 @@ import { TimerStartIcon, ShieldLockIcon, SidebarBothIcon, -} from '@navikt/aksel-icons'; +} from '@studio/icons'; import { StudioModal } from '@studio/components'; import type { LeftNavigationTab } from 'app-shared/types/LeftNavigationTab'; import { LeftNavigationBar } from 'app-shared/components/LeftNavigationBar'; diff --git a/frontend/app-development/layout/SettingsModalButton/SettingsModal/components/Tabs/AboutTab/CreatedFor/CreatedFor.tsx b/frontend/app-development/layout/SettingsModalButton/SettingsModal/components/Tabs/AboutTab/CreatedFor/CreatedFor.tsx index 6de40df82f1..5ef652a8efa 100644 --- a/frontend/app-development/layout/SettingsModalButton/SettingsModal/components/Tabs/AboutTab/CreatedFor/CreatedFor.tsx +++ b/frontend/app-development/layout/SettingsModalButton/SettingsModal/components/Tabs/AboutTab/CreatedFor/CreatedFor.tsx @@ -5,7 +5,7 @@ import { Paragraph } from '@digdir/design-system-react'; import { useTranslation } from 'react-i18next'; import { RepositoryType } from 'app-shared/types/global'; import type { Repository } from 'app-shared/types/Repository'; -import { PersonCircleIcon } from '@navikt/aksel-icons'; +import { PersonCircleIcon } from '@studio/icons'; import { formatDateToDateAndTimeString } from 'app-development/utils/dateUtils'; import { StudioLabelAsParagraph } from '@studio/components'; diff --git a/frontend/app-development/layout/SettingsModalButton/SettingsModal/utils/settingsModalUtils.test.tsx b/frontend/app-development/layout/SettingsModalButton/SettingsModal/utils/settingsModalUtils.test.tsx index 96926c79b76..d000e2d4356 100644 --- a/frontend/app-development/layout/SettingsModalButton/SettingsModal/utils/settingsModalUtils.test.tsx +++ b/frontend/app-development/layout/SettingsModalButton/SettingsModal/utils/settingsModalUtils.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type { SettingsModalTab } from 'app-development/types/SettingsModalTab'; import { createNavigationTab } from './index'; -import { TestFlaskIcon } from '@navikt/aksel-icons'; +import { TestFlaskIcon } from '@studio/icons'; import type { LeftNavigationTab } from 'app-shared/types/LeftNavigationTab'; const mockTabId1: SettingsModalTab = 'about'; diff --git a/frontend/app-development/layout/SettingsModalButton/SettingsModalButton.tsx b/frontend/app-development/layout/SettingsModalButton/SettingsModalButton.tsx index 617f1e489de..208a96574ff 100644 --- a/frontend/app-development/layout/SettingsModalButton/SettingsModalButton.tsx +++ b/frontend/app-development/layout/SettingsModalButton/SettingsModalButton.tsx @@ -1,7 +1,7 @@ import type { ReactNode } from 'react'; import React, { useState } from 'react'; import { StudioButton } from '@studio/components'; -import { CogIcon } from '@navikt/aksel-icons'; +import { CogIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { SettingsModal } from './SettingsModal'; diff --git a/frontend/app-preview/src/components/AppBarConfig/AppPreviewBarConfig.tsx b/frontend/app-preview/src/components/AppBarConfig/AppPreviewBarConfig.tsx index 1ea60fc434b..56f3dd4ff90 100644 --- a/frontend/app-preview/src/components/AppBarConfig/AppPreviewBarConfig.tsx +++ b/frontend/app-preview/src/components/AppBarConfig/AppPreviewBarConfig.tsx @@ -4,7 +4,7 @@ import type { TFunction } from 'i18next'; import { LegacyToggleButtonGroup, LegacySelect } from '@digdir/design-system-react'; import type { AltinnButtonActionItem } from 'app-shared/components/altinnHeader/types'; import classes from '../AppPreviewSubMenu.module.css'; -import { ArrowCirclepathIcon, EyeIcon, LinkIcon } from '@navikt/aksel-icons'; +import { ArrowCirclepathIcon, EyeIcon, LinkIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import type { AppPreviewSubMenuProps } from '../AppPreviewSubMenu'; import { useLayoutSetsQuery } from 'app-shared/hooks/queries/useLayoutSetsQuery'; diff --git a/frontend/dashboard/components/RepoList/RepoList.tsx b/frontend/dashboard/components/RepoList/RepoList.tsx index 23ab9ed0a0c..65bcf103a3f 100644 --- a/frontend/dashboard/components/RepoList/RepoList.tsx +++ b/frontend/dashboard/components/RepoList/RepoList.tsx @@ -21,13 +21,7 @@ import classes from './RepoList.module.css'; import type { User } from 'app-shared/types/Repository'; import { useSetStarredRepoMutation, useUnsetStarredRepoMutation } from '../../hooks/mutations'; -import { - PencilIcon, - FilesIcon, - ExternalLinkIcon, - StarIcon, - StarFillIcon, -} from '@navikt/aksel-icons'; +import { PencilIcon, FilesIcon, ExternalLinkIcon, StarIcon, StarFillIcon } from '@studio/icons'; export interface IRepoListProps { isLoading: boolean; diff --git a/frontend/dashboard/pages/Dashboard/Dashboard.tsx b/frontend/dashboard/pages/Dashboard/Dashboard.tsx index e1c8cafa82f..a6e204bd8dd 100644 --- a/frontend/dashboard/pages/Dashboard/Dashboard.tsx +++ b/frontend/dashboard/pages/Dashboard/Dashboard.tsx @@ -4,7 +4,7 @@ import cn from 'classnames'; import type { ChangeEvent, KeyboardEvent } from 'react'; import { Textfield } from '@digdir/design-system-react'; import { StudioButton } from '@studio/components'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { CenterContainer } from '../../components/CenterContainer'; import { DatamodelsReposList } from '../../components/DataModelsRepoList'; import { OrgReposList } from '../../components/OrgRepoList'; diff --git a/frontend/libs/studio-components/src/components/StudioIconTextfield/StudioIconTextfield.test.tsx b/frontend/libs/studio-components/src/components/StudioIconTextfield/StudioIconTextfield.test.tsx index 6398f2d67cb..b455fe2cef8 100644 --- a/frontend/libs/studio-components/src/components/StudioIconTextfield/StudioIconTextfield.test.tsx +++ b/frontend/libs/studio-components/src/components/StudioIconTextfield/StudioIconTextfield.test.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; import { StudioIconTextfield } from './StudioIconTextfield'; import type { StudioIconTextfieldProps } from './StudioIconTextfield'; -import { KeyVerticalIcon } from '@navikt/aksel-icons'; +import { KeyVerticalIcon } from '@studio/icons'; import userEvent from '@testing-library/user-event'; describe('StudioIconTextfield', () => { diff --git a/frontend/libs/studio-components/src/components/StudioToggleableTextfield/StudioToggleableTextfield.stories.tsx b/frontend/libs/studio-components/src/components/StudioToggleableTextfield/StudioToggleableTextfield.stories.tsx index e3fec31f1df..baed75ef7dc 100644 --- a/frontend/libs/studio-components/src/components/StudioToggleableTextfield/StudioToggleableTextfield.stories.tsx +++ b/frontend/libs/studio-components/src/components/StudioToggleableTextfield/StudioToggleableTextfield.stories.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type { Meta, StoryFn } from '@storybook/react'; import { StudioToggleableTextfield } from './StudioToggleableTextfield'; -import { KeyVerticalIcon } from '@navikt/aksel-icons'; +import { KeyVerticalIcon } from '@studio/icons'; type Story = StoryFn; diff --git a/frontend/libs/studio-components/src/components/StudioToggleableTextfieldSchema/StudioToggleableTextfieldSchema.stories.tsx b/frontend/libs/studio-components/src/components/StudioToggleableTextfieldSchema/StudioToggleableTextfieldSchema.stories.tsx index d4cb59ae894..a674556dc95 100644 --- a/frontend/libs/studio-components/src/components/StudioToggleableTextfieldSchema/StudioToggleableTextfieldSchema.stories.tsx +++ b/frontend/libs/studio-components/src/components/StudioToggleableTextfieldSchema/StudioToggleableTextfieldSchema.stories.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type { Meta, StoryFn } from '@storybook/react'; import { StudioToggleableTextfieldSchema } from './StudioToggleableTextfieldSchema'; -import { KeyVerticalIcon } from '@navikt/aksel-icons'; +import { KeyVerticalIcon } from '@studio/icons'; type Story = StoryFn; diff --git a/frontend/packages/policy-editor/src/components/CardButton/CardButton.tsx b/frontend/packages/policy-editor/src/components/CardButton/CardButton.tsx index 1f8950ce672..2ccd9488cb1 100644 --- a/frontend/packages/policy-editor/src/components/CardButton/CardButton.tsx +++ b/frontend/packages/policy-editor/src/components/CardButton/CardButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import classes from './CardButton.module.css'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { Paragraph } from '@digdir/design-system-react'; export type CardButtonProps = { diff --git a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyCard.tsx b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyCard.tsx index 309fa391cb1..2a8ebb09b4e 100644 --- a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyCard.tsx +++ b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyCard.tsx @@ -6,7 +6,7 @@ import { Textarea, LegacySelect, } from '@digdir/design-system-react'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import classes from './ExpandablePolicyCard.module.css'; import { ActionAndSubjectListItem } from './ActionAndSubjectListItem'; import { ResourceNarrowingList } from './ResourceNarrowingList'; diff --git a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyElement/ExpandablePolicyElement.tsx b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyElement/ExpandablePolicyElement.tsx index 674f1fa8345..4f02516961e 100644 --- a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyElement/ExpandablePolicyElement.tsx +++ b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ExpandablePolicyElement/ExpandablePolicyElement.tsx @@ -1,7 +1,7 @@ import type { ReactNode } from 'react'; import React, { useState } from 'react'; import classes from './ExpandablePolicyElement.module.css'; -import { ChevronDownIcon, ChevronUpIcon } from '@navikt/aksel-icons'; +import { ChevronDownIcon, ChevronUpIcon } from '@studio/icons'; import { PolicyEditorDropdownMenu } from './PolicyEditorDropdownMenu'; import { useTranslation } from 'react-i18next'; import { StudioLabelAsParagraph } from '@studio/components'; diff --git a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/PolicyResourceFields/PolicyResourceFields.tsx b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/PolicyResourceFields/PolicyResourceFields.tsx index 7d12cec03a8..fd9c1354c92 100644 --- a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/PolicyResourceFields/PolicyResourceFields.tsx +++ b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/PolicyResourceFields/PolicyResourceFields.tsx @@ -1,7 +1,7 @@ import React from 'react'; import classes from './PolicyResourceFields.module.css'; import { Textfield } from '@digdir/design-system-react'; -import { MultiplyIcon } from '@navikt/aksel-icons'; +import { MultiplyIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { StudioButton, StudioLabelAsParagraph } from '@studio/components'; diff --git a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/ResourceNarrowingList.tsx b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/ResourceNarrowingList.tsx index ec3d2f22eea..33a0964eb04 100644 --- a/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/ResourceNarrowingList.tsx +++ b/frontend/packages/policy-editor/src/components/ExpandablePolicyCard/ResourceNarrowingList/ResourceNarrowingList.tsx @@ -3,7 +3,7 @@ import classes from './ResourceNarrowingList.module.css'; import { PolicyResourceFields } from './PolicyResourceFields'; import { ExpandablePolicyElement } from '../ExpandablePolicyElement'; import { StudioButton } from '@studio/components'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import type { PolicyEditorUsage, PolicyRuleResource } from '../../../types'; import { useTranslation } from 'react-i18next'; diff --git a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/ConfigEndEvent.tsx b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/ConfigEndEvent.tsx index 0186c3ef32f..b30b50f69a9 100644 --- a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/ConfigEndEvent.tsx +++ b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/ConfigEndEvent.tsx @@ -2,7 +2,7 @@ import React from 'react'; import type { LayoutSetConfig } from 'app-shared/types/api/LayoutSetsResponse'; import { StudioSectionHeader, StudioToggleableTextfield } from '@studio/components'; import { Paragraph } from '@digdir/design-system-react'; -import { PencilWritingIcon } from '@navikt/aksel-icons'; +import { PencilWritingIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import classes from './ConfigEndEvent.module.css'; import { PROTECTED_TASK_NAME_CUSTOM_RECEIPT } from 'app-shared/constants'; diff --git a/frontend/packages/schema-editor/src/components/SchemaInspector/CustomProperties.tsx b/frontend/packages/schema-editor/src/components/SchemaInspector/CustomProperties.tsx index d477f5d0f91..cc258a82e77 100644 --- a/frontend/packages/schema-editor/src/components/SchemaInspector/CustomProperties.tsx +++ b/frontend/packages/schema-editor/src/components/SchemaInspector/CustomProperties.tsx @@ -8,7 +8,7 @@ import { setCustomProperties, setProperty, } from '@altinn/schema-model'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import classes from './CustomProperties.module.css'; import { useSchemaEditorAppContext } from '@altinn/schema-editor/hooks/useSchemaEditorAppContext'; diff --git a/frontend/packages/schema-editor/src/components/SchemaInspector/ItemFieldsTab/ItemFieldsTab.tsx b/frontend/packages/schema-editor/src/components/SchemaInspector/ItemFieldsTab/ItemFieldsTab.tsx index 6c1c253fcaa..0920befdacf 100644 --- a/frontend/packages/schema-editor/src/components/SchemaInspector/ItemFieldsTab/ItemFieldsTab.tsx +++ b/frontend/packages/schema-editor/src/components/SchemaInspector/ItemFieldsTab/ItemFieldsTab.tsx @@ -4,7 +4,7 @@ import type { FieldNode } from '@altinn/schema-model'; import { FieldType, isField, isReference, ObjectKind } from '@altinn/schema-model'; import classes from './ItemFieldsTab.module.css'; import { StudioButton, usePrevious } from '@studio/components'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { ItemFieldsTable } from './ItemFieldsTable'; import { useAddProperty } from '@altinn/schema-editor/hooks/useAddProperty'; diff --git a/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx b/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx index a758671f3e6..81a872b0ef4 100644 --- a/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx +++ b/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx @@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'; import { useAddProperty } from '../../../../hooks/useAddProperty'; import { ObjectKind } from '@altinn/schema-model'; import { ActionButton } from './ActionButton'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { DropdownMenu } from '@digdir/design-system-react'; import { CombinationIcon, PropertyIcon, ReferenceIcon } from '@studio/icons'; diff --git a/frontend/packages/schema-editor/src/components/TypesInspector/TypeItem.tsx b/frontend/packages/schema-editor/src/components/TypesInspector/TypeItem.tsx index 6b0b0b4f447..4e6991f1a51 100644 --- a/frontend/packages/schema-editor/src/components/TypesInspector/TypeItem.tsx +++ b/frontend/packages/schema-editor/src/components/TypesInspector/TypeItem.tsx @@ -1,7 +1,7 @@ import React from 'react'; import type { UiSchemaNode } from '@altinn/schema-model'; import { extractNameFromPointer } from '@altinn/schema-model'; -import { CogIcon, FileJsonIcon } from '@navikt/aksel-icons'; +import { CogIcon, FileJsonIcon } from '@studio/icons'; import classes from './TypeItem.module.css'; import classNames from 'classnames'; import * as testids from '../../../../../testing/testids'; diff --git a/frontend/packages/schema-editor/src/components/TypesInspector/TypesInspector.tsx b/frontend/packages/schema-editor/src/components/TypesInspector/TypesInspector.tsx index 9ee81278afc..e61ecb89bfa 100644 --- a/frontend/packages/schema-editor/src/components/TypesInspector/TypesInspector.tsx +++ b/frontend/packages/schema-editor/src/components/TypesInspector/TypesInspector.tsx @@ -1,7 +1,7 @@ import type { MouseEvent } from 'react'; import React from 'react'; import { StudioButton } from '@studio/components'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import type { UiSchemaNode } from '@altinn/schema-model'; import classes from './TypesInspector.module.css'; import { Divider } from 'app-shared/primitives'; diff --git a/frontend/packages/schema-editor/src/components/common/ActionMenu.tsx b/frontend/packages/schema-editor/src/components/common/ActionMenu.tsx index 08a86849698..6e0d24c0a58 100644 --- a/frontend/packages/schema-editor/src/components/common/ActionMenu.tsx +++ b/frontend/packages/schema-editor/src/components/common/ActionMenu.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { PlusCircleIcon } from '@navikt/aksel-icons'; +import { PlusCircleIcon } from '@studio/icons'; import type { IconImage } from './Icon'; import { Icon } from './Icon'; import classes from './ActionMenu.module.css'; diff --git a/frontend/packages/shared/src/components/FileSelector.tsx b/frontend/packages/shared/src/components/FileSelector.tsx index c425dca4a37..bd517b2e942 100644 --- a/frontend/packages/shared/src/components/FileSelector.tsx +++ b/frontend/packages/shared/src/components/FileSelector.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { useTranslation } from 'react-i18next'; import { StudioButton } from '@studio/components'; -import { UploadIcon } from '@navikt/aksel-icons'; +import { UploadIcon } from '@studio/icons'; import * as testids from '../../../../testing/testids'; export interface IFileSelectorProps { diff --git a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/DeleteModal/DeleteModal.tsx b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/DeleteModal/DeleteModal.tsx index 3e7ce6da7b3..2b8321bc7cb 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/DeleteModal/DeleteModal.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/DeleteModal/DeleteModal.tsx @@ -2,7 +2,7 @@ import React, { useState } from 'react'; import classes from './DeleteModal.module.css'; import { useTranslation } from 'react-i18next'; import { StudioButton, StudioModal, StudioSpinner } from '@studio/components'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import { useResetRepositoryMutation } from 'app-development/hooks/mutations/useResetRepositoryMutation'; import { toast } from 'react-toastify'; import { Heading, Paragraph, Textfield } from '@digdir/design-system-react'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChanges/LocalChanges.tsx b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChanges/LocalChanges.tsx index 958e6cb6e10..0285fb09284 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChanges/LocalChanges.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChanges/LocalChanges.tsx @@ -3,7 +3,7 @@ import React, { useState } from 'react'; import classes from './LocalChanges.module.css'; import { useTranslation } from 'react-i18next'; import { Paragraph } from '@digdir/design-system-react'; -import { DownloadIcon, TrashIcon } from '@navikt/aksel-icons'; +import { DownloadIcon, TrashIcon } from '@studio/icons'; import { LocalChangesActionButton } from '../LocalChangesActionButton'; import { DeleteModal } from '../DeleteModal'; import { repoDownloadPath } from 'app-shared/api/paths'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesActionButton/LocalChangesActionButton.test.tsx b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesActionButton/LocalChangesActionButton.test.tsx index 67744dd7282..33f4c07ad2f 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesActionButton/LocalChangesActionButton.test.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesActionButton/LocalChangesActionButton.test.tsx @@ -3,7 +3,7 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; import type { Action, LocalChangesActionButtonProps } from './LocalChangesActionButton'; import { LocalChangesActionButton } from './LocalChangesActionButton'; -import { TestFlaskIcon } from '@navikt/aksel-icons'; +import { TestFlaskIcon } from '@studio/icons'; import userEvent from '@testing-library/user-event'; const mockLabel: string = 'Test label'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesModal.tsx b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesModal.tsx index 04181c439c5..99c3df063ec 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesModal.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/LocalChangesModal/LocalChangesModal.tsx @@ -2,7 +2,7 @@ import type { ReactNode } from 'react'; import React from 'react'; import classes from './LocalChangesModal.module.css'; import { Heading } from '@digdir/design-system-react'; -import { MonitorIcon } from '@navikt/aksel-icons'; +import { MonitorIcon } from '@studio/icons'; import { StudioModal } from '@studio/components'; import { useTranslation } from 'react-i18next'; import { LocalChanges } from './LocalChanges/LocalChanges'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/ThreeDotsMenu.tsx b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/ThreeDotsMenu.tsx index 3f8703f3284..892f3153e48 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/ThreeDotsMenu.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/ThreeDotsMenu/ThreeDotsMenu.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import classes from './ThreeDotsMenu.module.css'; -import { MonitorIcon, TabsIcon, MenuElipsisVerticalIcon } from '@navikt/aksel-icons'; +import { MonitorIcon, TabsIcon, MenuElipsisVerticalIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { repositoryPath } from 'app-shared/api/paths'; import { GiteaIcon } from 'app-shared/icons'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/FetchChangesButton/FetchChangesButton.tsx b/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/FetchChangesButton/FetchChangesButton.tsx index 0c26bb509c0..43676982a07 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/FetchChangesButton/FetchChangesButton.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/FetchChangesButton/FetchChangesButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { StudioButton } from '@studio/components'; -import { DownloadIcon } from '@navikt/aksel-icons'; +import { DownloadIcon } from '@studio/icons'; import classes from './FetchChangesButton.module.css'; import { useTranslation } from 'react-i18next'; import { Notification } from '../Notification'; diff --git a/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/ShareChangesButton/ShareChangesButton.tsx b/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/ShareChangesButton/ShareChangesButton.tsx index 7cdf2ddb90d..cf41ad85c17 100644 --- a/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/ShareChangesButton/ShareChangesButton.tsx +++ b/frontend/packages/shared/src/components/GiteaHeader/VersionControlButtons/ShareChangesButton/ShareChangesButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { StudioButton } from '@studio/components'; -import { UploadIcon, XMarkIcon } from '@navikt/aksel-icons'; +import { UploadIcon, XMarkIcon } from '@studio/icons'; import classes from './ShareChangesButton.module.css'; import { useTranslation } from 'react-i18next'; import { Notification } from '../Notification'; diff --git a/frontend/packages/shared/src/components/LeftNavigationBar/GoBackButton/GoBackButton.tsx b/frontend/packages/shared/src/components/LeftNavigationBar/GoBackButton/GoBackButton.tsx index f159398c6e7..c87e3dbe846 100644 --- a/frontend/packages/shared/src/components/LeftNavigationBar/GoBackButton/GoBackButton.tsx +++ b/frontend/packages/shared/src/components/LeftNavigationBar/GoBackButton/GoBackButton.tsx @@ -2,7 +2,7 @@ import type { ReactNode } from 'react'; import React from 'react'; import classes from './GoBackButton.module.css'; import cn from 'classnames'; -import { ArrowLeftIcon } from '@navikt/aksel-icons'; +import { ArrowLeftIcon } from '@studio/icons'; import { Paragraph } from '@digdir/design-system-react'; import { NavLink } from 'react-router-dom'; diff --git a/frontend/packages/shared/src/components/LeftNavigationBar/LeftNavigationBar.test.tsx b/frontend/packages/shared/src/components/LeftNavigationBar/LeftNavigationBar.test.tsx index ce3aae915fb..445ed260f0d 100644 --- a/frontend/packages/shared/src/components/LeftNavigationBar/LeftNavigationBar.test.tsx +++ b/frontend/packages/shared/src/components/LeftNavigationBar/LeftNavigationBar.test.tsx @@ -4,7 +4,7 @@ import userEvent from '@testing-library/user-event'; import type { LeftNavigationBarProps } from './LeftNavigationBar'; import { LeftNavigationBar } from './LeftNavigationBar'; import type { LeftNavigationTab, TabAction } from 'app-shared/types/LeftNavigationTab'; -import { TestFlaskIcon } from '@navikt/aksel-icons'; +import { TestFlaskIcon } from '@studio/icons'; import { MemoryRouter } from 'react-router-dom'; import { textMock } from '../../../../../testing/mocks/i18nMock'; diff --git a/frontend/packages/shared/src/components/LeftNavigationBar/Tab/Tab.test.tsx b/frontend/packages/shared/src/components/LeftNavigationBar/Tab/Tab.test.tsx index facf37ba2fa..775844ff10a 100644 --- a/frontend/packages/shared/src/components/LeftNavigationBar/Tab/Tab.test.tsx +++ b/frontend/packages/shared/src/components/LeftNavigationBar/Tab/Tab.test.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { render as rtlRender, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import type { LeftNavigationTab, TabAction } from 'app-shared/types/LeftNavigationTab'; -import { TestFlaskIcon } from '@navikt/aksel-icons'; +import { TestFlaskIcon } from '@studio/icons'; import type { TabProps } from './Tab'; import { Tab } from './Tab'; import { MemoryRouter } from 'react-router-dom'; diff --git a/frontend/packages/shared/src/components/PreviewLimitationsInfo/PreviewLimitationsInfo.tsx b/frontend/packages/shared/src/components/PreviewLimitationsInfo/PreviewLimitationsInfo.tsx index 04a1d01e2fc..ac9f8c59836 100644 --- a/frontend/packages/shared/src/components/PreviewLimitationsInfo/PreviewLimitationsInfo.tsx +++ b/frontend/packages/shared/src/components/PreviewLimitationsInfo/PreviewLimitationsInfo.tsx @@ -3,7 +3,7 @@ import classes from './PreviewLimitationsInfo.module.css'; import cn from 'classnames'; import { useTranslation } from 'react-i18next'; import { Alert, LegacyPopover } from '@digdir/design-system-react'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { typedLocalStorage } from 'app-shared/utils/webStorage'; import { StudioButton } from '@studio/components'; diff --git a/frontend/packages/text-editor/src/Variables.tsx b/frontend/packages/text-editor/src/Variables.tsx index 1c5946d4d5f..2f6ae723923 100644 --- a/frontend/packages/text-editor/src/Variables.tsx +++ b/frontend/packages/text-editor/src/Variables.tsx @@ -1,7 +1,7 @@ import classes from './Variables.module.css'; import { PanelVariant, PopoverPanel } from '@altinn/altinn-design-system'; import { StudioButton } from '@studio/components'; -import { InformationSquareFillIcon } from '@navikt/aksel-icons'; +import { InformationSquareFillIcon } from '@studio/icons'; import React, { useState } from 'react'; import type { TextResourceVariable } from './types'; import { useTranslation, Trans } from 'react-i18next'; diff --git a/frontend/packages/ux-editor-v3/src/components/FormComponent/FormComponent.tsx b/frontend/packages/ux-editor-v3/src/components/FormComponent/FormComponent.tsx index 1a0e2049a7d..30a96f5b8ae 100644 --- a/frontend/packages/ux-editor-v3/src/components/FormComponent/FormComponent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/FormComponent/FormComponent.tsx @@ -8,7 +8,7 @@ import type { ConnectDragSource } from 'react-dnd'; import { DEFAULT_LANGUAGE } from 'app-shared/constants'; import { DragHandle } from './DragHandle'; import type { ITextResource } from 'app-shared/types/global'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import { formItemConfigs } from '../../data/formItemConfig'; import { getComponentTitleByComponentType, getTextResource, truncate } from '../../utils/language'; import { textResourcesByLanguageSelector } from '../../selectors/textResourceSelectors'; diff --git a/frontend/packages/ux-editor-v3/src/components/Properties/Calculations.tsx b/frontend/packages/ux-editor-v3/src/components/Properties/Calculations.tsx index b4c49431248..18b11e43d1a 100644 --- a/frontend/packages/ux-editor-v3/src/components/Properties/Calculations.tsx +++ b/frontend/packages/ux-editor-v3/src/components/Properties/Calculations.tsx @@ -1,7 +1,7 @@ import React from 'react'; import classes from './Calculations.module.css'; import { StudioButton } from '@studio/components'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { RuleModal } from '../toolbar/RuleModal'; import { OldDynamicsInfo } from './OldDynamicsInfo'; import { Divider } from 'app-shared/primitives'; diff --git a/frontend/packages/ux-editor-v3/src/components/Properties/ConditionalRendering.tsx b/frontend/packages/ux-editor-v3/src/components/Properties/ConditionalRendering.tsx index ceea68a4037..540f3559cd5 100644 --- a/frontend/packages/ux-editor-v3/src/components/Properties/ConditionalRendering.tsx +++ b/frontend/packages/ux-editor-v3/src/components/Properties/ConditionalRendering.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { Alert } from '@digdir/design-system-react'; import classes from './ConditionalRendering.module.css'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { ConditionalRenderingModal } from '../toolbar/ConditionalRenderingModal'; import { OldDynamicsInfo } from './OldDynamicsInfo'; import { Divider } from 'app-shared/primitives'; diff --git a/frontend/packages/ux-editor-v3/src/components/Properties/OldDynamicsInfo.tsx b/frontend/packages/ux-editor-v3/src/components/Properties/OldDynamicsInfo.tsx index 61b5aac15d5..6194b9d0b4d 100644 --- a/frontend/packages/ux-editor-v3/src/components/Properties/OldDynamicsInfo.tsx +++ b/frontend/packages/ux-editor-v3/src/components/Properties/OldDynamicsInfo.tsx @@ -1,6 +1,6 @@ import React from 'react'; import classes from './OldDynamicsInfo.module.css'; -import { ExternalLinkIcon } from '@navikt/aksel-icons'; +import { ExternalLinkIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { giteaEditLink, altinnDocsUrl } from 'app-shared/ext-urls'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; diff --git a/frontend/packages/ux-editor-v3/src/components/TextResource.tsx b/frontend/packages/ux-editor-v3/src/components/TextResource.tsx index 87c480e9edb..d11514f6471 100644 --- a/frontend/packages/ux-editor-v3/src/components/TextResource.tsx +++ b/frontend/packages/ux-editor-v3/src/components/TextResource.tsx @@ -1,13 +1,7 @@ import React, { useState } from 'react'; import type { LegacySingleSelectOption } from '@digdir/design-system-react'; import { LegacySelect, Paragraph } from '@digdir/design-system-react'; -import { - MagnifyingGlassIcon, - PencilIcon, - PlusIcon, - TrashIcon, - XMarkIcon, -} from '@navikt/aksel-icons'; +import { MagnifyingGlassIcon, PencilIcon, PlusIcon, TrashIcon, XMarkIcon } from '@studio/icons'; import classes from './TextResource.module.css'; import { useDispatch, useSelector } from 'react-redux'; import { setCurrentEditId } from '../features/appData/textResources/textResourcesSlice'; diff --git a/frontend/packages/ux-editor-v3/src/components/TextResourceEdit.tsx b/frontend/packages/ux-editor-v3/src/components/TextResourceEdit.tsx index 58867d71994..598892a5d43 100644 --- a/frontend/packages/ux-editor-v3/src/components/TextResourceEdit.tsx +++ b/frontend/packages/ux-editor-v3/src/components/TextResourceEdit.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'; import classes from './TextResourceEdit.module.css'; import type { ITextResource } from 'app-shared/types/global'; import { Fieldset, LegacyTextArea } from '@digdir/design-system-react'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { getAllLanguages, getCurrentEditId } from '../selectors/textResourceSelectors'; import { setCurrentEditId } from '../features/appData/textResources/textResourcesSlice'; import { useDispatch, useSelector } from 'react-redux'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/ConditionalRenderingComponent.tsx b/frontend/packages/ux-editor-v3/src/components/config/ConditionalRenderingComponent.tsx index 31dfd01a7f0..05d7da4a41e 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/ConditionalRenderingComponent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/ConditionalRenderingComponent.tsx @@ -18,7 +18,7 @@ import type { } from 'app-shared/types/RuleConfig'; import type i18next from 'i18next'; import type { FormComponent } from '../../types/FormComponent'; -import { Buldings2Icon, XMarkOctagonFillIcon } from '@navikt/aksel-icons'; +import { Buldings2Icon, XMarkOctagonFillIcon } from '@studio/icons'; import type { FormContainer } from '../../types/FormContainer'; export interface IConditionalRenderingComponentProps { diff --git a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/ExpressionEditMode.tsx b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/ExpressionEditMode.tsx index 9001ffce3c3..875d170f57b 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/ExpressionEditMode.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/ExpressionEditMode.tsx @@ -15,7 +15,7 @@ import { import { ComplexExpression } from '../ComplexExpression'; import { SimpleExpression } from './SimpleExpression'; import { Switch } from '@digdir/design-system-react'; -import { CheckmarkIcon, PlusCircleIcon, TrashIcon } from '@navikt/aksel-icons'; +import { CheckmarkIcon, PlusCircleIcon, TrashIcon } from '@studio/icons'; import { Trans } from 'react-i18next'; import classes from '../ExpressionContent.module.css'; import { stringifyData } from '../../../../../utils/jsonUtils'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/SimpleExpression/SubExpressionContent.tsx b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/SimpleExpression/SubExpressionContent.tsx index adbed525647..a587db42541 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/SimpleExpression/SubExpressionContent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionEditMode/SimpleExpression/SubExpressionContent.tsx @@ -7,7 +7,7 @@ import { ExpressionFunction, expressionFunctionTexts, } from '../../../../../../types/Expressions'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import classes from './SubExpressionContent.module.css'; import { DataSourceValue } from './DataSourceValue'; import { diff --git a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/ExpressionPreview.tsx b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/ExpressionPreview.tsx index b2d50c0734c..0930478a81e 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/ExpressionPreview.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/ExpressionPreview.tsx @@ -6,7 +6,7 @@ import { complexExpressionIsSet } from '../../../../../utils/expressionsUtils'; import { ComplexExpression } from '../ComplexExpression'; import { SimpleExpressionPreview } from './SimpleExpressionPreview'; import { StudioButton } from '@studio/components'; -import { PencilIcon, TrashIcon } from '@navikt/aksel-icons'; +import { PencilIcon, TrashIcon } from '@studio/icons'; import { useText } from '../../../../../hooks'; import cn from 'classnames'; import { Trans } from 'react-i18next'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/SimpleExpressionPreview.tsx b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/SimpleExpressionPreview.tsx index 710f9febd2c..740880a40a6 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/SimpleExpressionPreview.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/Expressions/ExpressionContent/ExpressionPreview/SimpleExpressionPreview.tsx @@ -6,7 +6,7 @@ import { expressionFunctionTexts, Operator, } from '../../../../../types/Expressions'; -import { ArrowRightIcon } from '@navikt/aksel-icons'; +import { ArrowRightIcon } from '@studio/icons'; import { useText } from '../../../../../hooks'; import { stringifyValueForDisplay } from '../../../../../utils/expressionsUtils'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/Expressions/NewExpressionButton.tsx b/frontend/packages/ux-editor-v3/src/components/config/Expressions/NewExpressionButton.tsx index 90ff947f4c3..af9eed656e4 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/Expressions/NewExpressionButton.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/Expressions/NewExpressionButton.tsx @@ -1,6 +1,6 @@ import React, { useRef } from 'react'; import { DropdownMenu } from '@digdir/design-system-react'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { useText } from '../../../hooks'; import type { ExpressionProperty } from '../../../types/Expressions'; import { expressionPropertyTexts } from '../../../types/Expressions'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/RuleComponent.tsx b/frontend/packages/ux-editor-v3/src/components/config/RuleComponent.tsx index e4d540cc39d..07b4d283c05 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/RuleComponent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/RuleComponent.tsx @@ -7,7 +7,7 @@ import classes from './RuleComponent.module.css'; import Modal from 'react-modal'; import type { RuleConnection, RuleConnections } from 'app-shared/types/RuleConfig'; import type i18next from 'i18next'; -import { Buldings2Icon } from '@navikt/aksel-icons'; +import { Buldings2Icon } from '@studio/icons'; export interface IRuleComponentProps { connectionId?: string; diff --git a/frontend/packages/ux-editor-v3/src/components/config/componentSpecificContent/Map/MapComponent.tsx b/frontend/packages/ux-editor-v3/src/components/config/componentSpecificContent/Map/MapComponent.tsx index 8153b6f846c..a8713119b9f 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/componentSpecificContent/Map/MapComponent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/componentSpecificContent/Map/MapComponent.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { PlusIcon, XMarkIcon } from '@navikt/aksel-icons'; +import { PlusIcon, XMarkIcon } from '@studio/icons'; import { LegacyFieldSet, LegacyTextField } from '@digdir/design-system-react'; import type { IGenericEditComponent } from '../../componentConfig'; import { FormField } from '../../../FormField'; diff --git a/frontend/packages/ux-editor-v3/src/components/config/editModal/EditOptions.tsx b/frontend/packages/ux-editor-v3/src/components/config/editModal/EditOptions.tsx index 52fad15fec7..3725f1e21ca 100644 --- a/frontend/packages/ux-editor-v3/src/components/config/editModal/EditOptions.tsx +++ b/frontend/packages/ux-editor-v3/src/components/config/editModal/EditOptions.tsx @@ -4,7 +4,7 @@ import { Fieldset, Radio, Textfield, ErrorMessage } from '@digdir/design-system- import classes from './EditOptions.module.css'; import type { IGenericEditComponent } from '../componentConfig'; import { EditCodeList } from './EditCodeList'; -import { PlusIcon, XMarkIcon } from '@navikt/aksel-icons'; +import { PlusIcon, XMarkIcon } from '@studio/icons'; import { TextResource } from '../../TextResource'; import { useText, useComponentErrorMessage } from '../../../hooks'; import { addOptionToComponent, generateRandomOption } from '../../../utils/component'; diff --git a/frontend/packages/ux-editor-v3/src/components/toolbar/RuleButton.tsx b/frontend/packages/ux-editor-v3/src/components/toolbar/RuleButton.tsx index ef2e25c2067..44c6ac47081 100644 --- a/frontend/packages/ux-editor-v3/src/components/toolbar/RuleButton.tsx +++ b/frontend/packages/ux-editor-v3/src/components/toolbar/RuleButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { StudioButton } from '@studio/components'; -import { CogIcon } from '@navikt/aksel-icons'; +import { CogIcon } from '@studio/icons'; export interface IRuleButtonProps { onClick: () => void; diff --git a/frontend/packages/ux-editor-v3/src/components/toolbar/ToolbarItemComponent.tsx b/frontend/packages/ux-editor-v3/src/components/toolbar/ToolbarItemComponent.tsx index 30fc68aff40..41003e41105 100644 --- a/frontend/packages/ux-editor-v3/src/components/toolbar/ToolbarItemComponent.tsx +++ b/frontend/packages/ux-editor-v3/src/components/toolbar/ToolbarItemComponent.tsx @@ -2,7 +2,7 @@ import type { MouseEvent } from 'react'; import React from 'react'; import classes from './ToolbarItemComponent.module.css'; import { StudioButton } from '@studio/components'; -import { InformationIcon } from '@navikt/aksel-icons'; +import { InformationIcon } from '@studio/icons'; import { getComponentTitleByComponentType } from '../../utils/language'; import { useTranslation } from 'react-i18next'; import type { ComponentTypeV3 } from 'app-shared/types/ComponentTypeV3'; diff --git a/frontend/packages/ux-editor-v3/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor-v3/src/containers/DesignView/DesignView.tsx index bfed9bb9fc0..09faedd0d6a 100644 --- a/frontend/packages/ux-editor-v3/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor-v3/src/containers/DesignView/DesignView.tsx @@ -12,7 +12,7 @@ import { FormLayoutActions } from '../../features/formDesigner/formLayout/formLa import { useInstanceIdQuery } from 'app-shared/hooks/queries'; import { useSearchParams } from 'react-router-dom'; import { useFormLayoutSettingsQuery } from '../../hooks/queries/useFormLayoutSettingsQuery'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { useAddLayoutMutation } from '../../hooks/mutations/useAddLayoutMutation'; import { setSelectedLayoutInLocalStorage } from '../../utils/localStorageUtils'; import { PageAccordion } from './PageAccordion'; diff --git a/frontend/packages/ux-editor-v3/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx b/frontend/packages/ux-editor-v3/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx index fabed5c6a05..6d0993c50a7 100644 --- a/frontend/packages/ux-editor-v3/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx +++ b/frontend/packages/ux-editor-v3/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx @@ -1,7 +1,7 @@ import React, { useState, useRef } from 'react'; import { useTranslation } from 'react-i18next'; import { DropdownMenu } from '@digdir/design-system-react'; -import { MenuElipsisVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '@navikt/aksel-icons'; +import { MenuElipsisVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '@studio/icons'; import { useFormLayoutSettingsQuery } from '../../../../hooks/queries/useFormLayoutSettingsQuery'; import { useUpdateLayoutOrderMutation } from '../../../../hooks/mutations/useUpdateLayoutOrderMutation'; import { useUpdateLayoutNameMutation } from '../../../../hooks/mutations/useUpdateLayoutNameMutation'; diff --git a/frontend/packages/ux-editor/src/components/FormComponent/FormComponent.tsx b/frontend/packages/ux-editor/src/components/FormComponent/FormComponent.tsx index 4abb1f46d2a..f52d3f25270 100644 --- a/frontend/packages/ux-editor/src/components/FormComponent/FormComponent.tsx +++ b/frontend/packages/ux-editor/src/components/FormComponent/FormComponent.tsx @@ -8,7 +8,7 @@ import type { ConnectDragSource } from 'react-dnd'; import { DEFAULT_LANGUAGE } from 'app-shared/constants'; import { DragHandle } from './DragHandle'; import type { ITextResource } from 'app-shared/types/global'; -import { TrashIcon } from '@navikt/aksel-icons'; +import { TrashIcon } from '@studio/icons'; import { formItemConfigs } from '../../data/formItemConfig'; import { getComponentTitleByComponentType, getTextResource, truncate } from '../../utils/language'; import { textResourcesByLanguageSelector } from '../../selectors/textResourceSelectors'; diff --git a/frontend/packages/ux-editor/src/components/Properties/Calculations.tsx b/frontend/packages/ux-editor/src/components/Properties/Calculations.tsx index b4c49431248..18b11e43d1a 100644 --- a/frontend/packages/ux-editor/src/components/Properties/Calculations.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/Calculations.tsx @@ -1,7 +1,7 @@ import React from 'react'; import classes from './Calculations.module.css'; import { StudioButton } from '@studio/components'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { RuleModal } from '../toolbar/RuleModal'; import { OldDynamicsInfo } from './OldDynamicsInfo'; import { Divider } from 'app-shared/primitives'; diff --git a/frontend/packages/ux-editor/src/components/Properties/ConditionalRendering.tsx b/frontend/packages/ux-editor/src/components/Properties/ConditionalRendering.tsx index ceea68a4037..540f3559cd5 100644 --- a/frontend/packages/ux-editor/src/components/Properties/ConditionalRendering.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/ConditionalRendering.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { Alert } from '@digdir/design-system-react'; import classes from './ConditionalRendering.module.css'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { ConditionalRenderingModal } from '../toolbar/ConditionalRenderingModal'; import { OldDynamicsInfo } from './OldDynamicsInfo'; import { Divider } from 'app-shared/primitives'; diff --git a/frontend/packages/ux-editor/src/components/Properties/OldDynamicsInfo.tsx b/frontend/packages/ux-editor/src/components/Properties/OldDynamicsInfo.tsx index 0e49f37d81a..91385ac2201 100644 --- a/frontend/packages/ux-editor/src/components/Properties/OldDynamicsInfo.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/OldDynamicsInfo.tsx @@ -1,6 +1,6 @@ import React from 'react'; import classes from './OldDynamicsInfo.module.css'; -import { ExternalLinkIcon } from '@navikt/aksel-icons'; +import { ExternalLinkIcon } from '@studio/icons'; import { useTranslation } from 'react-i18next'; import { giteaEditLink, altinnDocsUrl } from 'app-shared/ext-urls'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/EditPageId.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/EditPageId.tsx index bf5a308569e..a1d7443a9fd 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/EditPageId.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/EditPageId.tsx @@ -1,6 +1,6 @@ import React from 'react'; import classes from './EditPageId.module.css'; -import { KeyVerticalIcon } from '@navikt/aksel-icons'; +import { KeyVerticalIcon } from '@studio/icons'; import { getPageNameErrorKey } from '../../../utils/designViewUtils'; import { useUpdateLayoutNameMutation } from '../../../hooks/mutations/useUpdateLayoutNameMutation'; import { StudioToggleableTextfield } from '@studio/components'; diff --git a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx index 81f222aa86d..d093ce90252 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PageConfigPanel/PageConfigPanel.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { Accordion } from '@digdir/design-system-react'; -import { FileIcon } from '@navikt/aksel-icons'; +import { FileIcon } from '@studio/icons'; import { StudioSectionHeader } from '@studio/components'; import { useText, useTextResourcesSelector, useAppContext, useFormLayouts } from '../../../hooks'; import { DEFAULT_LANGUAGE, DEFAULT_SELECTED_LAYOUT_NAME } from 'app-shared/constants'; diff --git a/frontend/packages/ux-editor/src/components/Properties/PropertiesHeader/EditComponentIdRow/EditComponentIdRow.tsx b/frontend/packages/ux-editor/src/components/Properties/PropertiesHeader/EditComponentIdRow/EditComponentIdRow.tsx index ca35ee1464d..03949842341 100644 --- a/frontend/packages/ux-editor/src/components/Properties/PropertiesHeader/EditComponentIdRow/EditComponentIdRow.tsx +++ b/frontend/packages/ux-editor/src/components/Properties/PropertiesHeader/EditComponentIdRow/EditComponentIdRow.tsx @@ -1,6 +1,6 @@ import React, { useState } from 'react'; import { StudioToggleableTextfieldSchema, type SchemaValidationError } from '@studio/components'; -import { KeyVerticalIcon } from '@navikt/aksel-icons'; +import { KeyVerticalIcon } from '@studio/icons'; import classes from './EditComponentIdRow.module.css'; import { idExists } from '../../../../utils/formLayoutsUtils'; import { Trans, useTranslation } from 'react-i18next'; diff --git a/frontend/packages/ux-editor/src/components/TextResource/TextResource.tsx b/frontend/packages/ux-editor/src/components/TextResource/TextResource.tsx index 224426b0dad..513b5c96567 100644 --- a/frontend/packages/ux-editor/src/components/TextResource/TextResource.tsx +++ b/frontend/packages/ux-editor/src/components/TextResource/TextResource.tsx @@ -3,7 +3,7 @@ import { generateRandomId } from 'app-shared/utils/generateRandomId'; import { generateTextResourceId } from '../../utils/generateId'; import { TextResourceEditor } from './TextResourceEditor'; import { StudioButton, StudioDeleteButton, StudioProperty } from '@studio/components'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { TextResourceValue } from './TextResourceValue'; import { useTranslation } from 'react-i18next'; import { DEFAULT_LANGUAGE } from 'app-shared/constants'; diff --git a/frontend/packages/ux-editor/src/components/config/ConditionalRenderingComponent.tsx b/frontend/packages/ux-editor/src/components/config/ConditionalRenderingComponent.tsx index 31dfd01a7f0..05d7da4a41e 100644 --- a/frontend/packages/ux-editor/src/components/config/ConditionalRenderingComponent.tsx +++ b/frontend/packages/ux-editor/src/components/config/ConditionalRenderingComponent.tsx @@ -18,7 +18,7 @@ import type { } from 'app-shared/types/RuleConfig'; import type i18next from 'i18next'; import type { FormComponent } from '../../types/FormComponent'; -import { Buldings2Icon, XMarkOctagonFillIcon } from '@navikt/aksel-icons'; +import { Buldings2Icon, XMarkOctagonFillIcon } from '@studio/icons'; import type { FormContainer } from '../../types/FormContainer'; export interface IConditionalRenderingComponentProps { diff --git a/frontend/packages/ux-editor/src/components/config/Expressions/NewExpressionButton/NewExpressionButton.tsx b/frontend/packages/ux-editor/src/components/config/Expressions/NewExpressionButton/NewExpressionButton.tsx index 529868cb93d..9a21f9b9b75 100644 --- a/frontend/packages/ux-editor/src/components/config/Expressions/NewExpressionButton/NewExpressionButton.tsx +++ b/frontend/packages/ux-editor/src/components/config/Expressions/NewExpressionButton/NewExpressionButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { DropdownMenu } from '@digdir/design-system-react'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { useText } from '../../../../hooks'; import { StudioDropdownMenu } from '@studio/components'; import { useFormItemContext } from '../../../../containers/FormItemContext'; diff --git a/frontend/packages/ux-editor/src/components/config/RuleComponent.tsx b/frontend/packages/ux-editor/src/components/config/RuleComponent.tsx index e4d540cc39d..07b4d283c05 100644 --- a/frontend/packages/ux-editor/src/components/config/RuleComponent.tsx +++ b/frontend/packages/ux-editor/src/components/config/RuleComponent.tsx @@ -7,7 +7,7 @@ import classes from './RuleComponent.module.css'; import Modal from 'react-modal'; import type { RuleConnection, RuleConnections } from 'app-shared/types/RuleConfig'; import type i18next from 'i18next'; -import { Buldings2Icon } from '@navikt/aksel-icons'; +import { Buldings2Icon } from '@studio/icons'; export interface IRuleComponentProps { connectionId?: string; diff --git a/frontend/packages/ux-editor/src/components/config/componentSpecificContent/Map/MapComponent.tsx b/frontend/packages/ux-editor/src/components/config/componentSpecificContent/Map/MapComponent.tsx index 5dc24aa5a1e..ea4752c7fb4 100644 --- a/frontend/packages/ux-editor/src/components/config/componentSpecificContent/Map/MapComponent.tsx +++ b/frontend/packages/ux-editor/src/components/config/componentSpecificContent/Map/MapComponent.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { PlusIcon, XMarkIcon } from '@navikt/aksel-icons'; +import { PlusIcon, XMarkIcon } from '@studio/icons'; import { LegacyFieldSet, LegacyTextField } from '@digdir/design-system-react'; import type { IGenericEditComponent } from '../../componentConfig'; import { FormField } from '../../../FormField'; diff --git a/frontend/packages/ux-editor/src/components/config/editModal/EditOption/EditOption.tsx b/frontend/packages/ux-editor/src/components/config/editModal/EditOption/EditOption.tsx index ae5a9d63f4a..6dc7e3b4629 100644 --- a/frontend/packages/ux-editor/src/components/config/editModal/EditOption/EditOption.tsx +++ b/frontend/packages/ux-editor/src/components/config/editModal/EditOption/EditOption.tsx @@ -7,7 +7,7 @@ import { } from '@studio/components'; import { useTranslation } from 'react-i18next'; import type { Option } from 'app-shared/types/Option'; -import { XMarkIcon } from '@navikt/aksel-icons'; +import { XMarkIcon } from '@studio/icons'; import { TextResource } from '../../../TextResource/TextResource'; import { deleteDescription, diff --git a/frontend/packages/ux-editor/src/components/toolbar/RuleButton.tsx b/frontend/packages/ux-editor/src/components/toolbar/RuleButton.tsx index ef2e25c2067..44c6ac47081 100644 --- a/frontend/packages/ux-editor/src/components/toolbar/RuleButton.tsx +++ b/frontend/packages/ux-editor/src/components/toolbar/RuleButton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { StudioButton } from '@studio/components'; -import { CogIcon } from '@navikt/aksel-icons'; +import { CogIcon } from '@studio/icons'; export interface IRuleButtonProps { onClick: () => void; diff --git a/frontend/packages/ux-editor/src/components/toolbar/ToolbarItemComponent.tsx b/frontend/packages/ux-editor/src/components/toolbar/ToolbarItemComponent.tsx index 9a736de000b..42151228802 100644 --- a/frontend/packages/ux-editor/src/components/toolbar/ToolbarItemComponent.tsx +++ b/frontend/packages/ux-editor/src/components/toolbar/ToolbarItemComponent.tsx @@ -2,7 +2,7 @@ import type { MouseEvent } from 'react'; import React from 'react'; import classes from './ToolbarItemComponent.module.css'; import { StudioButton } from '@studio/components'; -import { InformationIcon } from '@navikt/aksel-icons'; +import { InformationIcon } from '@studio/icons'; import { getComponentTitleByComponentType } from '../../utils/language'; import { useTranslation } from 'react-i18next'; import type { ComponentType } from 'app-shared/types/ComponentType'; diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index c28c7ae5b8b..c3daaf99ec2 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -7,7 +7,7 @@ import { Accordion } from '@digdir/design-system-react'; import type { IFormLayouts } from '../../types/global'; import type { FormLayoutPage } from '../../types/FormLayoutPage'; import { useFormLayoutSettingsQuery } from '../../hooks/queries/useFormLayoutSettingsQuery'; -import { PlusIcon } from '@navikt/aksel-icons'; +import { PlusIcon } from '@studio/icons'; import { useAddLayoutMutation } from '../../hooks/mutations/useAddLayoutMutation'; import { PageAccordion } from './PageAccordion'; import { ReceiptContent } from './ReceiptContent'; diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx index 542a9e0143d..92331301952 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/NavigationMenu/NavigationMenu.tsx @@ -1,7 +1,7 @@ import React, { useState, useRef } from 'react'; import { useTranslation } from 'react-i18next'; import { DropdownMenu } from '@digdir/design-system-react'; -import { MenuElipsisVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '@navikt/aksel-icons'; +import { MenuElipsisVerticalIcon, ArrowUpIcon, ArrowDownIcon } from '@studio/icons'; import { useFormLayoutSettingsQuery } from '../../../../hooks/queries/useFormLayoutSettingsQuery'; import { useUpdateLayoutOrderMutation } from '../../../../hooks/mutations/useUpdateLayoutOrderMutation'; import { useStudioUrlParams } from 'app-shared/hooks/useStudioUrlParams'; diff --git a/frontend/studio-root/pages/Contact/Contact.tsx b/frontend/studio-root/pages/Contact/Contact.tsx index 7fbac840373..fe70070a59e 100644 --- a/frontend/studio-root/pages/Contact/Contact.tsx +++ b/frontend/studio-root/pages/Contact/Contact.tsx @@ -2,7 +2,7 @@ import React from 'react'; import classes from './Contact.module.css'; import { Heading, Link, Paragraph } from '@digdir/design-system-react'; import { Trans, useTranslation } from 'react-i18next'; -import { EnvelopeClosedIcon } from '@navikt/aksel-icons'; +import { EnvelopeClosedIcon } from '@studio/icons'; import { PageContainer } from 'app-shared/components/PageContainer/PageContainer'; import Slack from 'app-shared/icons/Slack.svg'; import GitHub from 'app-shared/icons/GitHub.svg'; From a5d41d76422d598968f79646bc181f5828aafe58 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Fri, 26 Apr 2024 14:00:01 +0200 Subject: [PATCH 24/25] remove duplicated import of @studio-icons --- .../SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx b/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx index 81a872b0ef4..fe720b2c7a9 100644 --- a/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx +++ b/frontend/packages/schema-editor/src/components/SchemaTree/SchemaNode/ActionButtons/AddPropertyMenu.tsx @@ -3,9 +3,8 @@ import { useTranslation } from 'react-i18next'; import { useAddProperty } from '../../../../hooks/useAddProperty'; import { ObjectKind } from '@altinn/schema-model'; import { ActionButton } from './ActionButton'; -import { PlusIcon } from '@studio/icons'; import { DropdownMenu } from '@digdir/design-system-react'; -import { CombinationIcon, PropertyIcon, ReferenceIcon } from '@studio/icons'; +import { CombinationIcon, PropertyIcon, ReferenceIcon, PlusIcon } from '@studio/icons'; interface AddPropertyMenuProps { pointer: string; From e78c285edfaaca8966d7bc92af701c96845a43f4 Mon Sep 17 00:00:00 2001 From: lassopicasso Date: Mon, 29 Apr 2024 08:56:25 +0200 Subject: [PATCH 25/25] feedbacks --- .../src/containers/DesignView/DesignView.tsx | 27 ++++++++++--------- .../src/containers/DesignView/FormLayout.tsx | 10 ++++--- .../DesignView/FormLayoutWarning.module.css | 4 +-- .../DesignView/FormLayoutWarning.tsx | 1 + .../PageAccordion/PageAccordion.module.css | 3 +-- 5 files changed, 24 insertions(+), 21 deletions(-) diff --git a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx index c3daaf99ec2..285024a6d87 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/DesignView.tsx @@ -90,18 +90,17 @@ export const DesignView = (): ReactNode => { // Check if the layout has unique component IDs const isValidLayout = !duplicatedIdsExistsInLayout(layout.data); return ( - - handleClickAccordion(layout.page)} - isValid={isValidLayout} - > - {layout.page === selectedFormLayoutName && ( - - )} - - + handleClickAccordion(layout.page)} + isValid={isValidLayout} + > + {layout.page === selectedFormLayoutName && ( + + )} + ); }); @@ -109,7 +108,9 @@ export const DesignView = (): ReactNode => {
-
{displayPageAccordions}
+
+ {displayPageAccordions} +
- isValid ? ( +export const FormLayout = ({ layout, isValid }: FormLayoutProps) => { + if (!isValid) { + return ; + } + return ( <> {hasMultiPageGroup(layout) && } - ) : ( - ); +}; const MultiPageWarning = () => { const { t } = useTranslation(); diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css index bbb3b74fa11..fce30fa3057 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.module.css @@ -1,8 +1,8 @@ .warningWrapper { display: flex; flex-direction: column; - gap: 10px; - padding: 10px 15px; + gap: var(--fds-spacing-4); + padding: var(--fds-spacing-4); } .duplicatedId { diff --git a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx index 20e463409ba..87c618e1bdc 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx +++ b/frontend/packages/ux-editor/src/containers/DesignView/FormLayoutWarning.tsx @@ -4,6 +4,7 @@ import { getDuplicatedIds } from '../../utils/formLayoutUtils'; import { Paragraph } from '@digdir/design-system-react'; import { useTranslation } from 'react-i18next'; import classes from './FormLayoutWarning.module.css'; + interface FormLayoutWarningProps { layout: IInternalLayout; } diff --git a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css index a300edfa4b7..cd2f4365f14 100644 --- a/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css +++ b/frontend/packages/ux-editor/src/containers/DesignView/PageAccordion/PageAccordion.module.css @@ -1,8 +1,7 @@ .navigationMenu { display: flex; align-items: center; - padding-block: 12px; - padding: 3px; + padding: var(--fds-spacing-1); background-color: var(--background-color); }