Merge branch 'main' into move-fullscreen-button

bdahle · bdahle · commit 76ac7ca1c47a · 2025-02-13T15:47:51.000+01:00
diff --git a/xp-archive/client/content/Content.tsx b/xp-archive/client/content/Content.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { ExternalLinkIcon, SidebarRightIcon } from '@navikt/aksel-icons';
-import { Button, Detail, Heading, Label } from '@navikt/ds-react';
 import { xpArchiveConfig } from '@common/shared/siteConfigs';
+import { Button, Detail, Heading, Label } from '@navikt/ds-react';
 import { useFetchContent } from '../hooks/useFetchContent';
 import { useAppState } from '../context/appState/useAppState';
 import { ViewSelector, ViewVariant } from 'client/viewSelector/ViewSelector';
@@ -18,6 +18,11 @@ const getDefaultView = (isWebpage: boolean, hasAttachment: boolean): ViewVariant
     return undefined;
 };
 
+const updateContentUrl = (nodeId: string, locale: string, versionId?: string) => {
+    const newUrl = `${xpArchiveConfig.basePath}/${nodeId}/${locale}/${versionId ?? ''}`;
+    window.history.pushState({}, '', newUrl);
+};
+
 export const Content = () => {
     const { selectedContentId, selectedLocale, selectedVersion, setSelectedVersion } =
         useAppState();
@@ -37,6 +42,16 @@ export const Content = () => {
         versionId: selectedVersion ?? '',
     });
 
