Skip to content

Commit

Permalink
fix(details): distribution contents
Browse files Browse the repository at this point in the history
  • Loading branch information
@Lillebo
Lillebo committed Nov 22, 2024
1 parent 780c140 commit 05945f7
Show file tree
Hide file tree
Showing 9 changed files with 279 additions and 115 deletions.
10 changes: 10 additions & 0 deletions apps/data-norge/src/app/components/details/community-tab/community-tab.module.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
.notice {
margin-top:2rem;
}

.forumStats {
display:flex;
flex-direction:column;
text-align:center;
padding:0.5rem;
}
120 changes: 120 additions & 0 deletions apps/data-norge/src/app/components/details/community-tab/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
import { PropsWithChildren } from 'react';

import { Heading, Button, Link, Paragraph, Alert } from '@digdir/designsystemet-react';
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';

const CommunityTab = ({ children }: PropsWithChildren) => {
return (
<section className={styles.section}>
<Heading
level={4}
size='xxsmall'
>
<Button
variant='tertiary'
size='sm'
style={{float:'right',position:'relative',top:'-0.75rem'}}
>
Gå til Datalandsbyen
<ExternalLinkIcon />
</Button>
<HStack>
Diskusjoner på Datalandsbyen <Badge>2</Badge>
{/*<HelpText
title='Begrepsforklaring'
size='sm'
style={{ transform: 'scale(0.75)' }}
>
<Paragraph size='sm'>
Viser alle diskusjoner på Datalandsbyen hvor denne siden er tagget.
<Paragraph size='sm'>
<Link href='https://data.norge.no/specification/dcat-ap-no#Datasett-tilgangsniv%C3%A5'>
Les mer om Datalandsbyen her
</Link>
</Paragraph>
</Paragraph>
</HelpText>*/}
</HStack>
</Heading>
<table className='table'>
<tbody>
<tr>
<td>
<Link href='#'>Datasett Stort testdatasett 1, RAMSUND OG ROGNAN REVISJON <ExternalLinkIcon /></Link>
<div style={{marginTop:'0.25rem'}}><Subtext>posted by fdk-community-admin</Subtext></div>
</td>
<td align='right'>
<HStack style={{justifyContent:'flex-end'}}>
<div className={styles.forumStats}>
<span>7</span>
<Subtext>Stemmer</Subtext>
</div>
<div className={styles.forumStats}>
<span>12</span>
<Subtext>Innlegg</Subtext>
</div>
<div className={styles.forumStats}>
<span>16k</span>
<Subtext>Visninger</Subtext>
</div>
</HStack>
</td>
</tr>
<tr>
<td>
<Link href='#'>Datasett Stort testdatasett 1, RAMSUND OG ROGNAN REVISJON <ExternalLinkIcon /></Link>
<div style={{marginTop:'0.25rem'}}><Subtext>posted by fdk-community-admin</Subtext></div>
</td>
<td align='right'>
<HStack style={{justifyContent:'flex-end'}}>
<div className={styles.forumStats}>
<span>7</span>
<Subtext>Stemmer</Subtext>
</div>
<div className={styles.forumStats}>
<span>12</span>
<Subtext>Innlegg</Subtext>
</div>
<div className={styles.forumStats}>
<span>16k</span>
<Subtext>Visninger</Subtext>
</div>
</HStack>
</td>
</tr>
</tbody>
</table>
<Alert className={styles.notice}>
<VStack>
<Heading
level={4}
size='xxsmall'
>
Hva er Datalandsbyen?
</Heading>
<Paragraph size='sm'>
Datalandsbyen er vårt nettforum hvor du kan etterspørre data, dele erfaringer og spørre om råd som gjelder datadeling og informasjonsforvaltning.
</Paragraph>
<HStack>
<Button variant='secondary' size='sm' asChild>
<a href="https://datalandsbyen.norge.no/">Gå til Datalandsbyen <ExternalLinkIcon /></a>
</Button>
<Button variant='secondary' size='sm' asChild>
<a href="/docs/community">Mer informasjon</a>
</Button>
</HStack>
</VStack>
</Alert>
</section>
);
}

export default CommunityTab;
13 changes: 0 additions & 13 deletions apps/data-norge/src/app/components/details/details-page/details-page.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,6 @@
}
}

.forumStats {
display:flex;
flex-direction:column;
text-align:center;
// background:#f4f4f4;
padding:0.5rem;
}

.detailsPage {
margin: 0 2rem 3rem;
container-type: inline-size;
Expand Down Expand Up @@ -150,11 +142,6 @@
}

.divider {
border: none;
background: var(--fds-brand-alt3-600);
height: 4px;
border-radius: 3px;
width: 2.5rem;
margin: 3rem auto 2rem !important;
}

Expand Down
131 changes: 36 additions & 95 deletions apps/data-norge/src/app/components/details/details-page/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,11 @@ import { type Dictionary, type LocaleCodes } from '@fdk-frontend/dictionaries';

