Address CLM review feedback: deduplicate routes/forms, fix agreement variable declarations, and harden template create null checks

webviewer-clm/src/App.tsx

@@ -1,50 +1,29 @@
 import {
   Refine,
-  GitHubBanner,
-  WelcomePage,
-  Authenticated,
-  useMenu,
-  useGetIdentity,
 } from "@refinedev/core";
-import { DevtoolsPanel, DevtoolsProvider } from "@refinedev/devtools";
+import { DevtoolsProvider } from "@refinedev/devtools";
 import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
 
-import {
-  AuthPage,
-  ErrorComponent,
-  useNotificationProvider,
-  ThemedLayout,
-  ThemedSider,
-} from "@refinedev/antd";
+import { useNotificationProvider } from "@refinedev/antd";
 import "@refinedev/antd/dist/reset.css";
 
 import { dataProvider, liveProvider } from "@refinedev/supabase";
 import { App as AntdApp } from "antd";
-import { BrowserRouter, Route, Routes, Outlet } from "react-router";
+import { BrowserRouter } from "react-router";
 import routerProvider, {
-  NavigateToResource,
-  CatchAllNavigate,
   UnsavedChangesNotifier,
   DocumentTitleHandler,
 } from "@refinedev/react-router";
-import { TemplateList, TemplateCreate, TemplateEdit } from "./pages/templates";
-import { AppIcon } from "./components/app-icon";
 import { supabaseClient } from "./utility";
 import { ColorModeContextProvider } from "./contexts/color-mode";
-import { Header } from "./components/header";
 import authProvider from "./authProvider";
 import {
   ContainerOutlined,
   FileOutlined,
   UserOutlined,
 } from "@ant-design/icons";
 import AppContent from "./AppContent";
-import { UserList } from "./pages/users/list";
-import { UserEdit } from "./pages/users/edit";
-import { AgreementCreate, AgreementList, AgreementShow } from "./pages/agreements";
 import AccessControlProvider from "./AccessControlProvider";
-import { AgreementSign } from "./pages/agreements/sign";
-import logo from '../src/components/logo.png';
 
 function App() {
   const resources = [
@@ -77,15 +56,6 @@ function App() {
         icon: <ContainerOutlined />,
       },
     },
-    {
-      name: "agreements",
-      list: "/agreements",
-      create: "/agreements/create",
-      show: "/agreements/show/:id",
-      meta: {
-        icon: <ContainerOutlined />,
-      },
-    },
   ];
 
   return (
@@ -109,76 +79,7 @@ function App() {
                   title: { text: "", icon: <></> },
                 }}
               >
-                <Routes>
-                  <Route
-                    element={
-                      <Authenticated
-                        key="authenticated-inner"
-                        fallback={<CatchAllNavigate to="/login" />}
-                      >
-                        <ThemedLayout
-                          Header={Header}
-                          Sider={(props) => <ThemedSider {...props} fixed />}>
-                          <Outlet />
-                        </ThemedLayout>
-                      </Authenticated>
-                    }
-                  >
-                    <Route
-                      index
-                      element={<NavigateToResource resource="agreements" />}
-                    />
-                    <Route path="/templates">
-                      <Route index element={<TemplateList />} />
-                      <Route path="create" element={<TemplateCreate />} />
-                      <Route path="edit/:id" element={<TemplateEdit />} />
-                    </Route>
-                    <Route path="/users">
-                      <Route index element={<UserList />} />
-                      <Route path="edit/:id" element={<UserEdit />} />
-                    </Route>
-                    <Route path="/agreements">
-                      <Route index element={<AgreementList />} />
-                      <Route path="create" element={<AgreementCreate />} />
-                      <Route path="show/:id" element={<AgreementShow />} />
-                      <Route path="sign/:id" element={<AgreementSign />} />
-                    </Route>
-                    <Route path="*" element={<ErrorComponent />} />
-                  </Route>
-                  <Route
-                    element={
-                      <Authenticated
-                        key="authenticated-outer"
-                        fallback={<Outlet />}
-                      >
-                        <NavigateToResource />
-                      </Authenticated>
-                    }
-                  >
-                    <Route
-                      path="/login"
-                      element={
-                        <AuthPage
-                          type="login"
-                          formProps={{
-                            initialValues: {
-                              email: "",
-                              password: "",
-                            },
-                          }}
-                        />
-                      }
-                    />
-                    <Route
-                      path="/register"
-                      element={<AuthPage type="register" />}
-                    />
-                    <Route
-                      path="/forgot-password"
-                      element={<AuthPage type="forgotPassword" />}
-                    />
-                  </Route>
-                </Routes>
+                <AppContent />
                 <RefineKbar />
                 <UnsavedChangesNotifier />
                 <DocumentTitleHandler />

