Skip to content

Commit c330205

Browse files
talepretalepre
authored
Merge pull request #2126 from navikt/amliptude-context
Legger til målgruppe og innholdstype for alle events mot Amplitude
2 parents 9db93ba + de4e4d7 commit c330205

File tree

19 files changed

+195
-65
lines changed

19 files changed

+195
-65
lines changed

‎next-env.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22
/// <reference types="next/image-types/global" />
33

44
// NOTE: This file should not be edited
5-
// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.
5+
// see https://nextjs.org/docs/basic-features/typescript for more information.

‎src/components/_common/accordion/Accordion.tsx

+7-4
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml';
44
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
55
import { Shortcuts, useShortcuts } from 'utils/useShortcuts';
66
import { usePageContentProps } from 'store/pageContext';
7+
import { getDecoratorParams } from 'utils/decorator-utils';
8+
import { innholdsTypeMap } from 'types/content-props/_content-common';
79
import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp';
810
import { PartConfigAccordion } from 'components/parts/accordion/AccordionPart';
911
import { classNames } from 'utils/classnames';
@@ -17,14 +19,13 @@ type PanelItem = AccordionProps['accordion'][number];
1719

1820
export const Accordion = ({ accordion }: AccordionProps) => {
1921
const itemRefs = useRef<(HTMLDivElement | null)[]>([]);
20-
21-
const { editorView } = usePageContentProps();
22+
const contentProps = usePageContentProps();
23+
const { context } = getDecoratorParams(contentProps);
24+
const { editorView, type } = contentProps;
2225
const [openAccordions, setOpenAccordions] = useState<number[]>([]);
23-
2426
const expandAll = () => {
2527
setOpenAccordions(accordion.map((_, index) => index));
2628
};
27-
2829
const validatePanel = (item: PanelItem) => !!(item.title && item.html);
2930

3031
useShortcuts({ shortcut: Shortcuts.SEARCH, callback: expandAll });
@@ -41,6 +42,8 @@ export const Accordion = ({ accordion }: AccordionProps) => {
4142
tittel,
4243
opprinnelse: 'trekkspill',
4344
komponent: 'Accordion',
45+
målgruppe: context,
46+
innholdstype: innholdsTypeMap[type],
4447
});
4548
};
4649

‎src/components/_common/card/useCard.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import { LinkProps } from 'types/link-props';
77
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
88
import { usePublicUrl } from 'utils/usePublicUrl';
99
import { usePageContentProps } from 'store/pageContext';
10+
import { getDecoratorParams } from 'utils/decorator-utils';
11+
import { innholdsTypeMap } from 'types/content-props/_content-common';
1012