import Breadcrumbs from '@fdk-frontend/ui/breadcrumbs';
import Badge from '@fdk-frontend/ui/badge';
import HStack from '@fdk-frontend/ui/hstack';
import VStack from '@fdk-frontend/ui/vstack';
import { Subtext } from '@fdk-frontend/ui/typography';
import StarButton from '@fdk-frontend/ui/star-button';
import { BrandDivider } from '@fdk-frontend/ui/divider';
import {
Alert,
Heading,
Button,
Heading,
Link,
Tag,
HelpText,
Expand All @@ -24,14 +21,13 @@ import {
TabContent,
Paragraph,
} from '@digdir/designsystemet-react';
import { DownloadIcon, ExternalLinkIcon } from '@navikt/aksel-icons';
import { DownloadIcon } from '@navikt/aksel-icons';

import Distributions, { type Distribution } from '../distributions';
import DatasetDescription from '../dataset-description';
import DatasetDetails from '../dataset-details';
import MetadataPage from '../metadata-page';

import PlaceholderBox from '../placeholder-box';
import CommunityTab from '../community-tab';

import fullDetails from '../dataset-details/data/full.json';

Expand Down Expand Up @@ -91,7 +87,7 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp

const apis: Distribution[] = [
{
title: 'Endepunkt for webtjeneste',
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',
Expand Down Expand Up @@ -130,7 +126,6 @@ export default function DetailsPage({ locale, commonDictionary }: DetailsPageTyp
}}
>
<DownloadIcon fontSize='1.2em' /> Last ned
{/*Be om tilgang*/}
</Button>
</div>
</div>
Expand Down Expand Up @@ -230,7 +225,7 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er
className={cn({ [styles.highlight]: highlight })}
/>
</section>
<hr className={styles.divider} />
<BrandDivider className={styles.divider} />
<section className={styles.section}>
<Heading
level={4}
Expand Down Expand Up @@ -324,116 +319,62 @@ For datasettene *Vannforsyningssystem*, *Transportsystem*, og *Inntakspunkt* er
apis={apis}
className={cn({ [styles.highlight]: highlight })}
/>
</TabContent>
<TabContent value='detaljer'>
<DatasetDetails details={fullDetails} />
</TabContent>
<TabContent value='kommentarer'>
{/*<section className={styles.section}>
<Heading
level={4}
size='xxsmall'
>
Kommentarer <Badge>2</Badge>
</Heading>
<PlaceholderBox>
Hello
</PlaceholderBox>
</section>
<hr className={styles.divider} />
<BrandDivider className={styles.divider} />
<section className={styles.section}>
<Heading
level={4}
size='xxsmall'
>
Diskusjonstråder på Datalandsbyen hvor dette datasettet er nevnt
Relaterte APIer
</Heading>
<table className='table'>
<tbody>
<tr>
<td>
<Link href='#'>Datasett Stort testdatasett 1, RAMSUND OG ROGNAN REVISJON</Link>
<div style={{marginTop:'0.25rem'}}><Subtext>posted by fdk-community-admin</Subtext></div>
</td>
<td align='right'>
<HStack>
<HStack>0 Stemmer</HStack>
<HStack>0 Stemmer</HStack>
</HStack>
<Link href='#'>Transportsystem API</Link>
</td>
</tr>
</tbody>
</table>
</section>*/}
<section className={styles.section}>
<Heading
level={4}
size='xxsmall'
>
<Button
variant='tertiary'
size='sm'
style={{float:'right',position:'relative',top:'-0.75rem'}}
>
Gå til Datalandsbyen
<ExternalLinkIcon />
</Button>
Diskusjoner på Datalandsbyen <Badge>2</Badge>
</Heading>
<table className='table'>
<tbody>
<tr>
<td>
<Link href='#'>Datasett Stort testdatasett 1, RAMSUND OG ROGNAN REVISJON <ExternalLinkIcon /></Link>
<div style={{marginTop:'0.25rem'}}><Subtext>posted by fdk-community-admin</Subtext></div>
<span className={styles.relatedPublisher}>
Mattilsynet
</span>
</td>
<td align='right'>
<HStack style={{justifyContent:'flex-end'}}>
<div className={styles.forumStats}><span>7</span>Stemmer</div>
<div className={styles.forumStats}><span>12</span>Innlegg</div>
<div className={styles.forumStats}><span>16k</span>Visninger</div>
</HStack>
<Tag
color='success'
size='sm'
>
Åpne data
</Tag>
</td>
</tr>
<tr>
<td>
<Link href='#'>Datasett Stort testdatasett 1, RAMSUND OG ROGNAN REVISJON <ExternalLinkIcon /></Link>
<div style={{marginTop:'0.25rem'}}><Subtext>posted by fdk-community-admin</Subtext></div>
<Link href='#'>Trafikkdata 2024</Link>
</td>
<td>
<span className={styles.relatedPublisher}>
Vegvesenet
</span>
</td>
<td align='right'>
<HStack style={{justifyContent:'flex-end'}}>
<div className={styles.forumStats}><span>7</span>Stemmer</div>
<div className={styles.forumStats}><span>12</span>Innlegg</div>
<div className={styles.forumStats}><span>16k</span>Visninger</div>
</HStack>
<Tag
color='success'
size='sm'
>
Åpne data
</Tag>
</td>
</tr>
</tbody>
</table>
<hr className={styles.divider} />
<Alert>
<VStack>
<Heading
level={4}
size='xxsmall'
>
Hva er Datalandsbyen?
</Heading>
<Paragraph size='sm'>
Datalandsbyen er et nettforum hvor man kan etterspørre data, dele erfaringer og spørre om råd som gjelder datadeling og informasjonsforvaltning.
</Paragraph>
<HStack>
<Button variant='secondary' size='sm' asChild>
<a href="https://datalandsbyen.norge.no/">Gå til Datalandsbyen <ExternalLinkIcon /></a>
</Button>
<Button variant='secondary' size='sm' asChild>
<a href="/docs/community">Mer informasjon</a>
</Button>
</HStack>
</VStack>
</Alert>
</section>
</TabContent>
<TabContent value='detaljer'>
<DatasetDetails details={fullDetails} />
</TabContent>
<TabContent value='kommentarer'>
<CommunityTab />
</TabContent>
<TabContent value='metadata'>
<MetadataPage />
</TabContent>
Expand Down
Loading

0 comments on commit 05945f7

Please sign in to comment.