Tsff 230 meldinger omskriving (meir typebasert backend kommunikasjon) (#6054)

* Legg til css nesting og rydd litt i postcss.config.js

For å bruke css nesting når tailwind er aktivert, uten å få advarsel, må ein også aktivere tailwindcss/nesting plugin i postcss.

Endre og konfigurasjonsfila til å vere meir lik eksempeloppsett frå nettet.

* Endre prosjekt frå type "commonjs" til "module".

Sidan vite advarer om at commonjs som grunnkonfigurasjon er deprecated og vil slutte å fungere med vite 6.0

* Endre stylelint.config og tailwind.config til cjs filending.

Sidan package.json type no er "module".

* WIP ny Messages.tsx mv

Starta på ny implementasjon av Messages.tsx

* WIP import fiksing.

Hadde feil ending på ein del importer.

* Ikkje bruk typer frå gammal kode i v2/

Fører til at typescript feiler, sidan gammal kode då blir sjekka med strict tsconfig.

* storybook oppsett justert.

Fjerner gamal testing-react, legger til addon-interactions og testing-library. For bruk i "play" funksjon i stories.

* La til @storybook/addon-controls i storybook oppsett.

Denne erstatter @storybook/addon-knobs som ikkje ser ut til å fungere lenger. (Viser ingen kontroller for å justere argument.)

* Legger til withMaxWidth storybook decorator.

Ein enkel måte å begrense bredda til komponenter vi lager stories for, når det er ein komponent som til vanleg lever ein tilværelse med fast begrensing på bredde.

Eksempel på bruk vil vere å sjå i Messages.stories.tsx

* Skriver om MeldingerSakIndex.stories.tsx til moderne storybook definisjon.

Gjev automatisk bruk av "addon-controls", betre typesafety/intellisense og enklare, mindre kode for storybook definisjon.

* Fjerner withKnobs decorator frå nokre stories.

Bør helst også skrive disse om til ny storybook definisjon.

* Implements utility type lagt til.

Bakgrunn:
For å få gradvis overgang til strict typescript redefinerer ein nokre typer frå gammal kode på nytt i v2 kode. Ein definerer då kanskje ikkje heile den gamle typen viss ein ikkje treng alle props frå den i første omgang.

Det kan og vere at ein lage ein ny type som bevisst skal vere eit subsett av ein anna type for bruk som prop i nokre komponenter. Slik at ein ikkje må spesifisere unødvendige data i storybook/testing av prop.

Ein treng då ein måte å sikre at dei ulike typane er i synk over tid.

Løsning:
For å sikre at den "delvise" nye typen er i synk med anna meir komplett type kan ein bruke denne nye Implements typen på den (gamle) "komplette" typen.

Eksempel:
type New = {
  a: string
}

type Old = Implements<New, {
  a: string
  b: number
}>

* v2 tsconfig.json: Skrur av exactOptionalPropertyTypes, skrur på verbatimModuleSyntax.

exactOptionalPropertyTypes vart tungvindt mtp react måte å skrive kode på.

verbatimModuleSyntax virka å vere anbefalt for framtida, får meir konsekvent oppførsel av imports.

* Oppstramming av kodeverktyper, omskriving til å bruke v2/backend. Subkomponenter for nytt meldingspanel.

Bruker lokal versjon av k9-sak-typescript-client. Må vente til ny versjon der er publisert før denne kan rullast ut.

* Initiell versjon av ny Messages.tsx klar for evaluering.

* Fjerner unødvendig todo.

Ikkje blitt gjort sidan 2021, og er urealistisk å gjere sidan mange dependencies feiler å kompilere då.

* Fjerner unødvendig ts-ignore

* lint warnings fixed.

* Fiks sirkulær avhengighet.

* Forbetra metodenamn i BackendApi.

* yarn.lock oppdatert etter merge.

* storybook/testing-library erstatta med @storybook/test i versjon 8.

Og fiksa litt anna småplukk etter merge.

* Remove local link to k9-sak-typescript-client, upgrade to latest published.

* No-op diff fiks for css typegen fil.

* Tillat eksplisitte grid-template-* properties i css.

shorthand grid-template kan fort bli vanskeleg å forstå.

* Fjern ubrukt behandlingstype dokumentinnsyn.

Bruken av denne vart fjerna i master.

* Legg til @storybook/addon-interactions

Hadde forsvunne i merge der storybook vart oppgradert til 8.

* yarn install etter merge.

* storybook upgrade til siste patch versjon.

* Fjern duplikat @storybook/addon-interactions innslag i main.ts

* Fiks typo i kommentar.

* Bruk find istadenfor filter for å finne første treff.

* yarn install etter merge resolution av package.json

Author: josstn

.storybook/main.ts

@@ -4,14 +4,15 @@ const config: StorybookConfig = {
   stories: ['../packages/**/stories/**/*.stories.@(j|t)s?(x)'],
   addons: [
     '@storybook/addon-actions',
+    '@storybook/addon-controls',
+    '@storybook/addon-interactions',
     {
       name: '@storybook/addon-docs',
       options: {
         configureJSX: true,
         csfPluginOptions: null,
       },
     },
-    '@storybook/addon-controls',
   ],
   staticDirs: ['../public'],
 

.storybook/preview.tsx

@@ -4,6 +4,8 @@ import { Preview } from '@storybook/react';
 import { initialize, mswLoader } from 'msw-storybook-addon';
 import React from 'react';
 
+// NB: Viss omgåelse av service worker er aktivert i devtools og devtools er opna når ein laster storybook, så oppstår
+// evig loop på grunn av dette kallet.
 initialize({ onUnhandledRequest: 'bypass' });
 
 export const loaders = [mswLoader];