webviewer-clm/src/AppContent.tsx

@@ -1,52 +1,26 @@
-import {
-  Authenticated,
-  useMenu,
-  useGetIdentity,
-} from "@refinedev/core";
+import { Authenticated } from "@refinedev/core";
 
 import {
   AuthPage,
   ErrorComponent,
-  useNotificationProvider,
   ThemedLayout,
   ThemedSider,
 } from "@refinedev/antd";
 import "@refinedev/antd/dist/reset.css";
 
-import { BrowserRouter, Route, Routes, Outlet } from "react-router";
-import routerProvider, {
+import { Route, Routes, Outlet } from "react-router";
+import {
   NavigateToResource,
   CatchAllNavigate,
 } from "@refinedev/react-router";
 import { TemplateList, TemplateCreate, TemplateEdit } from "./pages/templates";
 import { Header } from "./components/header";
-import {
-  ContainerOutlined,
-  FileFilled,
-  FileOutlined,
-  UserOutlined,
-} from "@ant-design/icons";
-import { UserCreate } from "./pages/users";
 import { UserList } from "./pages/users/list";
 import { UserEdit } from "./pages/users/edit";
-import { useEffect } from "react";
 import { AgreementList, AgreementCreate, AgreementShow } from "./pages/agreements";
+import { AgreementSign } from "./pages/agreements/sign";
 
 const AppContent = () => {
-
-  const { data: identity } = useGetIdentity<any>();
-
-  useEffect(() => {
-    console.log(identity);
-  }, [identity]);
-
-
-  const isAdmin = identity?.user_metadata?.role == "admin";
-
-  useEffect(() => {
-    console.log("Admin",isAdmin)
-  },[isAdmin])
-
   return (
     <Routes>
       <Route
@@ -61,33 +35,22 @@ const AppContent = () => {
             </ThemedLayout>
           </Authenticated>
         }>
-            <Route
-              index
-              element={<NavigateToResource resource="templates" />}
-            />
-            <Route path="/templates">
-              <Route index element={<TemplateList />} />
-              <Route path="create" element={<TemplateCreate />} />
-              <Route path="edit/:id" element={<TemplateEdit />} />
-            </Route>
-            <Route path="/users">
-              <Route index element={<UserList />} />
-              <Route path="edit/:id" element={<UserEdit />} />
-            </Route>
-            <Route path="/agreements">
-              <Route index element={<AgreementList />} />
-              <Route path="create" element={<AgreementCreate />} />
-              <Route path="show/:id" element={<AgreementShow />} />
-            </Route>
-            <Route
-              index
-              element={<NavigateToResource resource="agreements" />}
-            />
-            <Route path="/agreements">
-              <Route index element={<AgreementList />} />
-              <Route path="create" element={<AgreementCreate />} />
-              <Route path="show/:id" element={<AgreementShow />} />
-            </Route>
+        <Route index element={<NavigateToResource resource="agreements" />} />
+        <Route path="/templates">
+          <Route index element={<TemplateList />} />
+          <Route path="create" element={<TemplateCreate />} />
+          <Route path="edit/:id" element={<TemplateEdit />} />
+        </Route>
+        <Route path="/users">
+          <Route index element={<UserList />} />
+          <Route path="edit/:id" element={<UserEdit />} />
+        </Route>
+        <Route path="/agreements">
+          <Route index element={<AgreementList />} />
+          <Route path="create" element={<AgreementCreate />} />
+          <Route path="show/:id" element={<AgreementShow />} />
+          <Route path="sign/:id" element={<AgreementSign />} />
+        </Route>
         <Route path="*" element={<ErrorComponent />} />
       </Route>
       <Route
@@ -125,6 +88,6 @@ const AppContent = () => {
       </Route>
     </Routes>
   );
-};  
+};
 
-export default AppContent
+export default AppContent;

webviewer-clm/src/pages/agreements/create.tsx

@@ -77,7 +77,7 @@ export const AgreementCreate = () => {
             return;
         }
         const { Core } = instance;
-        const { PDFNet, Math, Annotations } = Core;
+        const { PDFNet, Math: PDFNetMath, Annotations } = Core;
         const { WidgetFlags } = Annotations;
         await PDFNet.initialize()
 
@@ -125,8 +125,8 @@ export const AgreementCreate = () => {
 
                 highlights.begin(document);
                 let quad = (await highlights.getCurrentQuads())[0];
-                var mathRect = new Math.Quad(quad?.p1x, quad?.p1y, quad?.p2x, quad?.p2y, quad?.p3x, quad?.p3y, quad?.p4x, quad?.p4y).toRect();
-                var rect = new  PDFNet.Rect(mathRect.x1, mathRect.y1, mathRect.x2, mathRect.y2);
+                const mathRect = new PDFNetMath.Quad(quad?.p1x, quad?.p1y, quad?.p2x, quad?.p2y, quad?.p3x, quad?.p3y, quad?.p4x, quad?.p4y).toRect();
+                const rect = new PDFNet.Rect(mathRect.x1, mathRect.y1, mathRect.x2, mathRect.y2);
 
                 await replacer.addString(result.out_str.slice(1,-1), '');
                 const page = await document.getPage(result?.page_num)

webviewer-clm/src/pages/blog-posts/create.tsx

@@ -1,7 +1,7 @@
 import { Create, useForm, useSelect } from "@refinedev/antd";
-import MDEditor from "@uiw/react-md-editor";
-import { Form, Input, Select } from "antd";
+import { Form } from "antd";
 import React from "react";
+import { BlogPostFormFields } from "./form";
 
 export const BlogPostCreate = () => {
   const { formProps, saveButtonProps } = useForm({});
@@ -13,59 +13,7 @@ export const BlogPostCreate = () => {
   return (
     <Create saveButtonProps={saveButtonProps}>
       <Form {...formProps} layout="vertical">
-        <Form.Item
-          label={"Title"}
-          name={["title"]}
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <Input />
-        </Form.Item>
-        <Form.Item
-          label={"Content"}
-          name="content"
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <MDEditor data-color-mode="light" />
-        </Form.Item>
-        <Form.Item
-          label={"Category"}
-          name={["category", "id"]}
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <Select {...categorySelectProps} />
-        </Form.Item>
-        <Form.Item
-          label={"Status"}
-          name={["status"]}
-          initialValue={"draft"}
-          rules={[
-            {
-              required: true,
-            },
-          ]}
-        >
-          <Select
-            defaultValue={"draft"}
-            options={[
-              { value: "draft", label: "Draft" },
-              { value: "published", label: "Published" },
-              { value: "rejected", label: "Rejected" },
-            ]}
-            style={{ width: 120 }}
-          />
-        </Form.Item>
+        <BlogPostFormFields categorySelectProps={categorySelectProps} />
       </Form>
     </Create>
   );