@navikt/arbeidsforhold

NAV Arbeidsforhold

React moduler / mikro-frontends som viser brukerens arbeidsforhold

Installasjon

npm install @navikt/arbeidsforhold

Komponenter

Prosjektet er delt opp i uavhengige moduler som kan importeres

Liste med arbeidsforhold

import { ListeMedArbeidsforhold } from "@navikt/arbeidsforhold";

Eksempel

  onClick = {
    type: "KNAPP",
    getId: (arbeidsforholdId: string) => console.log(arbeidsforholdId)
  };

  return <ListeMedArbeidsforhold
            locale={"nb" as "nb" | "en"}
            miljo={"DEV" as "LOCAL" | "DEV" | "PROD"}
            onClick={this.onClick} />;

Onclick støtter følgende variasjoner

  | {
      type: "INGEN_ON_CLICK";
    }
  | {
      type: "LENKE";
      href: string;
    }
  | {
      type: "REACT_ROUTER_LENKE";
      Component: typeof Link;
      to: string;
    }
  | {
      type: "KNAPP";
      getId: (navArbeidsforholdId: number) => void;
    };

Ved implementasjon av REACT_ROUTER_LENKE må {Link} importeres fra react-router-dom i rot-applikasjonen.
Se komplett eksempel under mappen /example

Detaljert arbeidsforhold

import { DetaljertArbeidsforhold } from "@navikt/arbeidsforhold";

Eksempel

render = () => {
  const id = "82421242";
  const locale = "nb" as "nb" | "en";
  const miljo = "DEV" as "LOCAL" | "DEV" | "PROD";
  const rolle = "ARBEIDSTAKER" as "ARBEIDSTAKER" | "ARBEIDSGIVER"

  return <DetaljertArbeidsforhold
            navArbeidsforholdId={id}
            locale={locale}
            miljo={miljo}
            rolle={rolle} />;
};

Komponenten vil hente data fra arbeidsforhold-api basert på miljo-variabelen, med mindre customApiUrl er satt. CustomApiUrl må inneholde {id} som erstattes av navArbeidsforholdId. Eksempel: "https://din-api-proxy.nav.no/arbeidsforhold/{id}"

Videreutvikling / test

• Hent repoet fra github

git clone https://github.com/navikt/arbeidsforhold.git

• Installer nødvendige pakker og start kompilering

npm install && npm start

• Start test applikasjonen
  

cd example && npm install && npm start

Test-applikasjonen består av en simpel create-react-app som importerer og benytter pakkene
Prosjektet støtter hot-reloading, endringer i komponentene vil føre til at test-applikasjonen oppdateres

Deployering

Applikasjonen bygges til dev ved git tag på formatet vX.X.X-test (Q1 og Q6) eller vX.X.X-dev (Q6).
For å lansere applikasjonen til npmjs, benytt npm version til å oppdatere package.json og lage en ny git-tag. Eks:

npm version patch -m "Din melding"

Push deretter den nye versjonen til Github, som vil plukkes opp av CircleCI.

git push && git push --tags

Logging

Vi bruker fo-frontendlogger for logging. For oppslag i kibana:

application:frontendlogger AND x_appname:arbeidsforhold

Henvendelser

Spørsmål knyttet til koden eller prosjektet kan rettes mot https://github.com/orgs/navikt/teams/team-personbruker

For NAV-ansatte

Interne henvendelser kan sendes via Slack i kanalen #team-personbruker.