Merge pull request #1694 from navikt/logikk-h3-h4-skjemadetalj

Legger til sjekk for visning av h3 / h4 basert på ryddejobb

Author: terjeofnorway

src/components/_common/form-details/FormDetails.tsx

@@ -17,6 +17,7 @@ export type FormDetailsComponentProps = {
         showAddendums?: boolean;
         showApplications?: boolean;
         showComplaints?: boolean;
+        showTitleAsLevel4?: boolean;
     };
     className?: string;
     formNumberSelected?: string;
@@ -35,6 +36,7 @@ export const FormDetails = ({
         showAddendums = true,
         showApplications = true,
         showComplaints = true,
+        showTitleAsLevel4 = false, // Temporary solution until all product pages have been re-organized.
     } = displayConfig;
 
     const { formNumbers, formType, languageDisclaimer, ingress, title } =
@@ -70,8 +72,8 @@ export const FormDetails = ({
         <div className={classNames(style.formDetails, className)}>
             {hasVisibleTitle && (
                 <Heading
-                    size="medium"
-                    level="3"
+                    size={showTitleAsLevel4 ? 'small' : 'medium'}
+                    level={showTitleAsLevel4 ? '4' : '3'}
                     spacing={!hasVisibleIngress && !hasVisibleFormNumbers}
                 >
                     {title}

src/components/parts/form-details/FormDetailsPart.tsx

@@ -3,20 +3,36 @@ import { FormDetailsProps } from 'types/component-props/parts/form-details';
 import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp';
 import { FormDetails } from 'components/_common/form-details/FormDetails';
 import { FilteredContent } from '../../_common/filtered-content/FilteredContent';
+import {
+    ContentType,
+} from 'types/content-props/_content-common';
 
-export const FormDetailsPart = ({ config }: FormDetailsProps) => {
+export const FormDetailsPart = ({ config, pageProps }: FormDetailsProps) => {
     const { targetFormDetails, ...displayConfig } = config;
 
+    // This is a temporary solution to show the title as level 4 on product pages
+    // that have been re-organized as part of the Maler 2.0.
+    // When all product pages have been re-organized, we can remove the reference and
+    // config for showTitleAsLevel4.
+    const showTitleAsLevel4 =
+        pageProps.type === ContentType.ProductPage &&
+        pageProps.data?.showSubsectionNavigation;
+
     if (!targetFormDetails) {
         return <EditorHelp text={'Velg hvilken skjemadetalj som skal vises'} />;
     }
     const formDetails = targetFormDetails.data;
 
+    const modifiedDisplayConfig = {
+        ...displayConfig,
+        showTitleAsLevel4,
+    };
+
     return (
         <FilteredContent {...config}>
             <FormDetails
                 formDetails={formDetails}
-                displayConfig={displayConfig}
+                displayConfig={modifiedDisplayConfig}
             />
         </FilteredContent>
     );