diff --git a/apps/data-norge/src/app/components/details/community-tab/index.tsx b/apps/data-norge/src/app/components/details/community-tab/index.tsx index 13cc5f4e..679051e4 100644 --- a/apps/data-norge/src/app/components/details/community-tab/index.tsx +++ b/apps/data-norge/src/app/components/details/community-tab/index.tsx @@ -6,7 +6,6 @@ import { ExternalLinkIcon } from '@navikt/aksel-icons'; import Badge from '@fdk-frontend/ui/badge'; import HStack from '@fdk-frontend/ui/hstack'; import VStack from '@fdk-frontend/ui/vstack'; -import { BrandDivider } from '@fdk-frontend/ui/divider'; import { Subtext } from '@fdk-frontend/ui/typography'; import styles from './community-tab.module.scss'; diff --git a/apps/data-norge/src/app/components/details/dataset-details/index.tsx b/apps/data-norge/src/app/components/details/dataset-details/index.tsx index 7fa1c98b..e4759fca 100644 --- a/apps/data-norge/src/app/components/details/dataset-details/index.tsx +++ b/apps/data-norge/src/app/components/details/dataset-details/index.tsx @@ -7,7 +7,7 @@ import ContactDetails from './components/contact-details'; import ContentDetails from './components/content-details'; import LegalDetails from './components/legal-details'; import ConceptDetails from './components/concept-details'; -import RelationDetails from './components/relation-details'; +// import RelationDetails from './components/relation-details'; import styles from './dataset-details.module.scss'; @@ -23,7 +23,7 @@ const DatasetDetails = ({ details }: any) => { const content = sections.find((s: any) => s.sectionTitle === 'Innhold'); const legal = sections.find((s: any) => s.sectionTitle === 'Lovhjemler'); const concept = sections.find((s: any) => s.sectionTitle === 'Begreper brukt i datasett'); - const relation = sections.find((s: any) => s.sectionTitle === 'Relasjoner til datasett'); + // const relation = sections.find((s: any) => s.sectionTitle === 'Relasjoner til datasett'); return ( @@ -51,7 +51,7 @@ const DatasetDetails = ({ details }: any) => { - + {/**/}
{ + switch (accessLevel) { + case 'open': return 'success'; + case 'limited': return 'warning'; + case 'restricted': return 'danger'; + default: return 'success'; + } + } + + const getLabelFromAccessLevel = (accessLevel: any) => { + switch (accessLevel) { + case 'open': return 'Åpne data'; + case 'limited': return 'Begrenset tilgang'; + case 'restricted': return 'Ikke-allmenn tilgang'; + default: return 'Åpne data'; + } + } + return (
- Skatteetaten + Digdir
- Inntektsmottakere API + data.altinn.no
- Ta i bruk + Bruk API
@@ -111,39 +148,43 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp -
-

- Tjenesten leverer en liste over inntektsmottakere der arbeidsgiver (opplysningspliktig), - via a-ordningen, har rapportert pensjonsavtale med pensjonsinnretningen som utfører - kallet. -

-
+ + Beskrivelse + +
+ Tjenesten leverer en liste over inntektsmottakere der arbeidsgiver (opplysningspliktig), + via a-ordningen, har rapportert pensjonsavtale med pensjonsinnretningen som utfører + kallet. +
- Endepunkter + Endepunkter 2
Endepunkt:
- - https://inntektsmottakere.api.skatteetaten-test.no/v1 + + https://api.data.altinn.no/v1
-
Endepunkt:
+
Endepunktbeskrivelse:
- - https://inntektsmottakere.api.skatteetaten.no/v1 + + https://api.data.altinn.no/v1/public/metadata/oas/json
-
Endepunktbeskrivelse:
+
Dokumentasjon:
- - Gå til spesifikasjon + + https://docs.data.altinn.no/
@@ -157,9 +198,49 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp
+ +
+ + {/*Relaterte datasett {relatedDatasets.length}*/} + Tilgjengeliggjør datasett + + + + {relatedDatasets.map(dataset => ( + + + + + + ))} + +
+ {dataset.name} + + + {dataset.publisher} + + + + {getLabelFromAccessLevel(dataset.accessLevel)} + +
+
+ + Endepunkter +
Endepunkt:
@@ -212,7 +293,7 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp level={4} size='xxsmall' > - Bruk av datasettet + Generelt
Utgiver:
diff --git a/apps/data-norge/src/app/components/details/details-page/datasett-worstcase/index.tsx b/apps/data-norge/src/app/components/details/details-page/datasett-worstcase/index.tsx index c0c36e80..1b178785 100644 --- a/apps/data-norge/src/app/components/details/details-page/datasett-worstcase/index.tsx +++ b/apps/data-norge/src/app/components/details/details-page/datasett-worstcase/index.tsx @@ -7,6 +7,7 @@ import { type Dictionary, type LocaleCodes } from '@fdk-frontend/dictionaries'; import Breadcrumbs from '@fdk-frontend/ui/breadcrumbs'; import Badge from '@fdk-frontend/ui/badge'; +import { BrandDivider } from '@fdk-frontend/ui/divider'; import StarButton from '@fdk-frontend/ui/star-button'; import { Heading, @@ -97,8 +98,8 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp blink(); }} > - Last ned - {/*Be om tilgang*/} + {/* Last ned*/} + Bruk datasett
@@ -148,7 +149,7 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp Oversikt - Distribusjoner 1 + Distribusjoner og API 1 Detaljer @@ -257,13 +258,13 @@ Formål: Data fra smilefjestilsyn gir en samlet oversikt over alle serveringsste
-
+
- Andre så også på + Relaterte datasett diff --git a/apps/data-norge/src/app/components/details/details-page/index.tsx b/apps/data-norge/src/app/components/details/details-page/index.tsx index 32ad34e9..7912c317 100644 --- a/apps/data-norge/src/app/components/details/details-page/index.tsx +++ b/apps/data-norge/src/app/components/details/details-page/index.tsx @@ -21,7 +21,7 @@ import { TabContent, Paragraph, } from '@digdir/designsystemet-react'; -import { DownloadIcon } from '@navikt/aksel-icons'; +// import { DownloadIcon } from '@navikt/aksel-icons'; import Distributions, { type Distribution } from '../distributions'; import DatasetDescription from '../dataset-description'; @@ -85,14 +85,15 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp }, ]; - const apis: Distribution[] = [ + const apis: any[] = [ { - title: 'Transportsystem API', - tags: ['csv', 'json', 'xml', 'yaml'], - description: 'API i formatene JSON, XML, CSV og YAML. Komplett nedlasting som CSV', - accessUrl: 'https://hotell.difi.no/?dataset=npd/survey/last-updates', - downloadUrl: 'https://hotell.difi.no/download/npd/survey/last-updates?download', - }, + title: 'data.altinn.no', + tags: ['json'], + description: 'Api for å benytte tjenester på data.altinn.no. Tilgang krever både autentisert virksomhet (maskinporten) og api-nøkkel som kan fås på data.altinn.no', + endpoint: 'https://api.data.altinn.no/v1', + endpointSpec: 'https://api.data.altinn.no/v1/public/metadata/oas/json', + documentation: 'https://docs.data.altinn.no/' + } ]; return ( @@ -125,7 +126,8 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp blink(); }} > - Last ned + {/* Last ned*/} + Bruk datasett @@ -175,7 +177,7 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp Oversikt - Distribusjoner 4 + Distribusjoner og API {[...datasets, ...exampleData, ...apis].length} Detaljer @@ -222,6 +224,8 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er
@@ -231,7 +235,7 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er level={4} size='xxsmall' > - Andre så også på + Relaterte datasett
@@ -319,7 +323,7 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er apis={apis} className={cn({ [styles.highlight]: highlight })} /> - + {/*
@@ -357,17 +356,12 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er
- - Åpne data - +
- - Åpne data - +
-
+
*/} diff --git a/apps/data-norge/src/app/components/details/distributions/distribution-content.tsx b/apps/data-norge/src/app/components/details/distributions/distribution-content.tsx index 1bcb5228..3726c390 100644 --- a/apps/data-norge/src/app/components/details/distributions/distribution-content.tsx +++ b/apps/data-norge/src/app/components/details/distributions/distribution-content.tsx @@ -2,7 +2,6 @@ import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'; import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism'; import { - Button, Heading, Link, Table, @@ -40,7 +39,8 @@ const SimpleContent = () => {
API:
- Transportsystem API + https://api.data.altinn.no/v1 + {/*
*/} @@ -75,7 +75,7 @@ const ExampleContent = () => { ); } -const APIContent = () => { +const APIContent = ({ api }: any) => { return ( <>
@@ -83,14 +83,16 @@ const APIContent = () => {

- Tjenesten leverer en liste over inntektsmottakere der arbeidsgiver (opplysningspliktig), via a-ordningen, har rapportert pensjonsavtale med pensjonsinnretningen som utfører kallet. + {api.description}

Endepunkt:
-
https://inntektsmottakere.api.skatteetaten-test.no/v1
+
{api.endpoint}
Endepunktbeskrivelse:
-
Gå til spesifikasjon
+
{api.endpointSpec}
+
Dokumentasjon:
+
{api.documentation}
); diff --git a/apps/data-norge/src/app/components/details/distributions/index.tsx b/apps/data-norge/src/app/components/details/distributions/index.tsx index b06dc321..5fcaab05 100644 --- a/apps/data-norge/src/app/components/details/distributions/index.tsx +++ b/apps/data-norge/src/app/components/details/distributions/index.tsx @@ -6,9 +6,10 @@ import { Accordion, Heading, Button, Link, Tag } from '@digdir/designsystemet-re import { DownloadIcon, ArrowRightIcon } from '@navikt/aksel-icons'; import Badge from '@fdk-frontend/ui/badge'; import HStack from '@fdk-frontend/ui/hstack'; +import PlaceholderBox from '../placeholder-box'; import styles from './distributions.module.scss'; -import { RichContent, SimpleContent, ExampleContent, APIContent } from './distribution-content'; +import { SimpleContent, APIContent } from './distribution-content'; export type Distribution = { title: string; @@ -21,11 +22,11 @@ export type Distribution = { export type DistributionsProps = { datasets: Distribution[]; exampleData?: Distribution[]; - apis?: Distribution[]; + apis?: any[]; className?: string; }; -const Distributions = ({ exampleData, datasets, apis, className }: DistributionsProps) => { +const Distributions = ({ exampleData = [], datasets, apis = [], className }: DistributionsProps) => { return (
-
Datasett
- {datasets.length} +
Distribusjoner
+ {[...datasets, ...exampleData].length}
@@ -73,6 +74,62 @@ const Distributions = ({ exampleData, datasets, apis, className }: Distributions Last ned + {/*Gå til datasett*/} + {/**/} + + +
+
+ + + + + + ))} + {exampleData.map((distribution, index) => ( + + +
+ + {distribution.title} +
+ + Eksempeldata + + {distribution.tags.map((tag) => ( + + {tag} + + ))} +
+
+
+
@@ -84,7 +141,7 @@ const Distributions = ({ exampleData, datasets, apis, className }: Distributions ))} - {exampleData && exampleData.length && ( + {/*exampleData && exampleData.length && ( <> - )} - {apis && apis.length && ( - <> - - -
API-er
- {apis.length} -
-
- - {apis.map((distribution, index) => ( - - -
- - {distribution.title} -
- {distribution.tags.map((tag) => ( - - {tag} - - ))} -
-
-
- + )*/} + + +
API-er som tilgjengeliggjør dette datasettet
+ {apis.length} +
+
+ { + apis && apis.length ? + + {apis.map((api, index) => ( + + +
+ + {api.title} +
+ {api.tags.map((tag: string) => ( + + {tag} + + ))}
+
+
+
- - - - - - ))} - - - )} +
+
+ + + +
+ ))} +
: + + Ingen registrerte API-er tilgjengeliggjør dette datasettet. + + }
); }; diff --git a/libs/ui/src/lib/core/table.scss b/libs/ui/src/lib/core/table.scss index a4a551d3..0d393023 100644 --- a/libs/ui/src/lib/core/table.scss +++ b/libs/ui/src/lib/core/table.scss @@ -7,6 +7,7 @@ padding: 0.75rem 0.75rem; border-top: 1px solid #eee; border-bottom: 1px solid #eee; + vertical-align: middle; } tr { diff --git a/libs/ui/src/lib/divider/index.tsx b/libs/ui/src/lib/divider/index.tsx index d83d3fd7..6bbc759c 100644 --- a/libs/ui/src/lib/divider/index.tsx +++ b/libs/ui/src/lib/divider/index.tsx @@ -1,7 +1,8 @@ +import React from 'react'; import cn from 'classnames'; import styles from './divider.module.scss'; -const BrandDivider = ({ className, ...props }) => { +const BrandDivider = ({ className, ...props }: React.HTMLAttributes) => { return (
); diff --git a/libs/ui/src/lib/hstack/index.tsx b/libs/ui/src/lib/hstack/index.tsx index 9fadf2fa..9bcce196 100644 --- a/libs/ui/src/lib/hstack/index.tsx +++ b/libs/ui/src/lib/hstack/index.tsx @@ -1,8 +1,8 @@ -import { PropsWithChildren } from 'react'; +import React, { PropsWithChildren } from 'react'; import styles from './hstack.module.scss'; -const HStack = ({ children, ...props }: PropsWithChildren) => { +const HStack = ({ children, ...props }: PropsWithChildren & React.HTMLAttributes) => { return
{children}
; }; diff --git a/libs/ui/src/lib/typography/index.tsx b/libs/ui/src/lib/typography/index.tsx index 3036aeff..72c2cd80 100644 --- a/libs/ui/src/lib/typography/index.tsx +++ b/libs/ui/src/lib/typography/index.tsx @@ -1,4 +1,4 @@ -import { PropsWithChildren } from 'react'; +import React, { PropsWithChildren } from 'react'; import cn from 'classnames'; import { Heading, HeadingProps } from '@digdir/designsystemet-react'; @@ -13,7 +13,7 @@ const HeadingWithDivider = ({ children, className, ...rest }: HeadingProps) => ( ); -const Subtext = ({ className, ...props }: PropsWithChildren) => ( +const Subtext = ({ className, ...props }: React.HTMLAttributes) => ( );