+    useEffect(() => {
+        if (selectedVersion) {
+            updateContentUrl(selectedContentId ?? '', selectedLocale, selectedVersion);
+        } else if (data?.versions?.[0]) {
+            const latestVersionId = data.versions[0].versionId;
+            setSelectedVersion(latestVersionId);
+            updateContentUrl(selectedContentId ?? '', selectedLocale, latestVersionId);
+        }
+    }, [data, selectedContentId, selectedLocale, selectedVersion]);
+
     const isWebpage = !!data?.html && !data.json.attachment;
     const hasAttachment = !!data?.json.attachment;
     const [selectedView, setSelectedView] = useState<ViewVariant | undefined>(
@@ -52,6 +67,15 @@ export const Content = () => {
         data?.json._versionKey
     }`;
 
+    const getVersionDisplay = () => {
+        if (selectedVersion && data?.versions) {
+            return formatTimestamp(
+                data.versions.find((v) => v.versionId === selectedVersion)?.timestamp ?? ''
+            );
+        }
+        return 'Laster...';
+    };
+
     if (!selectedContentId) {
         return <EmptyState />;
     }
@@ -95,14 +119,7 @@ export const Content = () => {
                         iconPosition={'right'}
                         onClick={() => setIsVersionPanelOpen(true)}
                     >
-                        {selectedVersion && data?.versions
-                            ? formatTimestamp(
-                                  data.versions.find((v) => v.versionId === selectedVersion)
-                                      ?.timestamp ?? ''
-                              )
-                            : data?.versions?.[0]
-                              ? `${formatTimestamp(data.versions[0].timestamp, true)} (Siste versjon)`
-                              : 'Laster...'}
+                        {getVersionDisplay()}
                     </Button>
                     <VersionSelector
                         versions={data?.versions || []}
@@ -112,7 +129,7 @@ export const Content = () => {
                 </div>
             </div>
             <ContentView
-                selectedView={selectedView || getDefaultView(isWebpage, hasAttachment) || 'html'}
+                selectedView={selectedView || getDefaultView(isWebpage, hasAttachment)}
                 isLoading={isLoading}
                 data={data}
             />
diff --git a/xp-archive/client/contentTree/contentTreeEntry/NavigationItem.tsx b/xp-archive/client/contentTree/contentTreeEntry/NavigationItem.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import { ContentTreeEntryData } from '../../../shared/types';
-import { xpArchiveConfig } from '@common/shared/siteConfigs';
 import { useAppState } from '../../context/appState/useAppState';
 import { TreeItem } from '@mui/x-tree-view';
 import { useContentTree } from 'client/hooks/useContentTree';
@@ -13,11 +12,6 @@ type Props = {
 export const getContentIconUrl = (type: string) =>
     `${import.meta.env.VITE_APP_ORIGIN}/xp/api/contentIcon?type=${type}`;
 
-export const updateContentUrl = (nodeId: string, locale: string, versionId?: string) => {
-    const newUrl = `${xpArchiveConfig.basePath}/${nodeId}/${locale}/${versionId ?? ''}`;
-    window.history.pushState({}, '', newUrl);
-};
-
 export const NavigationItem = ({ entry }: Props) => {
     const { setSelectedContentId } = useAppState();
 
@@ -39,7 +33,6 @@ export const NavigationItem = ({ entry }: Props) => {
     const onClick = () => {
         if (!entry.isEmpty) {
             setSelectedContentId(entry.id);
-            updateContentUrl(entry.id, entry.locale);
         }
     };
 
diff --git a/xp-archive/client/contentTree/search/SearchResultItem/SearchResultItem.tsx b/xp-archive/client/contentTree/search/SearchResultItem/SearchResultItem.tsx
@@ -1,9 +1,6 @@
 import { BodyShort, Detail } from '@navikt/ds-react';
 import { classNames } from '@common/client/utils/classNames';
-import {
-    updateContentUrl,
-    getContentIconUrl,
-} from 'client/contentTree/contentTreeEntry/NavigationItem';
+import { getContentIconUrl } from 'client/contentTree/contentTreeEntry/NavigationItem';
 import { useAppState } from 'client/context/appState/useAppState';
 import { SearchResponse } from 'shared/types';
 
@@ -31,7 +28,6 @@ export const SearchResultItem = ({
             onClick={() => {
                 setSelectedContentId(hit._id);
                 setSelectedLocale(hit.layerLocale);
-                updateContentUrl(hit._id, hit.layerLocale);
             }}
         >
             <img
diff --git a/xp-archive/client/contentView/ContentView.tsx b/xp-archive/client/contentView/ContentView.tsx
@@ -8,8 +8,8 @@ import { FilePreviewWrapper } from './filePreview/FilePreviewWrapper';
 
 import style from './ContentView.module.css';
 
-const getDisplayComponent = (viewVariant: ViewVariant, data?: ContentServiceResponse | null) => {
-    if (!data) return null;
+const getDisplayComponent = (viewVariant?: ViewVariant, data?: ContentServiceResponse | null) => {
+    if (!data || !viewVariant) return null;
     const components: Record<ViewVariant, React.ReactElement> = {
         html: (
             <HtmlView
@@ -25,7 +25,7 @@ const getDisplayComponent = (viewVariant: ViewVariant, data?: ContentServiceResp
 };
 
 type Props = {
-    selectedView: ViewVariant;
+    selectedView: ViewVariant | undefined;
     isLoading: boolean;
     data?: ContentServiceResponse | null;
 };
diff --git a/xp-archive/client/contentView/htmlView/HtmlView.tsx b/xp-archive/client/contentView/htmlView/HtmlView.tsx
@@ -9,8 +9,11 @@ type Props = {
     versionId: string;
 };
 
-export const HtmlView = ({ nodeId, locale, versionId }: Props) => {
+const localesToOverwrite = ['uk', 'ru'];
+
+export const HtmlView = ({ nodeId, locale: langLocale, versionId }: Props) => {
     const [isLoading, setIsLoading] = useState(true);
+    const locale = localesToOverwrite.includes(langLocale) ? 'no' : langLocale;
     const htmlPath = `${xpArchiveConfig.basePath}/html/${nodeId}/${locale}/${versionId}`;
 
     return (
diff --git a/xp-archive/client/versionSelector/VersionSelector.module.css b/xp-archive/client/versionSelector/VersionSelector.module.css
@@ -11,6 +11,7 @@
 
     :global(.navds-label) {
         font-weight: var(--a-font-weight-regular);
+        text-align: left;
     }
 
     :global(.navds-button__icon) {
diff --git a/xp-archive/client/versionSelector/VersionSelector.tsx b/xp-archive/client/versionSelector/VersionSelector.tsx
@@ -3,7 +3,6 @@ import { Heading, Button, Search } from '@navikt/ds-react';
 import { VersionReference } from 'shared/types';
 import { formatTimestamp } from '@common/shared/timestamp';
 import { useAppState } from 'client/context/appState/useAppState';
-import { updateContentUrl } from 'client/contentTree/contentTreeEntry/NavigationItem';
 import { SlidePanel } from './SlidePanel/SlidePanel';
 import { classNames } from '@common/client/utils/classNames';
 import style from './VersionSelector.module.css';
@@ -35,13 +34,7 @@ const VersionButton = ({ isSelected, onClick, children }: VersionButtonProps) =>
 
 export const VersionSelector = ({ versions, isOpen, onClose }: Props) => {
     const [searchQuery, setSearchQuery] = useState('');
-    const {
-        selectedContentId,
-        setSelectedContentId,
-        selectedVersion,
-        setSelectedVersion,
-        selectedLocale,
-    } = useAppState();
+    const { setSelectedContentId, selectedVersion, setSelectedVersion } = useAppState();
 
     const handleClose = () => {
         setSearchQuery('');
@@ -51,7 +44,6 @@ export const VersionSelector = ({ versions, isOpen, onClose }: Props) => {
     const selectVersion = (versionId: string) => {
         const nodeId = versions.find((v) => v.versionId === versionId)?.nodeId;
         if (nodeId) setSelectedContentId(nodeId);
-        updateContentUrl(selectedContentId ?? '', selectedLocale, versionId);
         setSelectedVersion(versionId);
         handleClose();
     };
@@ -73,23 +65,16 @@ export const VersionSelector = ({ versions, isOpen, onClose }: Props) => {
                 className={style.search}
             />
             <div className={style.versionList}>
-                <VersionButton isSelected={!selectedVersion} onClick={() => selectVersion('')}>
-                    {versions[0] ? (
-                        <>
-                            {formatTimestamp(versions[0].timestamp, true)}
-                            <span style={{ fontWeight: 'normal' }}> (Siste versjon)</span>
-                        </>
-                    ) : (
-                        'Laster...'
-                    )}
-                </VersionButton>
-                {filteredVersions.map((version) => (
+                {filteredVersions.map((version, index) => (
                     <VersionButton
                         key={version.versionId}
                         isSelected={version.versionId === selectedVersion}
                         onClick={() => selectVersion(version.versionId)}
                     >
                         {formatTimestamp(version.timestamp)}
+                        {index === 0 && (
+                            <span style={{ fontWeight: 'normal' }}> (Siste versjon)</span>
+                        )}
                     </VersionButton>
                 ))}
             </div>
diff --git a/xp-archive/client/viewSelector/ViewSelector.tsx b/xp-archive/client/viewSelector/ViewSelector.tsx
@@ -38,6 +38,9 @@ export const ViewSelector = ({
     };
 
     const relevantViewVariants = getRelevantViewVariants(isWebpage, hasAttachment);
+    if (!relevantViewVariants.length || !selectedView) {
+        return null;
+    }
 
     if (relevantViewVariants.length === 0) {
         return null;

Original file line number	Diff line number	Diff line change
`@@ -11,6 +11,7 @@`
`11`	`11`
`12`	`12`	`:global(.navds-label) {`
`13`	`13`	`font-weight: var(--a-font-weight-regular);`
	`14`	`+ text-align: left;`
`14`	`15`	`}`
`15`	`16`
`16`	`17`	`:global(.navds-button__icon) {`