Skip to content
This repository was archived by the owner on Jan 30, 2025. It is now read-only.

Commit f112677

Browse files
AmirhlotfiAmirhlotfi
authored
Merge pull request #56 from navikt/refaktor-og-redesign
Refaktor og redesign
2 parents 268f4e0 + e969343 commit f112677

36 files changed

+531
-466
lines changed

‎.eslintrc.js‎ renamed to ‎.eslintrc.cjs‎

File renamed without changes.

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
1212
# Idea
1313
.idea
1414
.DS_Store
15+
.vscode
1516

1617
# Runtime data
1718
pids

‎index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>Mikrofrontend</title>
7-
<link rel="preload stylesheet" href="https://cdn.nav.no/aksel/@navikt/ds-css/2.9.3/index.min.css" as="style" />
7+
<link rel="preload" href="https://cdn.nav.no/aksel/@navikt/ds-css/3.1.3/index.min.css" as="style" />
8+
<link rel="stylesheet" href="https://cdn.nav.no/aksel/@navikt/ds-css/3.1.3/index.min.css" />
89
</head>
910
<body>
1011
<div id="root"></div>

‎mock/endpoint.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
/*eslint no-undef: "off"*/
2-
const inaktiveVarsler = require("./mockData/varsler-inaktiv.json");
3-
42
export default [
53
{
64
url: "/api/tms-varsel-api/inaktive",

‎mock/mockData/varsler-inaktiv.json‎

Lines changed: 0 additions & 68 deletions
This file was deleted.

‎package-lock.json‎

Lines changed: 3 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/App.jsx‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,41 @@
1-
import TidligereVarsler from "./components/tidligereVarsler/TidligereVarsler";
1+
import style from "./App.module.css";
2+
import { LanguageContext } from "./provider/LanguageProvider";
3+
import { useContext } from "react";
4+
import { inaktiveVarslerApiUrl } from "./api/urls";
5+
import { fetcher } from "./api/api";
6+
import { useQuery } from "react-query";
7+
import { Alert, Heading, Loader, Ingress } from "@navikt/ds-react";
8+
import text from "./language/text";
9+
import NoTidligereVarslerPage from "./components/NoTidligereVarslerPage/NoTidligereVarslerPage.jsx";
10+
import TidligereVarslerPage from "./components/TidligereVarslerPage/TidligereVarslerPage.jsx";
211

312
function App() {
4-
return <TidligereVarsler />;
13+
const language = useContext(LanguageContext);
14+
const { data: varsler, isSuccess, isLoading } = useQuery(inaktiveVarslerApiUrl, fetcher);
15+
const hasMaskedVarsel = varsler && varsler.some((varsel) => varsel.isMasked);
16+
17+
return (
18+
<div className={style.app}>
19+
<Heading className={style.pageTitle} size="large">
20+
{text["tidligereVarslerOverskrift"][language]}
21+
</Heading>
22+
<Ingress className={style.pageDescription}>{text["sidebeskrivelse"][language]}</Ingress>
23+
{hasMaskedVarsel && (
24+
<Alert className={style.authenticationAlert} variant="info">
25+
{text["hoyereSikkerhetsnivaa"][language]}
26+
</Alert>
27+
)}
28+
<div className={style.pageBodyWrapper}>
29+
{isLoading ? (
30+
<Loader className={style.loader} size="3xlarge" title="venter..." />
31+
) : varsler.length === 0 ? (
32+
<NoTidligereVarslerPage />
33+
) : (
34+
<TidligereVarslerPage varsler={varsler} isSuccess={isSuccess} />
35+
)}
36+
</div>
37+
</div>
38+
);
539
}
640

741
export default App;

‎src/App.module.css‎

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,25 @@
11
.app {
2-
flex-direction: column;
2+
max-width: 39.5rem;
3+
margin: 0rem 1rem 6rem 1rem;
34
display: flex;
4-
align-items: center;
5+
flex-direction: column;
6+
}
7+
.pageTitle{
8+
margin-top: 1.25rem;
9+
}
10+
11+
.pageDescription{
12+
margin-top: 1rem;
13+
}
14+
15+
.authenticationAlert{
16+
margin-top: 1rem;
517
}
6-
main{
7-
max-width: none !important;
18+
19+
.pageBodyWrapper{
20+
margin-top: 2rem;
821
}
9-
@media (min-width: 800px) {
10-
.tekstInnhold {
11-
margin-left: 15%;
12-
}
22+
23+
.loader{
24+
align-self: center;
1325
}
14-
@media (max-width: 800px) {
15-
.tekstInnhold {
16-
margin-left: 1%;
17-
padding: 0rem 1rem;
18-
}
19-
}

‎src/assets/BeskjedIkon.jsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import style from "./Ikon.module.css";
2+
3+
const BeskjedIkon = () => {
4+
return (
5+
<svg
6+
className={style.varselIkon}
7+
width="24"
8+
height="24"
9+
viewBox="0 0 24 24"
10+
fill="none"
11+
xmlns="http://www.w3.org/2000/svg"
12+
>
13+
<rect width="24" height="24" rx="4" fill="#3380A5" />
14+
<path
15+
fillRule="evenodd"
16+
clipRule="evenodd"
17+
d="M5.43701 7.49951C5.43701 6.36042 6.36042 5.43701 7.49951 5.43701H16.4995C17.6386 5.43701 18.562 6.36042 18.562 7.49951V14.2495C18.562 15.3886 17.6386 16.312 16.4995 16.312H9.90532L6.28892 18.4819C6.11514 18.5861 5.89872 18.5888 5.72237 18.489C5.54602 18.3892 5.43701 18.2022 5.43701 17.9995V7.49951Z"
18+
fill="white"
19+
/>
20+
</svg>
21+
);
22+
};
23+
24+
export default BeskjedIkon;

‎src/assets/ClearButtonIkon.jsx‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

0 commit comments

Comments
 (0)