🐛 Fikset scrolling, ved å tillate Modal i å kjøre cleanup code

This commit is contained in:
Markus Johansen 2023-07-31 14:38:50 +02:00
parent 413a6277f4
commit 05aa88f736

View file

@ -1,8 +1,8 @@
import "@navikt/ds-css"; import "@navikt/ds-css";
import { Heading, Tag } from "@navikt/ds-react"; import { Heading, Modal, Tag } from "@navikt/ds-react";
import { IFeilmelding } from "../interface"; import { IFeilmelding } from "../interface";
import FeilModal from "./FeilModal"; import FeilModal from "./FeilModal";
import { useState } from "react"; import { useEffect, useState } from "react";
/** /**
* En konteiner som inneholder all informasjon og funksjonalitet for å vise og interagere med en feilmelding. * En konteiner som inneholder all informasjon og funksjonalitet for å vise og interagere med en feilmelding.
@ -11,13 +11,16 @@ import { useState } from "react";
* @param dato * @param dato
* @returns JSX komponent som beskriver innholdet i feilmeldinger. * @returns JSX komponent som beskriver innholdet i feilmeldinger.
*/ */
interface IFeilKort extends IFeilmelding { interface IFeilKort extends IFeilmelding {
key: number key: number
} }
export const FeilKort = (props: IFeilKort) => { export const FeilKort = (props: IFeilKort) => {
const [visModal, setVisModal] = useState<boolean>(false) const [visModal, setVisModal] = useState<boolean>(false)
useEffect(() => {
Modal.setAppElement(document.getElementById('root'));
}, []);
return( return(
<> <>
<div <div
@ -30,13 +33,11 @@ export const FeilKort = (props: IFeilKort) => {
> >
<FeilkortHeader tittel={props.tittel} beskrivelse={props.beskrivelse} dato={props.dato}/> <FeilkortHeader tittel={props.tittel} beskrivelse={props.beskrivelse} dato={props.dato}/>
</div> </div>
{ visModal ?
<FeilModal open={visModal} setOpen={setVisModal} > <FeilModal open={visModal} setOpen={setVisModal} >
<FeilkortHeader tittel={props.tittel} beskrivelse={props.beskrivelse} dato={new Date()} /> <FeilkortHeader tittel={props.tittel} beskrivelse={props.beskrivelse} dato={new Date()} />
<div className="h-2 bg-gray-200 my-4 rounded-lg"></div> <div className="h-2 bg-gray-200 my-4 rounded-lg"></div>
{/* TODO: HER KOMMER CONTENT */} {/* TODO: HER KOMMER CONTENT */}
</FeilModal> : null </FeilModal>
}
</> </>
) )
} }