1113
type AnalyticsProps = {
1214
analyticsLinkGroup?: string;
@@ -36,10 +38,10 @@ type UseCardSettings = {
3638

3739
export const useCard = ({ link, size, type }: UseCardSettings): UseCardState => {
3840
const router = useRouter();
39-
const { editorView } = usePageContentProps();
40-
41+
const contentProps = usePageContentProps();
42+
const { context } = getDecoratorParams(contentProps);
43+
const { editorView } = contentProps;
4144
const { layoutConfig } = useLayoutConfig();
42-
4345
const { url, canRouteClientSide } = usePublicUrl(link.url);
4446

4547
const getComponentAnalyticsName = (type: CardType, size: CardSize) => {
@@ -64,6 +66,8 @@ export const useCard = ({ link, size, type }: UseCardSettings): UseCardState =>
6466
seksjon: layoutConfig.title,
6567
destinasjon: link.url,
6668
lenketekst: link.text,
69+
målgruppe: context,
70+
innholdstype: innholdsTypeMap[contentProps.type],
6771
};
6872

6973
const handleUserEvent = (e: React.MouseEvent | React.TouchEvent): void => {

‎src/components/_common/copyLink/copyLink.tsx

+8-2
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import React, { useState } from 'react';
22
import { LinkIcon } from '@navikt/aksel-icons';
33
import { translator } from 'translations';
44
import { classNames } from 'utils/classnames';
5-
import { usePageContentProps } from 'store/pageContext';
65
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
6+
import { usePageContentProps } from 'store/pageContext';
7+
import { getDecoratorParams } from 'utils/decorator-utils';
8+
import { innholdsTypeMap } from 'types/content-props/_content-common';
79
import { useLayoutConfig } from 'components/layouts/useLayoutConfig';
810

911
import style from './copyLink.module.scss';
@@ -19,7 +21,9 @@ const linkCopiedDisplayTimeMs = 2500;
1921

2022
export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyLinkProps) => {
2123
const [showCopyTooltip, setShowCopyTooltip] = useState(false);
22-
const { language } = usePageContentProps();
24+
const contentProps = usePageContentProps();
25+
const { context } = getDecoratorParams(contentProps);
26+
const { language, type } = contentProps;
2327
const { layoutConfig } = useLayoutConfig();
2428
const getLabel = translator('header', language);
2529

@@ -38,7 +42,9 @@ export const CopyLink = ({ anchor, heading, className, showLabel = true }: CopyL
3842
setTimeout(() => setShowCopyTooltip(false), linkCopiedDisplayTimeMs);
3943
}
4044
logAmplitudeEvent(AnalyticsEvents.COPY_LINK, {
45+
målgruppe: context,
4146
seksjon: layoutConfig.title,
47+
innholdstype: innholdsTypeMap[type],
4248
});
4349
}
4450
};

‎src/components/_common/expandable/Expandable.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,9 @@ import React, { useEffect, useRef, useState } from 'react';
22
import { ExpansionCard } from '@navikt/ds-react';
33
import { BarChartIcon, BriefcaseClockIcon, CalendarIcon, TasklistIcon } from '@navikt/aksel-icons';
44
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
5+
import { usePageContentProps } from 'store/pageContext';
6+
import { getDecoratorParams } from 'utils/decorator-utils';
7+
import { innholdsTypeMap } from 'types/content-props/_content-common';
58
import { classNames } from 'utils/classnames';
69
import { smoothScrollToTarget, handleStickyScrollOffset } from 'utils/scroll-to';
710
import { Shortcuts, useShortcuts } from 'utils/useShortcuts';
@@ -32,6 +35,8 @@ export const Expandable = ({
3235
}: Props) => {
3336
const [isOpen, setIsOpen] = useState(isOpenDefault ?? false);
3437
const accordionRef = useRef<HTMLDivElement | null>(null);
38+
const contentProps = usePageContentProps();
39+
const { context } = getDecoratorParams(contentProps);
3540

3641
useShortcuts({
3742
shortcut: Shortcuts.SEARCH,
@@ -48,6 +53,8 @@ export const Expandable = ({
4853
tittel,
4954
opprinnelse: analyticsOriginTag || 'utvidbar tekst',
5055
komponent: 'Expandable',
56+
målgruppe: context,
57+
innholdstype: innholdsTypeMap[contentProps.type],
5158
});
5259
};
5360

‎src/components/_common/filter-bar/FilterBar.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
44
import { translator } from 'translations';
55
import { useFilterState } from 'store/hooks/useFilteredContent';
66
import { usePageContentProps } from 'store/pageContext';
7+
import { getDecoratorParams } from 'utils/decorator-utils';
8+
import { innholdsTypeMap } from 'types/content-props/_content-common';
79
import { FilterCheckbox } from 'components/parts/filters-menu/FilterCheckbox';
810
import { SectionWithHeaderProps } from 'types/component-props/layouts/section-with-header';
911
import { useScrollPosition } from 'utils/useStickyScroll';
@@ -24,19 +26,15 @@ type Props = {
2426
/** @deprecated */
2527
export const FilterBar = ({ layoutProps }: Props) => {
2628
const filterBarRef = useRef(null);
27-
28-
const { language } = usePageContentProps();
29-
const getLabel = translator('filteredContent', language);
30-
29+
const contentProps = usePageContentProps();
30+
const { context } = getDecoratorParams(contentProps);
31+
const getLabel = translator('filteredContent', contentProps.language);
3132
const { selectedFilters, availableFilters, toggleFilter } = useFilterState();
32-
3333
const { saveScrollPosition, scrollBackToElement } = useScrollPosition(filterBarRef.current);
34-
3534
const [filtersToDisplay, setFiltersToDisplay] = useState<FilterWithCategory[]>([]);
3635

3736
useEffect(() => {
3837
const { content, intro } = layoutProps.regions;
39-
4038
const components = [
4139
...(content ? content.components : []),
4240
...(intro ? intro.components : []),
@@ -92,6 +90,8 @@ export const FilterBar = ({ layoutProps }: Props) => {
9290
filternavn: filter.filterName,
9391
opprinnelse: 'innholdtekst',
9492
komponent: 'FilterBar',
93+
målgruppe: context,
94+
innholdstype: innholdsTypeMap[contentProps.type],
9595
});
9696
saveScrollPosition();
9797
toggleFilter(filter.id);

‎src/components/_common/lenke/lenkeBase/LenkeBase.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import { onlyText } from 'utils/react-children';
66
import { useLayoutConfig } from 'components/layouts/useLayoutConfig';
77
import { usePublicUrl } from 'utils/usePublicUrl';
88
import { usePageContentProps } from 'store/pageContext';
9+
import { getDecoratorParams } from 'utils/decorator-utils';
10+
import { innholdsTypeMap } from 'types/content-props/_content-common';
911

1012
import style from 'components/_common/lenke/lenkeBase/LenkeBase.module.scss';
1113

@@ -46,16 +48,19 @@ export const LenkeBase = ({
4648
children,
4749
...rest
4850
}: Props) => {
49-
const { editorView } = usePageContentProps();
51+
const contentProps = usePageContentProps();
52+
const { editorView } = contentProps;
53+
const { context } = getDecoratorParams(contentProps);
5054
const { layoutConfig } = useLayoutConfig();
51-
5255
const { url, canRouteClientSide } = usePublicUrl(href);
5356
const analyticsData = {
5457
komponent: analyticsComponent,
5558
lenkegruppe: analyticsLinkGroup,
5659
seksjon: analyticsLinkGroup || layoutConfig.title,
5760
destinasjon: url,
5861
lenketekst: analyticsLabel || onlyText(children),
62+
målgruppe: context,
63+
innholdstype: innholdsTypeMap[contentProps.type],
5964
};
6065

6166
const WrapperComponent =

‎src/components/_common/overview-filters/OverviewFilters.tsx

+8-6
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,10 @@ import { OverviewTextFilter } from 'components/_common/overview-filters/text-fil
77
import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters';
88
import { classNames } from 'utils/classnames';
99
import { translator } from 'translations';
10-
import { usePageContentProps } from 'store/pageContext';
1110
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
11+
import { usePageContentProps } from 'store/pageContext';
12+
import { getDecoratorParams } from 'utils/decorator-utils';
13+
import { innholdsTypeMap } from 'types/content-props/_content-common';
1214

1315
import style from './OverviewFilters.module.scss';
1416

@@ -18,16 +20,14 @@ const MobileView = ({
1820
showAreaFilter,
1921
showTaxonomyFilter,
2022
}: Props) => {
21-
const { language } = usePageContentProps();
22-
23+
const contentProps = usePageContentProps();
24+
const { context } = getDecoratorParams(contentProps);
2325
const [isOpen, setIsOpen] = useState(false);
2426
const filtersRef = useRef<HTMLDivElement>(null);
25-
2627
const hasToggleFilters = showAreaFilter || showTaxonomyFilter;
27-
2828
const searchLabel = translator(
2929
'overview',
30-
language
30+
contentProps.language
3131
)(hasToggleFilters ? 'filterOrSearch' : 'search');
3232

3333
return (
@@ -53,6 +53,8 @@ const MobileView = ({
5353
kategori: 'mobile-toggle',
5454
opprinnelse: 'oversiktsside filter mobil',
5555
komponent: 'MobileView',
56+
målgruppe: context,
57+
innholdstype: innholdsTypeMap[contentProps.type],
5658
});
5759
}}
5860
className={style.mobileFilterButton}

‎src/components/_common/overview-filters/area-filter/OverviewAreaFilter.tsx

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
import React from 'react';
22
import { Area } from 'types/areas';
33
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
4+
import { usePageContentProps } from 'store/pageContext';
5+
import { getDecoratorParams } from 'utils/decorator-utils';
6+
import { innholdsTypeMap } from 'types/content-props/_content-common';
47
import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase';
58
import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters';
69

@@ -37,13 +40,16 @@ type Props = {
3740

3841
export const OverviewAreaFilter = ({ items }: Props) => {
3942
const { areaFilter, setAreaFilter } = useOverviewFilters();
40-
43+
const contentProps = usePageContentProps();
44+
const { context } = getDecoratorParams(contentProps);
4145
const handleFilterUpdate = (area: Area) => {
4246
logAmplitudeEvent(AnalyticsEvents.FILTER, {
4347
kategori: 'område',
4448
filternavn: analyticsAreas[area],
4549
opprinnelse: 'oversiktsside områder',
4650
komponent: 'OverviewAreaFilter',
51+
målgruppe: context,
52+
innholdstype: innholdsTypeMap[contentProps.type],
4753
});
4854
setAreaFilter(area);
4955
};

‎src/components/_common/overview-filters/taxonomy-filter/OverviewTaxonomyFilter.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
import React from 'react';
22
import { ProductTaxonomy } from 'types/taxonomies';
33
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
4+
import { usePageContentProps } from 'store/pageContext';
5+
import { getDecoratorParams } from 'utils/decorator-utils';
6+
import { innholdsTypeMap } from 'types/content-props/_content-common';
47
import { OverviewFilterBase } from 'components/_common/overview-filters/OverViewFilterBase/OverviewFilterBase';
58
import { OverviewFilterableItem, useOverviewFilters } from 'store/hooks/useOverviewFilters';
69

@@ -35,13 +38,17 @@ type Props = {
3538

3639
export const OverviewTaxonomyFilter = ({ items }: Props) => {
3740
const { taxonomyFilter, setTaxonomyFilter } = useOverviewFilters();
41+
const contentProps = usePageContentProps();
42+
const { context } = getDecoratorParams(contentProps);
3843

3944
const handleFilterUpdate = (taxonomy: ProductTaxonomy) => {
4045
logAmplitudeEvent(AnalyticsEvents.FILTER, {
4146
kategori: 'type',
4247
filternavn: analyticsTaxonomi[taxonomy],
4348
opprinnelse: 'oversiktsside typer',
4449
komponent: 'OverviewTaxonomyFilter',
50+
målgruppe: context,
51+
innholdstype: innholdsTypeMap[contentProps.type],
4552
});
4653
setTaxonomyFilter(taxonomy);
4754
};

‎src/components/_common/overview-filters/text-filter/OverviewTextFilter.tsx

+10-5
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,17 @@ import React, { useCallback, useEffect, useId, useState } from 'react';
22
import { Search } from '@navikt/ds-react';
33
import debounce from 'lodash.debounce';
44
import { translator } from 'translations';
5+
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
56
import { usePageContentProps } from 'store/pageContext';
7+
import { getDecoratorParams } from 'utils/decorator-utils';
8+
import { innholdsTypeMap } from 'types/content-props/_content-common';
69
import { useOverviewFilters } from 'store/hooks/useOverviewFilters';
710
import { windowScrollTo } from 'utils/scroll-to';
8-
import { AnalyticsEvents, logAmplitudeEvent } from 'utils/amplitude';
911
import {
1012
OVERVIEW_FILTERS_TEXT_INPUT_EVENT,
1113
OverviewFiltersTextInputEventDetail,
1214
} from 'store/slices/overviewFilters';
15+
1316
import style from './OverviewTextFilter.module.scss';
1417

1518
type Props = {
@@ -23,9 +26,10 @@ const analyticsRedaction = (value: string) =>
2326

2427
export const OverviewTextFilter = ({ hideLabel }: Props) => {
2528
const { setTextFilter } = useOverviewFilters();
26-
const { language } = usePageContentProps();
29+
const contentProps = usePageContentProps();
30+
const { context } = getDecoratorParams(contentProps);
31+
const label = translator('overview', contentProps.language)('search');
2732
const inputId = useId();
28-
2933
const [textInput, setTextInput] = useState('');
3034

3135
// eslint-disable-next-line react-hooks/exhaustive-deps
@@ -44,6 +48,8 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => {
4448
kategori: 'fritekst',
4549
filternavn: analyticsRedaction(value),
4650
komponent: 'OverviewTextFilter',
51+
målgruppe: context,
52+
innholdstype: innholdsTypeMap[contentProps.type],
4753
});
4854
}, 500),
4955
[setTextFilter]
@@ -61,7 +67,6 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => {
6167
setTextInput(value);
6268
}
6369
};
64-
6570
window.addEventListener(OVERVIEW_FILTERS_TEXT_INPUT_EVENT, handleInputFromEvent);
6671
return () => {
6772
window.removeEventListener(OVERVIEW_FILTERS_TEXT_INPUT_EVENT, handleInputFromEvent);
@@ -95,7 +100,7 @@ export const OverviewTextFilter = ({ hideLabel }: Props) => {
95100
<Search
96101
onChange={handleUserInput}
97102
value={textInput}
98-
label={translator('overview', language)('search')}
103+
label={label}
99104
hideLabel={hideLabel}
100105
variant={'secondary'}
101106
autoComplete={'off'}

0 commit comments

Comments
 (0)