Feilkort med dynamisk haster tag, og felles interface.ts fil

This commit is contained in:
Markus Johansen 2023-07-19 17:10:50 +02:00
parent 6906609bf5
commit f40c345bd3
3 changed files with 34 additions and 22 deletions

View file

@ -1,35 +1,35 @@
import FeilCard from "./FeilCard"
type FeilMelding = {
tittel: String
beskrivelse: String
}
/**
*
* @returns Komponent for returnering av konteiner med alle feilinnmeldingene.
*/
const CardsContainer = () => {
const feilMeldinger: FeilMelding[] = [
const feilMeldinger: Feilmelding[] = [
{
tittel: "Mangel på hensyn til tariffoppgjør",
beskrivelse: "Det har vært ett tariffoppgjør og speil sier sykepengene må tilbakekreves, noe som er feil. (sier vi.. har ikke domenekunnskap)"
beskrivelse: "Det har vært ett tariffoppgjør og speil sier sykepengene må tilbakekreves, noe som er feil. (sier vi.. har ikke domenekunnskap)",
haster: false
},
{
tittel: "Speil sier NAV må tilbakekreve sykepenger på feil grunnlag",
beskrivelse: "baluba"
beskrivelse: "baluba",
haster: true
},
{
tittel: "Feil A",
beskrivelse: "Lorem Ipsum"
beskrivelse: "Lorem Ipsum",
haster: false
},
{
tittel: "Feil B",
beskrivelse: "dolor"
beskrivelse: "dolor",
haster: false
},
{
tittel: "Håndkle på hue",
beskrivelse: "Bombastic side eye"
beskrivelse: "Bombastic side eye",
haster: true
}
]
@ -37,7 +37,12 @@ const CardsContainer = () => {
<div>
<div className="grid grid-cols-2 gap-4">
{feilMeldinger.map((feilMelding) => (
<FeilCard key={feilMelding.toString()} tittel={feilMelding.tittel} beskrivelse={feilMelding.beskrivelse}/>
<FeilCard
key={feilMeldinger.indexOf(feilMelding)}
tittel={feilMelding.tittel}
beskrivelse={feilMelding.beskrivelse}
haster={feilMelding.haster}
/>
))}
</div>
</div>

View file

@ -1,24 +1,21 @@
import "@navikt/ds-css";
import { ExpansionCard, Tag } from "@navikt/ds-react";
interface feilmeldingInterface {
tittel: String,
beskrivelse: String
interface TagBarInterface {
haster: boolean
}
const TagBar = () => {
//typen på status er veldig wack heheheh, må fjerne any etterhvert men String fungerer ikke
const TagBar = (props: TagBarInterface) => {
return (
<div className="flex gap-8 mt-4">
<Tag variant="info">Jobbes med</Tag>
<div className="flex gap-2">
<Tag variant="neutral">Spleiselaget</Tag>
<Tag variant="warning">Haster</Tag>
</div>
{props.haster === true ? <Tag variant="warning">Haster</Tag> : <></>}
</div>
)
}
const FeilCard = (props: feilmeldingInterface) => {
const FeilCard = (props: Feilmelding) => {
return (
<ExpansionCard aria-label="tekst">
<ExpansionCard.Header>
@ -26,7 +23,7 @@ const FeilCard = (props: feilmeldingInterface) => {
<ExpansionCard.Description>
{props.beskrivelse}
</ExpansionCard.Description>
<TagBar />
<TagBar haster={props.haster}/>
</ExpansionCard.Header>
<ExpansionCard.Content>
Hællæ

10
frontend/src/interface.ts Normal file
View file

@ -0,0 +1,10 @@
/*
* I denne filen kan vi legge interfaces som skal brukes over flere steder!
*/
interface Feilmelding {
tittel: String,
beskrivelse: String
haster: boolean
}