diff --git a/aksel.nav.no/website/components/layout/WithSidebar.tsx b/aksel.nav.no/website/components/layout/WithSidebar.tsx index 9a978fb022..8ee6eeaf44 100644 --- a/aksel.nav.no/website/components/layout/WithSidebar.tsx +++ b/aksel.nav.no/website/components/layout/WithSidebar.tsx @@ -75,7 +75,7 @@ export const WithSidebar = ({ <>
-
+
-
-
- {variant === "page" && pageProps?.kategori && ( - - - - {capitalize(pageType.type)} - - {" "} - / {capitalize(pageProps.kategori)} - +
+
+
+ {variant === "page" && pageProps?.kategori && ( + + + + {capitalize(pageType.type)} + + {" "} + / {capitalize(pageProps.kategori)} + + )} - - {pageType.title} - -
- {intro && intro} + + {pageType.title} + +
+ {intro && intro} +
+ {variant === "page" && pageProps.status?.bilde && ( + + )} + {variant === "landingPage" && ( +
+ +
+ )}
- {variant === "page" && pageProps.status?.bilde && ( - - )} - {variant === "landingPage" && ( -
- -
- )}
{withToc && ( diff --git a/aksel.nav.no/website/components/sanity-modules/cards/ArtikkelCard.tsx b/aksel.nav.no/website/components/sanity-modules/cards/ArtikkelCard.tsx index e40000ae39..b37c08b424 100644 --- a/aksel.nav.no/website/components/sanity-modules/cards/ArtikkelCard.tsx +++ b/aksel.nav.no/website/components/sanity-modules/cards/ArtikkelCard.tsx @@ -1,14 +1,15 @@ import { withErrorBoundary } from "@/error-boundary"; import { + AkselGodPraksisDocT, ResolveContributorsSingleT, - ResolveTemaT, ResolveSlugT, - AkselGodPraksisDocT, + ResolveTemaT, } from "@/types"; import { BodyShort, Detail, Heading } from "@navikt/ds-react"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; import NextLink from "next/link"; -import { abbrName, dateStr, logNav } from "../.."; +import { abbrName, logNav } from "../.."; const ArtikkelCard = ({ slug, @@ -25,11 +26,9 @@ const ArtikkelCard = ({ }: ResolveContributorsSingleT< ResolveTemaT> > & { source: string; variant: string; level?: "2" | "3" }) => { - const date = (rest as any)?.updateInfo?.lastVerified - ? (rest as any)?.updateInfo?.lastVerified - : publishedAt - ? publishedAt - : _updatedAt; + const date = useFormatedDate( + (rest as any)?.updateInfo?.lastVerified ?? publishedAt ?? _updatedAt + ); return (
@@ -70,7 +69,7 @@ const ArtikkelCard = ({ )} - {dateStr(date)} + {date} ) : ( diff --git a/aksel.nav.no/website/components/sanity-modules/cards/BloggCard.tsx b/aksel.nav.no/website/components/sanity-modules/cards/BloggCard.tsx index bae9670c7e..9b951f91cb 100644 --- a/aksel.nav.no/website/components/sanity-modules/cards/BloggCard.tsx +++ b/aksel.nav.no/website/components/sanity-modules/cards/BloggCard.tsx @@ -1,15 +1,16 @@ import { withErrorBoundary } from "@/error-boundary"; import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types"; import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; -import { getAuthors } from "components/website-modules/LatestBloggs"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; import NextLink from "next/link"; -import { dateStr, logNav } from "../.."; +import { getAuthors, logNav } from "@/utils"; const BloggCard = ({ blog, }: { blog: ResolveContributorsT>; }) => { + const date = useFormatedDate(blog?.publishedAt ?? blog._createdAt); return (
  • {getAuthors(blog)[0]} - {dateStr(blog?.publishedAt ?? blog._createdAt)} + {date} )}
    • diff --git a/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Card.tsx b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Card.tsx index 59536f315a..6907fc4892 100644 --- a/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Card.tsx +++ b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Card.tsx @@ -1,13 +1,14 @@ -import { abbrName, dateStr } from "@/utils"; +import { withErrorBoundary } from "@/error-boundary"; +import { urlFor } from "@/sanity/interface"; +import { abbrName } from "@/utils"; import { BodyShort, Detail, Heading } from "@navikt/ds-react"; +import cl from "clsx"; import { logNav } from "components/website-modules/utils/amplitude"; -import NextLink from "next/link"; +import { getImage } from "components/website-modules/utils/get-image"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; import NextImage from "next/legacy/image"; +import NextLink from "next/link"; import { Tag } from "./Tag"; -import cl from "clsx"; -import { getImage } from "components/website-modules/utils/get-image"; -import { urlFor } from "@/sanity/interface"; -import { withErrorBoundary } from "@/error-boundary"; export type ArticleT = { _key: string; @@ -37,7 +38,7 @@ const Card = ({ visible: boolean; index: number; }) => { - const date = article.publishedAt ? article.publishedAt : article._updatedAt; + const date = useFormatedDate(article.publishedAt ?? article._updatedAt); const showFooter = ["aksel_artikkel", "aksel_blogg"].includes(article._type); const showImage = [ @@ -142,7 +143,7 @@ const Card = ({ {abbrName(article?.contributors[0]?.title)} )} - {dateStr(date)} + {date} )}
    diff --git a/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Highlight.tsx b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Highlight.tsx new file mode 100644 index 0000000000..baa4f15d32 --- /dev/null +++ b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Highlight.tsx @@ -0,0 +1,111 @@ +import { urlFor } from "@/sanity/interface"; +import { getAuthors, logNav } from "@/utils"; +import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; +import cl from "clsx"; +import { getImage } from "components/website-modules/utils/get-image"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; +import Image from "next/legacy/image"; +import NextLink from "next/link"; +import { ArticleT } from "./Card"; +import { Tag } from "./Tag"; + +export const Highlight = ({ + article, + compact, +}: { + article: ArticleT; + compact: boolean; +}) => { + const showFooter = ["aksel_artikkel", "aksel_blogg"].includes(article._type); + const useStatusImage = + ["ds_artikkel", "komponent_artikkel"].includes(article._type) && + article.status?.bilde; + + const date = useFormatedDate(article?.publishedAt ?? article._createdAt); + + return ( +
    +
    + {useStatusImage ? ( + + ) : article?.seo?.image ? ( + + ) : ( + + )} +
    +
    + + + + logNav( + "artikkel-kort", + window.location.pathname, + e.currentTarget.getAttribute("href") + ) + } + className="text-text-default mb-5 mt-2 no-underline hover:underline" + > + + {article?.heading} + + + + + {article?.ingress ?? article.seo?.meta} + + {showFooter && getAuthors(article as any).length > 0 && ( + + + {getAuthors(article as any)[0]} + + {date} + + )} +
    +
    + ); +}; diff --git a/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Latest.tsx b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Latest.tsx index 35bc9189a6..9ea71bc0a7 100644 --- a/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Latest.tsx +++ b/aksel.nav.no/website/components/sanity-modules/frontpage-blocks/Latest.tsx @@ -1,16 +1,10 @@ -import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; -import Masonry, { ResponsiveMasonry } from "react-responsive-masonry"; import { withErrorBoundary } from "@/error-boundary"; -import Image from "next/legacy/image"; -import NextLink from "next/link"; -import { getImage } from "components/website-modules/utils/get-image"; -import { getAuthors } from "components/website-modules/LatestBloggs"; -import { dateStr, logNav } from "@/utils"; -import { Tag } from "./Tag"; -import Card, { ArticleT } from "./Card"; +import { Heading } from "@navikt/ds-react"; import cl from "clsx"; -import { urlFor } from "@/sanity/interface"; import { useEffect, useRef, useState } from "react"; +import Masonry, { ResponsiveMasonry } from "react-responsive-masonry"; +import Card, { ArticleT } from "./Card"; +import { Highlight } from "./Highlight"; export type LatestT = { _type: "nytt_fra_aksel"; @@ -29,9 +23,12 @@ const Latest = ({ block }: { block: LatestT }) => { const section = useRef(null); useEffect(() => { - const observer = new IntersectionObserver(([entry]) => { - entry.isIntersecting && setIntersected(entry.isIntersecting); - }); + const observer = new IntersectionObserver( + ([entry]) => { + entry.isIntersecting && setIntersected(entry.isIntersecting); + }, + { rootMargin: "0px 0px 100px 0px" } + ); observer.observe(section.current); return () => observer.disconnect(); }, []); @@ -74,99 +71,9 @@ function Highlights({ highlights }: { highlights: ArticleT[] }) {
    - {highlights.map((x, idx) => { - const showFooter = ["aksel_artikkel", "aksel_blogg"].includes(x._type); - const useStatusImage = - ["ds_artikkel", "komponent_artikkel"].includes(x._type) && - x.status?.bilde; - return ( -
    -
    - {useStatusImage ? ( - - ) : x?.seo?.image ? ( - - ) : ( - - )} -
    -
    - - - - logNav( - "artikkel-kort", - window.location.pathname, - e.currentTarget.getAttribute("href") - ) - } - className="text-text-default mb-5 mt-2 no-underline hover:underline" - > - - {x?.heading} - - - - - {x?.ingress ?? x.seo?.meta} - - {showFooter && getAuthors(x as any).length > 0 && ( - - - {getAuthors(x as any)[0]} - - {dateStr(x?.publishedAt ?? x._createdAt)} - - )} -
    -
    - ); - })} + {highlights.map((x, idx) => ( + + ))}
    ); } diff --git a/aksel.nav.no/website/components/website-modules/LatestBloggs.tsx b/aksel.nav.no/website/components/website-modules/LatestBloggs.tsx deleted file mode 100644 index bdb1b8ef25..0000000000 --- a/aksel.nav.no/website/components/website-modules/LatestBloggs.tsx +++ /dev/null @@ -1,270 +0,0 @@ -import { SanityBlockContent } from "@/sanity-block"; -import { urlFor } from "@/sanity/interface"; -import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types"; -import { dateStr } from "@/utils"; -import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; -import { getImage } from "components/website-modules/utils/get-image"; -import Image from "next/legacy/image"; -import NextLink from "next/link"; - -export const getAuthors = ( - blog: ResolveContributorsT> -) => (blog?.contributors as any)?.map((x) => x?.title) ?? []; - -export const LatestBloggposts = ({ - bloggs, - title, - level = "1", - intro, -}: { - bloggs: ResolveContributorsT>[]; - title: string; - level?: "1" | "2"; - intro?: any[]; -}) => { - if (!bloggs || bloggs.length < 3) { - return null; - } - - return ( -
    - - {title} - - {intro && ( - - )} - {/* Desktop-view */} -
    -
    -
    - {bloggs[0]?.seo?.image ? ( - - ) : ( - - )} -
    - - - - {bloggs[0].heading} - - - - - {bloggs[0]?.ingress} - - {getAuthors(bloggs[0]).length > 0 && ( - - {getAuthors(bloggs[0])[0]} - - {dateStr(bloggs[0]?.publishedAt ?? bloggs[0]._createdAt)} - - - )} -
    -
    - {bloggs.slice(1, 3).map((blog) => ( -
    -
    - {blog?.seo?.image ? ( - - ) : ( - - )} -
    - -
    - - - - {blog.heading} - - - - - {blog?.ingress} - - {getAuthors(blog).length > 0 ? ( - - {getAuthors(blog)[0]} - {dateStr(blog?.publishedAt ?? blog._createdAt)} - - ) : ( - - {dateStr(blog?.publishedAt ?? blog._createdAt)} - - )} -
    -
    - ))} -
    -
    - - {/* Mobile view */} -
    -
    -
    - {bloggs[0]?.seo?.image ? ( - - ) : ( - - )} -
    - - - - {bloggs[0].heading} - - - - - {bloggs[0]?.ingress} - - {getAuthors(bloggs[0]).length > 0 && ( - - {getAuthors(bloggs[0])[0]} - - {dateStr(bloggs[0]?.publishedAt ?? bloggs[0]._createdAt)} - - - )} -
    -
    - {bloggs.slice(1, 3).map((blog) => ( -
    -
    - {blog?.seo?.image ? ( - - ) : ( - - )} -
    -
    - - - - {blog.heading} - - - - - {blog?.ingress} - - {getAuthors(blog).length > 0 ? ( - - {getAuthors(blog)[0]} - {dateStr(blog?.publishedAt ?? blog._createdAt)} - - ) : ( - - {dateStr(blog?.publishedAt ?? blog._createdAt)} - - )} -
    -
    - ))} -
    -
    -
    - ); -}; diff --git a/aksel.nav.no/website/components/website-modules/blogg-page/BloggList.tsx b/aksel.nav.no/website/components/website-modules/blogg-page/BloggList.tsx new file mode 100644 index 0000000000..31f150f3bc --- /dev/null +++ b/aksel.nav.no/website/components/website-modules/blogg-page/BloggList.tsx @@ -0,0 +1,117 @@ +import { urlFor } from "@/sanity/interface"; +import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types"; +import { getAuthors } from "@/utils"; +import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; +import { getImage } from "components/website-modules/utils/get-image"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; +import Image from "next/legacy/image"; +import NextLink from "next/link"; + +export const BloggList = ({ + blogg, +}: { + blogg: ResolveContributorsT>; +}) => { + const date = useFormatedDate(blogg?.publishedAt ?? blogg._createdAt); + return ( +
    +
    +
    + {blogg?.seo?.image ? ( + + ) : ( + + )} +
    + +
    + + + + {blogg.heading} + + + + + {blogg?.ingress} + + {getAuthors(blogg).length > 0 ? ( + + {getAuthors(blogg)[0]} + {date} + + ) : ( + + {date} + + )} +
    +
    +
    +
    + {blogg?.seo?.image ? ( + + ) : ( + + )} +
    +
    + + + + {blogg.heading} + + + + + {blogg?.ingress} + + {getAuthors(blogg).length > 0 ? ( + + {getAuthors(blogg)[0]} + {date} + + ) : ( + + {date} + + )} +
    +
    +
    + ); +}; diff --git a/aksel.nav.no/website/components/website-modules/blogg-page/HighlightedBlogg.tsx b/aksel.nav.no/website/components/website-modules/blogg-page/HighlightedBlogg.tsx new file mode 100644 index 0000000000..f73dac51d8 --- /dev/null +++ b/aksel.nav.no/website/components/website-modules/blogg-page/HighlightedBlogg.tsx @@ -0,0 +1,103 @@ +import { urlFor } from "@/sanity/interface"; +import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types"; +import { getAuthors } from "@/utils"; +import { BodyLong, BodyShort, Heading, Link } from "@navikt/ds-react"; +import { getImage } from "components/website-modules/utils/get-image"; +import { useFormatedDate } from "components/website-modules/utils/getDate"; +import Image from "next/legacy/image"; +import NextLink from "next/link"; + +export const HighlightedBlogg = ({ + blogg, +}: { + blogg: ResolveContributorsT>; +}) => { + const date = useFormatedDate(blogg?.publishedAt ?? blogg._createdAt); + return ( +
    +
    +
    + {blogg?.seo?.image ? ( + + ) : ( + + )} +
    + + + + {blogg.heading} + + + + + {blogg?.ingress} + + {getAuthors(blogg).length > 0 && ( + + {getAuthors(blogg)[0]} + {date} + + )} +
    + {/* Mobile view */} +
    +
    + {blogg?.seo?.image ? ( + + ) : ( + + )} +
    + + + + {blogg.heading} + + + + + {blogg?.ingress} + + {getAuthors(blogg).length > 0 && ( + + {getAuthors(blogg)[0]} + {date} + + )} +
    +
    + ); +}; diff --git a/aksel.nav.no/website/components/website-modules/blogg-page/index.tsx b/aksel.nav.no/website/components/website-modules/blogg-page/index.tsx new file mode 100644 index 0000000000..b2ebdae79e --- /dev/null +++ b/aksel.nav.no/website/components/website-modules/blogg-page/index.tsx @@ -0,0 +1,48 @@ +import { SanityBlockContent } from "@/sanity-block"; +import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types"; +import { Heading } from "@navikt/ds-react"; +import { BloggList } from "./BloggList"; +import { HighlightedBlogg } from "./HighlightedBlogg"; + +export const LatestBloggposts = ({ + bloggs, + title, + intro, +}: { + bloggs: ResolveContributorsT>[]; + title: string; + intro?: any[]; +}) => { + if (!bloggs || bloggs.length < 3) { + return null; + } + + return ( +
    + + {title} + + {intro && ( + + )} + {/* Desktop-view */} +
    + +
    + {bloggs.slice(1, 3).map((blogg) => ( + + ))} +
    +
    +
    + ); +}; diff --git a/aksel.nav.no/website/components/website-modules/icon-page/Page.tsx b/aksel.nav.no/website/components/website-modules/icon-page/Page.tsx index 85d5c47ed6..ce16f6b97c 100644 --- a/aksel.nav.no/website/components/website-modules/icon-page/Page.tsx +++ b/aksel.nav.no/website/components/website-modules/icon-page/Page.tsx @@ -126,7 +126,7 @@ export const IconPage = ({ name }: { name: string }) => { onSubmit={(e) => e.preventDefault()} className="flex h-fit w-full flex-wrap-reverse items-center gap-4 px-4 py-2" > -
    +
    setToggle(v as any)} @@ -137,7 +137,7 @@ export const IconPage = ({ name }: { name: string }) => { Fill
    -
    +
    { } }} className={cl( - "hover:bg-surface-hover bg-surface-default active:bg-surface-neutral-subtle-hover group relative grid aspect-square w-11 shrink-0 place-items-center rounded focus:outline-none focus:ring-2 focus:ring-blue-800", + "hover:bg-surface-hover bg-surface-default active:bg-surface-neutral-subtle-hover group relative grid aspect-square w-11 shrink-0 place-items-center rounded focus:outline-none focus:ring-blue-800 focus-visible:ring-2", { - "bg-surface-selected ring-border-alt-3 z-10 ring-1": + "from-surface-selected bg-surface-selected ring-border-alt-3 z-10 bg-gradient-to-br to-teal-50 ring-1": i.id === name, } )} diff --git a/aksel.nav.no/website/components/website-modules/icon-page/Sidebar.tsx b/aksel.nav.no/website/components/website-modules/icon-page/Sidebar.tsx index ca0c618468..9ce814781a 100644 --- a/aksel.nav.no/website/components/website-modules/icon-page/Sidebar.tsx +++ b/aksel.nav.no/website/components/website-modules/icon-page/Sidebar.tsx @@ -184,7 +184,7 @@ export const IconSidebar = ({ theme={undefined} > {({ tokens, getLineProps, getTokenProps }) => ( - 
    +              
                     {tokens.map((line, i) => (
                   
    
             {({ tokens, getLineProps, getTokenProps }) => (
-              
    +              
                     {tokens.map((line, i) => (
                   
     {
     expect(capitalize(str4)).toEqual("Teststr");
   });
 
-  test("dateStr", () => {
+  test("dateStr", async () => {
     const date = "2022-06-09T11:05:48Z";
     const date2 = "2021-03-02T12:05:48Z";
 
-    expect(dateStr(date)).toEqual("9. juni 2022");
-    expect(dateStr(date2)).toEqual("2. mars 2021");
+    expect(await dateStr(date)).toEqual("9. juni 2022");
+    expect(await dateStr(date2)).toEqual("2. mars 2021");
   });
 
   test("abbrName", () => {
diff --git a/aksel.nav.no/website/components/website-modules/utils/date-string.ts b/aksel.nav.no/website/components/website-modules/utils/date-string.ts
new file mode 100644
index 0000000000..db355ef768
--- /dev/null
+++ b/aksel.nav.no/website/components/website-modules/utils/date-string.ts
@@ -0,0 +1,5 @@
+export const dateStr = async (date: string) => {
+  const format = (await import("date-fns/format")).default;
+  const locale = (await import("date-fns/locale/nb")).default;
+  return format(new Date(date), "d. MMMM YYY", { locale: locale });
+};
diff --git a/aksel.nav.no/website/components/website-modules/utils/getDate.ts b/aksel.nav.no/website/components/website-modules/utils/getDate.ts
new file mode 100644
index 0000000000..ffd6f50f4e
--- /dev/null
+++ b/aksel.nav.no/website/components/website-modules/utils/getDate.ts
@@ -0,0 +1,12 @@
+import { dateStr } from "components/website-modules/utils/date-string";
+import { useEffect, useState } from "react";
+
+export const useFormatedDate = (date: string) => {
+  const [_date, setDate] = useState(null);
+
+  useEffect(() => {
+    const handleDate = async () => setDate(await dateStr(date));
+    handleDate();
+  }, [date]);
+  return _date;
+};
diff --git a/aksel.nav.no/website/components/website-modules/utils/index.ts b/aksel.nav.no/website/components/website-modules/utils/index.ts
index 9a61f62d09..8b974c3538 100644
--- a/aksel.nav.no/website/components/website-modules/utils/index.ts
+++ b/aksel.nav.no/website/components/website-modules/utils/index.ts
@@ -1,16 +1,10 @@
-import nbLocale from "date-fns/locale/nb";
-import { format } from "date-fns";
+import { AkselBloggDocT, ResolveContributorsT, ResolveSlugT } from "@/types";
 
 export * from "./util";
 export * from "./amplitude";
 export * from "./hooks";
 export * from "./contexts";
-
-export const dateStr = (date: string) =>
-  format(new Date(date), "d. MMMM YYY", { locale: nbLocale });
-
-export const dateTimeStr = (date: string) =>
-  format(new Date(date), "d-MM-YYY", { locale: nbLocale });
+export * from "./date-string";
 
 export const isNew = (date: string) => {
   const date1 = new Date(date);
@@ -32,3 +26,7 @@ export const abbrName = (name: string): string => {
     )
     .join(" ");
 };
+
+export const getAuthors = (
+  blog: ResolveContributorsT>
+) => (blog?.contributors as any)?.map((x) => x?.title) ?? [];
diff --git a/aksel.nav.no/website/pages/god-praksis/artikler/[slug].tsx b/aksel.nav.no/website/pages/god-praksis/artikler/[slug].tsx
index 6b601ee7e7..798799ed91 100644
--- a/aksel.nav.no/website/pages/god-praksis/artikler/[slug].tsx
+++ b/aksel.nav.no/website/pages/god-praksis/artikler/[slug].tsx
@@ -37,6 +37,8 @@ type PageProps = NextPageT<{
   page: ResolveContributorsT<
     ResolveTemaT>>
   >;
+  publishDate: string;
+  verifiedDate: string;
 }>;
 
 export const query = `{
@@ -99,13 +101,21 @@ export const getStaticProps = async ({
       preview,
       id: page?._id ?? "",
       title: page?.heading ?? "",
+      verifiedDate: await dateStr(
+        page?.updateInfo?.lastVerified ?? page.publishedAt ?? page._updatedAt
+      ),
+      publishDate: await dateStr(page?.publishedAt ?? page?._updatedAt),
     },
     notFound: !page && !preview,
     revalidate: 60,
   };
 };
 
-const Page = ({ page: data }: PageProps["props"]) => {
+const Page = ({
+  page: data,
+  publishDate,
+  verifiedDate,
+}: PageProps["props"]) => {
   if (!data) {
     return ;
   }
@@ -119,12 +129,6 @@ const Page = ({ page: data }: PageProps["props"]) => {
     return null;
   }
 
-  const date = data?.updateInfo?.lastVerified
-    ? data?.updateInfo?.lastVerified
-    : data?.publishedAt
-    ? data.publishedAt
-    : data._updatedAt;
-
   const authors = (data?.contributors as any)?.map((x) => x?.title) ?? [];
 
   const hasTema = "tema" in data && data.tema && data?.tema.length > 0;
@@ -227,7 +231,7 @@ const Page = ({ page: data }: PageProps["props"]) => {
 
               
    
                 
-                  {dateStr(date)}
+                  {verifiedDate}
                 
                 {authors?.length > 0 && (
                   <>
@@ -297,7 +301,7 @@ const Page = ({ page: data }: PageProps["props"]) => {
                     
                   )}
                   
-                    Publisert: {dateStr(data?.publishedAt ?? data?._updatedAt)}
+                    Publisert: {publishDate}
                   
                 
    
                 
    
diff --git a/aksel.nav.no/website/pages/grunnleggende/[...slug].tsx b/aksel.nav.no/website/pages/grunnleggende/[...slug].tsx
index 714d9b6f30..3bdbe01406 100644
--- a/aksel.nav.no/website/pages/grunnleggende/[...slug].tsx
+++ b/aksel.nav.no/website/pages/grunnleggende/[...slug].tsx
@@ -25,6 +25,7 @@ type PageProps = NextPageT<{
   sidebar: AkselSidebarT;
   seo: any;
   refs: ArticleListT;
+  publishDate: string;
 }>;
 
 export const query = `{
@@ -79,23 +80,18 @@ export const getStaticProps = async ({
       title: page?.heading ?? "",
       id: page?._id ?? "",
       refs: [],
+      publishDate: await dateStr(page._updatedAt),
     },
     notFound: !page && !preview,
     revalidate: 60,
   };
 };
 
-const Page = ({ page, sidebar, seo }: PageProps["props"]) => {
+const Page = ({ page, sidebar, seo, publishDate }: PageProps["props"]) => {
   if (!page) {
     return ;
   }
 
-  const date = page?.updateInfo?.lastVerified
-    ? page?.updateInfo?.lastVerified
-    : page?.publishedAt
-    ? page.publishedAt
-    : page._updatedAt;
-
   return (
     <>
       
@@ -131,7 +127,7 @@ const Page = ({ page, sidebar, seo }: PageProps["props"]) => {
         intro={
           
             
-            {`OPPDATERT ${dateStr(date)}`}
+            {`OPPDATERT ${publishDate}`}
           
         }
         pageProps={page}
diff --git a/aksel.nav.no/website/pages/komponenter/[...slug].tsx b/aksel.nav.no/website/pages/komponenter/[...slug].tsx
index e567da11bb..c68f40acba 100644
--- a/aksel.nav.no/website/pages/komponenter/[...slug].tsx
+++ b/aksel.nav.no/website/pages/komponenter/[...slug].tsx
@@ -67,6 +67,7 @@ type PageProps = NextPageT<{
   sidebar: AkselSidebarT;
   seo: any;
   refs: ArticleListT;
+  publishDate: string;
 }>;
 
 /**
@@ -148,25 +149,26 @@ export const getStaticProps = async ({
       preview,
       title: page?.heading ?? "",
       id: page?._id ?? "",
+      publishDate: await dateStr(page._updatedAt),
     },
     notFound: !page && !preview,
     revalidate: 60,
   };
 };
 
-const Page = ({ page, sidebar, refs, seo }: PageProps["props"]) => {
+const Page = ({
+  page,
+  sidebar,
+  refs,
+  seo,
+  publishDate,
+}: PageProps["props"]) => {
   if (!page) {
     return ;
   }
 
   const pack = page?.kodepakker?.length > 0 && kodepakker[page?.kodepakker[0]];
 
-  const date = page?.updateInfo?.lastVerified
-    ? page?.updateInfo?.lastVerified
-    : page?.publishedAt
-    ? page.publishedAt
-    : page._updatedAt;
-
   const tag =
     page?.status?.tag === "beta"
       ? "komponent-beta"
@@ -220,7 +222,7 @@ const Page = ({ page, sidebar, refs, seo }: PageProps["props"]) => {
           
             {internal && }
             
-            {`OPPDATERT ${dateStr(date)}`}
+            {`OPPDATERT ${publishDate}`}
           
         }
         footer={
diff --git a/aksel.nav.no/website/pages/prinsipper/[...prinsipp].tsx b/aksel.nav.no/website/pages/prinsipper/[...prinsipp].tsx
index c9f2ea49b8..9f6821583b 100644
--- a/aksel.nav.no/website/pages/prinsipper/[...prinsipp].tsx
+++ b/aksel.nav.no/website/pages/prinsipper/[...prinsipp].tsx
@@ -28,6 +28,7 @@ import { contributorsAll, destructureBlocks } from "@/sanity/queries";
 
 type PageProps = NextPageT<{
   prinsipp: ResolveContributorsT>;
+  publishDate: string;
 }>;
 
 export const query = `{
@@ -61,13 +62,14 @@ export const getServerSideProps: GetServerSideProps = async (
       preview: context.preview ?? false,
       id: prinsipp?._id,
       title: prinsipp?.heading ?? "",
+      publishDate: await dateStr(prinsipp?.publishedAt ?? prinsipp._createdAt),
     },
     notFound:
       (!prinsipp && !context.preview) || context.params.prinsipp.length > 2,
   };
 };
 
-const Page = ({ prinsipp: data }: PageProps["props"]) => {
+const Page = ({ prinsipp: data, publishDate }: PageProps["props"]) => {
   if (!data) {
     return ;
   }
@@ -155,7 +157,7 @@ const Page = ({ prinsipp: data }: PageProps["props"]) => {
                     as="span"
                     className="text-text-subtle "
                   >
-                    {dateStr(data?._updatedAt)}
+                    {publishDate}
                   
                   {authors?.length > 0 && (
                      {
                         
                       )}
                       
-                        Publisert:{" "}
-                        {dateStr(data?.publishedAt ?? data?._updatedAt)}
+                        Publisert: {publishDate}
                       
                     
    
                     
    
diff --git a/aksel.nav.no/website/pages/produktbloggen/[slug].tsx b/aksel.nav.no/website/pages/produktbloggen/[slug].tsx
index 859f57842b..2110c1d473 100644
--- a/aksel.nav.no/website/pages/produktbloggen/[slug].tsx
+++ b/aksel.nav.no/website/pages/produktbloggen/[slug].tsx
@@ -28,6 +28,7 @@ import { destructureBlocks, contributorsAll } from "@/sanity/queries";
 type PageProps = NextPageT<{
   blogg: ResolveContributorsT>;
   morePosts: ResolveContributorsT>[];
+  publishDate: string;
 }>;
 
 export const query = `{
@@ -66,12 +67,13 @@ export const getServerSideProps: GetServerSideProps = async (
       preview: context.preview ?? false,
       id: blogg?._id ?? "",
       title: blogg?.heading ?? "",
+      publishDate: await dateStr(blogg?.publishedAt ?? blogg._createdAt),
     },
     notFound: !blogg && !context.preview,
   };
 };
 
-const Page = ({ blogg, morePosts }: PageProps["props"]) => {
+const Page = ({ blogg, morePosts, publishDate }: PageProps["props"]) => {
   if (!blogg) {
     return ;
   }
@@ -100,10 +102,7 @@ const Page = ({ blogg, morePosts }: PageProps["props"]) => {
         {authors?.[0] && }
         
         
-        
+        
         
          {
       
    
         
    
           
    
@@ -144,7 +143,7 @@ const Page = ({ blogg, morePosts }: PageProps["props"]) => {
             )}
             
    
               
-                {dateStr(blogg?.publishedAt ?? blogg._createdAt)}
+                {publishDate}
               
               {authors?.[0] && (
                 <>
@@ -225,7 +224,7 @@ const Page = ({ blogg, morePosts }: PageProps["props"]) => {
               as="span"
               className="text-text-subtle flex justify-center"
             >
-              Publisert: {dateStr(blogg?.publishedAt ?? blogg?._updatedAt)}
+              Publisert: {publishDate}
             
           
    
           {morePosts && (
@@ -233,7 +232,7 @@ const Page = ({ blogg, morePosts }: PageProps["props"]) => {
               
                 Flere blogginnlegg
               
-              
      
+              
        
                 {morePosts.map((post) => (
                   
                 ))}
diff --git a/aksel.nav.no/website/pages/produktbloggen/index.tsx b/aksel.nav.no/website/pages/produktbloggen/index.tsx
index 4da30eee6b..0835b6aac5 100644
--- a/aksel.nav.no/website/pages/produktbloggen/index.tsx
+++ b/aksel.nav.no/website/pages/produktbloggen/index.tsx
@@ -12,7 +12,7 @@ import { Header } from "components/layout/header/Header";
 import BloggCard from "components/sanity-modules/cards/BloggCard";
 import { BloggAd } from "components/website-modules/BloggAd";
 import { AkselCubeStatic } from "components/website-modules/cube";
-import { LatestBloggposts } from "components/website-modules/LatestBloggs";
+import { LatestBloggposts } from "components/website-modules/blogg-page";
 import { PreviewSuspense } from "next-sanity/preview";
 import Head from "next/head";
 import { lazy } from "react";
@@ -119,7 +119,7 @@ const Page = (props: PageProps["props"]) => {
                 
                   Flere blogginnlegg
                 
-                
          
+                
            
                   {remainingPosts.map((blog) => (
                     
                   ))}