Implementing Contract creation on draft page

gui/rpk-gui/package-lock.json

@@ -35,6 +35,7 @@
         "@tiptap/extension-underline": "^2.11.7",
         "@tiptap/react": "^2.11.7",
         "@tiptap/starter-kit": "^2.11.7",
+        "dayjs": "^1.11.13",
         "i18next": "^25.0.1",
         "i18next-browser-languagedetector": "^8.0.5",
         "i18next-http-backend": "^3.0.2",

gui/rpk-gui/package.json

@@ -31,6 +31,7 @@
     "@tiptap/extension-underline": "^2.11.7",
     "@tiptap/react": "^2.11.7",
     "@tiptap/starter-kit": "^2.11.7",
+    "dayjs": "^1.11.13",
     "i18next": "^25.0.1",
     "i18next-browser-languagedetector": "^8.0.5",
     "i18next-http-backend": "^3.0.2",

gui/rpk-gui/src/pages/firm/ContractRoutes.tsx

@@ -1,9 +1,8 @@
 import { Route, Routes } from "react-router";
 import List from "./base-page/List";
 import Edit from "./base-page/Edit";
-import New from "./base-page/New";
 
-type Contract = {
+export type Contract = {
   id: string,
   label: string
 }
@@ -13,7 +12,6 @@ export const ContractRoutes = () => {
     <Routes>
       <Route index element={ <ListContract /> } />
       <Route path="/edit/:record_id" element={ <EditContract /> } />
-      <Route path="/create" element={ <CreateContract /> } />
     </Routes>
   );
 }
@@ -28,7 +26,3 @@ const ListContract = () => {
 const EditContract = () => {
   return <Edit<Contract> resource={`contracts`} schemaName={"Contract"} />
 }
-
-const CreateContract = () => {
-  return <New<Contract> resource={`contracts`} schemaName={"Contract"} />
-}

gui/rpk-gui/src/pages/firm/DraftRoutes.tsx

@@ -1,7 +1,7 @@
-import { Route, Routes } from "react-router";
+import { Navigate, Route, Routes, useParams } from "react-router";
 import { CircularProgress } from "@mui/material";
 import React, { useContext, useState } from "react";
-import { useOne } from "@refinedev/core";
+import { useOne, useTranslation } from "@refinedev/core";
 import { BaseForm } from "../../lib/crud/components/base-form";
 import { ForeignKeyReference, ForeignKeySchema } from "../../lib/crud/components/widgets/foreign-key";
 
@@ -9,6 +9,8 @@ import { FirmContext } from "../../contexts/FirmContext";
 import List from "./base-page/List";
 import Edit from "./base-page/Edit";
 import New from "./base-page/New";
+import { Contract } from "./ContractRoutes";
+import dayjs from "dayjs";
 
 type Draft = {
   id: string,
@@ -33,7 +35,63 @@ const ListDraft = () => {
 }
 
 const EditDraft = () => {
-  return <Edit<Draft> resource={`contracts/drafts`} schemaName={"ContractDraft"} />
+  const { currentFirm } = useContext(FirmContext);
+  const { record_id } = useParams();
+  const resourceBasePath = `firm/${currentFirm.instance}/${currentFirm.firm}`
+
+  const { data, isLoading } = useOne({
+    resource: `${resourceBasePath}/contracts/drafts`,
+    id: record_id
+  })
+
+  if (isLoading) {
+    return <CircularProgress />
+  }
+
+  if (!data?.data) {
+    return <Navigate to="../" />
+  }
+
+  const draft = data?.data
+  const readOnly = draft.status === "published";
+
+  const uiSchema = {
+    "ui:readonly":  readOnly
+  }
+
+  return (
+    <>
+      <Edit<Draft> resource={"contracts/drafts"} schemaName={"ContractDraft"} uiSchema={uiSchema} />
+      <ContractCreate draft={draft}></ContractCreate>
+    </>
+  )
+}
+
+const ContractCreate = (props: { draft: any}) => {
+  const { translate: t } = useTranslation();
+  const { draft } = props;
+
+  if (draft.status === "published") {
+    return <h4>{t("resource.draft.already_published") }</h4>
+  }
+  if (draft.status === "in_progress") {
+    return (
+      <>
+        <h4>{ t("resource.draft.todo") + ":" }</h4>
+        <ul>{ draft.todo.map((item: any) => <li>{ item }</li>) }</ul>
+      </>
+    )
+  }
+  return <New<Contract>
+    resource={"contracts"}
+    schemaName={"Contract"}
+    defaultValue={{
+      date: dayjs().format("YYYY-MM-DD"),
+      location: "Los Santos, SA",
+      draft_id: draft.id
+    }}
+    uiSchema={{ draft_id: { 'ui:widget': 'hidden' } }}
+  />
 }
 
 type ForeignKeySubSchema = ForeignKeySchema & {