V3 add first names to project info (#913)

* Refactor consultants to a list and include first name in Sanity * Refactor project info to include first names
varianter · Nov 27, 2024 · 08593e6 · 08593e6
1 parent 8fb369c
commit 08593e6
Show file tree

Hide file tree

Showing 6 changed files with 60 additions and 31 deletions.
diff --git a/src/components/customerCases/customerCase/CustomerCase.tsx b/src/components/customerCases/customerCase/CustomerCase.tsx
@@ -20,7 +20,7 @@ export default async function CustomerCase({
   customerCasesPagePath,
 }: CustomerCaseProps) {
   const consultantsResult = await fetchEmployeesByEmails(
-    customerCase.projectInfo.consultants,
+    customerCase.projectInfo.consultants.map((e) => e.employeeEmail),
   );
 
   return (
@@ -32,10 +32,7 @@ export default async function CustomerCase({
         <hr className={styles.divider} />
         {consultantsResult.ok && (
           <div className={styles.projectInfoWrapper}>
-            <CustomerCaseProjectInfo
-              projectInfo={customerCase.projectInfo}
-              consultantsInProject={consultantsResult.value}
-            />
+            <CustomerCaseProjectInfo projectInfo={customerCase.projectInfo} />
           </div>
         )}
         <div className={styles.mainImageWrapper}>

diff --git a/src/components/customerCases/customerCase/projectInfo/CustomerCaseProjectInfo.tsx b/src/components/customerCases/customerCase/projectInfo/CustomerCaseProjectInfo.tsx
@@ -3,7 +3,6 @@ import { getTranslations } from "next-intl/server";
 import Badge from "src/components/badge/Badge";
 import CustomLink from "src/components/link/CustomLink";
 import Text from "src/components/text/Text";
-import { ChewbaccaEmployee } from "src/types/employees";
 import { LinkType } from "studio/lib/interfaces/navigation";
 import {
   CustomerCaseProjectInfo as CustomerCaseCaseProjectInfoObject,
@@ -14,15 +13,17 @@ import styles from "./customerCaseProjectInfo.module.css";
 
 interface CustomerCaseProjectInfoProps {
   projectInfo: CustomerCaseCaseProjectInfoObject;
-  consultantsInProject: ChewbaccaEmployee[];
 }
 
 export default async function CustomerCaseProjectInfo({
   projectInfo,
-  consultantsInProject,
 }: CustomerCaseProjectInfoProps) {
   const t = await getTranslations("customer_case");
 
+  const consultantsFirstNames = projectInfo.consultants.map(
+    (n) => n.employeeFirstName,
+  );
+
   return (
     <>
       <div className={styles.projectInfo}>
@@ -39,24 +40,26 @@ export default async function CustomerCaseProjectInfo({
               </div>
             </div>
           )}
-          <div>
-            <Text className={styles.title} type="labelRegular">
-              {t("variants").toUpperCase()}
-            </Text>
-            <div className={styles.varianter}>
-              <Text className={styles.preFancyCharacter}>【 </Text>
-              {consultantsInProject.map((c) => (
-                <Text
-                  key={c.name}
-                  type="bodyNormal"
-                  className={styles.dotSeperatorVarianter}
-                >
-                  {c.name}
-                </Text>
-              ))}
-              <Text className={styles.afterFancyCharacter}> 】</Text>
+          {consultantsFirstNames && (
+            <div>
+              <Text className={styles.title} type="labelRegular">
+                {t("variants").toUpperCase()}
+              </Text>
+              <div className={styles.varianter}>
+                <Text className={styles.preFancyCharacter}>【 </Text>
+                {consultantsFirstNames.map((name) => (
+                  <Text
+                    key={name}
+                    type="bodyNormal"
+                    className={styles.dotSeperatorVarianter}
+                  >
+                    {name}
+                  </Text>
+                ))}
+                <Text className={styles.afterFancyCharacter}> 】</Text>
+              </div>
             </div>
-          </div>
+          )}
           {projectInfo.collaborators && (
             <div>
               <Text className={styles.title} type="labelRegular">

diff --git a/src/components/customerCases/customerCase/projectInfo/customerCaseProjectInfo.module.css b/src/components/customerCases/customerCase/projectInfo/customerCaseProjectInfo.module.css
@@ -29,7 +29,7 @@
 
 .dotSeperator::after {
   content: "·";
-  margin: 0 0.5rem;
+  margin: 0 0.38rem;
 }
 
 .dotSeperator:last-child:after {
@@ -46,7 +46,7 @@
 
 .dotSeperatorVarianter::after {
   content: "·";
-  margin: 0 0.5rem;
+  margin: 0 0.38rem;
 }
 
 .dotSeperatorVarianter:nth-last-child(2)::after {

diff --git a/studioShared/lib/interfaces/customerCases.ts b/studioShared/lib/interfaces/customerCases.ts
@@ -12,7 +12,13 @@ export interface CustomerCaseProjectInfo {
   sector: string[];
   collaborators: string[];
   deliveries: Deliveries;
-  consultants: string[];
+  consultants: Consultants[];
+}
+
+export interface Consultants {
+  employeeEmail: string;
+  employeeFirstName: string;
+  _key: string;
 }
 
 export interface CustomerSector {

diff --git a/studioShared/lib/queries/customerCases.ts b/studioShared/lib/queries/customerCases.ts
@@ -65,7 +65,11 @@ export const CUSTOMER_CASE_QUERY = groq`
         }
       },
       collaborators,
-      consultants
+      "consultants": consultants[] {
+        _key,  
+        employeeEmail,
+        employeeFirstName,
+      }
     },
     "sections": sections[] {
       _key,

diff --git a/studioShared/schemas/fields/customerCaseProjectInfo.ts b/studioShared/schemas/fields/customerCaseProjectInfo.ts
@@ -55,9 +55,28 @@ export const customerCaseProjectInfo = defineField({
     defineField({
       name: "consultants",
       description:
-        "The consultants enrolled in the project. Use employee emails (e.g. '[email protected]').",
+        "The consultants enrolled in the project. Use employee emails and first names  (e.g. '[email protected]' and Odd Morten).",
       type: "array",
-      of: [{ type: "email" }],
+      of: [
+        {
+          type: "object",
+          title: "List of employees in project",
+          name: "employeesInProjectList",
+          fields: [
+            {
+              name: "employeeEmail",
+              title: "Add employee email (e.g. [email protected])",
+              type: "email",
+            },
+            {
+              name: "employeeFirstName",
+              title:
+                "Add the first name(s) of the consultant corresponding to the email above. If there are multiple employees with the same name, feel free to include the initials of the last name (e.g. Odd Morten S.)",
+              type: "string",
+            },
+          ],
+        },
+      ],
     }),
     defineField({
       name: "collaborators",