feat: edit contact form

app/components/Contact/ContactTableRow.tsx

@@ -1,18 +1,20 @@
 import Button from "@button-inc/bcgov-theme/Button";
+import useCreateEditContactFormChange from "mutations/Contact/createEditContactFormChange";
 import { useRouter } from "next/router";
-import { getContactViewPageRoute } from "pageRoutes";
+import { getContactFormPageRoute } from "pageRoutes";
 import { useFragment, graphql } from "react-relay";
 import { ContactTableRow_contact$key } from "__generated__/ContactTableRow_contact.graphql";
+import { createEditContactFormChangeMutation$data } from "__generated__/createEditContactFormChangeMutation.graphql";
 
 interface Props {
   contact: ContactTableRow_contact$key;
 }
 
 const ContactTableRow: React.FC<Props> = ({ contact }) => {
-  const { id, fullName, fullPhone, position } = useFragment(
+  const { rowId, fullName, fullPhone, position } = useFragment(
     graphql`
       fragment ContactTableRow_contact on Contact {
-        id
+        rowId
         fullName
         fullPhone
         position
@@ -22,9 +24,18 @@ const ContactTableRow: React.FC<Props> = ({ contact }) => {
   );
 
   const router = useRouter();
+  const [startContactRevision, isStartingContactRevision] =
+    useCreateEditContactFormChange();
 
-  const handleViewClick = () => {
-    router.push(getContactViewPageRoute(id));
+  const handleEditContact = () => {
+    startContactRevision({
+      variables: { contactRowId: rowId },
+      onCompleted: (response: createEditContactFormChangeMutation$data) => {
+        router.push(
+          getContactFormPageRoute(response.createFormChange.formChange.id)
+        );
+      },
+    });
   };
 
   return (
@@ -34,8 +45,12 @@ const ContactTableRow: React.FC<Props> = ({ contact }) => {
       <td>{position}</td>
       <td>
         <div className="actions">
-          <Button size="small" onClick={handleViewClick}>
-            View
+          <Button
+            size="small"
+            disabled={isStartingContactRevision}
+            onClick={handleEditContact}
+          >
+            Edit
           </Button>
         </div>
       </td>

app/mutations/Contact/createEditContactFormChange.ts

@@ -0,0 +1,36 @@
+import { useMutation, graphql, Disposable, Environment } from "react-relay";
+import { MutationConfig } from "relay-runtime";
+import { createEditContactFormChangeMutation } from "__generated__/createEditContactFormChangeMutation.graphql";
+
+export const mutation = graphql`
+  mutation createEditContactFormChangeMutation($contactRowId: Int!) {
+    createFormChange(
+      input: {
+        formDataSchemaName: "cif"
+        formDataTableName: "contact"
+        jsonSchemaName: "contact"
+        operation: "UPDATE"
+        changeReason: "Created from contact form"
+        formDataRecordId: $contactRowId
+      }
+    ) {
+      formChange {
+        id
+      }
+    }
+  }
+`;
+
+export const useCreateEditContactFormChange = (
+  commitMutationFn?: (
+    environment: Environment,
+    config: MutationConfig<createEditContactFormChangeMutation>
+  ) => Disposable
+) => {
+  return useMutation<createEditContactFormChangeMutation>(
+    mutation,
+    commitMutationFn
+  );
+};
+
+export default useCreateEditContactFormChange;

app/mutations/Contact/createNewContactFormChange.ts

@@ -0,0 +1,33 @@
+import { useMutation, graphql, Disposable, Environment } from "react-relay";
+import { MutationConfig } from "relay-runtime";
+import { createNewContactFormChangeMutation } from "__generated__/createNewContactFormChangeMutation.graphql";
+
+export const mutation = graphql`
+  mutation createNewContactFormChangeMutation {
+    createFormChange(
+      input: {
+        formDataSchemaName: "cif"
+        formDataTableName: "contact"
+        jsonSchemaName: "contact"
+        operation: "INSERT"
+        changeReason: "Created from contact form"
+      }
+    ) {
+      formChange {
+        id
+      }
+    }
+  }
+`;
+
+export const useCreateNewContactFormChange = (
+  commitMutationFn?: (
+    environment: Environment,
+    config: MutationConfig<createNewContactFormChangeMutation>
+  ) => Disposable
+) => {
+  return useMutation<createNewContactFormChangeMutation>(
+    mutation,
+    commitMutationFn
+  );
+};

app/pages/cif/contacts.tsx

@@ -7,7 +7,7 @@ import { NoHeaderFilter, TextFilter } from "components/Table/Filters";
 import Table from "components/Table";
 import ContactTableRow from "components/Contact/ContactTableRow";
 import { Button } from "@button-inc/bcgov-theme";
-import useCreateContactFormChange from "mutations/Contact/createContactFormChange";
+import { useCreateNewContactFormChange } from "mutations/Contact/createNewContactFormChange";
 import { useRouter } from "next/router";
 import { createContactFormChangeMutation$data } from "__generated__/createContactFormChangeMutation.graphql";
 import { getContactFormPageRoute } from "pageRoutes";
@@ -56,7 +56,7 @@ const tableFilters = [
 function Contacts({ preloadedQuery }: RelayProps<{}, contactsQuery>) {
   const { session, allContacts } = usePreloadedQuery(pageQuery, preloadedQuery);
   const router = useRouter();
-  const [addContact, isAddingContact] = useCreateContactFormChange();
+  const [addContact, isAddingContact] = useCreateNewContactFormChange();
 
   const handleAddContact = () => {
     addContact({

app/postgraphile.tags.json5

@@ -31,6 +31,11 @@
           omit: ["create", "update", "delete"],
         },
       },
+      "cif.form_change": {
+        tags: {
+          omit: ["create"],
+        },
+      },
     },
     procedure: {
       "cif.contact_full_name": {

app/schema/schema.graphql

@@ -17479,19 +17479,27 @@ type CreateCifUserPayload {
   query: Query
 }
 
-"""All input for the create `FormChange` mutation."""
+"""All input for the `createFormChange` mutation."""
 input CreateFormChangeInput {
+  changeReason: String!
+  changeStatus: String
+
   """
   An arbitrary string value with no semantic meaning. Will be included in the
   payload verbatim. May be used to track mutations by the client.
   """
   clientMutationId: String
-
-  """The `FormChange` to be created by this mutation."""
-  formChange: FormChangeInput!
+  formDataRecordId: Int
+  formDataSchemaName: String!
+  formDataTableName: String!
+  jsonSchemaName: String!
+  newFormData: JSON
+  operation: String!
+  projectRevisionId: Int
+  validationErrors: JSON
 }
 
-"""The output of our create `FormChange` mutation."""
+"""The output of our `createFormChange` mutation."""
 type CreateFormChangePayload {
   """Reads a single `ChangeStatus` that is related to this `FormChange`."""
   changeStatusByChangeStatus: ChangeStatus
@@ -17507,8 +17515,6 @@ type CreateFormChangePayload {
   unchanged and unused. May be used by a client to track mutations.
   """
   clientMutationId: String
-
-  """The `FormChange` that was created by this mutation."""
   formChange: FormChange
 
   """An edge for our `FormChange`. May be used by Relay 1."""
@@ -18903,6 +18909,7 @@ input FormChangeFilter {
   validationErrors: JSONFilter
 }
 
+<<<<<<< chore/archived-at-refactor
 """An input for mutations affecting `FormChange`"""
 input FormChangeInput {
   """The reason for the change"""
@@ -18952,6 +18959,8 @@ input FormChangeInput {
   validationErrors: JSON
 }
 
+=======
+>>>>>>> feat: edit contact form
 """
 The type of change operation, defining the action taken when the form_change is committed.
 """
@@ -21972,8 +21981,6 @@ type Mutation {
     """
     input: CreateCifUserInput!
   ): CreateCifUserPayload
-
-  """Creates a single `FormChange`."""
   createFormChange(
     """
     The exclusive input argument for this mutation. An object type, make sure to see documentation for this object’s fields.