diff --git a/frontend/mulighetsrommet-api-client/src/index.ts b/frontend/mulighetsrommet-api-client/src/index.ts index 33aa4bc3c4..ae603e816a 100644 --- a/frontend/mulighetsrommet-api-client/src/index.ts +++ b/frontend/mulighetsrommet-api-client/src/index.ts @@ -1,15 +1,15 @@ /* istanbul ignore file */ /* tslint:disable */ /* eslint-disable */ -export { ApiError } from './core/ApiError'; -export { CancelablePromise, CancelError } from './core/CancelablePromise'; -export { OpenAPI } from './core/OpenAPI'; -export type { OpenAPIConfig } from './core/OpenAPI'; +export { ApiError } from "./core/ApiError"; +export { CancelablePromise, CancelError } from "./core/CancelablePromise"; +export { OpenAPI } from "./core/OpenAPI"; +export type { OpenAPIConfig } from "./core/OpenAPI"; -export type { Innsatsgruppe } from './models/Innsatsgruppe'; -export type { Tiltaksgjennomforing } from './models/Tiltaksgjennomforing'; -export { Tiltakskode } from './models/Tiltakskode'; -export type { Tiltakstype } from './models/Tiltakstype'; +export type { Innsatsgruppe } from "./models/Innsatsgruppe"; +export type { Tiltaksgjennomforing } from "./models/Tiltaksgjennomforing"; +export { Tiltakskode } from "./models/Tiltakskode"; +export type { Tiltakstype } from "./models/Tiltakstype"; -export { InternalService } from './services/InternalService'; -export { MulighetsrommetService } from './services/MulighetsrommetService'; +export { InternalService } from "./services/InternalService"; +export { MulighetsrommetService } from "./services/MulighetsrommetService"; diff --git a/frontend/mulighetsrommet-api-client/src/models/Arrangor.ts b/frontend/mulighetsrommet-api-client/src/models/Arrangor.ts new file mode 100644 index 0000000000..b39cfe29a3 --- /dev/null +++ b/frontend/mulighetsrommet-api-client/src/models/Arrangor.ts @@ -0,0 +1,11 @@ +/* istanbul ignore file */ +/* tslint:disable */ +/* eslint-disable */ + +export type Arrangor = { + _id: number; + selskapsnavn: string; + telefonnummer: string; + epost: string; + adresse: string; +}; diff --git a/frontend/mulighetsrommet-api-client/src/models/Tiltaksansvarlig.ts b/frontend/mulighetsrommet-api-client/src/models/Tiltaksansvarlig.ts new file mode 100644 index 0000000000..edc73c5d76 --- /dev/null +++ b/frontend/mulighetsrommet-api-client/src/models/Tiltaksansvarlig.ts @@ -0,0 +1,11 @@ +/* istanbul ignore file */ +/* tslint:disable */ +/* eslint-disable */ + +export type Tiltaksansvarlig = { + _id: number; + navn: string; + enhet: string; + telefonnummer: string; + epost: string; +}; diff --git a/frontend/mulighetsrommet-api-client/src/models/Tiltaksgjennomforing.ts b/frontend/mulighetsrommet-api-client/src/models/Tiltaksgjennomforing.ts index 5d992fd4d9..998528b393 100644 --- a/frontend/mulighetsrommet-api-client/src/models/Tiltaksgjennomforing.ts +++ b/frontend/mulighetsrommet-api-client/src/models/Tiltaksgjennomforing.ts @@ -2,14 +2,28 @@ /* tslint:disable */ /* eslint-disable */ -import type { Tiltakskode } from './Tiltakskode'; +import { Tiltakstype } from "./Tiltakstype"; +import { Arrangor } from "./Arrangor"; +import { Tiltaksansvarlig } from "./Tiltaksansvarlig"; export type Tiltaksgjennomforing = { - id: number; - tittel: string; - beskrivelse: string; - tiltakskode: Tiltakskode; - tiltaksnummer?: string; - fraDato: string | null; - tilDato: string | null; + _id: number; + tiltakstype: Tiltakstype; + tiltaksgjennomforingNavn: string; + beskrivelse?: string; + tiltaksnummer: number; + kontaktinfoArrangor: Arrangor; + lokasjon: string; + enheter: { fylke: string }; + oppstart: string; + oppstartsdato?: Date; + faneinnhold?: { + forHvemInfoboks?: string; + forHvem?: object; + detaljerOgInnholdInfoboks?: string; + detaljerOgInnhold?: object; + pameldingOgVarighetInfoboks?: string; + pameldingOgVarighet?: object; + }; + kontaktinfoTiltaksansvarlig: Tiltaksansvarlig; }; diff --git a/frontend/mulighetsrommet-api-client/src/models/Tiltakstype.ts b/frontend/mulighetsrommet-api-client/src/models/Tiltakstype.ts index 05d585fe80..8d2ed7df5a 100644 --- a/frontend/mulighetsrommet-api-client/src/models/Tiltakstype.ts +++ b/frontend/mulighetsrommet-api-client/src/models/Tiltakstype.ts @@ -2,14 +2,22 @@ /* tslint:disable */ /* eslint-disable */ -import type { Tiltakskode } from './Tiltakskode'; - export type Tiltakstype = { - id: number; - innsatsgruppe: number | null; - sanityId: number | null; - navn: string; - tiltakskode: Tiltakskode; - fraDato: string | null; - tilDato: string | null; + _id: number; + tiltakstypeNavn: string; + beskrivelse?: string; + innsatsgruppe: string; + varighet?: string; + regelverkFil?: string; //skal være fil + regelverkFilNavn?: string; + regelverkLenke?: string; + regelverkLenkeNavn?: string; + faneinnhold?: { + forHvemInfoboks?: string; + forHvem?: object; + detaljerOgInnholdInfoboks?: string; + detaljerOgInnhold?: object; + pameldingOgVarighetInfoboks?: string; + pameldingOgVarighet?: object; + }; }; diff --git a/frontend/mulighetsrommet-cms/schemas/schema.js b/frontend/mulighetsrommet-cms/schemas/schema.js index 795166a783..319dbc5175 100644 --- a/frontend/mulighetsrommet-cms/schemas/schema.js +++ b/frontend/mulighetsrommet-cms/schemas/schema.js @@ -1,21 +1,13 @@ -// First, we must import the schema creator import createSchema from "part:@sanity/base/schema-creator"; -// Then import schema types from any plugins that might expose them import schemaTypes from "all:part:@sanity/base/schema-type"; -// We import object and document schemas import blockContent from "./blockContent"; import tiltakstype from "./tiltakstype"; import tiltaksgjennomforing from "./tiltaksgjennomforing"; import arrangor from "./arrangor"; import kontaktperson from "./kontaktperson"; -// Then we give our schema to the builder and provide the result to Sanity export default createSchema({ - // We name our schema name: "default", - - // Then proceed to concatenate our document type - // to the ones provided by any plugins that are installed types: schemaTypes.concat([ // The following are document types which will appear // in the studio. diff --git a/frontend/mulighetsrommet-cms/schemas/tiltaksgjennomforing.js b/frontend/mulighetsrommet-cms/schemas/tiltaksgjennomforing.js index c7c1c9daf5..24d9441329 100644 --- a/frontend/mulighetsrommet-cms/schemas/tiltaksgjennomforing.js +++ b/frontend/mulighetsrommet-cms/schemas/tiltaksgjennomforing.js @@ -198,6 +198,7 @@ export default { }, ], }, + //TODO skal kunne legge til flere tiltaksansvarlige { name: "kontaktinfoTiltaksansvarlig", title: "Tiltaksansvarlig", diff --git a/frontend/mulighetsrommet-cms/schemas/tiltakstype.js b/frontend/mulighetsrommet-cms/schemas/tiltakstype.js index 32d58e4213..7293ff4d37 100644 --- a/frontend/mulighetsrommet-cms/schemas/tiltakstype.js +++ b/frontend/mulighetsrommet-cms/schemas/tiltakstype.js @@ -15,7 +15,7 @@ export default { { name: "beskrivelse", title: "Beskrivelse", - type: "blockContent", + type: "string", }, { name: "overgangTilArbeid", @@ -23,7 +23,6 @@ export default { description: "Hentes fra Arena, usikker på hvordan denne skal vises her", type: "blockContent", }, - // Sammendrag/Infoboks { name: "innsatsgruppe", title: "Innsatsgruppe", @@ -31,10 +30,19 @@ export default { options: { layout: "dropdown", list: [ - { title: "Standardinnsats", value: "staninn" }, - { title: "Situasjonsbestemt innsats", value: "sitinn" }, - { title: "Spesielt tilpasset innsats", value: "speinn" }, - { title: "Varig tilpasset innsats", value: "varinn" }, + { title: "Standardinnsats", value: "Standardinnsats" }, + { + title: "Situasjonsbestemt innsats", + value: "Situasjonsbestemt innsats", + }, + { + title: "Spesielt tilpasset innsats", + value: "Spesielt tilpasset innsats", + }, + { + title: "Varig tilpasset innsats", + value: "Varig tilpasset innsats", + }, ], }, validation: (Rule) => Rule.required(), @@ -44,15 +52,43 @@ export default { title: "Varighet", type: "string", }, + //TODO skal kunne legge til flere lenker og filer { name: "regelverkFil", title: "Regelverk fil", type: "file", }, + { + name: "regelverkFilNavn", + title: "Navn til fil", + description: "Hvilket navn skal vises til filen?", + type: "string", + validation: (Rule) => + Rule.custom((field, context) => + context.document.regelverkFil && field === undefined + ? "Dette feltet kan ikke være tomt." + : true + ), + hidden: ({ document }) => !document?.regelverkFil, + }, { name: "regelverkLenke", title: "Regelverk lenke", type: "url", + placeholder: "https://www...", + }, + { + name: "regelverkLenkeNavn", + title: "Navn til lenke", + description: "Hvilket navn skal vises i lenken?", + type: "string", + validation: (Rule) => + Rule.custom((field, context) => + context.document.regelverkLenke && field === undefined + ? "Dette feltet kan ikke være tomt." + : true + ), + hidden: ({ document }) => !document?.regelverkLenke, }, //Faneinnhold { @@ -72,7 +108,6 @@ export default { title: "For hvem", type: "blockContent", }, - { name: "detaljerOgInnholdInfoboks", title: "Detaljer og innhold - infoboks", @@ -85,7 +120,6 @@ export default { title: "Detaljer og innhold", type: "blockContent", }, - { name: "pameldingOgVarighetInfoboks", title: "Påmelding og varighet - infoboks", diff --git a/frontend/mulighetsrommet-veileder-flate/package.json b/frontend/mulighetsrommet-veileder-flate/package.json index 8efef54549..54eaba1420 100644 --- a/frontend/mulighetsrommet-veileder-flate/package.json +++ b/frontend/mulighetsrommet-veileder-flate/package.json @@ -34,6 +34,7 @@ "@navikt/ds-react": "^0.17.27", "@navikt/frontendlogger": "^2.0.0", "@navikt/navspa": "^5.0.1", + "@portabletext/react": "^1.0.6", "@sanity/client": "^3.3.0", "@vitejs/plugin-react": "^1.2.0", "classnames": "^2.3.1", diff --git a/frontend/mulighetsrommet-veileder-flate/src/RoutesConfig.tsx b/frontend/mulighetsrommet-veileder-flate/src/RoutesConfig.tsx index 08ab61f398..5256a8a23a 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/RoutesConfig.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/RoutesConfig.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Navigate, Route, Routes } from 'react-router-dom'; -import ViewTiltakstypeDetaljer from './views/tiltakstype-detaljer/ViewTiltakstypeDetaljer'; -import ViewTiltakstypeOversikt from './views/tiltakstype-oversikt/ViewTiltakstypeOversikt'; +import ViewTiltakstypeDetaljer from './views/tiltaksgjennomforing-detaljer/ViewTiltakstypeDetaljer'; +import ViewTiltakstypeOversikt from './views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt'; const RoutesConfig = () => { return ( diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Filtermeny.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Filtermeny.tsx index 8634e7eb75..6ba11839bd 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Filtermeny.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Filtermeny.tsx @@ -42,8 +42,8 @@ const Filtermeny = () => { data={ tiltakstyper.data?.map(tiltakstype => { return { - id: tiltakstype.id, - tittel: tiltakstype.navn, + id: tiltakstype._id, + tittel: tiltakstype.tiltakstypeNavn, }; }) ?? [] } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Searchfield.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Searchfield.tsx index be752cac3b..9690b38e63 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Searchfield.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/filtrering/Searchfield.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import '../../views/tiltakstype-oversikt/ViewTiltakstypeOversikt.less'; +import '../../views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.less'; import { TextField } from '@navikt/ds-react'; interface SokeFilterProps { diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/Sidemeny.less b/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/Sidemeny.less index 1b7920a114..8e5ce89cc7 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/Sidemeny.less +++ b/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/Sidemeny.less @@ -1,9 +1,30 @@ .mulighetsrommet-veileder-flate { .tiltakstype-detaljer { + display: grid; + grid-template-rows: auto auto; + grid-template-columns: auto 23rem; + grid-gap: 1rem; + margin: 0 1rem; &__rad { display: flex; justify-content: space-between; margin-bottom: 1rem; + column-gap: 1rem; + } + &__sidemeny { + grid-row: 2; + display: flex; + flex-direction: column; + gap: 0.5rem; + height: fit-content; + } + &__regelverk { + display: flex; + flex-direction: column; + gap: 1rem; + } + span { + text-align: end; } } } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/SidemenyDetaljer.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/SidemenyDetaljer.tsx index a2b3f35e1d..0407ba472f 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/SidemenyDetaljer.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/sidemeny/SidemenyDetaljer.tsx @@ -2,59 +2,62 @@ import React from 'react'; import { Panel } from '@navikt/ds-react'; import './Sidemeny.less'; import Kopiknapp from '../kopiknapp/Kopiknapp'; -import { Tiltakskode } from '../../../../mulighetsrommet-api-client'; +import { Tiltakstype } from '../../../../mulighetsrommet-api-client'; +import Lenke from '../lenke/Lenke'; interface SidemenyDetaljerProps { tiltaksnummer: string; - tiltakstype: Tiltakskode; arrangor: string; - innsatsgruppe: number | null; - oppstartsdato: string | null; - beskrivelse: string; + oppstartsdato?: string | null; + tiltakstype: Tiltakstype; } -const SidemenyDetaljer = ({ - tiltaksnummer, - tiltakstype, - arrangor, - innsatsgruppe, - oppstartsdato, - beskrivelse, -}: SidemenyDetaljerProps) => { +const SidemenyDetaljer = ({ tiltaksnummer, arrangor, oppstartsdato, tiltakstype }: SidemenyDetaljerProps) => { return ( <>
- Tiltaksnummer + Tiltaksnummer {tiltaksnummer}
- Tiltakstype - {tiltakstype} + Tiltakstype + {tiltakstype.tiltakstypeNavn}
- Arrangør + Arrangør {arrangor}
- Innsatsgruppe - {innsatsgruppe} + Innsatsgruppe + {tiltakstype.innsatsgruppe}
-
- Oppstart - {oppstartsdato} -
+ {oppstartsdato && ( +
+ Oppstart + {oppstartsdato} +
+ )} -
- Beskrivelse - {beskrivelse} -
+ {(tiltakstype.regelverkFil || tiltakstype.regelverkLenke) && ( +
+ Regelverk +
+ {tiltakstype.regelverkFil && {tiltakstype.regelverkFilNavn}} + {tiltakstype.regelverkLenke && ( + + {tiltakstype.regelverkLenkeNavn} + + )} +
+
+ )}
); diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.less b/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.less index 52f97395cf..ee46c88d17 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.less +++ b/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.less @@ -1,6 +1,6 @@ .mulighetsrommet-veileder-flate { .statistikk { - width: 40%; + width: 30%; display: flex; flex-direction: column; gap: 0.5rem; @@ -16,10 +16,9 @@ font-weight: unset; } } - - .navds-body-short { - font-size: 32px; - line-height: unset; - } + &__tekst { + font-size: 32px; + line-height: unset; + } } } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.tsx index 2a0c4f9abe..4309b4232d 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/statistikk/Statistikk.tsx @@ -17,7 +17,7 @@ const Statistikk = ({ tittel, hjelpetekst, statistikktekst }: StatistikkProps) = {hjelpetekst} - {statistikktekst} + {statistikktekst} ); }; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabell/TiltaksgjennomforingsTabell.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabell/TiltaksgjennomforingsTabell.tsx new file mode 100644 index 0000000000..cb2228fba7 --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabell/TiltaksgjennomforingsTabell.tsx @@ -0,0 +1,174 @@ +import React, { useState } from 'react'; +import { Pagination, Table, Alert, Heading, Loader, SortState } from '@navikt/ds-react'; +import './Tabell.less'; +import Lenke from '../lenke/Lenke'; +import Kopiknapp from '../kopiknapp/Kopiknapp'; +import StatusGronn from '../../ikoner/Sirkel-gronn.png'; +import StatusGul from '../../ikoner/Sirkel-gul.png'; +import StatusRod from '../../ikoner/Sirkel-rod.png'; +import { Tiltaksgjennomforing } from '../../../../mulighetsrommet-api-client'; +import useTiltaksgjennomforing from '../../hooks/tiltaksgjennomforing/useTiltaksgjennomforing'; +import { SortDirection } from '@mswjs/data/lib/query/queryTypes'; + +const TiltaksgjennomforingsTabell = () => { + const [sort, setSort] = useState(); + const [page, setPage] = useState(1); + const rowsPerPage = 15; + const pagination = (tiltaksgjennomforing: Tiltaksgjennomforing[] | undefined) => { + return Math.ceil(tiltaksgjennomforing!.length / rowsPerPage); + }; + + const { data, isLoading, isError } = useTiltaksgjennomforing(); + + const tilgjengelighetsstatus = (status: string) => { + //TODO endre denne når vi får inn data fra Arena + if (status === 'Åpent') { + return ( +
+ Grønt sirkelikon +
Åpent
+
+ ); + } else if (status === 'Stengt') { + return ( +
+ Rødt sirkelikon +
Stengt
+
+ ); + } else if (status === 'Venteliste') { + return ( +
+ Gult sirkelikon +
Venteliste
+
+ ); + } + }; + + return ( + <> + {isLoading && } + {isError && Det har skjedd en feil} + {data && ( +
+ + setSort( + sort && sortKey === sort.orderBy && sort.direction === 'descending' + ? undefined + : { + orderBy: sortKey, + direction: + sort && sortKey === sort.orderBy && sort.direction === 'ascending' ? 'descending' : 'ascending', + } + ) + } + > + + + + Tiltaksnavn + + + Tiltaksnr. + + + Tiltakstype + + + Lokasjon + + + Oppstartsdato + + {/*TODO fiks sortering*/} + + Status + + + + + {data!.length === 0 ? ( + + + Det finnes ingen tiltakstyper med dette søket. + + + ) : ( + data! + .sort((a, b) => { + if (sort) { + const comparator = (a: any, b: any, orderBy: string | number) => { + if (b[orderBy] < a[orderBy] || b[orderBy] === undefined) { + return -1; + } + if (b[orderBy] > a[orderBy]) { + return 1; + } + return 0; + }; + return sort.direction === 'ascending' + ? comparator(b, a, sort.orderBy) + : comparator(a, b, sort.orderBy); + } + return 1; + }) + .slice((page - 1) * rowsPerPage, page * rowsPerPage) + .map( + ({ + _id, + tiltaksnummer, + tiltaksgjennomforingNavn, + oppstart, + oppstartsdato, + lokasjon, + tiltakstype, + kontaktinfoArrangor, + }) => ( + + + + {tiltaksgjennomforingNavn} + +
{kontaktinfoArrangor.selskapsnavn}
+
+ + {tiltaksnummer} + + + {tiltakstype.tiltakstypeNavn} + {lokasjon} + + {oppstart === 'dato' ? new Intl.DateTimeFormat().format(new Date(oppstartsdato!)) : 'Løpende'} + + {tilgjengelighetsstatus('Åpent')} +
+ ) + ) + )} +
+
+
+ + Viser {data?.length} av {data?.length} tiltak + + +
+
+ )} + + ); +}; + +export default TiltaksgjennomforingsTabell; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.less b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.less index 992a307216..8f99d6c8e1 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.less +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.less @@ -1,7 +1,7 @@ .mulighetsrommet-veileder-flate { .fane { &__root { - margin: 1rem 0; + margin: 1rem 0 2rem; } &__liste { @@ -9,7 +9,12 @@ flex-direction: row; border-bottom: 1px solid var(--navds-semantic-color-border-muted); margin-bottom: 2rem; - gap: 1%; + gap: 5%; + justify-content: start; + + .navds-label { + font-weight: normal; + } button { background-color: transparent; @@ -23,13 +28,28 @@ } .btn__tab { - width: 6rem; + width: fit-content; + margin: 0 0.5rem; } button[data-state='active'] { - font-weight: bold; + .navds-label { + font-weight: bold; + } border-bottom: 3px solid var(--navds-semantic-color-interaction-primary); } } } + + .navds-tabs__tabpanel { + .tiltaksdetaljer__alert { + margin-bottom: 1rem; + } + } + + @media (max-width: 1200px) { + .fane__liste { + justify-content: space-between; + } + } } diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.tsx index cdee34d993..6a35e72e34 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/TiltaksdetaljerFane.tsx @@ -1,10 +1,27 @@ import React from 'react'; import './TiltaksdetaljerFane.less'; import { Tabs } from '@navikt/ds-react'; +import KontaktinfoFane from './kontaktinfofane/KontaktinfoFane'; +import { Tiltaksansvarlig } from '../../../../mulighetsrommet-api-client/src/models/Tiltaksansvarlig'; +import { Arrangor } from '../../../../mulighetsrommet-api-client/src/models/Arrangor'; +import DetaljerFane from './detaljerFane'; +import { Tiltakstype } from '../../../../mulighetsrommet-api-client'; import {logEvent} from "../../api/logger"; -const TiltaksdetaljerFane2 = () => { - const faneoverskrifter = ['Om kurset', 'Detaljer', 'Påmelding', 'Innhold', 'Varighet', 'Statistikk']; +interface TiltaksdetaljerFaneProps { + tiltaksgjennomforingTiltaksansvarlig: Tiltaksansvarlig; + tiltaksgjennomforingArrangorinfo: Arrangor; + tiltakstype: Tiltakstype; + tiltaksgjennomforing: any; +} + +const TiltaksdetaljerFane = ({ + tiltaksgjennomforingTiltaksansvarlig, + tiltaksgjennomforingArrangorinfo, + tiltakstype, + tiltaksgjennomforing, +}: TiltaksdetaljerFaneProps) => { + const faneoverskrifter = ['For hvem', 'Detaljer og innhold', 'Påmelding og varighet', 'Kontaktinfo', 'Innsikt']; return ( logEvent('mulighetsrommet.faner', {value})}> @@ -13,15 +30,39 @@ const TiltaksdetaljerFane2 = () => { ))} - - Om kurset - Detaljer - Påmelding - Innhold - Varighet - Statistikk + + + + + + + + + + + + + Innsikt ); }; -export default TiltaksdetaljerFane2; +export default TiltaksdetaljerFane; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/detaljerFane.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/detaljerFane.tsx new file mode 100644 index 0000000000..b8ef0e074b --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/detaljerFane.tsx @@ -0,0 +1,37 @@ +import React from 'react'; +import { Alert } from '@navikt/ds-react'; +import { PortableText } from '@portabletext/react'; +import './TiltaksdetaljerFane.less'; + +interface DetaljerFaneProps { + tiltaksgjennomforingAlert?: string; + tiltakstypeAlert?: string; + tiltaksgjennomforing?: any; + tiltakstype?: any; +} + +const DetaljerFane = ({ + tiltaksgjennomforingAlert, + tiltakstypeAlert, + tiltaksgjennomforing, + tiltakstype, +}: DetaljerFaneProps) => { + return ( + <> + {tiltakstypeAlert && ( + + {tiltakstypeAlert} + + )} + {tiltaksgjennomforingAlert && ( + + {tiltaksgjennomforingAlert} + + )} + + + + ); +}; + +export default DetaljerFane; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/ArrangorInfo.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/ArrangorInfo.tsx new file mode 100644 index 0000000000..e7c918b35d --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/ArrangorInfo.tsx @@ -0,0 +1,32 @@ +import { BodyShort, Heading, Label } from '@navikt/ds-react'; +import React from 'react'; +import { Arrangor } from '../../../../../mulighetsrommet-api-client/src/models/Arrangor'; + +interface ArrangorProps { + arrangorinfo: Arrangor; +} + +const ArrangorInfo = ({ arrangorinfo }: ArrangorProps) => { + return ( + <> + + {arrangorinfo.selskapsnavn} + +
+
+ + {arrangorinfo.telefonnummer} +
+
+ ' + {arrangorinfo.epost} +
+
+ + {arrangorinfo.adresse} +
+
+ + ); +}; +export default ArrangorInfo; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.less b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.less new file mode 100644 index 0000000000..864828be16 --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.less @@ -0,0 +1,20 @@ +.mulighetsrommet-veileder-flate { + .kontaktinfo { + display: grid; + grid-template-columns: auto auto; + &__header { + margin-bottom: 0.5rem; + } + &__navn { + margin-bottom: 0.2rem; + } + &__container { + display: flex; + flex-direction: column; + } + &__rad { + display: grid; + grid-template-columns: 6rem auto; + } + } +} diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.tsx new file mode 100644 index 0000000000..9f89cbc667 --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/KontaktinfoFane.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import { Heading } from '@navikt/ds-react'; +import './KontaktinfoFane.less'; +import ArrangorInfo from './ArrangorInfo'; +import TiltaksansvarligInfo from './TiltaksansvarligInfo'; +import { Arrangor } from '../../../../../mulighetsrommet-api-client/src/models/Arrangor'; +import { Tiltaksansvarlig } from '../../../../../mulighetsrommet-api-client/src/models/Tiltaksansvarlig'; + +interface KontaktinfoFaneProps { + tiltaksansvarligInfo: Tiltaksansvarlig; + arrangorinfo: Arrangor; +} + +const KontaktinfoFane = ({ tiltaksansvarligInfo, arrangorinfo }: KontaktinfoFaneProps) => { + return ( +
+
+ + Arrangør + + +
+
+ + Tiltaksansvarlig + + +
+
+ ); +}; + +export default KontaktinfoFane; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/TiltaksansvarligInfo.tsx b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/TiltaksansvarligInfo.tsx new file mode 100644 index 0000000000..a6515e0f92 --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tabs/kontaktinfofane/TiltaksansvarligInfo.tsx @@ -0,0 +1,34 @@ +import { BodyShort, Heading, Label } from '@navikt/ds-react'; +import React from 'react'; +import { Tiltaksansvarlig } from '../../../../../mulighetsrommet-api-client/src/models/Tiltaksansvarlig'; +import './KontaktinfoFane.less'; + +interface TiltaksansvarligProps { + tiltaksansvarlig: Tiltaksansvarlig; +} + +const TiltaksansvarligInfo = ({ tiltaksansvarlig }: TiltaksansvarligProps) => { + //TODO når det er mulig å ha flere tiltaksansvarlige i Sanity må det mappes her + return ( + <> + + {tiltaksansvarlig.navn} + +
+
+ + {tiltaksansvarlig.telefonnummer} +
+
+ + {tiltaksansvarlig.epost} +
+
+ + {tiltaksansvarlig.enhet} +
+
+ + ); +}; +export default TiltaksansvarligInfo; diff --git a/frontend/mulighetsrommet-veileder-flate/src/components/tilbakeknapp/Tilbakeknapp.less b/frontend/mulighetsrommet-veileder-flate/src/components/tilbakeknapp/Tilbakeknapp.less index 4ef4b2d149..1942b3d2bb 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/components/tilbakeknapp/Tilbakeknapp.less +++ b/frontend/mulighetsrommet-veileder-flate/src/components/tilbakeknapp/Tilbakeknapp.less @@ -1,5 +1,7 @@ .mulighetsrommet-veileder-flate { .tilbakeknapp { + grid-column: 1; + grid-row: 1; max-width: fit-content; display: flex; justify-content: space-between; diff --git a/frontend/mulighetsrommet-veileder-flate/src/core/api/QueryKeys.ts b/frontend/mulighetsrommet-veileder-flate/src/core/api/QueryKeys.ts index 82e42d3dc4..038be85d02 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/core/api/QueryKeys.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/core/api/QueryKeys.ts @@ -2,4 +2,6 @@ export const enum QueryKeys { Innsatsgrupper = 'innsatsgrupper', Tiltakstyper = 'tiltakstyper', Tiltaksgjennomforinger = 'tiltaksgjennomforinger', + kontaktperson = 'kontaktperson', + arrangor = 'arrangor', } diff --git a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforing.ts b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforing.ts index f9f7aad15c..5cc4ad3028 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforing.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforing.ts @@ -1,9 +1,22 @@ import { useQuery } from 'react-query'; -import { MulighetsrommetService, Tiltaksgjennomforing } from 'mulighetsrommet-api-client'; +import { Tiltaksgjennomforing } from 'mulighetsrommet-api-client'; import { QueryKeys } from '../../core/api/QueryKeys'; +import { client } from '../../sanityClient'; -export default function useTiltaksgjennomforing(id: number) { - return useQuery([QueryKeys.Tiltaksgjennomforinger, id], () => - MulighetsrommetService.getTiltaksgjennomforing({ id }) +export default function useTiltaksgjennomforing() { + return useQuery([QueryKeys.Tiltaksgjennomforinger], () => + client.fetch( + `*[_type == "tiltaksgjennomforing"]{ + _id, + tiltaksgjennomforingNavn, + enheter, + lokasjon, + oppstart, + oppstartsdato, + tiltaksnummer, + kontaktinfoArrangor->, + tiltakstype-> + }` + ) ); } diff --git a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingById.ts b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingById.ts new file mode 100644 index 0000000000..1cd2b5f683 --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingById.ts @@ -0,0 +1,40 @@ +import { useQuery } from 'react-query'; +import { Tiltaksgjennomforing } from 'mulighetsrommet-api-client'; +import { QueryKeys } from '../../core/api/QueryKeys'; +import { client } from '../../sanityClient'; + +export default function useTiltaksgjennomforingById(id: number) { + return useQuery([QueryKeys.Tiltaksgjennomforinger, id], () => + client.fetch(`*[_type == "tiltaksgjennomforing" && tiltaksnummer == ${id}]{ + _id, + tiltaksgjennomforingNavn, + beskrivelse, + tiltaksnummer, + lokasjon, + oppstart, + oppstartsdato, + enheter{ + fylke, + asker, + fredrikstad, + indreOstfold, + lillestrom, + ringsaker, + sarpsborg, + skiptvedtMarker, + steinkjer, + trondheim + }, + faneinnhold{ + forHvemInfoboks, + forHvem, + detaljerOgInnholdInfoboks, + detaljerOgInnhold, + pameldingOgVarighetInfoboks, + pameldingOgVarighet, + }, + kontaktinfoArrangor->, + kontaktinfoTiltaksansvarlig->, + tiltakstype->}`) + ); +} diff --git a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforinger.ts b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforinger.ts deleted file mode 100644 index 4da574432e..0000000000 --- a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforinger.ts +++ /dev/null @@ -1,14 +0,0 @@ -import { useQuery } from 'react-query'; -import { MulighetsrommetService, Tiltaksgjennomforing } from 'mulighetsrommet-api-client'; -import { Tiltaksgjennomforingsfilter } from '../../core/atoms/atoms'; -import { QueryKeys } from '../../core/api/QueryKeys'; - -export default function useTiltaksgjennomforinger(filter: Tiltaksgjennomforingsfilter = {}) { - return useQuery([QueryKeys.Tiltaksgjennomforinger, filter], () => - MulighetsrommetService.getTiltaksgjennomforinger({ - ...filter, - innsatsgrupper: filter.innsatsgrupper?.map(gruppe => gruppe.id), - tiltakstyper: filter.tiltakstyper?.map(type => type.id), - }) - ); -} diff --git a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingerByTiltakskode.ts b/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingerByTiltakskode.ts deleted file mode 100644 index 418c9853db..0000000000 --- a/frontend/mulighetsrommet-veileder-flate/src/hooks/tiltaksgjennomforing/useTiltaksgjennomforingerByTiltakskode.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { useQuery } from 'react-query'; -import { MulighetsrommetService, Tiltaksgjennomforing, Tiltakskode } from 'mulighetsrommet-api-client'; -import { QueryKeys } from '../../core/api/QueryKeys'; - -export default function useTiltaksgjennomforingerByTiltakskode(tiltakskode: Tiltakskode) { - return useQuery([QueryKeys.Tiltaksgjennomforinger, { tiltakskode }], () => - MulighetsrommetService.getTiltaksgjennomforingerByTiltakskode({ tiltakskode }) - ); -} diff --git a/frontend/mulighetsrommet-veileder-flate/src/layouts/MainView.less b/frontend/mulighetsrommet-veileder-flate/src/layouts/MainView.less deleted file mode 100644 index 32f6c6f3e4..0000000000 --- a/frontend/mulighetsrommet-veileder-flate/src/layouts/MainView.less +++ /dev/null @@ -1,8 +0,0 @@ -.mulighetsrommet-veileder-flate { - .tiltaksgjennomforing__subtitle-container { - display: flex; - flex-direction: row; - gap: 10%; - margin-bottom: 2rem; - } -} diff --git a/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.less b/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.less new file mode 100644 index 0000000000..80b885c1ef --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.less @@ -0,0 +1,10 @@ +.mulighetsrommet-veileder-flate { + .tiltaksgjennomforing { + &__title { + margin-bottom: 3rem; + } + &__beskrivelse { + font-size: 22px; + } + } +} diff --git a/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.tsx b/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.tsx index 8a1091911b..cd20868f40 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/layouts/TiltaksgjennomforingsHeader.tsx @@ -1,38 +1,34 @@ -import React, { useEffect, useState } from 'react'; -import './MainView.less'; +import React from 'react'; +import './TiltaksgjennomforingsHeader.less'; import { Heading } from '@navikt/ds-react'; import { kebabCase } from '../utils/Utils'; -import { client } from '../sanityClient'; interface TiltaksgjennomforingsHeaderProps { - tiltakstype: string; - arrangor?: string; + tiltaksgjennomforingsnavn: string; + beskrivelseTiltaksgjennomforing?: string; + beskrivelseTiltakstype?: string; } -function TiltaksgjennomforingsHeader({ tiltakstype, arrangor }: TiltaksgjennomforingsHeaderProps) { - const [gjennomforing, setGjennomforing] = useState(null); - - useEffect(() => { - client.fetch(`*[_type == "tiltaksgjennomforing"]`).then(data => setGjennomforing(data)); - }, []); - +const TiltaksgjennomforingsHeader = ({ + tiltaksgjennomforingsnavn, + beskrivelseTiltaksgjennomforing, + beskrivelseTiltakstype, +}: TiltaksgjennomforingsHeaderProps) => { return (
- - {tiltakstype} + + {tiltaksgjennomforingsnavn} -
- {arrangor && ( - - {arrangor} - - )} - - {tiltakstype} - -
+ {beskrivelseTiltaksgjennomforing && ( +
{beskrivelseTiltaksgjennomforing}
+ )} + {beskrivelseTiltakstype &&
{beskrivelseTiltakstype}
}
); -} +}; export default TiltaksgjennomforingsHeader; diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/api/handlers.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/api/handlers.ts index 124d3a14c5..cb164c9054 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/api/handlers.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/api/handlers.ts @@ -1,9 +1,9 @@ import { rest, RestHandler } from 'msw'; import { db } from '../database'; -import { toTiltaksgjennomforing } from '../entities/tiltaksgjennomføring'; +import { toTiltaksgjennomforing } from '../entities/tiltaksgjennomforing'; import { toTiltakstype } from '../entities/tiltakstype'; -import { badReq, notFound, ok } from './responses'; import { mockFeatures } from './features'; +import { notFound, ok } from './responses'; export const handlers: RestHandler[] = [ rest.get('*/api/feature', (req, res, ctx) => { @@ -17,32 +17,7 @@ export const handlers: RestHandler[] = [ rest.get('*/api/v1/tiltakstyper', () => { return ok(db.tiltakstype.getAll().map(toTiltakstype)); }), - rest.get('*/api/v1/tiltakstyper/:tiltakskode', req => { - const { tiltakskode } = req.params as any; - if (!tiltakskode) { - return badReq(); - } - - const entity = db.tiltakstype.findFirst({ - where: { tiltakskode: { equals: tiltakskode } }, - }); - - if (!entity) { - return notFound(); - } - - return ok(toTiltakstype(entity)); - }), - rest.get('*/api/v1/tiltakstyper/:tiltakskode/tiltaksgjennomforinger', req => { - const { tiltakskode } = req.params as any; - - const items = db.tiltaksgjennomforing.findMany({ - where: { tiltakskode: { equals: tiltakskode } }, - }); - - return ok(items.map(toTiltaksgjennomforing)); - }), rest.get('*/api/v1/tiltaksgjennomforinger', req => { return ok(db.tiltaksgjennomforing.getAll().map(toTiltaksgjennomforing)); }), diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/database.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/database.ts index dc900af017..df22a18865 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/database.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/database.ts @@ -1,6 +1,6 @@ import { nullable, oneOf, primaryKey } from '@mswjs/data'; import faker from 'faker'; -import { innsatsgrupper } from './fixtures/innsatsgrupper'; +import { innsatsgrupperFixture } from './fixtures/innsatsgrupper'; import { tiltakstyper } from './fixtures/tiltakstyper'; import { createMockDatabase, idAutoIncrement } from './helpers'; import { Tiltakstype } from '../../../mulighetsrommet-api-client'; @@ -12,32 +12,62 @@ export const definition = { }, tiltakstype: { id: idAutoIncrement(), - innsatsgruppe: oneOf('innsatsgruppe', { nullable: true }), - sanityId: nullable(Number), - tiltakskode: String, - navn: String, - fraDato: nullable(String), - tilDato: nullable(String), - createdBy: nullable(String), - createdAt: nullable(String), - updatedBy: nullable(String), - updatedAt: nullable(String), + tiltakstypeNavn: String, + beskrivelse: String, + innsatsgruppe: String, + varighet: String, + regelverkFil: String, //skal være fil + regelverkFilNavn: String, + regelverkLenke: String, + regelverkLenkeNavn: String, + faneinnhold: { + forHvemInfoboks: String, + forHvem: Object, + detaljerOgInnholdInfoboks: String, + detaljerOgInnhold: Object, + pameldingOgVarighetInfoboks: String, + pameldingOgVarighet: Object, + }, }, tiltaksgjennomforing: { id: idAutoIncrement(), - tiltakskode: String, - tiltaksnummer: String, - tittel: String, + tiltakstype: Object, + tiltaksgjennomforingNavn: String, beskrivelse: String, - fraDato: Date, - tilDato: Date, + tiltaksnummer: Number, + kontaktinfoArrangor: { + id: Number, + selskapsnavn: String, + telefonnummer: String, + epost: String, + adresse: String, + }, + lokasjon: String, + enheter: { fylke: String }, + oppstart: String, + oppstartsdato: Date, + faneinnhold: { + forHvemInfoboks: String, + forHvem: Object, + detaljerOgInnholdInfoboks: String, + detaljerOgInnhold: Object, + pameldingOgVarighetInfoboks: String, + pameldingOgVarighet: Object, + }, + kontaktinfoTiltaksansvarlig: { + id: Number, + navn: String, + enhet: String, + telefonnummer: String, + epost: String, + }, }, }; export type DatabaseDictionary = typeof definition; export const db = createMockDatabase(definition, (db: any) => { - innsatsgrupper.forEach(db.innsatsgruppe.create); + innsatsgrupperFixture.forEach(db.innsatsgruppe.create); tiltakstyper.forEach(({ innsatsgruppe, ...data }) => { const relatedInnsatsgruppe = innsatsgruppe @@ -53,7 +83,6 @@ export const db = createMockDatabase(definition, (db: any) => { db.tiltakstype.getAll().forEach((tiltakstype: Tiltakstype) => { for (let index = 0; index < faker.datatype.number({ min: 1, max: 5 }); index++) { db.tiltaksgjennomforing.create({ - tiltakskode: tiltakstype.tiltakskode, tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), tittel: `Kjøreopplæring av ${faker.vehicle.manufacturer()}`, beskrivelse: faker.lorem.paragraph(1), diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomforing.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomforing.ts new file mode 100644 index 0000000000..e2a1a64cea --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomforing.ts @@ -0,0 +1,34 @@ +import { Entity } from '@mswjs/data/lib/glossary'; +import { Tiltaksgjennomforing, Tiltakstype } from 'mulighetsrommet-api-client'; +import { DatabaseDictionary } from '../database'; + +export type TiltaksgjennomforingEntity = Entity; + +export function toTiltaksgjennomforing(entity: TiltaksgjennomforingEntity): Tiltaksgjennomforing { + return { + _id: entity.id, + tiltaksnummer: entity.tiltaksnummer, + tiltaksgjennomforingNavn: entity.tiltaksgjennomforingNavn, + beskrivelse: entity.beskrivelse, + kontaktinfoArrangor: { + _id: entity.kontaktinfoArrangor.id!, + selskapsnavn: entity.kontaktinfoArrangor.selskapsnavn!, + adresse: entity.kontaktinfoArrangor.adresse!, + epost: entity.kontaktinfoArrangor.epost!, + telefonnummer: entity.kontaktinfoArrangor.telefonnummer!, + }, + tiltakstype: entity.tiltakstype as Tiltakstype, + lokasjon: entity.lokasjon, + enheter: { + fylke: entity.enheter.fylke!, + }, + oppstart: entity.oppstart, + kontaktinfoTiltaksansvarlig: { + _id: entity.kontaktinfoTiltaksansvarlig.id!, + enhet: entity.kontaktinfoTiltaksansvarlig.enhet!, + epost: entity.kontaktinfoTiltaksansvarlig.epost!, + telefonnummer: entity.kontaktinfoTiltaksansvarlig.telefonnummer!, + navn: entity.kontaktinfoTiltaksansvarlig.navn!, + }, + }; +} diff --git "a/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomf\303\270ring.ts" "b/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomf\303\270ring.ts" deleted file mode 100644 index ddc7ce1f2f..0000000000 --- "a/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltaksgjennomf\303\270ring.ts" +++ /dev/null @@ -1,17 +0,0 @@ -import { Entity } from '@mswjs/data/lib/glossary'; -import { Tiltaksgjennomforing, Tiltakskode } from 'mulighetsrommet-api-client'; -import { DatabaseDictionary } from '../database'; - -export type TiltaksgjennomforingEntity = Entity; - -export function toTiltaksgjennomforing(entity: TiltaksgjennomforingEntity): Tiltaksgjennomforing { - return { - id: entity.id, - tiltaksnummer: entity.tiltaksnummer, - tiltakskode: Tiltakskode[entity.tiltakskode as keyof typeof Tiltakskode], - tittel: entity.tittel, - beskrivelse: entity.beskrivelse, - fraDato: entity.fraDato, - tilDato: entity.tilDato, - }; -} diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltakstype.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltakstype.ts index 19d9dde5cb..6710ce3ace 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltakstype.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/entities/tiltakstype.ts @@ -1,17 +1,13 @@ import { Entity } from '@mswjs/data/lib/glossary'; -import { Tiltakskode, Tiltakstype } from 'mulighetsrommet-api-client'; +import { Tiltakstype } from 'mulighetsrommet-api-client'; import { DatabaseDictionary } from '../database'; export type TiltakstypeEntity = Entity; export function toTiltakstype(entity: TiltakstypeEntity): Tiltakstype { return { - id: entity.id, - innsatsgruppe: entity.innsatsgruppe?.id ?? null, - sanityId: entity.sanityId, - navn: entity.navn, - tiltakskode: Tiltakskode[entity.tiltakskode as keyof typeof Tiltakskode], - fraDato: entity.fraDato, - tilDato: entity.tilDato, + _id: entity.id, + innsatsgruppe: entity.innsatsgruppe!!, + tiltakstypeNavn: entity.tiltakstypeNavn, }; } diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/innsatsgrupper.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/innsatsgrupper.ts index 8a00cbca48..79f1fbabdb 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/innsatsgrupper.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/innsatsgrupper.ts @@ -1,6 +1,6 @@ import { Innsatsgruppe } from 'mulighetsrommet-api-client'; -export const innsatsgrupper: Innsatsgruppe[] = [ +export const innsatsgrupperFixture: Innsatsgruppe[] = [ { id: 1, navn: 'Standardinnsats', diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltaksgjennomforinger.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltaksgjennomforinger.ts index 47fb6675a1..fbd9ee7300 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltaksgjennomforinger.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltaksgjennomforinger.ts @@ -2,48 +2,158 @@ import faker from 'faker'; import { Tiltaksgjennomforing, Tiltakskode, Tiltakstype } from '../../../../mulighetsrommet-api-client'; export const tiltaksgjennomforinger: Tiltaksgjennomforing[] = [ { - id: faker.datatype.number({ min: 100000, max: 999999 }), - tittel: 'Opplæring', + _id: faker.datatype.number({ min: 100000, max: 999999 }), + tiltaksgjennomforingNavn: 'Opplæring', beskrivelse: faker.lorem.paragraph(3), - tiltakskode: Tiltakskode.ABIST, - tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + + tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }), + tiltakstype: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '', + tiltakstypeNavn: '', + }, + kontaktinfoArrangor: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + adresse: '', + epost: '', + selskapsnavn: '', + telefonnummer: '', + }, + lokasjon: '', + enheter: { + fylke: '', + }, + oppstart: '', + kontaktinfoTiltaksansvarlig: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + enhet: '', + epost: '', + navn: '', + telefonnummer: '', + }, }, { - id: faker.datatype.number({ min: 100000, max: 999999 }), - tittel: 'Opplæring', + _id: faker.datatype.number({ min: 100000, max: 999999 }), + tiltaksgjennomforingNavn: 'Opplæring', beskrivelse: faker.lorem.paragraph(3), - tiltakskode: Tiltakskode.FUNKSJASS, - tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + + tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }), + tiltakstype: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '', + tiltakstypeNavn: '', + }, + kontaktinfoArrangor: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + adresse: '', + epost: '', + selskapsnavn: '', + telefonnummer: '', + }, + lokasjon: '', + enheter: { + fylke: '', + }, + oppstart: '', + kontaktinfoTiltaksansvarlig: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + enhet: '', + epost: '', + navn: '', + telefonnummer: '', + }, }, { - id: faker.datatype.number({ min: 100000, max: 999999 }), - tittel: 'Opplæring', + _id: faker.datatype.number({ min: 100000, max: 999999 }), + tiltaksgjennomforingNavn: 'Opplæring', beskrivelse: faker.lorem.paragraph(3), - tiltakskode: Tiltakskode.UTVOPPFOPL, - tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + + tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }), + tiltakstype: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '', + tiltakstypeNavn: '', + }, + kontaktinfoArrangor: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + adresse: '', + epost: '', + selskapsnavn: '', + telefonnummer: '', + }, + lokasjon: '', + enheter: { + fylke: '', + }, + oppstart: '', + kontaktinfoTiltaksansvarlig: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + enhet: '', + epost: '', + navn: '', + telefonnummer: '', + }, }, { - id: faker.datatype.number({ min: 100000, max: 999999 }), - tittel: 'Opplæring', + _id: faker.datatype.number({ min: 100000, max: 999999 }), + tiltaksgjennomforingNavn: 'Opplæring', beskrivelse: faker.lorem.paragraph(3), - tiltakskode: Tiltakskode.AVKLARAG, - tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + + tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }), + tiltakstype: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '', + tiltakstypeNavn: '', + }, + kontaktinfoArrangor: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + adresse: '', + epost: '', + selskapsnavn: '', + telefonnummer: '', + }, + lokasjon: '', + enheter: { + fylke: '', + }, + oppstart: '', + kontaktinfoTiltaksansvarlig: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + enhet: '', + epost: '', + navn: '', + telefonnummer: '', + }, }, { - id: faker.datatype.number({ min: 100000, max: 999999 }), - tittel: 'Opplæring', + _id: faker.datatype.number({ min: 100000, max: 999999 }), + tiltaksgjennomforingNavn: 'Opplæring', beskrivelse: faker.lorem.paragraph(3), - tiltakskode: Tiltakskode.GRUPPEAMO, - tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }).toString(), - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + + tiltaksnummer: faker.datatype.number({ min: 100000, max: 999999 }), + tiltakstype: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '', + tiltakstypeNavn: '', + }, + kontaktinfoArrangor: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + adresse: '', + epost: '', + selskapsnavn: '', + telefonnummer: '', + }, + lokasjon: '', + enheter: { + fylke: '', + }, + oppstart: '', + kontaktinfoTiltaksansvarlig: { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + enhet: '', + epost: '', + navn: '', + telefonnummer: '', + }, }, ]; diff --git a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltakstyper.ts b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltakstyper.ts index 6476be5237..e4aea6a988 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltakstyper.ts +++ b/frontend/mulighetsrommet-veileder-flate/src/mock/fixtures/tiltakstyper.ts @@ -1,202 +1,114 @@ import faker from 'faker'; -import { Tiltakskode, Tiltakstype } from '../../../../mulighetsrommet-api-client'; +import { Tiltakstype } from '../../../../mulighetsrommet-api-client'; export const tiltakstyper: Tiltakstype[] = [ { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Opplæring', - tiltakskode: Tiltakskode.ABIST, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Funksjonsassistanse', - tiltakskode: Tiltakskode.FUNKSJASS, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Utvidet oppfølging', - tiltakskode: Tiltakskode.UTVOPPFOPL, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Avklaring', - tiltakskode: Tiltakskode.AVKLARAG, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Arbeidsmarkedsopplæring (AMO)', - tiltakskode: Tiltakskode.GRUPPEAMO, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Ekspertbistand', - tiltakskode: Tiltakskode.EKSPEBIST, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 1, - navn: 'Jobbklubb', - tiltakskode: Tiltakskode.JOBBKLUBB, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Oppfølging', - tiltakskode: Tiltakskode.ABOPPF, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Digital jobbklubb', - tiltakskode: Tiltakskode.DIGIOPPARB, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Fag- og yrkesopplæring', - tiltakskode: Tiltakskode.ENKFAGYRKE, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Arbeidstrening', - tiltakskode: Tiltakskode.ARBTREN, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Arbeidsforberedende trening', - tiltakskode: Tiltakskode.ARBRRHDAG, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Midlertidig lønnstilskudd', - tiltakskode: Tiltakskode.MIDLONTIL, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 2, - navn: 'Varig lønnstilskudd', - tiltakskode: Tiltakskode.MIDLONTIL, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Varig tilrettelagt arbeid i skjermet virksomhet', - tiltakskode: Tiltakskode.TILRTILSK, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Varig tilrettelagt arbeid i ordinær virksomhet', - tiltakskode: Tiltakskode.TILRETTEL, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Inkluderingstilskudd', - tiltakskode: Tiltakskode.ABTBOPPF, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Funksjonsassistanse i arbeidslivet', - tiltakskode: Tiltakskode.INKLUTILS, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Mentor', - tiltakskode: Tiltakskode.MENTOR, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Arbeidsrettet rehabilitering', - tiltakskode: Tiltakskode.ARBRRHBAG, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 3, - navn: 'Individuell jobbstøtte', - tiltakskode: Tiltakskode.INDJOBSTOT, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), - }, - { - id: faker.datatype.number({ min: 100000, max: 999999 }), - innsatsgruppe: 4, - navn: 'Tilskudd til sommerjobb', - tiltakskode: Tiltakskode.TILSJOBB, - sanityId: null, - fraDato: faker.date.future(2).toISOString(), - tilDato: faker.date.future(2).toISOString(), + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Opplæring', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Funksjonsassistanse', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Utvidet oppfølging', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Avklaring', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Arbeidsmarkedsopplæring (AMO)', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Ekspertbistand', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '1', + tiltakstypeNavn: 'Jobbklubb', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Oppfølging', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Digital jobbklubb', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Fag- og yrkesopplæring', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Arbeidstrening', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Arbeidsforberedende trening', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Midlertidig lønnstilskudd', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '2', + tiltakstypeNavn: 'Varig lønnstilskudd', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Varig tilrettelagt arbeid i skjermet virksomhet', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Varig tilrettelagt arbeid i ordinær virksomhet', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Inkluderingstilskudd', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Funksjonsassistanse i arbeidslivet', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Mentor', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Arbeidsrettet rehabilitering', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '3', + tiltakstypeNavn: 'Individuell jobbstøtte', + }, + { + _id: faker.datatype.number({ min: 100000, max: 999999 }), + innsatsgruppe: '4', + tiltakstypeNavn: 'Tilskudd til sommerjobb', }, ]; diff --git a/frontend/mulighetsrommet-veileder-flate/src/views/ViewTiltakstype-tiltaksgjennomforing-detaljer.less b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltaksgjennomforingDetaljer.less similarity index 58% rename from frontend/mulighetsrommet-veileder-flate/src/views/ViewTiltakstype-tiltaksgjennomforing-detaljer.less rename to frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltaksgjennomforingDetaljer.less index 2951b1b316..6b66df752d 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/views/ViewTiltakstype-tiltaksgjennomforing-detaljer.less +++ b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltaksgjennomforingDetaljer.less @@ -1,16 +1,5 @@ .mulighetsrommet-veileder-flate { .tiltakstype-detaljer { - display: grid; - grid-template-rows: auto auto; - grid-template-columns: auto 22rem; - grid-gap: 1%; - margin: 0 1rem; - - .tilbakeknapp { - grid-column: 1; - grid-row: 1; - } - &__info { grid-column: 1; grid-row: 2; @@ -24,7 +13,6 @@ flex-direction: column; gap: 0.5rem; height: fit-content; - width: 22rem; } } } diff --git a/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltakstypeDetaljer.tsx b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltakstypeDetaljer.tsx new file mode 100644 index 0000000000..ae931d3c4e --- /dev/null +++ b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-detaljer/ViewTiltakstypeDetaljer.tsx @@ -0,0 +1,68 @@ +import React from 'react'; +import './ViewTiltaksgjennomforingDetaljer.less'; +import Tilbakeknapp from '../../components/tilbakeknapp/Tilbakeknapp'; +import TiltaksgjennomforingsHeader from '../../layouts/TiltaksgjennomforingsHeader'; +import Statistikk from '../../components/statistikk/Statistikk'; +import SidemenyDetaljer from '../../components/sidemeny/SidemenyDetaljer'; +import { useParams } from 'react-router-dom'; +import TiltaksdetaljerFane from '../../components/tabs/TiltaksdetaljerFane'; +import useTiltaksgjennomforingById from '../../hooks/tiltaksgjennomforing/useTiltaksgjennomforingById'; +import { Alert, Loader } from '@navikt/ds-react'; + +const ViewTiltakstypeDetaljer = () => { + const { tiltaksnummer } = useParams(); + const { data, isLoading, isError } = useTiltaksgjennomforingById(parseInt(tiltaksnummer!)); + + return ( + <> + {isLoading && } + {isError && Det har skjedd en feil} + {data && + data.map( + ({ + _id, + tiltaksgjennomforingNavn, + oppstart, + oppstartsdato, + beskrivelse, + tiltakstype, + kontaktinfoArrangor, + faneinnhold, + kontaktinfoTiltaksansvarlig, + }) => ( +
+ +
+ + + +
+ +
+ ) + )} + + ); +}; + +export default ViewTiltakstypeDetaljer; diff --git a/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-oversikt/ViewTiltakstypeOversikt.less b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.less similarity index 100% rename from frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-oversikt/ViewTiltakstypeOversikt.less rename to frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.less diff --git a/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-oversikt/ViewTiltakstypeOversikt.tsx b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.tsx similarity index 75% rename from frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-oversikt/ViewTiltakstypeOversikt.tsx rename to frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.tsx index 0ac549b013..44a29dff33 100644 --- a/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-oversikt/ViewTiltakstypeOversikt.tsx +++ b/frontend/mulighetsrommet-veileder-flate/src/views/tiltaksgjennomforing-oversikt/ViewTiltakstypeOversikt.tsx @@ -1,27 +1,22 @@ -import React, { useEffect, useState } from 'react'; +import React, { useEffect } from 'react'; import './ViewTiltakstypeOversikt.less'; -import '../../layouts/MainView.less'; -import { Alert, Button, Link, Loader } from '@navikt/ds-react'; +import '../../layouts/TiltaksgjennomforingsHeader.less'; +import { Alert, Button } from '@navikt/ds-react'; import Filtermeny from '../../components/filtrering/Filtermeny'; -import TiltakstypeTabell from '../../components/tabell/TiltakstypeTabell'; import { useAtom } from 'jotai'; import SearchFieldTag from '../../components/tags/SearchFieldTag'; import { tiltaksgjennomforingsfilter } from '../../core/atoms/atoms'; import { FAKE_DOOR, useFeatureToggles } from '../../api/feature-toggles'; import FilterTags from '../../components/tags/Filtertags'; -import useTiltaksgjennomforinger from '../../hooks/tiltaksgjennomforing/useTiltaksgjennomforinger'; import Show from '../../utils/Show'; -import { client } from '../../sanityClient'; +import TiltaksgjennomforingsTabell from '../../components/tabell/TiltaksgjennomforingsTabell'; const ViewTiltakstypeOversikt = () => { const [filter, setFilter] = useAtom(tiltaksgjennomforingsfilter); - const [gjennomforing, setGjennomforing] = useState(null); const features = useFeatureToggles(); const visFakeDoorFeature = features.isSuccess && features.data[FAKE_DOOR]; - const { data, isFetching, isError } = useTiltaksgjennomforinger(filter); - //TODO fiks denne når vi får inn prefiltrering useEffect(() => { if (filter.tiltakstyper?.length === 0 && filter.innsatsgrupper?.length === 0) { @@ -29,10 +24,6 @@ const ViewTiltakstypeOversikt = () => { } }, [filter.tiltakstyper, filter.innsatsgrupper]); - useEffect(() => { - client.fetch(`*[_type == "tiltaksgjennomforing"]`).then(data => setGjennomforing(data)); - }, []); - return ( <> {visFakeDoorFeature ? ( @@ -56,7 +47,7 @@ const ViewTiltakstypeOversikt = () => { handleClick={(id: number) => setFilter({ ...filter, - tiltakstyper: filter.tiltakstyper?.filter(tiltakstype => tiltakstype.id !== id), + tiltakstyper: filter.tiltakstyper?.filter(tiltakstype => tiltakstype._id !== id), }) } /> @@ -76,9 +67,7 @@ const ViewTiltakstypeOversikt = () => {
- {isFetching && !data && } - {data && } - {isError && Det har skjedd en feil} +
)} diff --git a/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-detaljer/ViewTiltakstypeDetaljer.tsx b/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-detaljer/ViewTiltakstypeDetaljer.tsx deleted file mode 100644 index 60a05be13e..0000000000 --- a/frontend/mulighetsrommet-veileder-flate/src/views/tiltakstype-detaljer/ViewTiltakstypeDetaljer.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import React from 'react'; -import { useParams } from 'react-router-dom'; -import '../ViewTiltakstype-tiltaksgjennomforing-detaljer.less'; -import { Alert, Loader } from '@navikt/ds-react'; -import useTiltakstype from '../../hooks/tiltakstype/useTiltakstype'; -import Tilbakeknapp from '../../components/tilbakeknapp/Tilbakeknapp'; -import TiltaksgjennomforingsHeader from '../../layouts/TiltaksgjennomforingsHeader'; -import TiltaksdetaljerFane from '../../components/tabs/TiltaksdetaljerFane'; -import { Tiltakskode } from '../../../../mulighetsrommet-api-client'; -import Statistikk from '../../components/statistikk/Statistikk'; -import SidemenyDetaljer from '../../components/sidemeny/SidemenyDetaljer'; - -interface RouteParams { - tiltakskode: Tiltakskode; -} - -const ViewTiltakstypeDetaljer = () => { - const params = useParams<'tiltakskode'>() as RouteParams; - - //TODO legg inn tiltaksgjennomføring når den er klar - const tiltakstype = useTiltakstype(params.tiltakskode); - - if (tiltakstype.isError) { - return Det har skjedd en feil; - } - - if (tiltakstype.isLoading) { - return ; - } - - if (!tiltakstype.data) { - return Nå er det noe rusk i maskineriet...; - } - - const { navn, tiltakskode, innsatsgruppe, fraDato } = tiltakstype.data; - - return ( -
- -
- - - - -
- -
- ); -}; - -export default ViewTiltakstypeDetaljer; diff --git a/package-lock.json b/package-lock.json index cf55fc7156..5b4ffd3d20 100644 --- a/package-lock.json +++ b/package-lock.json @@ -116,6 +116,8 @@ "@navikt/ds-react": "^0.17.27", "@navikt/frontendlogger": "^2.0.0", "@navikt/navspa": "^5.0.1", + "@portabletext/react": "^1.0.6", + "@sanity/cli": "^2.30.0", "@sanity/client": "^3.3.0", "@vitejs/plugin-react": "^1.2.0", "classnames": "^2.3.1", @@ -2682,16 +2684,15 @@ } }, "node_modules/@portabletext/react": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/@portabletext/react/-/react-1.0.4.tgz", - "integrity": "sha512-IaCt83hJTR1foeD8FsMJmGnBawuD4IAaRQqilTElIgBzdsuW79h14D4REso8xY0Fdt+T+h+W+n/AnAS8QT/ZQQ==", - "license": "MIT", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/@portabletext/react/-/react-1.0.6.tgz", + "integrity": "sha512-j6BprLiwFz3zr1Lo6BxM2sQ1b3g1JIjGwePeuxqSfbBiEYbGXn2izEckMJ02hSa1f7+RCEUJ+Bojvtzz6BBUaw==", "dependencies": { "@portabletext/toolkit": "^1.0.5", "@portabletext/types": "^1.0.3" }, "peerDependencies": { - "react": "^17.0.0" + "react": "^17 || ^18" } }, "node_modules/@portabletext/toolkit": { @@ -27655,9 +27656,9 @@ "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==" }, "@portabletext/react": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/@portabletext/react/-/react-1.0.4.tgz", - "integrity": "sha512-IaCt83hJTR1foeD8FsMJmGnBawuD4IAaRQqilTElIgBzdsuW79h14D4REso8xY0Fdt+T+h+W+n/AnAS8QT/ZQQ==", + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/@portabletext/react/-/react-1.0.6.tgz", + "integrity": "sha512-j6BprLiwFz3zr1Lo6BxM2sQ1b3g1JIjGwePeuxqSfbBiEYbGXn2izEckMJ02hSa1f7+RCEUJ+Bojvtzz6BBUaw==", "requires": { "@portabletext/toolkit": "^1.0.5", "@portabletext/types": "^1.0.3" @@ -37725,6 +37726,7 @@ "@navikt/ds-react": "^0.17.27", "@navikt/frontendlogger": "^2.0.0", "@navikt/navspa": "^5.0.1", + "@portabletext/react": "^1.0.6", "@sanity/cli": "^2.30.0", "@sanity/client": "^3.3.0", "@types/faker": "^5.5.9",