diff --git a/frontend/src/pages/groups/GroupCreatePage.tsx b/frontend/src/pages/groups/GroupCreatePage.tsx
index c15116736..225a4e951 100644
--- a/frontend/src/pages/groups/GroupCreatePage.tsx
+++ b/frontend/src/pages/groups/GroupCreatePage.tsx
@@ -24,6 +24,17 @@ const GroupCreatePage: FunctionComponent = () => {
   const onSubmit = async (input: GroupCreateInput) => {
     try {
       // Create the group and then redirect to its view/edit page
+
+      // TODO fix the fact that the backend validations consider null values as
+      // invalid inputs.
+      if (input.primaryContact) {
+        input.primaryContact.whatsApp =
+          input.primaryContact.whatsApp || undefined
+        input.primaryContact.phone = input.primaryContact.phone || undefined
+        input.primaryContact.signal = input.primaryContact.signal || undefined
+        input.primaryContact.email = input.primaryContact.email || undefined
+      }
+
       const { data } = await addGroup({
         variables: { input },
         // Fetch the updated list of groups
diff --git a/frontend/src/pages/groups/GroupEditPage.tsx b/frontend/src/pages/groups/GroupEditPage.tsx
index 53664aad7..0c9fed3f1 100644
--- a/frontend/src/pages/groups/GroupEditPage.tsx
+++ b/frontend/src/pages/groups/GroupEditPage.tsx
@@ -29,6 +29,21 @@ const GroupEditPage: FunctionComponent = () => {
 
   const onSubmit = async (input: GroupUpdateInput) => {
     try {
+      // TODO fix the fact that the backend validations consider null values as
+      // invalid inputs.
+      // Potential solutions:
+      // 1. make fields undefined on the frontend
+      // 2. support undefined in the validations
+      // 3. transform to undefined on the backend
+
+      if (input.primaryContact) {
+        input.primaryContact.whatsApp =
+          input.primaryContact.whatsApp || undefined
+        input.primaryContact.phone = input.primaryContact.phone || undefined
+        input.primaryContact.signal = input.primaryContact.signal || undefined
+        input.primaryContact.email = input.primaryContact.email || undefined
+      }
+
       await updateGroup({
         variables: { id: parseInt(groupId, 10), input },
       })
diff --git a/frontend/src/pages/offers/CreateOfferForm.tsx b/frontend/src/pages/offers/CreateOfferForm.tsx
index e8eeeec8a..41c70b8bf 100644
--- a/frontend/src/pages/offers/CreateOfferForm.tsx
+++ b/frontend/src/pages/offers/CreateOfferForm.tsx
@@ -28,6 +28,12 @@ interface Props {
   onSubmit: (input: OfferCreateInput) => void
 }
 
+/**
+ * TODO
+ * If the user is an admin, they should be able to select a SENDING group.
+ * If the user is not an admin, they should automatically use their own group
+ */
+
 /**
  * This form allows users to create a new offer. It is very specific to offer
  * creation, and therefore difficult to reuse for editing offers.
@@ -41,6 +47,7 @@ const OfferForm: FunctionComponent<Props> = (props) => {
   // TODO switch to filtering groups when the resolver supports it
   const { data: groups, loading: isLoadingGroups } = useAllGroupsQuery()
 
+  // TODO this won't work if the user is an admin
   const groupForUser = useMemo(() => {
     if (groups?.listGroups && profile) {
       return groups.listGroups.find(
@@ -77,15 +84,27 @@ const OfferForm: FunctionComponent<Props> = (props) => {
     input.shipmentId = props.shipmentId
     input.sendingGroupId = groupForUser.id
 
+    // TODO fix the fact that the backend validations consider null values as
+    // invalid inputs.
+    if (input.contact) {
+      input.contact.email = input.contact?.email || undefined
+      input.contact.phone = input.contact?.phone || undefined
+      input.contact.whatsApp = input.contact?.whatsApp || undefined
+      input.contact.signal = input.contact?.signal || undefined
+    }
+
     props.onSubmit(input)
   }
 
-  if (!groupForUser || !profile) {
-    return (
-      <div>
-        <Spinner /> Loading form data
-      </div>
-    )
+  // TODO this won't work if the user is an admin
+  if (!profile?.isAdmin) {
+    if (!groupForUser || !profile) {
+      return (
+        <div>
+          <Spinner /> Loading form data
+        </div>
+      )
+    }
   }
 
   return (
@@ -111,35 +130,35 @@ const OfferForm: FunctionComponent<Props> = (props) => {
           name="contact.name"
           register={register}
           errors={errors}
-          defaultValue={groupForUser.primaryContact.name}
+          defaultValue={groupForUser?.primaryContact.name}
         />
         <TextField
           label="Email"
           name="contact.email"
           register={register}
           errors={errors}
-          defaultValue={groupForUser.primaryContact.email || ''}
+          defaultValue={groupForUser?.primaryContact.email || ''}
         />
         <TextField
           label="WhatsApp"
           name="contact.whatsApp"
           register={register}
           errors={errors}
-          defaultValue={groupForUser.primaryContact.whatsApp || ''}
+          defaultValue={groupForUser?.primaryContact.whatsApp || ''}
         />
         <TextField
           label="Phone"
           name="contact.phone"
           register={register}
           errors={errors}
-          defaultValue={groupForUser.primaryContact.phone || ''}
+          defaultValue={groupForUser?.primaryContact.phone || ''}
         />
         <TextField
           label="Signal"
           name="contact.signal"
           register={register}
           errors={errors}
-          defaultValue={groupForUser.primaryContact.signal || ''}
+          defaultValue={groupForUser?.primaryContact.signal || ''}
         />
       </fieldset>
       <fieldset>