- Refactor of workflow and steps types to differentiate between editView and normalView.

- Added side panel with steps details

src/interfaces/approval.workflow.ts

@@ -12,6 +12,17 @@ export interface ApprovalWorkflow {
     steps: WorkflowStep[],
 }
 
+export interface EditableApprovalWorkflow {
+    id: string,
+    name: string,
+    entityId: string,
+    requester: User["id"],
+    startDate: number,
+    modules: Module[],
+    status: ApprovalWorkflowStatus,
+    steps: EditableWorkflowStep[],
+}
+
 export type StepType = "form-intake" | "approval-by";
 export const StepTypeLabel: Record<StepType, string> = {
 	"form-intake": "Form Intake",
@@ -19,19 +30,28 @@ export const StepTypeLabel: Record<StepType, string> = {
 };
 
 export interface WorkflowStep {
-    key?: number,
-    stepType?: StepType,
+    stepType: StepType,
     stepNumber: number,
-    completed?: boolean,
+    completed: boolean,
     completedBy?: User["id"],
-    assignees?: (User["id"] | null | undefined)[]; // bit of an hack, but allowing null or undefined values allows us to match one to one the select input components with the assignees array. And since select inputs allow undefined or null values, it is allowed here too, but must validate required input before form submission
-    assigneesType?: Type,
+    completedDate?: number,
+    assignees: (User["id"])[];
     firstStep?: boolean,
     currentStep?: boolean,
     finalStep?: boolean,
-    selected?: boolean,
+    selected: boolean,
+    comments?: string,
+    onClick: React.MouseEventHandler<HTMLDivElement>
+}
+
+export interface EditableWorkflowStep {
+    key: number,
+    stepType: StepType,
+    stepNumber: number,
+    assignees: (User["id"] | null | undefined)[]; // bit of an hack, but allowing null or undefined values allows us to match one to one the select input components with the assignees array. And since select inputs allow undefined or null values, it is allowed here too, but must validate required input before form submission
+    firstStep: boolean,
+    finalStep?: boolean,
     onDelete?: () => void;
-    onClick?: React.MouseEventHandler<HTMLDivElement>
 }
 
 export function getUserTypeLabel(type: Type | undefined): string {