From f8920b9acf700d6eb37952e5d7026b75568c6049 Mon Sep 17 00:00:00 2001 From: perolavm Date: Tue, 10 Dec 2024 13:22:36 +0100 Subject: [PATCH 1/7] =?UTF-8?q?Legger=20til=20m=C3=A5lgruppe=20(context)?= =?UTF-8?q?=20i=20Amplitude-logging=20fra=20LenkeBase?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/_common/lenke/lenkeBase/LenkeBase.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx index 2abfd7be8..5c62ccc51 100644 --- a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx +++ b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx @@ -6,6 +6,7 @@ import { onlyText } from 'utils/react-children'; import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import style from 'components/_common/lenke/lenkeBase/LenkeBase.module.scss'; @@ -46,7 +47,9 @@ export const LenkeBase = ({ children, ...rest }: Props) => { - const { editorView } = usePageContentProps(); + const contentProps = usePageContentProps(); + const { editorView } = contentProps; + const { context } = getDecoratorParams(contentProps); const { layoutConfig } = useLayoutConfig(); const { url, canRouteClientSide } = usePublicUrl(href); @@ -56,6 +59,7 @@ export const LenkeBase = ({ seksjon: analyticsLinkGroup || layoutConfig.title, destinasjon: url, lenketekst: analyticsLabel || onlyText(children), + målgruppe: context, }; const WrapperComponent = From f237782b977087be7c43f33bdeeefe21b7fe8149 Mon Sep 17 00:00:00 2001 From: perolavm Date: Wed, 11 Dec 2024 13:33:40 +0100 Subject: [PATCH 2/7] =?UTF-8?q?Legger=20til=20m=C3=A5lgruppe=20(context)?= =?UTF-8?q?=20i=20Amplitude-logging=20for:=20Accordion=20copyLink=20Expand?= =?UTF-8?q?able=20FilterBar=20FiltersMenuPart=20OfficeInformation=20Overvi?= =?UTF-8?q?ewAreaFilter=20OverviewFilters=20OverviewTaxonomyFilter=20Overv?= =?UTF-8?q?iewTextFilter=20ProductPanelExpandable=20QbrickVideo=20ReadMore?= =?UTF-8?q?Part=20useCard?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/_common/accordion/Accordion.tsx | 9 +++++---- src/components/_common/card/useCard.tsx | 8 +++++--- src/components/_common/copyLink/copyLink.tsx | 9 ++++++--- src/components/_common/expandable/Expandable.tsx | 5 +++++ src/components/_common/filter-bar/FilterBar.tsx | 12 +++++------- .../_common/overview-filters/OverviewFilters.tsx | 12 ++++++------ .../area-filter/OverviewAreaFilter.tsx | 6 +++++- .../taxonomy-filter/OverviewTaxonomyFilter.tsx | 5 +++++ .../text-filter/OverviewTextFilter.tsx | 13 ++++++++----- .../ProductPanelExpandable.tsx | 16 ++++++++-------- .../_common/qbrick-video/QbrickVideo.tsx | 13 ++++++------- .../qbrick-video/useQbrickPlayerState.tsx | 11 +++++++---- .../officeInformation/OfficeInformation.tsx | 9 ++++++--- .../parts/filters-menu/FiltersMenuPart.tsx | 14 ++++++-------- .../parts/readMorePart/ReadMorePart.tsx | 10 +++++++--- 15 files changed, 90 insertions(+), 62 deletions(-) diff --git a/src/components/_common/accordion/Accordion.tsx b/src/components/_common/accordion/Accordion.tsx index 492b4bcd2..3988c2a25 100644 --- a/src/components/_common/accordion/Accordion.tsx +++ b/src/components/_common/accordion/Accordion.tsx @@ -4,6 +4,7 @@ import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartConfigAccordion } from 'components/parts/accordion/AccordionPart'; import { classNames } from 'utils/classnames'; @@ -17,14 +18,13 @@ type PanelItem = AccordionProps['accordion'][number]; export const Accordion = ({ accordion }: AccordionProps) => { const itemRefs = useRef<(HTMLDivElement | null)[]>([]); - - const { editorView } = usePageContentProps(); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const { editorView } = contentProps; const [openAccordions, setOpenAccordions] = useState([]); - const expandAll = () => { setOpenAccordions(accordion.map((_, index) => index)); }; - const validatePanel = (item: PanelItem) => !!(item.title && item.html); useShortcuts({ shortcut: Shortcuts.SEARCH, callback: expandAll }); @@ -41,6 +41,7 @@ export const Accordion = ({ accordion }: AccordionProps) => { tittel, opprinnelse: 'trekkspill', komponent: 'Accordion', + målgruppe: context, }); }; diff --git a/src/components/_common/card/useCard.tsx b/src/components/_common/card/useCard.tsx index b18b400f4..55b46666a 100644 --- a/src/components/_common/card/useCard.tsx +++ b/src/components/_common/card/useCard.tsx @@ -7,6 +7,7 @@ import { LinkProps } from 'types/link-props'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; type AnalyticsProps = { analyticsLinkGroup?: string; @@ -36,10 +37,10 @@ type UseCardSettings = { export const useCard = ({ link, size, type }: UseCardSettings): UseCardState => { const router = useRouter(); - const { editorView } = usePageContentProps(); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const { editorView } = contentProps; const { layoutConfig } = useLayoutConfig(); - const { url, canRouteClientSide } = usePublicUrl(link.url); const getComponentAnalyticsName = (type: CardType, size: CardSize) => { @@ -64,6 +65,7 @@ export const useCard = ({ link, size, type }: UseCardSettings): UseCardState => seksjon: layoutConfig.title, destinasjon: link.url, lenketekst: link.text, + målgruppe: context, }; const handleUserEvent = (e: React.MouseEvent | React.TouchEvent): void => { diff --git a/src/components/_common/copyLink/copyLink.tsx b/src/components/_common/copyLink/copyLink.tsx index 34f01303f..612838f3b 100644 --- a/src/components/_common/copyLink/copyLink.tsx +++ b/src/components/_common/copyLink/copyLink.tsx @@ -2,8 +2,9 @@ import React, { useState } from 'react'; import { LinkIcon } from '@navikt/aksel-icons'; import { translator } from 'translations'; import { classNames } from 'utils/classnames'; -import { usePageContentProps } from 'store/pageContext'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import style from './copyLink.module.scss'; @@ -19,9 +20,10 @@ const linkCopiedDisplayTimeMs = 2500; export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyLinkProps) => { const [showCopyTooltip, setShowCopyTooltip] = useState(false); - const { language } = usePageContentProps(); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); const { layoutConfig } = useLayoutConfig(); - const getLabel = translator('header', language); + const getLabel = translator('header', contentProps.language); if (!anchor) { return null; @@ -38,6 +40,7 @@ export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyL setTimeout(() => setShowCopyTooltip(false), linkCopiedDisplayTimeMs); } logAmplitudeEvent(AnalyticsEvents.COPY_LINK, { + målgruppe: context, seksjon: layoutConfig.title, }); } diff --git a/src/components/_common/expandable/Expandable.tsx b/src/components/_common/expandable/Expandable.tsx index 3634a8dc6..fff75a3b6 100644 --- a/src/components/_common/expandable/Expandable.tsx +++ b/src/components/_common/expandable/Expandable.tsx @@ -2,6 +2,8 @@ import React, { useEffect, useRef, useState } from 'react'; import { ExpansionCard } from '@navikt/ds-react'; import { BarChartIcon, BriefcaseClockIcon, CalendarIcon, TasklistIcon } from '@navikt/aksel-icons'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { classNames } from 'utils/classnames'; import { smoothScrollToTarget, handleStickyScrollOffset } from 'utils/scroll-to'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; @@ -32,6 +34,8 @@ export const Expandable = ({ }: Props) => { const [isOpen, setIsOpen] = useState(isOpenDefault ?? false); const accordionRef = useRef(null); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); useShortcuts({ shortcut: Shortcuts.SEARCH, @@ -48,6 +52,7 @@ export const Expandable = ({ tittel, opprinnelse: analyticsOriginTag || 'utvidbar tekst', komponent: 'Expandable', + målgruppe: context, }); }; diff --git a/src/components/_common/filter-bar/FilterBar.tsx b/src/components/_common/filter-bar/FilterBar.tsx index e3a411dcf..8e8d7c78d 100644 --- a/src/components/_common/filter-bar/FilterBar.tsx +++ b/src/components/_common/filter-bar/FilterBar.tsx @@ -4,6 +4,7 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { translator } from 'translations'; import { useFilterState } from 'store/hooks/useFilteredContent'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { FilterCheckbox } from 'components/parts/filters-menu/FilterCheckbox'; import { SectionWithHeaderProps } from 'types/component-props/layouts/section-with-header'; import { useScrollPosition } from 'utils/useStickyScroll'; @@ -24,19 +25,15 @@ type Props = { /** @deprecated */ export const FilterBar = ({ layoutProps }: Props) => { const filterBarRef = useRef(null); - - const { language } = usePageContentProps(); - const getLabel = translator('filteredContent', language); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const getLabel = translator('filteredContent', contentProps.language); const { selectedFilters, availableFilters, toggleFilter } = useFilterState(); - const { saveScrollPosition, scrollBackToElement } = useScrollPosition(filterBarRef.current); - const [filtersToDisplay, setFiltersToDisplay] = useState([]); useEffect(() => { const { content, intro } = layoutProps.regions; - const components = [ ...(content ? content.components : []), ...(intro ? intro.components : []), @@ -92,6 +89,7 @@ export const FilterBar = ({ layoutProps }: Props) => { filternavn: filter.filterName, opprinnelse: 'innholdtekst', komponent: 'FilterBar', + målgruppe: context, }); saveScrollPosition(); toggleFilter(filter.id); diff --git a/src/components/_common/overview-filters/OverviewFilters.tsx b/src/components/_common/overview-filters/OverviewFilters.tsx index f4e7968dd..38d005ef9 100644 --- a/src/components/_common/overview-filters/OverviewFilters.tsx +++ b/src/components/_common/overview-filters/OverviewFilters.tsx @@ -7,8 +7,9 @@ import { OverviewTextFilter } from 'components/_common/overview-filters/text-fil import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; import { classNames } from 'utils/classnames'; import { translator } from 'translations'; -import { usePageContentProps } from 'store/pageContext'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import style from './OverviewFilters.module.scss'; @@ -18,16 +19,14 @@ const MobileView = ({ showAreaFilter, showTaxonomyFilter, }: Props) => { - const { language } = usePageContentProps(); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); const [isOpen, setIsOpen] = useState(false); const filtersRef = useRef(null); - const hasToggleFilters = showAreaFilter || showTaxonomyFilter; - const searchLabel = translator( 'overview', - language + contentProps.language )(hasToggleFilters ? 'filterOrSearch' : 'search'); return ( @@ -53,6 +52,7 @@ const MobileView = ({ kategori: 'mobile-toggle', opprinnelse: 'oversiktsside filter mobil', komponent: 'MobileView', + målgruppe: context, }); }} className={style.mobileFilterButton} diff --git a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx index 7ca9ecca9..f1beaa209 100644 --- a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx +++ b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx @@ -1,6 +1,8 @@ import React from 'react'; import { Area } from 'types/areas'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -37,13 +39,15 @@ type Props = { export const OverviewAreaFilter = ({ items }: Props) => { const { areaFilter, setAreaFilter } = useOverviewFilters(); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); const handleFilterUpdate = (area: Area) => { logAmplitudeEvent(AnalyticsEvents.FILTER, { kategori: 'område', filternavn: analyticsAreas[area], opprinnelse: 'oversiktsside områder', komponent: 'OverviewAreaFilter', + målgruppe: context, }); setAreaFilter(area); }; diff --git a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx index 4928e9f4a..f62348aad 100644 --- a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx +++ b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx @@ -1,6 +1,8 @@ import React from 'react'; import { ProductTaxonomy } from 'types/taxonomies'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -35,6 +37,8 @@ type Props = { export const OverviewTaxonomyFilter = ({ items }: Props) => { const { taxonomyFilter, setTaxonomyFilter } = useOverviewFilters(); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); const handleFilterUpdate = (taxonomy: ProductTaxonomy) => { logAmplitudeEvent(AnalyticsEvents.FILTER, { @@ -42,6 +46,7 @@ export const OverviewTaxonomyFilter = ({ items }: Props) => { filternavn: analyticsTaxonomi[taxonomy], opprinnelse: 'oversiktsside typer', komponent: 'OverviewTaxonomyFilter', + målgruppe: context, }); setTaxonomyFilter(taxonomy); }; diff --git a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx index 115721484..8ccbce359 100644 --- a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx +++ b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx @@ -2,14 +2,16 @@ import React, { useCallback, useEffect, useId, useState } from 'react'; import { Search } from '@navikt/ds-react'; import debounce from 'lodash.debounce'; import { translator } from 'translations'; +import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { useOverviewFilters } from 'store/hooks/useOverviewFilters'; import { windowScrollTo } from 'utils/scroll-to'; -import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { OVERVIEW_FILTERS_TEXT_INPUT_EVENT, OverviewFiltersTextInputEventDetail, } from 'store/slices/overviewFilters'; + import style from './OverviewTextFilter.module.scss'; type Props = { @@ -23,9 +25,10 @@ const analyticsRedaction = (value: string) => export const OverviewTextFilter = ({ hideLabel }: Props) => { const { setTextFilter } = useOverviewFilters(); - const { language } = usePageContentProps(); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const label = translator('overview', contentProps.language)('search'); const inputId = useId(); - const [textInput, setTextInput] = useState(''); // eslint-disable-next-line react-hooks/exhaustive-deps @@ -44,6 +47,7 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => { kategori: 'fritekst', filternavn: analyticsRedaction(value), komponent: 'OverviewTextFilter', + målgruppe: context, }); }, 500), [setTextFilter] @@ -61,7 +65,6 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => { setTextInput(value); } }; - window.addEventListener(OVERVIEW_FILTERS_TEXT_INPUT_EVENT, handleInputFromEvent); return () => { window.removeEventListener(OVERVIEW_FILTERS_TEXT_INPUT_EVENT, handleInputFromEvent); @@ -95,7 +98,7 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => { { const [isOpen, setIsOpen] = useState(false); - - const { language } = usePageContentProps(); - const loadingText = translator('overview', language)('loading'); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const loadingText = translator('overview', contentProps.language)('loading'); const anchorIdWithHash = `#${anchorId}`; - const checkHashAndExpandPanel = () => { if (window.location.hash === anchorIdWithHash) { contentLoaderCallback?.(); @@ -70,6 +69,7 @@ export const ProductPanelExpandable = ({ tittel, opprinnelse: 'produktdetalj', komponent: 'ProductPanelExpandable', + målgruppe: context, ...analyticsData, }); }; diff --git a/src/components/_common/qbrick-video/QbrickVideo.tsx b/src/components/_common/qbrick-video/QbrickVideo.tsx index ad0680b36..052be8168 100644 --- a/src/components/_common/qbrick-video/QbrickVideo.tsx +++ b/src/components/_common/qbrick-video/QbrickVideo.tsx @@ -4,10 +4,11 @@ import Script from 'next/script'; import { translator } from 'translations'; import { getMediaUrl } from 'utils/urls'; import { classNames } from 'utils/classnames'; -import { AlertBox } from 'components/_common/alertBox/AlertBox'; import { logger } from 'srcCommon/logger'; +import { AlertBox } from 'components/_common/alertBox/AlertBox'; import { NextImage } from 'components/_common/image/NextImage'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { QbrickVideoProps } from './utils/videoProps'; import { getTimestampFromDuration } from './utils/videoHelpers'; import { useQbrickPlayerState } from './useQbrickPlayerState'; @@ -15,16 +16,16 @@ import { useQbrickPlayerState } from './useQbrickPlayerState'; import style from './QbrickVideo.module.scss'; export const QbrickVideo = (props: QbrickVideoProps) => { - const { language: contentLanguage, editorView } = usePageContentProps(); - + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const { language: contentLanguage, editorView } = contentProps; const { title, duration, poster } = props; - const videoContainerId = useId(); - const { createAndStartPlayer, resetPlayer, playerState, setPlayerState } = useQbrickPlayerState( { videoProps: props, videoContainerId, + context, } ); @@ -33,9 +34,7 @@ export const QbrickVideo = (props: QbrickVideoProps) => { }, [resetPlayer]); const translations = translator('macroVideo', contentLanguage); - const durationAsString = getTimestampFromDuration(duration); - const imageUrl = poster?.startsWith('http') ? poster : getMediaUrl(poster, !!editorView, contentLanguage); diff --git a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx index 5d806305e..793e6d5a1 100644 --- a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx +++ b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx @@ -11,9 +11,10 @@ const PLAYER_POLLING_RATE_MS = 50; type Props = { videoProps: QbrickVideoProps; videoContainerId: string; + context?: string; }; -export const useQbrickPlayerState = ({ videoProps, videoContainerId }: Props) => { +export const useQbrickPlayerState = ({ videoProps, videoContainerId, context }: Props) => { const [playerState, setPlayerState] = useState('stopped'); const widgetId = useId(); @@ -28,8 +29,8 @@ export const useQbrickPlayerState = ({ videoProps, videoContainerId }: Props) => return; } - createAndStart(videoProps, videoContainer, widgetId, setPlayerState); - }, [videoProps, videoContainerId, widgetId, playerState, setPlayerState]); + createAndStart(videoProps, videoContainer, widgetId, setPlayerState, context); + }, [videoProps, videoContainerId, widgetId, playerState, setPlayerState, context]); const resetPlayer = useCallback(() => { setPlayerState('stopped'); @@ -51,7 +52,8 @@ const createAndStart = ( { accountId, mediaId, language, title, duration }: QbrickVideoProps, videoContainer: HTMLElement, widgetId: string, - setPlayerState: (state: PlayerState) => void + setPlayerState: (state: PlayerState) => void, + context?: string ) => { const createPlayer = (timeLeft: number = PLAYER_TIMEOUT_MS) => { if (timeLeft <= 0) { @@ -88,6 +90,7 @@ const createAndStart = ( tittel: title, varighet: duration, språk: language, + målgruppe: context, }); }) .on('playable', () => { diff --git a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx index 68a5f33b2..2575f9e08 100644 --- a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx +++ b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx @@ -1,8 +1,9 @@ import { useState } from 'react'; import { ExpansionCard, BodyShort, Heading } from '@navikt/ds-react'; -import { usePageContentProps } from 'store/pageContext'; import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { OfficeDetailsData } from 'types/content-props/office-details-props'; import { officeDetailsFormatAddress } from 'components/pages/office-page/office-details/utils'; @@ -14,8 +15,9 @@ export interface OfficeInformationProps { export const OfficeInformation = ({ officeData }: OfficeInformationProps) => { const [isOpen, setIsOpen] = useState(false); - const { language } = usePageContentProps(); - const getOfficeTranslations = translator('office', language); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const getOfficeTranslations = translator('office', contentProps.language); const title = getOfficeTranslations('officeInformation'); const { postadresse, beliggenhet, organisasjonsnummer, enhetNr } = officeData; const visitingAddress = officeDetailsFormatAddress(beliggenhet, true); @@ -27,6 +29,7 @@ export const OfficeInformation = ({ officeData }: OfficeInformationProps) => { tittel, opprinnelse: 'kontorinformasjon', komponent: 'OfficeInformation', + målgruppe: context, }); }; diff --git a/src/components/parts/filters-menu/FiltersMenuPart.tsx b/src/components/parts/filters-menu/FiltersMenuPart.tsx index f55df13c8..852ee1840 100644 --- a/src/components/parts/filters-menu/FiltersMenuPart.tsx +++ b/src/components/parts/filters-menu/FiltersMenuPart.tsx @@ -10,6 +10,7 @@ import { Header } from 'components/_common/headers/Header'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartComponentProps, PartType } from 'types/component-props/parts'; import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { ExpandableMixin } from 'types/component-props/_mixins'; import { checkIfFilterFirstInPage } from './helpers'; import { FilterCheckbox } from './FilterCheckbox'; @@ -33,16 +34,13 @@ export type PartConfigFilterMenu = { } & ExpandableMixin; export const FiltersMenuPart = ({ config, path }: PartComponentProps) => { - const { language, editorView, page } = usePageContentProps(); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); + const { language, editorView, page } = contentProps; const { categories, description, expandableTitle, title } = config; - const { clearFiltersForPage, selectedFilters, setAvailableFilters, toggleFilter } = useFilterState(); - - const isFirstFilterInPage = checkIfFilterFirstInPage({ - path, - page, - }); + const isFirstFilterInPage = checkIfFilterFirstInPage({ path, page }); useEffect(() => { // Multiple FilterMenus in same page will break. @@ -64,13 +62,13 @@ export const FiltersMenuPart = ({ config, path }: PartComponentProps { logAmplitudeEvent(AnalyticsEvents.FILTER, { kategori: category.categoryName, filternavn: filter.filterName, opprinnelse: 'filtermeny', komponent: 'FiltersMenuPart', + målgruppe: context, }); toggleFilter(filter.id); }; diff --git a/src/components/parts/readMorePart/ReadMorePart.tsx b/src/components/parts/readMorePart/ReadMorePart.tsx index c0ee0aeb1..3c712fb7d 100644 --- a/src/components/parts/readMorePart/ReadMorePart.tsx +++ b/src/components/parts/readMorePart/ReadMorePart.tsx @@ -2,12 +2,14 @@ import React, { useRef, useState } from 'react'; import { ReadMore } from '@navikt/ds-react'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; +import { classNames } from 'utils/classnames'; +import { handleStickyScrollOffset } from 'utils/scroll-to'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; +import { usePageContentProps } from 'store/pageContext'; +import { getDecoratorParams } from 'utils/decorator-utils'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; import { PartComponentProps, PartType } from 'types/component-props/parts'; import { ProcessedHtmlProps } from 'types/processed-html-props'; -import { classNames } from 'utils/classnames'; -import { handleStickyScrollOffset } from 'utils/scroll-to'; import defaultHtml from 'components/_common/parsedHtml/DefaultHtmlStyling.module.scss'; import styles from './ReadMorePart.module.scss'; @@ -21,6 +23,8 @@ export type PartConfigReadMore = { export const ReadMorePart = ({ config }: PartComponentProps) => { const [isOpen, setIsOpen] = useState(config?.isOpen ?? false); const divRef = useRef(null); + const contentProps = usePageContentProps(); + const { context } = getDecoratorParams(contentProps); useShortcuts({ shortcut: Shortcuts.SEARCH, @@ -33,12 +37,12 @@ export const ReadMorePart = ({ config }: PartComponentProps) const openChangeHandler = (isOpening: boolean, tittel: string) => { handleStickyScrollOffset(isOpening, divRef.current); - setIsOpen(isOpening); logAmplitudeEvent(isOpening ? AnalyticsEvents.ACC_EXPAND : AnalyticsEvents.ACC_COLLAPSE, { tittel, opprinnelse: 'lesmer', komponent: 'ReadMore', + målgruppe: context, }); }; From 9d123cff30fa788962f7fa896171d2a744565506 Mon Sep 17 00:00:00 2001 From: perolavm Date: Wed, 11 Dec 2024 15:11:18 +0100 Subject: [PATCH 3/7] Legger til innholdstype i Amplitude-logging for: Accordion copyLink Expandable FilterBar FiltersMenuPart LenkeBase OfficeInformation OverviewAreaFilter OverviewFilters OverviewTaxonomyFilter OverviewTextFilter ProductPanelExpandable QbrickVideo ReadMorePart useCard --- .../_common/accordion/Accordion.tsx | 4 +- src/components/_common/card/useCard.tsx | 2 + src/components/_common/copyLink/copyLink.tsx | 5 +- .../_common/expandable/Expandable.tsx | 2 + .../_common/filter-bar/FilterBar.tsx | 2 + .../_common/lenke/lenkeBase/LenkeBase.tsx | 3 +- .../overview-filters/OverviewFilters.tsx | 2 + .../area-filter/OverviewAreaFilter.tsx | 2 + .../OverviewTaxonomyFilter.tsx | 2 + .../text-filter/OverviewTextFilter.tsx | 2 + .../ProductPanelExpandable.tsx | 2 + .../_common/qbrick-video/QbrickVideo.tsx | 2 + .../qbrick-video/useQbrickPlayerState.tsx | 14 ++- .../officeInformation/OfficeInformation.tsx | 2 + .../parts/filters-menu/FiltersMenuPart.tsx | 2 + .../parts/readMorePart/ReadMorePart.tsx | 2 + src/types/content-props/_content-common.ts | 88 +++++++++++++++++++ 17 files changed, 132 insertions(+), 6 deletions(-) diff --git a/src/components/_common/accordion/Accordion.tsx b/src/components/_common/accordion/Accordion.tsx index 3988c2a25..6db23f362 100644 --- a/src/components/_common/accordion/Accordion.tsx +++ b/src/components/_common/accordion/Accordion.tsx @@ -5,6 +5,7 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartConfigAccordion } from 'components/parts/accordion/AccordionPart'; import { classNames } from 'utils/classnames'; @@ -20,7 +21,7 @@ export const Accordion = ({ accordion }: AccordionProps) => { const itemRefs = useRef<(HTMLDivElement | null)[]>([]); const contentProps = usePageContentProps(); const { context } = getDecoratorParams(contentProps); - const { editorView } = contentProps; + const { editorView, type } = contentProps; const [openAccordions, setOpenAccordions] = useState([]); const expandAll = () => { setOpenAccordions(accordion.map((_, index) => index)); @@ -42,6 +43,7 @@ export const Accordion = ({ accordion }: AccordionProps) => { opprinnelse: 'trekkspill', komponent: 'Accordion', målgruppe: context, + innholdstype: innholdsType(type), }); }; diff --git a/src/components/_common/card/useCard.tsx b/src/components/_common/card/useCard.tsx index 55b46666a..810076e95 100644 --- a/src/components/_common/card/useCard.tsx +++ b/src/components/_common/card/useCard.tsx @@ -8,6 +8,7 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; type AnalyticsProps = { analyticsLinkGroup?: string; @@ -66,6 +67,7 @@ export const useCard = ({ link, size, type }: UseCardSettings): UseCardState => destinasjon: link.url, lenketekst: link.text, målgruppe: context, + innholdstype: innholdsType(contentProps.type), }; const handleUserEvent = (e: React.MouseEvent | React.TouchEvent): void => { diff --git a/src/components/_common/copyLink/copyLink.tsx b/src/components/_common/copyLink/copyLink.tsx index 612838f3b..485a8e255 100644 --- a/src/components/_common/copyLink/copyLink.tsx +++ b/src/components/_common/copyLink/copyLink.tsx @@ -5,6 +5,7 @@ import { classNames } from 'utils/classnames'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import style from './copyLink.module.scss'; @@ -22,8 +23,9 @@ export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyL const [showCopyTooltip, setShowCopyTooltip] = useState(false); const contentProps = usePageContentProps(); const { context } = getDecoratorParams(contentProps); + const { language, type } = contentProps; const { layoutConfig } = useLayoutConfig(); - const getLabel = translator('header', contentProps.language); + const getLabel = translator('header', language); if (!anchor) { return null; @@ -42,6 +44,7 @@ export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyL logAmplitudeEvent(AnalyticsEvents.COPY_LINK, { målgruppe: context, seksjon: layoutConfig.title, + innholdstype: innholdsType(type), }); } }; diff --git a/src/components/_common/expandable/Expandable.tsx b/src/components/_common/expandable/Expandable.tsx index fff75a3b6..a0699b2ef 100644 --- a/src/components/_common/expandable/Expandable.tsx +++ b/src/components/_common/expandable/Expandable.tsx @@ -4,6 +4,7 @@ import { BarChartIcon, BriefcaseClockIcon, CalendarIcon, TasklistIcon } from '@n import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { classNames } from 'utils/classnames'; import { smoothScrollToTarget, handleStickyScrollOffset } from 'utils/scroll-to'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; @@ -53,6 +54,7 @@ export const Expandable = ({ opprinnelse: analyticsOriginTag || 'utvidbar tekst', komponent: 'Expandable', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); }; diff --git a/src/components/_common/filter-bar/FilterBar.tsx b/src/components/_common/filter-bar/FilterBar.tsx index 8e8d7c78d..3922ef1f9 100644 --- a/src/components/_common/filter-bar/FilterBar.tsx +++ b/src/components/_common/filter-bar/FilterBar.tsx @@ -5,6 +5,7 @@ import { translator } from 'translations'; import { useFilterState } from 'store/hooks/useFilteredContent'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { FilterCheckbox } from 'components/parts/filters-menu/FilterCheckbox'; import { SectionWithHeaderProps } from 'types/component-props/layouts/section-with-header'; import { useScrollPosition } from 'utils/useStickyScroll'; @@ -90,6 +91,7 @@ export const FilterBar = ({ layoutProps }: Props) => { opprinnelse: 'innholdtekst', komponent: 'FilterBar', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); saveScrollPosition(); toggleFilter(filter.id); diff --git a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx index 5c62ccc51..c4c07ef44 100644 --- a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx +++ b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx @@ -7,6 +7,7 @@ import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import style from 'components/_common/lenke/lenkeBase/LenkeBase.module.scss'; @@ -51,7 +52,6 @@ export const LenkeBase = ({ const { editorView } = contentProps; const { context } = getDecoratorParams(contentProps); const { layoutConfig } = useLayoutConfig(); - const { url, canRouteClientSide } = usePublicUrl(href); const analyticsData = { komponent: analyticsComponent, @@ -60,6 +60,7 @@ export const LenkeBase = ({ destinasjon: url, lenketekst: analyticsLabel || onlyText(children), målgruppe: context, + innholdstype: innholdsType(contentProps.type), }; const WrapperComponent = diff --git a/src/components/_common/overview-filters/OverviewFilters.tsx b/src/components/_common/overview-filters/OverviewFilters.tsx index 38d005ef9..ba778ad11 100644 --- a/src/components/_common/overview-filters/OverviewFilters.tsx +++ b/src/components/_common/overview-filters/OverviewFilters.tsx @@ -10,6 +10,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import style from './OverviewFilters.module.scss'; @@ -53,6 +54,7 @@ const MobileView = ({ opprinnelse: 'oversiktsside filter mobil', komponent: 'MobileView', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); }} className={style.mobileFilterButton} diff --git a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx index f1beaa209..c8c34c229 100644 --- a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx +++ b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx @@ -3,6 +3,7 @@ import { Area } from 'types/areas'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -48,6 +49,7 @@ export const OverviewAreaFilter = ({ items }: Props) => { opprinnelse: 'oversiktsside områder', komponent: 'OverviewAreaFilter', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); setAreaFilter(area); }; diff --git a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx index f62348aad..e0a7d799a 100644 --- a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx +++ b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx @@ -3,6 +3,7 @@ import { ProductTaxonomy } from 'types/taxonomies'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -47,6 +48,7 @@ export const OverviewTaxonomyFilter = ({ items }: Props) => { opprinnelse: 'oversiktsside typer', komponent: 'OverviewTaxonomyFilter', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); setTaxonomyFilter(taxonomy); }; diff --git a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx index 8ccbce359..8c789ade5 100644 --- a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx +++ b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx @@ -5,6 +5,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { useOverviewFilters } from 'store/hooks/useOverviewFilters'; import { windowScrollTo } from 'utils/scroll-to'; import { @@ -48,6 +49,7 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => { filternavn: analyticsRedaction(value), komponent: 'OverviewTextFilter', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); }, 500), [setTextFilter] diff --git a/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx b/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx index 50289acbd..c78f615b4 100644 --- a/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx +++ b/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx @@ -4,6 +4,7 @@ import { PictogramsProps } from 'types/content-props/pictograms'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { IllustrationStatic } from 'components/_common/illustration/static/IllustrationStatic'; import { CopyLink } from 'components/_common/copyLink/copyLink'; import { AlertBox } from 'components/_common/alertBox/AlertBox'; @@ -70,6 +71,7 @@ export const ProductPanelExpandable = ({ opprinnelse: 'produktdetalj', komponent: 'ProductPanelExpandable', målgruppe: context, + innholdstype: innholdsType(contentProps.type), ...analyticsData, }); }; diff --git a/src/components/_common/qbrick-video/QbrickVideo.tsx b/src/components/_common/qbrick-video/QbrickVideo.tsx index 052be8168..3c8700ba7 100644 --- a/src/components/_common/qbrick-video/QbrickVideo.tsx +++ b/src/components/_common/qbrick-video/QbrickVideo.tsx @@ -9,6 +9,7 @@ import { AlertBox } from 'components/_common/alertBox/AlertBox'; import { NextImage } from 'components/_common/image/NextImage'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { QbrickVideoProps } from './utils/videoProps'; import { getTimestampFromDuration } from './utils/videoHelpers'; import { useQbrickPlayerState } from './useQbrickPlayerState'; @@ -26,6 +27,7 @@ export const QbrickVideo = (props: QbrickVideoProps) => { videoProps: props, videoContainerId, context, + innholdstype: innholdsType(contentProps.type), } ); diff --git a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx index 793e6d5a1..661841e6c 100644 --- a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx +++ b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx @@ -12,9 +12,15 @@ type Props = { videoProps: QbrickVideoProps; videoContainerId: string; context?: string; + innholdstype?: string; }; -export const useQbrickPlayerState = ({ videoProps, videoContainerId, context }: Props) => { +export const useQbrickPlayerState = ({ + videoProps, + videoContainerId, + context, + innholdstype, +}: Props) => { const [playerState, setPlayerState] = useState('stopped'); const widgetId = useId(); @@ -29,7 +35,7 @@ export const useQbrickPlayerState = ({ videoProps, videoContainerId, context }: return; } - createAndStart(videoProps, videoContainer, widgetId, setPlayerState, context); + createAndStart(videoProps, videoContainer, widgetId, setPlayerState, context, innholdstype); }, [videoProps, videoContainerId, widgetId, playerState, setPlayerState, context]); const resetPlayer = useCallback(() => { @@ -53,7 +59,8 @@ const createAndStart = ( videoContainer: HTMLElement, widgetId: string, setPlayerState: (state: PlayerState) => void, - context?: string + context?: string, + innholdstype?: string ) => { const createPlayer = (timeLeft: number = PLAYER_TIMEOUT_MS) => { if (timeLeft <= 0) { @@ -91,6 +98,7 @@ const createAndStart = ( varighet: duration, språk: language, målgruppe: context, + innholdstype, }); }) .on('playable', () => { diff --git a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx index 2575f9e08..d00a726e6 100644 --- a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx +++ b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx @@ -4,6 +4,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { OfficeDetailsData } from 'types/content-props/office-details-props'; import { officeDetailsFormatAddress } from 'components/pages/office-page/office-details/utils'; @@ -30,6 +31,7 @@ export const OfficeInformation = ({ officeData }: OfficeInformationProps) => { opprinnelse: 'kontorinformasjon', komponent: 'OfficeInformation', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); }; diff --git a/src/components/parts/filters-menu/FiltersMenuPart.tsx b/src/components/parts/filters-menu/FiltersMenuPart.tsx index 852ee1840..23ed20f56 100644 --- a/src/components/parts/filters-menu/FiltersMenuPart.tsx +++ b/src/components/parts/filters-menu/FiltersMenuPart.tsx @@ -11,6 +11,7 @@ import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartComponentProps, PartType } from 'types/component-props/parts'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; +import { innholdsType } from 'types/content-props/_content-common'; import { ExpandableMixin } from 'types/component-props/_mixins'; import { checkIfFilterFirstInPage } from './helpers'; import { FilterCheckbox } from './FilterCheckbox'; @@ -69,6 +70,7 @@ export const FiltersMenuPart = ({ config, path }: PartComponentProps) opprinnelse: 'lesmer', komponent: 'ReadMore', målgruppe: context, + innholdstype: innholdsType(contentProps.type), }); }; diff --git a/src/types/content-props/_content-common.ts b/src/types/content-props/_content-common.ts index ecbd7ef3a..ef1b7ef93 100644 --- a/src/types/content-props/_content-common.ts +++ b/src/types/content-props/_content-common.ts @@ -95,6 +95,94 @@ export enum ContentType { FallbackPage = 'no.nav.navno:fallback-page', } +export const innholdsType = (type: ContentType) => { + switch (type) { + case ContentType.InternalLink: + return 'Intern Lenke'; + case ContentType.ExternalLink: + return 'Ekstern Lenke'; + case ContentType.SectionPage: + return 'Oppslagstavle'; + case ContentType.TransportPage: + return 'Transportside'; + case ContentType.DynamicPage: + return 'Dynamisk side'; + case ContentType.ContentList: + return 'Innholdsliste'; + case ContentType.ContactInformationPage: + return 'Kontaktinformasjon'; + case ContentType.GenericPage: + return 'Generisk side'; + case ContentType.PageList: + return 'Artikkelliste'; + case ContentType.MainArticle: + return 'Artikkel'; + case ContentType.MainArticleChapter: + return 'Kapittel'; + case ContentType.Melding: + return 'Driftsmelding'; + case ContentType.LargeTable: + return 'Ekstra stor tabell'; + case ContentType.OfficeInformation: + return 'Enhetsinformasjon'; + case ContentType.PublishingCalendar: + return 'Publiseringskalender'; + case ContentType.PublishingCalendarEntry: + return 'Kalenderhendelse'; + case ContentType.GlobalNumberValuesSet: + return 'Globale tall-verdier'; + case ContentType.ProductPage: + return 'Produktside'; + case ContentType.ProductDetails: + return 'Produktdetaljer'; + case ContentType.OfficeEditorialPage: + return 'Kontorside for redaktørinnhold'; + case ContentType.GuidePage: + return 'Slik gjør du det'; + case ContentType.ThemedArticlePage: + return 'Temaartikkel'; + case ContentType.CurrentTopicPage: + return 'Aktuelt'; + case ContentType.SituationPage: + return 'Situasjonsside'; + case ContentType.Pictograms: + return 'Piktogram'; + case ContentType.ToolsPage: + return 'Verktøy-side'; + case ContentType.Calculator: + return 'Kalkulator'; + case ContentType.Overview: + return 'Oversiktsside'; + case ContentType.GlobalCaseTimeSet: + return 'Saksbehandlingstider'; + case ContentType.PayoutDates: + return 'Utbetalingsdatoer'; + case ContentType.FrontPage: + return 'Forside'; + case ContentType.FrontPageNested: + return 'Underforside'; + case ContentType.AreaPage: + return 'Områdeside'; + case ContentType.PressLandingPage: + return 'Landingsside for presse'; + case ContentType.FormDetails: + return 'Skjemadetaljer'; + case ContentType.FormIntermediateStepPage: + return 'Mellomsteg for søknad, skjema, klage og ettersendelse'; + case ContentType.FormsOverview: + return 'Skjemaoversikt'; + case ContentType.UserTestsConfig: + return 'Brukertester'; + case ContentType.Video: + return 'Qbrick Video'; + case ContentType.AlertInContext: + return 'Varsel i kontekst'; + case ContentType.OfficePage: + return 'Kontorside (gammel)'; + } + return `Ugyldig [${type}]`; +}; + export type ContentAndMediaCommonProps = { type: ContentType | MediaType; _id: string; From c31b46acf5c5366843e3bf4a9b248a7bde755bb9 Mon Sep 17 00:00:00 2001 From: Tale Prestmo Date: Thu, 12 Dec 2024 12:27:24 +0100 Subject: [PATCH 4/7] Fix testdata --- src/components/_common/user-tests/UserTests.tsx | 1 + .../_common/user-tests/public-view/UserTestsPublicView.test.tsx | 1 + 2 files changed, 2 insertions(+) diff --git a/src/components/_common/user-tests/UserTests.tsx b/src/components/_common/user-tests/UserTests.tsx index 502bb4651..4239a4bad 100644 --- a/src/components/_common/user-tests/UserTests.tsx +++ b/src/components/_common/user-tests/UserTests.tsx @@ -11,6 +11,7 @@ export type UserTestsComponentProps = { data: UserTestsConfigData; }; selectedTestIds: string[]; + _path: string; }; export const UserTests = (props: UserTestsComponentProps) => { diff --git a/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx b/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx index 9495723b6..8de6fad2f 100644 --- a/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx +++ b/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx @@ -21,6 +21,7 @@ const baseProps: UserTestsComponentProps = { variants: [], }, }, + _path: 'test', }; const buildProps = (variants: UserTestVariantProps[], selectedTestIds: string[] = []) => { From e5c0155d56610b4827e74d4b9acee3f1f4edea58 Mon Sep 17 00:00:00 2001 From: Tale Prestmo Date: Fri, 13 Dec 2024 10:23:07 +0100 Subject: [PATCH 5/7] oppdater hent innholdstype --- next-env.d.ts | 2 +- .../_common/accordion/Accordion.tsx | 4 +- src/components/_common/card/useCard.tsx | 4 +- src/components/_common/copyLink/copyLink.tsx | 4 +- .../_common/expandable/Expandable.tsx | 4 +- .../_common/filter-bar/FilterBar.tsx | 4 +- .../_common/lenke/lenkeBase/LenkeBase.tsx | 4 +- .../overview-filters/OverviewFilters.tsx | 4 +- .../area-filter/OverviewAreaFilter.tsx | 4 +- .../OverviewTaxonomyFilter.tsx | 4 +- .../text-filter/OverviewTextFilter.tsx | 4 +- .../ProductPanelExpandable.tsx | 4 +- .../_common/qbrick-video/QbrickVideo.tsx | 4 +- .../officeInformation/OfficeInformation.tsx | 4 +- .../parts/filters-menu/FiltersMenuPart.tsx | 4 +- .../parts/readMorePart/ReadMorePart.tsx | 4 +- src/types/content-props/_content-common.ts | 135 +++++++----------- 17 files changed, 80 insertions(+), 117 deletions(-) diff --git a/next-env.d.ts b/next-env.d.ts index a4a7b3f5c..4f11a03dc 100644 --- a/next-env.d.ts +++ b/next-env.d.ts @@ -2,4 +2,4 @@ /// // NOTE: This file should not be edited -// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information. +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/src/components/_common/accordion/Accordion.tsx b/src/components/_common/accordion/Accordion.tsx index 6db23f362..8d0615f9b 100644 --- a/src/components/_common/accordion/Accordion.tsx +++ b/src/components/_common/accordion/Accordion.tsx @@ -5,7 +5,7 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartConfigAccordion } from 'components/parts/accordion/AccordionPart'; import { classNames } from 'utils/classnames'; @@ -43,7 +43,7 @@ export const Accordion = ({ accordion }: AccordionProps) => { opprinnelse: 'trekkspill', komponent: 'Accordion', målgruppe: context, - innholdstype: innholdsType(type), + innholdstype: innholdsTypeMap[type], }); }; diff --git a/src/components/_common/card/useCard.tsx b/src/components/_common/card/useCard.tsx index 810076e95..399dacfd2 100644 --- a/src/components/_common/card/useCard.tsx +++ b/src/components/_common/card/useCard.tsx @@ -8,7 +8,7 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; type AnalyticsProps = { analyticsLinkGroup?: string; @@ -67,7 +67,7 @@ export const useCard = ({ link, size, type }: UseCardSettings): UseCardState => destinasjon: link.url, lenketekst: link.text, målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }; const handleUserEvent = (e: React.MouseEvent | React.TouchEvent): void => { diff --git a/src/components/_common/copyLink/copyLink.tsx b/src/components/_common/copyLink/copyLink.tsx index 485a8e255..d51a3c9d1 100644 --- a/src/components/_common/copyLink/copyLink.tsx +++ b/src/components/_common/copyLink/copyLink.tsx @@ -5,7 +5,7 @@ import { classNames } from 'utils/classnames'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import style from './copyLink.module.scss'; @@ -44,7 +44,7 @@ export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyL logAmplitudeEvent(AnalyticsEvents.COPY_LINK, { målgruppe: context, seksjon: layoutConfig.title, - innholdstype: innholdsType(type), + innholdstype: innholdsTypeMap[type], }); } }; diff --git a/src/components/_common/expandable/Expandable.tsx b/src/components/_common/expandable/Expandable.tsx index a0699b2ef..ffa792307 100644 --- a/src/components/_common/expandable/Expandable.tsx +++ b/src/components/_common/expandable/Expandable.tsx @@ -4,7 +4,7 @@ import { BarChartIcon, BriefcaseClockIcon, CalendarIcon, TasklistIcon } from '@n import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { classNames } from 'utils/classnames'; import { smoothScrollToTarget, handleStickyScrollOffset } from 'utils/scroll-to'; import { Shortcuts, useShortcuts } from 'utils/useShortcuts'; @@ -54,7 +54,7 @@ export const Expandable = ({ opprinnelse: analyticsOriginTag || 'utvidbar tekst', komponent: 'Expandable', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); }; diff --git a/src/components/_common/filter-bar/FilterBar.tsx b/src/components/_common/filter-bar/FilterBar.tsx index 3922ef1f9..deefadce7 100644 --- a/src/components/_common/filter-bar/FilterBar.tsx +++ b/src/components/_common/filter-bar/FilterBar.tsx @@ -5,7 +5,7 @@ import { translator } from 'translations'; import { useFilterState } from 'store/hooks/useFilteredContent'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { FilterCheckbox } from 'components/parts/filters-menu/FilterCheckbox'; import { SectionWithHeaderProps } from 'types/component-props/layouts/section-with-header'; import { useScrollPosition } from 'utils/useStickyScroll'; @@ -91,7 +91,7 @@ export const FilterBar = ({ layoutProps }: Props) => { opprinnelse: 'innholdtekst', komponent: 'FilterBar', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); saveScrollPosition(); toggleFilter(filter.id); diff --git a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx index c4c07ef44..9514fd2e9 100644 --- a/src/components/_common/lenke/lenkeBase/LenkeBase.tsx +++ b/src/components/_common/lenke/lenkeBase/LenkeBase.tsx @@ -7,7 +7,7 @@ import { useLayoutConfig } from 'components/layouts/useLayoutConfig'; import { usePublicUrl } from 'utils/usePublicUrl'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import style from 'components/_common/lenke/lenkeBase/LenkeBase.module.scss'; @@ -60,7 +60,7 @@ export const LenkeBase = ({ destinasjon: url, lenketekst: analyticsLabel || onlyText(children), målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }; const WrapperComponent = diff --git a/src/components/_common/overview-filters/OverviewFilters.tsx b/src/components/_common/overview-filters/OverviewFilters.tsx index ba778ad11..571916b74 100644 --- a/src/components/_common/overview-filters/OverviewFilters.tsx +++ b/src/components/_common/overview-filters/OverviewFilters.tsx @@ -10,7 +10,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import style from './OverviewFilters.module.scss'; @@ -54,7 +54,7 @@ const MobileView = ({ opprinnelse: 'oversiktsside filter mobil', komponent: 'MobileView', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); }} className={style.mobileFilterButton} diff --git a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx index c8c34c229..ca98601c0 100644 --- a/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx +++ b/src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx @@ -3,7 +3,7 @@ import { Area } from 'types/areas'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -49,7 +49,7 @@ export const OverviewAreaFilter = ({ items }: Props) => { opprinnelse: 'oversiktsside områder', komponent: 'OverviewAreaFilter', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); setAreaFilter(area); }; diff --git a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx index e0a7d799a..276132d91 100644 --- a/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx +++ b/src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx @@ -3,7 +3,7 @@ import { ProductTaxonomy } from 'types/taxonomies'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase'; import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters'; @@ -48,7 +48,7 @@ export const OverviewTaxonomyFilter = ({ items }: Props) => { opprinnelse: 'oversiktsside typer', komponent: 'OverviewTaxonomyFilter', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); setTaxonomyFilter(taxonomy); }; diff --git a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx index 8c789ade5..869bcb4d0 100644 --- a/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx +++ b/src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx @@ -5,7 +5,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { useOverviewFilters } from 'store/hooks/useOverviewFilters'; import { windowScrollTo } from 'utils/scroll-to'; import { @@ -49,7 +49,7 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => { filternavn: analyticsRedaction(value), komponent: 'OverviewTextFilter', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); }, 500), [setTextFilter] diff --git a/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx b/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx index c78f615b4..b2e43aa7c 100644 --- a/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx +++ b/src/components/_common/productPanelExpandable/ProductPanelExpandable.tsx @@ -4,7 +4,7 @@ import { PictogramsProps } from 'types/content-props/pictograms'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { IllustrationStatic } from 'components/_common/illustration/static/IllustrationStatic'; import { CopyLink } from 'components/_common/copyLink/copyLink'; import { AlertBox } from 'components/_common/alertBox/AlertBox'; @@ -71,7 +71,7 @@ export const ProductPanelExpandable = ({ opprinnelse: 'produktdetalj', komponent: 'ProductPanelExpandable', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], ...analyticsData, }); }; diff --git a/src/components/_common/qbrick-video/QbrickVideo.tsx b/src/components/_common/qbrick-video/QbrickVideo.tsx index 3c8700ba7..cf89e7903 100644 --- a/src/components/_common/qbrick-video/QbrickVideo.tsx +++ b/src/components/_common/qbrick-video/QbrickVideo.tsx @@ -9,7 +9,7 @@ import { AlertBox } from 'components/_common/alertBox/AlertBox'; import { NextImage } from 'components/_common/image/NextImage'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { QbrickVideoProps } from './utils/videoProps'; import { getTimestampFromDuration } from './utils/videoHelpers'; import { useQbrickPlayerState } from './useQbrickPlayerState'; @@ -27,7 +27,7 @@ export const QbrickVideo = (props: QbrickVideoProps) => { videoProps: props, videoContainerId, context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], } ); diff --git a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx index d00a726e6..2397cee1a 100644 --- a/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx +++ b/src/components/pages/office-page/office-details/officeInformation/OfficeInformation.tsx @@ -4,7 +4,7 @@ import { translator } from 'translations'; import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { OfficeDetailsData } from 'types/content-props/office-details-props'; import { officeDetailsFormatAddress } from 'components/pages/office-page/office-details/utils'; @@ -31,7 +31,7 @@ export const OfficeInformation = ({ officeData }: OfficeInformationProps) => { opprinnelse: 'kontorinformasjon', komponent: 'OfficeInformation', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); }; diff --git a/src/components/parts/filters-menu/FiltersMenuPart.tsx b/src/components/parts/filters-menu/FiltersMenuPart.tsx index 23ed20f56..9ba30f789 100644 --- a/src/components/parts/filters-menu/FiltersMenuPart.tsx +++ b/src/components/parts/filters-menu/FiltersMenuPart.tsx @@ -11,7 +11,7 @@ import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { PartComponentProps, PartType } from 'types/component-props/parts'; import { usePageContentProps } from 'store/pageContext'; import { getDecoratorParams } from 'utils/decorator-utils'; -import { innholdsType } from 'types/content-props/_content-common'; +import { innholdsTypeMap } from 'types/content-props/_content-common'; import { ExpandableMixin } from 'types/component-props/_mixins'; import { checkIfFilterFirstInPage } from './helpers'; import { FilterCheckbox } from './FilterCheckbox'; @@ -70,7 +70,7 @@ export const FiltersMenuPart = ({ config, path }: PartComponentProps) opprinnelse: 'lesmer', komponent: 'ReadMore', målgruppe: context, - innholdstype: innholdsType(contentProps.type), + innholdstype: innholdsTypeMap[contentProps.type], }); }; diff --git a/src/types/content-props/_content-common.ts b/src/types/content-props/_content-common.ts index ef1b7ef93..837d9a114 100644 --- a/src/types/content-props/_content-common.ts +++ b/src/types/content-props/_content-common.ts @@ -95,92 +95,55 @@ export enum ContentType { FallbackPage = 'no.nav.navno:fallback-page', } -export const innholdsType = (type: ContentType) => { - switch (type) { - case ContentType.InternalLink: - return 'Intern Lenke'; - case ContentType.ExternalLink: - return 'Ekstern Lenke'; - case ContentType.SectionPage: - return 'Oppslagstavle'; - case ContentType.TransportPage: - return 'Transportside'; - case ContentType.DynamicPage: - return 'Dynamisk side'; - case ContentType.ContentList: - return 'Innholdsliste'; - case ContentType.ContactInformationPage: - return 'Kontaktinformasjon'; - case ContentType.GenericPage: - return 'Generisk side'; - case ContentType.PageList: - return 'Artikkelliste'; - case ContentType.MainArticle: - return 'Artikkel'; - case ContentType.MainArticleChapter: - return 'Kapittel'; - case ContentType.Melding: - return 'Driftsmelding'; - case ContentType.LargeTable: - return 'Ekstra stor tabell'; - case ContentType.OfficeInformation: - return 'Enhetsinformasjon'; - case ContentType.PublishingCalendar: - return 'Publiseringskalender'; - case ContentType.PublishingCalendarEntry: - return 'Kalenderhendelse'; - case ContentType.GlobalNumberValuesSet: - return 'Globale tall-verdier'; - case ContentType.ProductPage: - return 'Produktside'; - case ContentType.ProductDetails: - return 'Produktdetaljer'; - case ContentType.OfficeEditorialPage: - return 'Kontorside for redaktørinnhold'; - case ContentType.GuidePage: - return 'Slik gjør du det'; - case ContentType.ThemedArticlePage: - return 'Temaartikkel'; - case ContentType.CurrentTopicPage: - return 'Aktuelt'; - case ContentType.SituationPage: - return 'Situasjonsside'; - case ContentType.Pictograms: - return 'Piktogram'; - case ContentType.ToolsPage: - return 'Verktøy-side'; - case ContentType.Calculator: - return 'Kalkulator'; - case ContentType.Overview: - return 'Oversiktsside'; - case ContentType.GlobalCaseTimeSet: - return 'Saksbehandlingstider'; - case ContentType.PayoutDates: - return 'Utbetalingsdatoer'; - case ContentType.FrontPage: - return 'Forside'; - case ContentType.FrontPageNested: - return 'Underforside'; - case ContentType.AreaPage: - return 'Områdeside'; - case ContentType.PressLandingPage: - return 'Landingsside for presse'; - case ContentType.FormDetails: - return 'Skjemadetaljer'; - case ContentType.FormIntermediateStepPage: - return 'Mellomsteg for søknad, skjema, klage og ettersendelse'; - case ContentType.FormsOverview: - return 'Skjemaoversikt'; - case ContentType.UserTestsConfig: - return 'Brukertester'; - case ContentType.Video: - return 'Qbrick Video'; - case ContentType.AlertInContext: - return 'Varsel i kontekst'; - case ContentType.OfficePage: - return 'Kontorside (gammel)'; - } - return `Ugyldig [${type}]`; +export const innholdsTypeMap: Record = { + [ContentType.InternalLink]: 'Intern Lenke', + [ContentType.ExternalLink]: 'Ekstern Lenke', + [ContentType.SectionPage]: 'Oppslagstavle', + [ContentType.TransportPage]: 'Transportside', + [ContentType.DynamicPage]: 'Dynamisk side', + [ContentType.ContentList]: 'Innholdsliste', + [ContentType.ContactInformationPage]: 'Kontaktinformasjon', + [ContentType.GenericPage]: 'Generisk side', + [ContentType.PageList]: 'Artikkelliste', + [ContentType.MainArticle]: 'Artikkel', + [ContentType.MainArticleChapter]: 'Kapittel', + [ContentType.Melding]: 'Driftsmelding', + [ContentType.LargeTable]: 'Ekstra stor tabell', + [ContentType.OfficeInformation]: 'Enhetsinformasjon', + [ContentType.PublishingCalendar]: 'Publiseringskalender', + [ContentType.PublishingCalendarEntry]: 'Kalenderhendelse', + [ContentType.GlobalNumberValuesSet]: 'Globale tall-verdier', + [ContentType.ProductPage]: 'Produktside', + [ContentType.ProductDetails]: 'Produktdetaljer', + [ContentType.OfficeEditorialPage]: 'Kontorside for redaktørinnhold', + [ContentType.GuidePage]: 'Slik gjør du det', + [ContentType.ThemedArticlePage]: 'Temaartikkel', + [ContentType.CurrentTopicPage]: 'Aktuelt', + [ContentType.SituationPage]: 'Situasjonsside', + [ContentType.Pictograms]: 'Piktogram', + [ContentType.ToolsPage]: 'Verktøy-side', + [ContentType.Calculator]: 'Kalkulator', + [ContentType.Overview]: 'Oversiktsside', + [ContentType.GlobalCaseTimeSet]: 'Saksbehandlingstider', + [ContentType.PayoutDates]: 'Utbetalingsdatoer', + [ContentType.FrontPage]: 'Forside', + [ContentType.FrontPageNested]: 'Underforside', + [ContentType.AreaPage]: 'Områdeside', + [ContentType.PressLandingPage]: 'Landingsside for presse', + [ContentType.FormDetails]: 'Skjemadetaljer', + [ContentType.FormIntermediateStepPage]: 'Mellomsteg for søknad, skjema, klage og ettersendelse', + [ContentType.FormsOverview]: 'Skjemaoversikt', + [ContentType.UserTestsConfig]: 'Brukertester', + [ContentType.Video]: 'Qbrick Video', + [ContentType.AlertInContext]: 'Varsel i kontekst', + [ContentType.OfficePage]: 'Kontorside (gammel)', + + [ContentType.Error]: `Ugyldig type: [${ContentType.Error}]`, + [ContentType.Site]: `Ugyldig type: [${ContentType.Site}]`, + [ContentType.Fragment]: `Ugyldig type: [${ContentType.Fragment}]`, + [ContentType.TemplatePage]: `Ugyldig type: [${ContentType.TemplatePage}]`, + [ContentType.Url]: `Ugyldig type: [${ContentType.Url}]`, + [ContentType.FallbackPage]: `Ugyldig type: [${ContentType.FallbackPage}]`, }; export type ContentAndMediaCommonProps = { From b04a68144bd3298c6485fb489ebc86577e55e3f3 Mon Sep 17 00:00:00 2001 From: Tale Prestmo Date: Fri, 13 Dec 2024 10:30:09 +0100 Subject: [PATCH 6/7] =?UTF-8?q?Legg=20til=20dep=20array=20verdi,=20gj?= =?UTF-8?q?=C3=B8r=20path=20valgfri?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_common/qbrick-video/useQbrickPlayerState.tsx | 10 +++++++++- src/components/_common/user-tests/UserTests.tsx | 2 +- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx index 661841e6c..e07a7201e 100644 --- a/src/components/_common/qbrick-video/useQbrickPlayerState.tsx +++ b/src/components/_common/qbrick-video/useQbrickPlayerState.tsx @@ -36,7 +36,15 @@ export const useQbrickPlayerState = ({ } createAndStart(videoProps, videoContainer, widgetId, setPlayerState, context, innholdstype); - }, [videoProps, videoContainerId, widgetId, playerState, setPlayerState, context]); + }, [ + videoProps, + videoContainerId, + widgetId, + playerState, + setPlayerState, + context, + innholdstype, + ]); const resetPlayer = useCallback(() => { setPlayerState('stopped'); diff --git a/src/components/_common/user-tests/UserTests.tsx b/src/components/_common/user-tests/UserTests.tsx index 4239a4bad..96126e57b 100644 --- a/src/components/_common/user-tests/UserTests.tsx +++ b/src/components/_common/user-tests/UserTests.tsx @@ -11,7 +11,7 @@ export type UserTestsComponentProps = { data: UserTestsConfigData; }; selectedTestIds: string[]; - _path: string; + _path?: string; }; export const UserTests = (props: UserTestsComponentProps) => { From de4e4d7ed7aafbf9210d8e3b53be03182086ac8b Mon Sep 17 00:00:00 2001 From: Tale Prestmo Date: Fri, 13 Dec 2024 11:56:35 +0100 Subject: [PATCH 7/7] Make test run without changing prop-interface --- src/components/_common/user-tests/UserTests.tsx | 1 - .../_common/user-tests/public-view/UserTestsPublicView.test.tsx | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/_common/user-tests/UserTests.tsx b/src/components/_common/user-tests/UserTests.tsx index 96126e57b..502bb4651 100644 --- a/src/components/_common/user-tests/UserTests.tsx +++ b/src/components/_common/user-tests/UserTests.tsx @@ -11,7 +11,6 @@ export type UserTestsComponentProps = { data: UserTestsConfigData; }; selectedTestIds: string[]; - _path?: string; }; export const UserTests = (props: UserTestsComponentProps) => { diff --git a/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx b/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx index 8de6fad2f..5b77f5952 100644 --- a/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx +++ b/src/components/_common/user-tests/public-view/UserTestsPublicView.test.tsx @@ -11,7 +11,7 @@ import { PageContextProvider } from 'store/pageContext'; const cookieId = 'cookie-1234'; -const baseProps: UserTestsComponentProps = { +const baseProps: UserTestsComponentProps & { _path: string } = { selectedTestIds: [], tests: { data: {