Merge pull request #1212 from navikt/uttaksplancolor-typing

Better typing UttaksplanColor Former-commit-id: 96909cf74f8fab9e5760400090b092f1bc82abd2
navikt · Sep 2, 2019 · c473026 · c473026
2 parents c907a2f + ad52dc9
commit c473026
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 19 deletions.
diff --git a/...omponents/uttaksplanlegger/components/periodeliste/items/PeriodelisteGruppertInfoPart.tsx b/...omponents/uttaksplanlegger/components/periodeliste/items/PeriodelisteGruppertInfoPart.tsx
@@ -10,6 +10,7 @@ import { getNavnGenitivEierform } from 'app/util/tekstUtils';
 import EnkelPeriodeliste from 'app/components/uttaksplanlegger/components/enkelPeriodeliste/EnkelPeriodeliste';
 import { getPeriodeIkon } from '../elements/PeriodeHeader';
 import { trimPerioderIGruppertInfoPeriode } from 'app/util/uttaksplan/gruppertInfoPeriodeUtils';
+import { UttaksplanColor } from 'app/types/uttaksplan/colors';
 
 export interface Props {
     itemId: string;
@@ -43,7 +44,7 @@ const PeriodelisteGruppertInfoPart: React.StatelessComponent<Props & InjectedInt
             onToggle={onToggle}
             erSamtidigUttak={false}
             ikon={getPeriodeIkon(periode, navnPåForeldre)}
-            farge="transparent"
+            farge={UttaksplanColor.transparent}
             border={stil === 'medRammeOgStrek'}
             renderContent={() => (
                 <div>

diff --git a/src/app/components/uttaksplanlegger/components/periodeliste/items/PeriodelisteInfo.tsx b/src/app/components/uttaksplanlegger/components/periodeliste/items/PeriodelisteInfo.tsx
@@ -34,7 +34,7 @@ const PeriodelisteInfo: React.StatelessComponent<Props> = ({
     tittel,
     beskrivelse,
     tidsperiode,
-    farge = 'yellow',
+    farge = UttaksplanColor.yellow,
     border,
     periodeFargestrek,
     erSamtidigUttak,

diff --git a/...omponents/uttaksplanlegger/components/periodeliste/items/PeriodelisteOppholdAnnenPart.tsx b/...omponents/uttaksplanlegger/components/periodeliste/items/PeriodelisteOppholdAnnenPart.tsx
@@ -15,6 +15,7 @@ import { getPeriodeIkon } from '../elements/PeriodeHeader';
 import { getOppholdskontoNavn, getForelderNavn, getPeriodeForelderNavn, getUtsettelseTekst } from 'app/util/uttaksplan';
 import { formaterDatoKompakt } from 'common/util/datoUtils';
 import { getNavnGenitivEierform } from 'app/util/tekstUtils';
+import { UttaksplanColor } from 'app/types/uttaksplan/colors';
 
 export interface Props {
     itemId: string;
@@ -47,7 +48,7 @@ const PeriodelisteOppholdAnnenPart: React.StatelessComponent<Props & InjectedInt
             onToggle={onToggle}
             beskrivelse={getVarighetString(antallDager, intl)}
             ikon={getPeriodeIkon(periode, navnPåForeldre)}
-            farge="transparent"
+            farge={UttaksplanColor.transparent}
             border={true}
             navnAnnenForelder={navnAnnenForelder}
             erSamtidigUttak={isUttakAnnenPart(periode) ? periode.ønskerSamtidigUttak === true : false}

diff --git a/src/app/types/uttaksplan/colors.ts b/src/app/types/uttaksplan/colors.ts
@@ -1,9 +1,10 @@
-export type UttaksplanColor =
-    | 'purple'
-    | 'blue'
-    | 'green'
-    | 'purpleBlue'
-    | 'yellow'
-    | 'white'
-    | 'transparent'
-    | 'infoBlue';
+export enum UttaksplanColor {
+    'purple' = 'purple',
+    'blue' = 'blue',
+    'green' = 'green',
+    'purpleBlue' = 'purpleBlue',
+    'yellow' = 'yellow',
+    'white' = 'white',
+    'transparent' = 'transparent',
+    'infoBlue' = 'infoBlue'
+}
diff --git a/src/app/util/uttaksplan/styleUtils.ts b/src/app/util/uttaksplan/styleUtils.ts
@@ -3,7 +3,7 @@ import { Periode, Periodetype, StønadskontoType, Oppholdsperiode } from '../../
 import { UttaksplanColor } from '../../types/uttaksplan/colors';
 
 export const getForelderFarge = (forelder: Forelder) => {
-    return forelder === Forelder.mor ? 'purple' : 'blue';
+    return forelder === Forelder.mor ? UttaksplanColor.purple : UttaksplanColor.blue;
 };
 
 export const getStønadskontoFarge = (
@@ -12,30 +12,30 @@ export const getStønadskontoFarge = (
     forIkon?: boolean
 ): UttaksplanColor => {
     if (forIkon && (konto === StønadskontoType.Fellesperiode || konto === StønadskontoType.Flerbarnsdager)) {
-        return 'purpleBlue';
+        return UttaksplanColor.purpleBlue;
     }
 
     if (forelder === undefined) {
         switch (konto) {
             case StønadskontoType.Fedrekvote:
             case StønadskontoType.AktivitetsfriKvote:
-                return 'blue';
+                return UttaksplanColor.blue;
             case StønadskontoType.Mødrekvote:
             case StønadskontoType.Foreldrepenger:
             case StønadskontoType.ForeldrepengerFørFødsel:
-                return 'purple';
+                return UttaksplanColor.purple;
             case StønadskontoType.Fellesperiode:
             case StønadskontoType.Flerbarnsdager:
-                return 'purpleBlue';
+                return UttaksplanColor.purpleBlue;
             default:
-                return 'transparent';
+                return UttaksplanColor.transparent;
         }
     }
     return getForelderFarge(forelder);
 };
 
 export const getUtsettelseFarge = (): UttaksplanColor => {
-    return 'green';
+    return UttaksplanColor.green;
 };
 
 export const getOppholdFarge = (periode: Oppholdsperiode): UttaksplanColor => {