✨ oppgavesøk i KelvinAppHeader

navikt · Jan 7, 2025 · a166a89 · a166a89
1 parent 805afe7
commit a166a89
Show file tree

Hide file tree

Showing 15 changed files with 89 additions and 6 deletions.
diff --git a/packages/aap-felles-css/CHANGELOG.md b/packages/aap-felles-css/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Change Log
 
+## 4.1.1
+
+### Patch Changes
+
+- oppgavesøk
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/aap-felles-css/package.json b/packages/aap-felles-css/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "4.1.0",
+  "version": "4.1.1",
   "name": "@navikt/aap-felles-css",
   "author": "NAV",
   "homepage": "https://github.com/navikt/aap-felles-frontend#readme",

diff --git a/packages/aap-felles-css/src/kelvin-app-header.css b/packages/aap-felles-css/src/kelvin-app-header.css
@@ -11,3 +11,17 @@
 .kelvin-app-header-link {
   width: 100%;
 }
+
+.kelvin-oppgavesok-form {
+  padding-top: var(--a-spacing-2);
+  background-color: var(--a-surface-inverted);
+  overflow: visible;
+}
+
+.kelvin-oppgavesok-resultat {
+  overflow: visible;
+  position: relative;
+  background-color: var(--a-surface-inverted);
+  list-style: none;
+  padding: 0 var(--a-spacing-2) var(--a-spacing-2) var(--a-spacing-2);
+}
diff --git a/packages/aap-felles-prettier/CHANGELOG.md b/packages/aap-felles-prettier/CHANGELOG.md
@@ -1,5 +1,7 @@
 # Change Log
 
+## 4.1.1
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/aap-felles-prettier/package.json b/packages/aap-felles-prettier/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@navikt/aap-felles-prettier",
   "author": "NAV",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "main": "index.json",
   "license": "MIT",
   "dependencies": {

diff --git a/packages/aap-felles-react/CHANGELOG.md b/packages/aap-felles-react/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Change Log
 
+## 4.1.1
+
+### Patch Changes
+
+- oppgavesøk
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/aap-felles-react/package.json b/packages/aap-felles-react/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "4.1.0",
+  "version": "4.1.1",
   "name": "@navikt/aap-felles-react",
   "author": "NAV",
   "homepage": "https://github.com/navikt/aap-felles-frontend#readme",

diff --git a/packages/aap-felles-react/src/KelvinAppHeader/KelvinAppHeader.tsx b/packages/aap-felles-react/src/KelvinAppHeader/KelvinAppHeader.tsx
@@ -2,6 +2,7 @@
 
 import React from 'react';
 import { Dropdown, InternalHeader, Link } from '@navikt/ds-react';
+import { Oppgavesøk } from './Oppgavesøk';
 
 interface BrukerInformasjon {
   navn: string;
@@ -27,6 +28,7 @@ export const KelvinAppHeader = ({ brukerInformasjon }: { brukerInformasjon: Bruk
   <InternalHeader className="kelvin-app-header">
     <div className="kelvin-app-header-leftSide">
       <InternalHeader.Title href="/">Kelvin</InternalHeader.Title>
+      <Oppgavesøk />
       <Link href={`${process.env.NEXT_PUBLIC_SAKSBEHANDLING_URL}/sanity`}>Sanity</Link>
       <Link href={`${process.env.NEXT_PUBLIC_SAKSBEHANDLING_URL}/saksoversikt`}>Saksoversikt</Link>
       <Link href={`${process.env.NEXT_PUBLIC_OPPGAVESTYRING_URL}/oppgaveliste`}>Oppgaveliste</Link>

diff --git a/packages/aap-felles-react/src/KelvinAppHeader/Oppgavesøk.tsx b/packages/aap-felles-react/src/KelvinAppHeader/Oppgavesøk.tsx
@@ -0,0 +1,47 @@
+'use client'
+
+import {useState} from "react";
+import {Search} from "@navikt/ds-react";
+import React from "react";
+interface Søkeresultat {
+  label: string;
+  href: string;
+}
+export const Oppgavesøk = () => {
+  const [søkeResultat, setSøkeresultat] = useState<Søkeresultat[]>([]);
+  async function utførSøk(søketekst: string) {
+    const data: Søkeresultat[] = await fetch(`${process.env.NEXT_PUBLIC_OPPGAVESTYRING_URL}/api/oppgave/sok`, {
+      method: 'POST',
+      body: JSON.stringify({ søketekst }),
+    }).then((res) => res.json());
+    setSøkeresultat(data);
+  }
+  return (
+    <form
+      data-theme={'dark'}
+      className={'kelvin-oppgavesok-form'}
+      role={'search'}
+      onSubmit={(e) => {
+        const input = e.currentTarget.elements?.[0] as HTMLInputElement;
+        if (input.value) {
+          utførSøk(input.value);
+        }
+        e.preventDefault();
+      }}
+    >
+      <Search label={'Søk etter person eller sak'} variant="secondary" hideLabel={true} size={'small'} />
+
+      {søkeResultat.length !== 0 && (
+        <ul className={'kelvin-oppgavesok-resultat'}>
+          {søkeResultat.map((søk, index) => (
+            <li key={`resultat-${index}`}>
+              <a
+                href={søk.href}
+              >{søk.label}</a>
+            </li>
+          ))}
+        </ul>
+      )}
+    </form>
+  );
+};
diff --git a/packages/aap-felles-utils-client/CHANGELOG.md b/packages/aap-felles-utils-client/CHANGELOG.md
@@ -1,5 +1,7 @@
 # Change Log
 
+## 4.1.1
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/aap-felles-utils-client/package.json b/packages/aap-felles-utils-client/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "4.1.0",
+  "version": "4.1.1",
   "name": "@navikt/aap-felles-utils-client",
   "author": "NAV",
   "homepage": "https://github.com/navikt/aap-felles-frontend#readme",

diff --git a/packages/aap-felles-utils/CHANGELOG.md b/packages/aap-felles-utils/CHANGELOG.md
@@ -1,5 +1,7 @@
 # Change Log
 
+## 4.1.1
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/aap-felles-utils/package.json b/packages/aap-felles-utils/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "4.1.0",
+  "version": "4.1.1",
   "name": "@navikt/aap-felles-utils",
   "author": "NAV",
   "homepage": "https://github.com/navikt/aap-felles-frontend#readme",

diff --git a/packages/eslint-config-aap/CHANGELOG.md b/packages/eslint-config-aap/CHANGELOG.md
@@ -1,5 +1,7 @@
 # Change Log
 
+## 4.1.1
+
 ## 4.1.0
 
 ### Minor Changes

diff --git a/packages/eslint-config-aap/package.json b/packages/eslint-config-aap/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@navikt/eslint-config-aap",
   "author": "NAV",
-  "version": "4.1.0",
+  "version": "4.1.1",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\"",