feat(Compensations): display salary for selected location, degree and…

… examination year

src/compensations/Compensations.tsx

@@ -5,8 +5,14 @@ import { CompensationsPage } from "studio/lib/payloads/compensations";
 import SalaryCalculator, {
   Degree,
 } from "./components/salaryCalculator/SalaryCalculator";
-import { useState } from "react";
-import { calculatePension, calculateSalary } from "./utils/calculateSalary";
+import { useMemo, useState } from "react";
+import {
+  calculatePension,
+  calculateSalary,
+  maxSalariesExaminationYear,
+  minSalariesExaminationYear,
+  salariesFromLocation,
+} from "./utils/salary";
 import { CompanyLocation } from "studio/lib/payloads/companyDetails";
 import {
   IOption,
@@ -34,6 +40,16 @@ const Compensations = ({ compensations, locations }: CompensationsProps) => {
     selectedDegree: "bachelor",
   });
 
+  const currentYearSalariesResult = useMemo(
+    () =>
+      salariesFromLocation(
+        currentYear,
+        selectedLocation,
+        compensations.salaries,
+      ),
+    [currentYear, selectedLocation, compensations.salaries],
+  );
+
   const updateSelectedDegree = (newDegree: Degree) => {
     setFormState((prevState) => ({
       ...prevState,
@@ -50,13 +66,14 @@ const Compensations = ({ compensations, locations }: CompensationsProps) => {
 
   const handleSubmit = (event: React.FormEvent) => {
     event.preventDefault();
-    setSalary(
-      calculateSalary(
-        currentYear,
-        formState.examinationYear,
-        formState.selectedDegree,
-      ),
+    if (!currentYearSalariesResult.ok) return;
+    const salary = calculateSalary(
+      formState.examinationYear,
+      formState.selectedDegree,
+      currentYearSalariesResult.value,
     );
+    if (salary === undefined) return;
+    setSalary(salary);
   };
 
   const locationOptions: IOption[] = locations.map((companyLocation) => ({
@@ -74,10 +91,16 @@ const Compensations = ({ compensations, locations }: CompensationsProps) => {
         selectedId={selectedLocation}
         onValueChange={(option) => setSelectedLocation(option.id)}
       />
-      {compensations.showSalaryCalculator && (
+      {compensations.showSalaryCalculator && currentYearSalariesResult.ok && (
         <>
           <SalaryCalculator
             examinationYearValue={formState.examinationYear}
+            minExaminationYear={minSalariesExaminationYear(
+              currentYearSalariesResult.value,
+            )}
+            maxExaminationYear={
+              maxSalariesExaminationYear(currentYearSalariesResult.value) - 1
+            }
             selectedDegree={formState.selectedDegree}
             onDegreeChanged={updateSelectedDegree}
             onExaminationYearChanged={updateExaminationYear}

src/compensations/components/salaryCalculator/SalaryCalculator.tsx

@@ -5,7 +5,6 @@ import {
   RadioButtonGroup,
 } from "src/components/forms/radioButtonGroup/RadioButtonGroup";
 import Button from "src/components/buttons/Button";
-import { maxExperience } from "src/compensations/utils/calculateSalary";
 
 export type Degree = "bachelor" | "master";
 
@@ -16,6 +15,8 @@ const degreeOptions: IOption[] = [
 
 interface SalaryCalculatorProps {
   examinationYearValue: number;
+  minExaminationYear: number;
+  maxExaminationYear: number;
   selectedDegree: Degree;
   onDegreeChanged: (degree: Degree) => void;
   onExaminationYearChanged: (examinationYear: number) => void;
@@ -24,15 +25,13 @@ interface SalaryCalculatorProps {
 
 export default function SalaryCalculator({
   examinationYearValue: yearValue,
+  minExaminationYear,
+  maxExaminationYear,
   selectedDegree,
   onDegreeChanged,
   onExaminationYearChanged,
   onSubmit,
 }: SalaryCalculatorProps) {
-  const currentYear = new Date().getFullYear();
-  const minExaminationYear = maxExperience(currentYear);
-  const maxExaminationYear = currentYear - 1;
-
   return (
     <form
       //TODO: replace aria-label with static translation from Sanity

src/compensations/utils/salary.ts

@@ -0,0 +1,54 @@
+import {
+  isSalariesType,
+  Salaries,
+} from "studio/components/salariesInput/utils/parseSalaries";
+import { SalariesByLocation } from "../../../studio/lib/payloads/compensations";
+import { Result, ResultError, ResultOk } from "../../../studio/utils/result";
+
+export function calculateSalary(
+  examinationYear: number,
+  degree: string,
+  salaries: Salaries,
+): number | undefined {
+  const degreeValue = degree === "bachelor" ? 1 : 0;
+  const adjustedYear = examinationYear + degreeValue;
+  return salaries[adjustedYear];
+}
+
+export function calculatePension(salary: number): number {
+  return Math.round(salary * 0.07);
+}
+
+function examinationYearsFromSalaries(salaries: Salaries) {
+  return Object.keys(salaries).map(Number);
+}
+
+export function minSalariesExaminationYear(salaries: Salaries): number {
+  return Math.min(...examinationYearsFromSalaries(salaries));
+}
+
+export function maxSalariesExaminationYear(salaries: Salaries): number {
+  return Math.max(...examinationYearsFromSalaries(salaries));
+}
+
+export function salariesFromLocation(
+  year: number,
+  locationId: string,
+  salariesByLocation: SalariesByLocation[],
+): Result<Salaries, string> {
+  const yearlySalaries = salariesByLocation.find(
+    (s) => s.location._ref === locationId,
+  )?.yearlySalaries;
+  if (yearlySalaries === undefined) {
+    return ResultError(`Could not find salaries for location '${locationId}'`);
+  }
+  const salariesData = yearlySalaries.find((s) => s.year === year);
+  if (salariesData === undefined) {
+    return ResultError(`Could not find salaries for year ${year}`);
+  }
+  const parsedSalaries = JSON.parse(salariesData.salaries);
+  if (!isSalariesType(parsedSalaries)) {
+    return ResultError("Parsed salaries data was not valid");
+  }
+  return ResultOk(parsedSalaries);
+}

studio/components/salariesInput/utils/parseSalaries.tsx

@@ -4,6 +4,16 @@ export interface Salaries {
   [year: string]: number;
 }
 
+export function isSalariesType(o: unknown): o is Salaries {
+  return (
+    typeof o === "object" &&
+    o !== null &&
+    Object.entries(o).every(
+      ([k, v]) => !isNaN(Number(k)) && typeof v === "number",
+    )
+  );
+}
+
 const NON_EMPTY_DIGITS_ONLY_REGEX = new RegExp(/^\d+$/);
 export const VALID_SALARY_REGEX = NON_EMPTY_DIGITS_ONLY_REGEX;
 

studio/lib/payloads/compensations.ts

@@ -1,5 +1,5 @@
 import { PortableTextBlock } from "src/components/richText/RichText";
-import { Slug } from "./global";
+import { Reference, Slug } from "./global";
 
 export interface Benefit {
   _type: string;
@@ -21,6 +21,13 @@ export interface SalariesPage {
   salaries: string;
 }
 
+export interface SalariesByLocation {
+  _key: string;
+  _type: string;
+  location: Reference;
+  yearlySalaries: SalariesPage[];
+}
+
 export interface CompensationsPage {
   _createdAt: string;
   _id: string;
@@ -31,5 +38,6 @@ export interface CompensationsPage {
   page: string;
   slug: Slug;
   benefitsByLocation: BenefitsByLocation[];
+  salaries: SalariesByLocation[];
   showSalaryCalculator: boolean;
 }

studio/lib/payloads/global.ts

@@ -2,3 +2,8 @@ export interface Slug {
   _type: string;
   current: string;
 }
+
+export interface Reference {
+  _type: "reference";
+  _ref: string;
+}