diff --git a/aksel.nav.no/website/package.json b/aksel.nav.no/website/package.json index e4bb2f74f1..0863453a54 100644 --- a/aksel.nav.no/website/package.json +++ b/aksel.nav.no/website/package.json @@ -34,12 +34,12 @@ "dependencies": { "@amplitude/analytics-browser": "^2.2.3", "@portabletext/react": "^3.0.11", - "@sanity/client": "^6.6.0", + "@sanity/client": "^6.8.6", "@sanity/code-input": "4.1.1", "@sanity/color-input": "^3.1.0", "@sanity/image-url": "1.0.2", "@sanity/table": "1.0.1", - "@sanity/vision": "3.18.0", + "@sanity/vision": "3.20.0", "boring-avatars": "1.10.1", "clsx": "^1.2.1", "codesandbox": "^2.2.3", @@ -57,9 +57,9 @@ "react-dom": "^18.0.0", "react-hotjar": "^6.1.0", "react-responsive-masonry": "^2.1.7", - "sanity": "3.18.0", - "sanity-plugin-asset-source-unsplash": "^1.1.1", - "sanity-plugin-media": "^2.2.2", + "sanity": "3.20.0", + "sanity-plugin-asset-source-unsplash": "^1.1.2", + "sanity-plugin-media": "^2.2.4", "sharp": "0.32.6", "styled-components": "^6.0.0", "swr": "^1.1.2", @@ -72,8 +72,8 @@ "@next/bundle-analyzer": "13.2.1", "@next/eslint-plugin-next": "13.2.1", "@playwright/test": "1.35.1", - "@sanity/block-tools": "^3.18.0", - "@sanity/schema": "^3.18.0", + "@sanity/block-tools": "^3.20.0", + "@sanity/schema": "^3.20.0", "@testing-library/jest-dom": "^5.16.0", "@testing-library/react": "^13.3.0", "@types/jest": "^29.0.0", diff --git a/aksel.nav.no/website/sanity/plugins/structure/FeedbackPreview.tsx b/aksel.nav.no/website/sanity/plugins/structure/FeedbackPreview.tsx deleted file mode 100644 index a00d7ccf7d..0000000000 --- a/aksel.nav.no/website/sanity/plugins/structure/FeedbackPreview.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import { Alert, BodyLong, Heading, Loader } from "@navikt/ds-react"; -import { - IntentButton, - Preview, - getPublishedId, - useClient, - useSchema, -} from "sanity"; -import useSWR from "swr"; - -export function FeedbackView(props) { - const { documentId } = props; - - const schema = useSchema(); - - const schemaType = schema.get("aksel_feedback"); - - const client = useClient({ apiVersion: "2021-06-07" }); - const { data, error, isValidating } = useSWR( - `*[_type == "aksel_feedback" && references($id)]`, - (query) => - client.fetch(query, { - id: documentId, - }) - ); - - if (isValidating) { - return ( -
-
- -
-
- ); - } - - if (error) { - return ( -
-
- En feil oppstod, prøv å laste side på nytt eller kontakt utvikler. -
-
- ); - } - - if (data.length === 0) { - return ( -
-
- Siden har ingen tilbakemeldinger enda. -
-
- ); - } - - const done = data.filter((x) => x?.behandlet === true); - const notDone = data.filter((x) => x?.behandlet === false); - - return ( -
-
- - Løsning for tilbakemeldinger på Aksel er midlertidig slått av. - -
- - Tilbakemeldinger - - {notDone.length === 0 && ( - Ingen nye tilbakemeldinger - )} -
    - {notDone.map((x) => ( -
  • - - - -
    • - ))} -
-
- {done.length > 0 && ( -
- - Ferdig behandet - -
    - {done.map((x) => ( -
  • - - - -
    • - ))} -
-
- )} -
-
- ); -} diff --git a/aksel.nav.no/website/sanity/plugins/structure/feedback.ts b/aksel.nav.no/website/sanity/plugins/structure/feedback.ts deleted file mode 100644 index badfec484e..0000000000 --- a/aksel.nav.no/website/sanity/plugins/structure/feedback.ts +++ /dev/null @@ -1,211 +0,0 @@ -import { - EyeClosedIcon, - EyeWithPupilIcon, - MinusIcon, - PresentationIcon, -} from "@navikt/aksel-icons"; -import { StructureBuilder } from "sanity/desk"; - -export const FeedbackPanes = async (getClient, S: StructureBuilder) => { - const fb = await getClient({ apiVersion: "2021-06-07" }).fetch( - `{ - "behandlet": count(*[_type == "aksel_feedback" && behandlet == true]), - "ubehandlet": count(*[_type == "aksel_feedback" && behandlet == false]), - "totalt-gp": count(*[_type == "aksel_feedback" && doc_ref->_type == "aksel_artikkel"]), - "totalt-comp": count(*[_type == "aksel_feedback" && doc_ref->_type == "komponent_artikkel"]), - "totalt-grunnleggende": count(*[_type == "aksel_feedback" && doc_ref->_type == "ds_artikkel"]), - "totalt-rest": count(*[_type == "aksel_feedback" && !(doc_ref->_type in ["ds_artikkel", "komponent_artikkel", "aksel_artikkel"])]), - "totalt-footer": count(*[_type == "aksel_feedback" && feedback_type == "footer"]), - "totalt-uu": count(*[_type == "aksel_feedback" && feedback_type == "uu_feedback"]), - "totalt-ja": count(*[_type == "aksel_feedback" && artikkel_feedback == "ja"]), - "totalt-nei": count(*[_type == "aksel_feedback" && artikkel_feedback == "nei"]), - "totalt-forslag": count(*[_type == "aksel_feedback" && artikkel_feedback == "forslag"]), - }` - ); - - /* const types = [...fb.ubehandlet, ...fb.behandlet]?.reduce((acc, curr) => { - return { - ...acc, - [curr._type]: acc[curr?._type] ? acc[curr._type] + 1 : 1, - }; - }, {}); - console.log(types); */ - - return [ - S.listItem() - .title(`Ubehandlet (${fb.ubehandlet})`) - .icon(EyeWithPupilIcon) - .child( - S.documentList() - .title(`Ubehandlet`) - .filter(`_type == "aksel_feedback" && behandlet == false`) - /* .menuItems([...S.documentTypeList("aksel_artikkel").getMenuItems()]) */ - ), - S.listItem() - .title(`God praksis`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && doc_ref->_type == "aksel_artikkel"` - ) - ), - S.listItem() - .title(`Komponentsider`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && doc_ref->_type == "komponent_artikkel"` - ) - ), - S.listItem() - .title(`Grunnleggende`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && doc_ref->_type == "ds_artikkel"` - ) - ), - S.listItem() - .title(`Andre sider`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && !(doc_ref->_type in ["ds_artikkel", "komponent_artikkel", "aksel_artikkel"])` - ) - ), - S.listItem() - .title(`Fant ikke det de lette etter`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && artikkel_feedback == "nei"` - ) - ), - S.listItem() - .title(`Footer`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && feedback_type == "footer"` - ) - ), - S.listItem() - .title(`UU-feedback`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && behandlet == false && feedback_type == "uu_feedback"` - ) - ), - S.divider(), - S.listItem() - .title(`Behandlet (${fb.behandlet})`) - .icon(EyeClosedIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && behandlet == true`) - ), - S.divider(), - S.listItem() - .title(`Alle tilbakemeldinger (${fb.ubehandlet + fb.behandlet})`) - .icon(PresentationIcon) - .child( - S.documentList().title(`Ubehandlet`).filter(`_type == "aksel_feedback"`) - ), - S.listItem() - .title(`God praksis totalt (${fb["totalt-gp"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && doc_ref->_type == "aksel_artikkel"` - ) - ), - S.listItem() - .title(`Komponentsider totalt (${fb["totalt-comp"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && doc_ref->_type == "komponent_artikkel"` - ) - ), - S.listItem() - .title(`Grunnleggende totalt (${fb["totalt-grunnleggende"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && doc_ref->_type == "ds_artikkel"` - ) - ), - S.listItem() - .title(`Andre sider totalt (${fb["totalt-rest"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter( - `_type == "aksel_feedback" && !(doc_ref->_type in ["ds_artikkel", "komponent_artikkel", "aksel_artikkel"])` - ) - ), - S.listItem() - .title(`Nei totalt (${fb["totalt-nei"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && artikkel_feedback == "nei"`) - ), - S.listItem() - .title(`Forslag totalt (${fb["totalt-forslag"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && artikkel_feedback == "forslag"`) - ), - S.listItem() - .title(`Ja totalt (${fb["totalt-ja"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && artikkel_feedback == "ja"`) - ), - S.listItem() - .title(`Footer totalt (${fb["totalt-footer"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && feedback_type == "footer"`) - ), - S.listItem() - .title(`UU-feedback totalt (${fb["totalt-uu"]})`) - .icon(MinusIcon) - .child( - S.documentList() - .title(`Behandlet`) - .filter(`_type == "aksel_feedback" && feedback_type == "uu_feedback"`) - ), - ]; -}; diff --git a/aksel.nav.no/website/sanity/plugins/structure/index.tsx b/aksel.nav.no/website/sanity/plugins/structure/index.tsx index 1cc325f482..617ed57936 100644 --- a/aksel.nav.no/website/sanity/plugins/structure/index.tsx +++ b/aksel.nav.no/website/sanity/plugins/structure/index.tsx @@ -11,7 +11,6 @@ import { import { Iframe } from "./IFrame"; import { - ChatIcon, CircleSlashIcon, ComponentIcon, FileTextIcon, @@ -23,10 +22,8 @@ import { TokenIcon, } from "@navikt/aksel-icons"; import differenceInMonths from "date-fns/differenceInMonths"; -import { FeedbackView } from "./FeedbackPreview"; -import { FeedbackPanes } from "./feedback"; import { GodPraksisPanes } from "./god-praksis"; -import { PanesWithCount } from "./with-count"; +import { Panes } from "./panes"; const isAfter = (date) => differenceInMonths(new Date(), new Date(date)) >= 6; @@ -76,11 +73,6 @@ export const structure = async ( ["developer"].includes(x.name) ); - const feedback = await getClient({ apiVersion: "2021-06-07" }).fetch( - `*[_type == "aksel_feedback" && $id in doc_ref->contributors[]->user_id.current]{_id, behandlet}`, - { id: currentUser?.id } - ); - let outdated = await getClient({ apiVersion: "2021-06-07" }).fetch( `*[$id in contributors[]->user_id.current]{_id, updateInfo}`, { id: currentUser?.id } @@ -112,64 +104,7 @@ export const structure = async ( ), ] : []), - ...(feedback.length > 0 - ? [ - S.listItem() - .title( - `Tilbakemeldinger (${ - feedback.filter( - (x) => !x._id.includes("draft") && x.behandlet === false - ).length - })` - ) - .icon(ChatIcon) - .child( - S.list() - .title("Tilbakemeldinger.") - .items([ - S.listItem() - .title( - `Nye tilbakemeldinger (${ - feedback.filter( - (x) => - !x._id.includes("draft") && x.behandlet === false - ).length - })` - ) - .child( - S.documentList() - .title(`Nye tilbakemeldinger`) - .filter( - `_type == 'aksel_feedback' && behandlet == false && _id in $ids` - ) - .params({ - ids: feedback.map((x) => x?._id), - }) - ), - S.listItem() - .title( - `Ferdig behandlet (${ - feedback.filter( - (x) => - !x._id.includes("draft") && x.behandlet === true - ).length - })` - ) - .child( - S.documentList() - .title("Ferdig") - .filter( - `_type == 'aksel_feedback' && behandlet == true && _id in $ids` - ) - .params({ - ids: feedback.map((x) => x?._id), - }) - ), - ]) - ), - S.divider(), - ] - : [S.divider()]), + ...(outdated.length > 0 || !!editor ? [S.divider()] : []), S.listItem() .title("God Praksis") .icon(PencilBoardIcon) @@ -227,12 +162,7 @@ export const structure = async ( .schemaType(`grunnleggende_landingsside`) .id(`grunnleggende_landingsside_id1`), S.divider(), - ...(await PanesWithCount( - "ds_artikkel", - grunnleggendeKategorier, - getClient, - S - )), + ...Panes("ds_artikkel", grunnleggendeKategorier, S), ]) ), S.listItem() @@ -247,12 +177,7 @@ export const structure = async ( .schemaType(`templates_landingsside`) .id(`templates_landingsside_id1`), S.divider(), - ...(await PanesWithCount( - "templates_artikkel", - templatesKategorier, - getClient, - S - )), + ...Panes("templates_artikkel", templatesKategorier, S), ]) ), S.listItem() @@ -267,12 +192,7 @@ export const structure = async ( .schemaType(`komponenter_landingsside`) .id(`komponenter_landingsside_id1`), S.divider(), - ...(await PanesWithCount( - "komponent_artikkel", - komponentKategorier, - getClient, - S - )), + ...Panes("komponent_artikkel", komponentKategorier, S), ]) ), S.listItem() @@ -287,12 +207,7 @@ export const structure = async ( .schemaType(`blogg_landingsside`) .id(`blogg_landingsside_id1`), S.divider(), - ...(await PanesWithCount( - "aksel_blogg", - [...bloggKategorier], - getClient, - S - )), + ...Panes("aksel_blogg", [...bloggKategorier], S), ]) ), ...(adminOrDev @@ -310,14 +225,6 @@ export const structure = async ( .schemaType(`aksel_forside`) .icon(ImageIcon) .id(`aksel_forside_dokument`), - S.listItem() - .title("Feedback") - .icon(ChatIcon) - .child( - S.list() - .title("Feedback") - .items([...(await FeedbackPanes(getClient, S))]) - ), S.listItem().title("Standalone-sider").child( S.documentList() @@ -442,7 +349,6 @@ export const defaultDocumentNode = (S, { schemaType }) => { url: (doc) => resolveProductionUrl(doc), }) .title("Forhåndsvisning"), - S.view.component(FeedbackView).icon(ChatIcon).title("Tilbakemeldinger"), ]); } if (schemaType === "aksel_forside") { diff --git a/aksel.nav.no/website/sanity/plugins/structure/with-count.ts b/aksel.nav.no/website/sanity/plugins/structure/panes.ts similarity index 54% rename from aksel.nav.no/website/sanity/plugins/structure/with-count.ts rename to aksel.nav.no/website/sanity/plugins/structure/panes.ts index c33384a779..fae66e8233 100644 --- a/aksel.nav.no/website/sanity/plugins/structure/with-count.ts +++ b/aksel.nav.no/website/sanity/plugins/structure/panes.ts @@ -1,34 +1,24 @@ import { FileXMarkIcon } from "@navikt/aksel-icons"; -/* documentStore is in Alpha, so avoid using for now */ -export const PanesWithCount = async ( +export const Panes = ( docType, categories: { title: string; value: string }[], - getClient, S ) => { - const ids = await getClient({ apiVersion: "2021-06-07" }).fetch( - `*[_type == $docType]{_id, kategori}`, - { docType } - ); - return [ ...categories.map(({ value, title }) => S.listItem() - .title( - `${title} (${ids.filter((x) => x?.kategori === value).length ?? 0})` - ) + .title(title) .child( S.documentList() .title(title) .schemaType(docType) .filter(`_type == $docType && $kat == kategori`) .params({ kat: value, docType }) - /* .menuItems([...S.documentTypeList(docType).getMenuItems()]) */ ) ), S.listItem() - .title(`Uten kategori (${ids.filter((x) => !x?.kategori).length ?? 0})`) + .title(`Uten kategori`) .icon(FileXMarkIcon) .child( S.documentList() @@ -36,7 +26,6 @@ export const PanesWithCount = async ( .schemaType(docType) .filter(`_type == $docType && !defined(kategori)`) .params({ docType }) - /* .menuItems([...S.documentTypeList(docType).getMenuItems()]) */ ), ]; }; diff --git a/aksel.nav.no/website/sanity/sanity.config.tsx b/aksel.nav.no/website/sanity/sanity.config.tsx index f07c2bb38e..9e157b34d9 100644 --- a/aksel.nav.no/website/sanity/sanity.config.tsx +++ b/aksel.nav.no/website/sanity/sanity.config.tsx @@ -1,4 +1,3 @@ -import { InputWithCounter } from "./schema/custom-components"; import { codeInput } from "@sanity/code-input"; import { colorInput } from "@sanity/color-input"; import { table } from "@sanity/table"; @@ -8,12 +7,13 @@ import { unsplashImageAsset } from "sanity-plugin-asset-source-unsplash"; import { media } from "sanity-plugin-media"; import { deskTool } from "sanity/desk"; import { defaultDocumentNode, publicationFlow, structure } from "./plugins"; +import { InputWithCounter } from "./schema/custom-components"; import { getTemplates } from "./util"; +import { DatabaseIcon, TestFlaskIcon } from "@navikt/aksel-icons"; import { allArticleDocuments } from "./config"; import { schema } from "./schema"; -import { DatabaseIcon, TestFlaskIcon } from "@navikt/aksel-icons"; const projectId = "hnbe3yhs"; @@ -49,11 +49,11 @@ function defaultConfig() { const name = props.schemaType?.name; if (name === "string" && props.schemaType?.options?.maxLength) { - return ; + return ; } if (name === "text" && props.schemaType?.options?.maxLength) { - return ; + return ; } return props.renderDefault(props); }, @@ -67,6 +67,9 @@ function defaultConfig() { ? [...getTemplates(prev), ...prev] : getTemplates(); }, + unstable_comments: { + enabled: true, + }, }, plugins: [ deskTool({ diff --git a/aksel.nav.no/website/sanity/schema/custom-components/EditorPage.tsx b/aksel.nav.no/website/sanity/schema/custom-components/EditorPage.tsx index 915fc112d8..68a25fe370 100644 --- a/aksel.nav.no/website/sanity/schema/custom-components/EditorPage.tsx +++ b/aksel.nav.no/website/sanity/schema/custom-components/EditorPage.tsx @@ -9,9 +9,9 @@ import { import { differenceInMonths } from "date-fns"; import React, { useMemo } from "react"; import { - getPublishedId, IntentButton, Preview, + getPublishedId, useClient, useCurrentUser, useFormValue, @@ -158,54 +158,6 @@ const DraftList = ({ data }: { data: any[] }) => { ); }; -const FeedbackList = ({ data, title }: { data: any[]; title: string }) => { - const schema = useSchema(); - - const list = useMemo( - () => - data.filter((x) => - title.startsWith("Ferdig") ? x.behandlet : !x.behandlet - ), - [data, title] - ); - - if (list.length === 0) { - return null; - } - - return ( - - {`${title} (${list.length ?? 0})`} - -
    - {list.map((x) => ( -
  • - - - -
    • - ))} -
- - - ); -}; - export const EditorPage = () => { const user = useCurrentUser(); const userId = useFormValue([`user_id`]) as { current?: string }; @@ -216,15 +168,6 @@ export const EditorPage = () => { (query) => client.fetch(query) ); - const { - data: fbData, - error: fbError, - isValidating: fbValidating, - } = useSWR( - `*[_type == "aksel_feedback" && $id in doc_ref->contributors[]->user_id.current]{_id, behandlet}`, - (query) => client.fetch(query, { id: userId.current }) - ); - if (error || !user) { return
Feilet lasting av bruker...
; } @@ -259,20 +202,7 @@ export const EditorPage = () => {

- {!fbError && !fbValidating && ( -
- - Tilbakemeldinger på artikler du er bidragsyter i ( - {fbData?.length ?? 0}) - - {fbData?.length > 0 && ( - - - - - )} -
- )} +
Under arbeid / må re-valideres diff --git a/aksel.nav.no/website/sanity/schema/custom-components/InputWithCounter.tsx b/aksel.nav.no/website/sanity/schema/custom-components/InputWithCounter.tsx index 6f7e4e5d01..f26278375c 100644 --- a/aksel.nav.no/website/sanity/schema/custom-components/InputWithCounter.tsx +++ b/aksel.nav.no/website/sanity/schema/custom-components/InputWithCounter.tsx @@ -1,42 +1,45 @@ -import { Textarea } from "@navikt/ds-react"; -import React, { useCallback } from "react"; -import { set, StringInputProps, TextInputProps, unset } from "sanity"; +import { Box, Detail, VStack } from "@navikt/ds-react"; +import cl from "clsx"; +import { StringInputProps, TextInputProps } from "sanity"; export function InputWithCounter( props: (StringInputProps | TextInputProps) & { size?: "medium" | "large"; } ) { - const { onChange, value = "", elementProps, schemaType } = props; + const { value, schemaType } = props; - //@ts-ignore - const maxLength = schemaType?.options?.maxLength - ? //@ts-ignore - schemaType?.options?.maxLength - : 60; - - const handleChange = useCallback( - (event: React.ChangeEvent) => - onChange( - event.currentTarget.value ? set(event.currentTarget.value) : unset() - ), - [onChange] + return ( + + {props.renderDefault(props)} + + ); +} - const hasError = - props.validationError && props.validation.find((x) => x.level === "error"); +function Counter({ + maxLength, + currentLength, +}: { + maxLength: number; + currentLength: number; +}) { + const difference = maxLength - currentLength; return ( -