Enabling editing of 'estimated hourly price' for a consultant (#724)

Author: astride

backend/Api/Common/StorageService.cs

@@ -200,6 +200,7 @@ public async Task<Consultant> CreateConsultant(Organization org, ConsultantWrite
         if (department is not null) consultant.Department = department;
         consultant.GraduationYear = body.GraduationYear;
         consultant.Degree = body.Degree;
+        consultant.EstimatedHourPrice = body.EstimatedHourPrice;
 
         if (body.Discipline?.Id != consultant.DisciplineId)
         {

backend/Api/Consultants/ConsultantModels.cs

@@ -17,7 +17,8 @@ public record SingleConsultantReadModel(
     int? GraduationYear,
     int YearsOfExperience,
     Degree Degree,
-    DisciplineReadModel? Discipline)
+    DisciplineReadModel? Discipline,
+    int EstimatedHourPrice)
 {
     public SingleConsultantReadModel(Consultant consultant)
         : this(
@@ -31,7 +32,8 @@ public SingleConsultantReadModel(Consultant consultant)
             consultant.GraduationYear,
             consultant.YearsOfExperience,
             consultant.Degree ?? Degree.Master,
-            DisciplineReadModel.CreateIfExists(consultant.Discipline)
+            DisciplineReadModel.CreateIfExists(consultant.Discipline),
+            consultant.EstimatedHourPrice
         )
     {
     }
@@ -62,4 +64,5 @@ public record ConsultantWriteModel(
     UpdateDepartmentReadModel Department,
     int GraduationYear,
     Degree Degree,
-    DisciplineReadModel? Discipline);
+    DisciplineReadModel? Discipline,
+    int EstimatedHourPrice);

frontend/mockdata/mockData.ts

@@ -418,5 +418,6 @@ export const MockConsultants: ConsultantReadModel[] = [
     isOccupied: true,
     graduationYear: 2010,
     degree: Degree.Bachelor,
+    estimatedHourPrice: 1200,
   },
 ];

frontend/src/api-types.ts

@@ -58,6 +58,8 @@ export interface ConsultantReadModel {
   yearsOfExperience: number;
   graduationYear: number;
   degree: Degree;
+  /** @format int32 */
+  estimatedHourPrice: number;
   bookings: BookedHoursPerWeek[];
   detailedBooking: DetailedBooking[];
   isOccupied: boolean;
@@ -76,6 +78,8 @@ export interface ConsultantWriteModel {
   degree: Degree;
   /** @format int32 */
   graduationYear: number;
+  /** @format int32 */
+  estimatedHourPrice: number;
   startDate: Date;
   endDate?: Date;
 }
@@ -222,6 +226,8 @@ export interface SingleConsultantReadModel {
   graduationYear: number;
   /** @format int32 */
   yearsOfExperience: number;
+  /** @format int32 */
+  estimatedHourPrice: number;
   degree: Degree;
   imageUrl?: string;
   imageThumbUrl?: string;

frontend/src/components/consultants/AddNewConsultantModal.tsx

@@ -21,6 +21,7 @@ export default function AddNewConsultantModal({
     degree: Degree.None,
     graduationYear: new Date().getFullYear(),
     startDate: new Date(),
+    estimatedHourPrice: 0,
   });
   const { competences, departments } = useContext(FilteredContext);
   const { organisation } = useParams();

frontend/src/components/consultants/EditableTableNumberCell.tsx

@@ -0,0 +1,38 @@
+"use client";
+import React, { useEffect, useState } from "react";
+
+export default function EditableTableNumberCell({
+  number,
+  setConsultant,
+  isEditing,
+}: {
+  number: number;
+  setConsultant: (number: number) => void;
+  isEditing: boolean;
+}) {
+  const [newValue, setNewValue] = useState<number>(number);
+
+  useEffect(() => {
+    if (isEditing) {
+      setConsultant(newValue);
+    }
+  }, [newValue]);
+
+  return (
+    <td className="pr-3">
+      {isEditing ? (
+        <input
+          className="w-full py-2 px-3 border border-primary_50 rounded-md focus:outline-none focus:ring-1 focus:ring-primary text-sm"
+          type="number"
+          min="0"
+          value={newValue}
+          onChange={(e) => setNewValue(Number(e.target.value))}
+        />
+      ) : (
+        <p className="normal text-text_light_black float-right">
+          {newValue.toLocaleString("no-nb")}
+        </p>
+      )}
+    </td>
+  );
+}

frontend/src/components/consultants/FilteredConsultantsComp.tsx

@@ -9,8 +9,9 @@ import {
 import { useSimpleConsultantsFilter } from "@/hooks/staffing/useConsultantsFilter";
 import Image from "next/image";
 import React, { useContext, useEffect, useRef, useState } from "react";
-import { Edit3, Check } from "react-feather";
+import { Edit3, Check, Info } from "react-feather";
 import EditableTableTextCell from "./EditableTableTextCell";
+import EditableTableNumberCell from "./EditableTableNumberCell";
 import EditableTableDateCell from "./EditableTableDateCell";
 import { FilteredContext } from "@/hooks/ConsultantFilterProvider";
 import EditableTableSelectDepartmentCell from "./EditableTableSelectDepartmentCell";
@@ -155,6 +156,18 @@ export default function FilteredConsultantsComp({
               <p className="normal text-left">Eksamensår</p>
             </div>
           </th>
+
+          <th className="py-1 pt-3 w-20">
+            <div className="flex flex-col gap-1">
+              <p className="normal text-left" title="Estimert timepris">
+                Timepris
+                <span className="pl-1">
+                  <Info className="inline" size="15" />
+                </span>
+              </p>
+            </div>
+          </th>
+
           <th className="py-1 pt-3 w-14">
             <div className="flex flex-col gap-1"></div>
           </th>
@@ -327,6 +340,20 @@ export default function FilteredConsultantsComp({
                 isEditing={selectedEditConsultant?.id === consultant.id}
               />
 
+              <EditableTableNumberCell
+                setConsultant={(hourPrice: number) =>
+                  setSelectedEditConsultant((selectedConsultant) => {
+                    if (!selectedConsultant) return null;
+                    return {
+                      ...selectedConsultant,
+                      estimatedHourPrice: hourPrice,
+                    };
+                  })
+                }
+                number={consultant.estimatedHourPrice}
+                isEditing={selectedEditConsultant?.id === consultant.id}
+              />
+
               <td className="rounded-r-md">
                 <button
                   className="flex self-center hover:bg-background_light_purple p-2 rounded float-right"