Add contract dates to people

Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>

Author: SachaProbo

apps/console/src/pages/organizations/people/NewPeopleView.tsx

@@ -25,6 +25,8 @@ const createPeopleMutation = graphql`
           primaryEmailAddress
           additionalEmailAddresses
           kind
+          contractStartDate
+          contractEndDate
         }
       }
     }
@@ -77,6 +79,8 @@ function NewPeopleViewContent() {
     primaryEmailAddress: "",
     additionalEmailAddresses: [] as string[],
     kind: "EMPLOYEE" as "EMPLOYEE" | "CONTRACTOR" | "SERVICE_ACCOUNT",
+    contractStartDate: "",
+    contractEndDate: "",
   });
 
   const handleFieldChange = (field: keyof typeof formData, value: unknown) => {
@@ -129,6 +133,8 @@ function NewPeopleViewContent() {
           primaryEmailAddress: formData.primaryEmailAddress,
           additionalEmailAddresses: formData.additionalEmailAddresses,
           kind: formData.kind,
+          contractStartDate: formData.contractStartDate ? new Date(formData.contractStartDate).toISOString() : null,
+          contractEndDate: formData.contractEndDate ? new Date(formData.contractEndDate).toISOString() : null,
         },
       },
       onCompleted: () => {
@@ -276,6 +282,20 @@ function NewPeopleViewContent() {
                     </button>
                   </div>
                 </div>
+
+                <EditableField
+                  label="Contract Start Date"
+                  value={formData.contractStartDate}
+                  type="date"
+                  onChange={(value) => handleFieldChange("contractStartDate", value)}
+                />
+
+                <EditableField
+                  label="Contract End Date"
+                  value={formData.contractEndDate}
+                  type="date"
+                  onChange={(value) => handleFieldChange("contractEndDate", value)}
+                />
               </div>
             </div>
           </Card>

apps/console/src/pages/organizations/people/PeopleView.tsx

@@ -14,7 +14,7 @@ import {
   useMutation,
 } from "react-relay";
 import { Suspense, useEffect, useState, useCallback } from "react";
-import type { PeopleViewQuery as PeopleViewQueryType } from "./__generated__/PeopleViewQuery.graphql";
+import type { PeopleViewQuery as PeopleViewQueryType, PeopleKind } from "./__generated__/PeopleViewQuery.graphql";
 import { useParams } from "react-router";
 import { PageTemplate } from "@/components/PageTemplate";
 import { PeopleViewSkeleton } from "./PeoplePage";
@@ -35,6 +35,8 @@ const peopleViewQuery = graphql`
         primaryEmailAddress
         additionalEmailAddresses
         kind
+        contractStartDate
+        contractEndDate
         createdAt
         updatedAt
       }
@@ -51,6 +53,8 @@ const updatePeopleMutation = graphql`
         primaryEmailAddress
         additionalEmailAddresses
         kind
+        contractStartDate
+        contractEndDate
         updatedAt
       }
     }
@@ -100,19 +104,34 @@ function PeopleViewContent({
     primaryEmailAddress: data.node.primaryEmailAddress || "",
     additionalEmailAddresses: data.node.additionalEmailAddresses || [],
     kind: data.node.kind,
+    contractStartDate: data.node.contractStartDate
+      ? new Date(data.node.contractStartDate).toISOString().split('T')[0]
+      : "",
+    contractEndDate: data.node.contractEndDate
+      ? new Date(data.node.contractEndDate).toISOString().split('T')[0]
+      : "",
   });
   const [commit] = useMutation(updatePeopleMutation);
   const [, loadQuery] = useQueryLoader<PeopleViewQueryType>(peopleViewQuery);
   const { toast } = useToast();
-
   const hasChanges = editedFields.size > 0;
 
   const handleSave = useCallback(() => {
+    const formattedData = {
+      ...formData,
+      contractStartDate: formData.contractStartDate
+        ? new Date(formData.contractStartDate).toISOString()
+        : null,
+      contractEndDate: formData.contractEndDate
+        ? new Date(formData.contractEndDate).toISOString()
+        : null,
+    };
+
     commit({
       variables: {
         input: {
           id: data.node.id,
-          ...formData,
+          ...formattedData,
         },
       },
       onCompleted: () => {
@@ -157,6 +176,12 @@ function PeopleViewContent({
       primaryEmailAddress: data.node.primaryEmailAddress || "",
       additionalEmailAddresses: data.node.additionalEmailAddresses || [],
       kind: data.node.kind,
+      contractStartDate: data.node.contractStartDate
+        ? new Date(data.node.contractStartDate).toISOString().split('T')[0]
+        : "",
+      contractEndDate: data.node.contractEndDate
+        ? new Date(data.node.contractEndDate).toISOString().split('T')[0]
+        : "",
     });
     setEditedFields(new Set());
   };
@@ -256,6 +281,29 @@ function PeopleViewContent({
                     </SelectContent>
                   </Select>
                 </div>
+                <EditableField
+                  label="Contract Start Date"
+                  value={formData.contractStartDate || ""}
+                  type="date"
+                  onChange={(value) =>
+                    handleFieldChange(
+                      "contractStartDate" as keyof typeof formData,
+                      value,
+                    )
+                  }
+                />
+
+                <EditableField
+                  label="Contract End Date"
+                  value={formData.contractEndDate || ""}
+                  type="date"
+                  onChange={(value) =>
+                    handleFieldChange(
+                      "contractEndDate" as keyof typeof formData,
+                      value,
+                    )
+                  }
+                />
               </div>
             </div>
           </Card>

apps/console/src/pages/organizations/people/__generated__/NewPeopleViewCreatePeopleMutation.graphql.ts

@@ -0,0 +1,3 @@
+ALTER TABLE peoples
+  ADD COLUMN contract_start_date DATE,
+  ADD COLUMN contract_end_date DATE;