From d57cac47e70cae27e2d492440fede7853cd71a5c Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Mon, 5 Dec 2022 15:45:36 +0800
Subject: [PATCH] Basic page for accepting invites

---
 .../networking/mutations/joinGroupMutation.ts | 51 +++++++++++++++++++
 packages/web/pages/invite/[inviteCode].tsx    | 45 ++++++++++++++++
 2 files changed, 96 insertions(+)
 create mode 100644 packages/web/lib/networking/mutations/joinGroupMutation.ts
 create mode 100644 packages/web/pages/invite/[inviteCode].tsx

diff --git a/packages/web/lib/networking/mutations/joinGroupMutation.ts b/packages/web/lib/networking/mutations/joinGroupMutation.ts
new file mode 100644
index 000000000..86c7b9000
--- /dev/null
+++ b/packages/web/lib/networking/mutations/joinGroupMutation.ts
@@ -0,0 +1,51 @@
+import { gql } from 'graphql-request'
+import { gqlFetcher } from '../networkHelpers'
+
+export interface RecommendationGroup {
+  id: string
+  name: string
+  createdAt: Date
+  updatedAt: Date
+}
+
+type JoinGroupResponse = {
+  joinGroup?: JoinGroupData
+  errorCodes?: string[]
+}
+
+type JoinGroupData = {
+  group: RecommendationGroup | undefined
+}
+
+export async function joinGroupMutation(
+  inviteCode: string
+): Promise<RecommendationGroup | undefined> {
+  const mutation = gql`
+    mutation JoinGroup($inviteCode: String!) {
+      joinGroup(inviteCode: $inviteCode) {
+        ... on JoinGroupSuccess {
+          group {
+            id
+            name
+            createdAt
+            updatedAt
+          }
+        }
+        ... on JoinGroupError {
+          errorCodes
+        }
+      }
+    }
+  `
+
+  console.log('JoinGroupMutation', mutation)
+
+  const response = await gqlFetcher(mutation, { inviteCode })
+  console.log(' -- response', response)
+  const data = response as JoinGroupResponse | undefined
+  const error = data?.errorCodes?.find(() => true)
+  if (error) {
+    throw error
+  }
+  return data?.joinGroup?.group
+}
diff --git a/packages/web/pages/invite/[inviteCode].tsx b/packages/web/pages/invite/[inviteCode].tsx
new file mode 100644
index 000000000..6e68a1684
--- /dev/null
+++ b/packages/web/pages/invite/[inviteCode].tsx
@@ -0,0 +1,45 @@
+import { useRouter } from 'next/router'
+import { useEffect, useState } from 'react'
+import { PageMetaData } from '../../components/patterns/PageMetaData'
+import { ProfileLayout } from '../../components/templates/ProfileLayout'
+import { joinGroupMutation } from '../../lib/networking/mutations/joinGroupMutation'
+import { showSuccessToast } from '../../lib/toastHelpers'
+
+export default function InvitePage(): JSX.Element {
+  const router = useRouter()
+  const { inviteCode } = router.query
+
+  const [error, setError] = useState<string | undefined>(undefined)
+
+  useEffect(() => {
+    if (!router.isReady) {
+      return
+    }
+    if (!inviteCode || typeof inviteCode != 'string') {
+      setError('No invite code provided')
+    }
+
+    const joinGroup = async () => {
+      try {
+        const result = await joinGroupMutation(inviteCode as string)
+        if (!result) {
+          throw 'Unknown error occurred.'
+        }
+        showSuccessToast(`You have been added to the ${result.name} group`)
+      } catch (error) {
+        setError('Unable to join group')
+      }
+    }
+
+    joinGroup().catch((error) => {
+      setError(error)
+    })
+  }, [router, inviteCode])
+  return (
+    <>
+      <PageMetaData title="Accept Invite - Omnivore" path="/invite" />
+      <ProfileLayout>Accepting invite to join</ProfileLayout>
+      <div data-testid="invite-page-tag" />
+    </>
+  )
+}