refactor: Change join space by invite url flow

ikigai-hq · May 12, 2024 · 310a89f · 310a89f
1 parent 5a4c141
commit 310a89f
Show file tree

Hide file tree

Showing 14 changed files with 324 additions and 351 deletions.
diff --git a/apps/ikigai/components/PreJoinSpace.tsx b/apps/ikigai/components/PreJoinSpace.tsx
@@ -1,70 +1,93 @@
-import {useRouter} from "next/router";
-import {useState} from "react";
-import {Button, Divider, Input, Typography} from "antd";
-import {t, Trans} from "@lingui/macro";
+import { useRouter } from "next/router";
+import { useState } from "react";
+import { Button, Divider, Input, Typography } from "antd";
+import { t, Trans } from "@lingui/macro";
 import useAuthUserStore from "../context/ZustandAuthStore";
-import {useMutation} from "@apollo/client";
-import {JOIN_SPACE_BY_INVITE_TOKEN} from "../graphql/mutation/SpaceMutation";
-import {handleError} from "../graphql/ApolloClient";
+import { useMutation } from "@apollo/client";
+import { JOIN_SPACE_BY_INVITE_TOKEN } from "../graphql/mutation/SpaceMutation";
+import { handleError } from "../graphql/ApolloClient";
 import validator from "validator";
 import toast from "react-hot-toast";
-import {JoinSpaceByInviteToken} from "../graphql/types";
-import TokenStorage from "../storage/TokenStorage";
-import {formatDocumentRoute} from "../config/Routes";
+import { JoinSpaceByInviteToken } from "../graphql/types";
 
 const PreJoinSpace = () => {
   const router = useRouter();
-  const currentEmail = useAuthUserStore(state => state.currentUser?.userMe?.email);
+  const currentEmail = useAuthUserStore(
+    (state) => state.currentUser?.userMe?.email,
+  );
   const [email, setEmail] = useState(currentEmail || "");
-  const [joinSpace, { loading }] = useMutation<JoinSpaceByInviteToken>(JOIN_SPACE_BY_INVITE_TOKEN, {
-    onError: handleError,
-  });
-
+  const [joinSpace, { loading }] = useMutation<JoinSpaceByInviteToken>(
+    JOIN_SPACE_BY_INVITE_TOKEN,
+    {
+      onError: handleError,
+    },
+  );
+  const [status, setStatus] = useState<boolean | undefined>();
+
   const join = async () => {
     if (!validator.isEmail(email)) {
       toast.error(t`Wrong email format!`);
       return;
     }
-    
+
     const { data } = await joinSpace({
       variables: {
         email,
         spaceId: parseInt(router.query.spaceId as string, 10),
         token: router.query.token,
       },
     });
-    
+
     if (data) {
-      TokenStorage.set(data.spaceJoinByInviteToken.accessToken);
-      window.location.replace(formatDocumentRoute(data.spaceJoinByInviteToken.starterDocument.id));
-      toast.success(t`Joined! We're moving you to your space...`);
+      setStatus(true);
+      toast.success(t`Joined! Please check your mail inbox`);
+    } else {
+      setStatus(false);
     }
   };
-  
+
   return (
     <div style={{ width: "400px" }}>
-      <Typography.Title level={5}>
-        <Trans>You've been invited to join ikigai</Trans>
-      </Typography.Title>
-      <Typography.Text strong>
-        <Trans>Email</Trans>
-      </Typography.Text>
-      <Input
-        placeholder={t`Type your email!`}
-        value={email}
-        readOnly={!!currentEmail}
-        onChange={(e) => setEmail(e.currentTarget.value)}
-      />
-      <Divider />
-      <Button
-        type="primary"
-        style={{ width: "100%" }}
-        loading={loading}
-        disabled={loading}
-        onClick={join}
-      >
-        <Trans>Join</Trans>
-      </Button>
+      {status === undefined && (
+        <div>
+          <Typography.Title level={5}>
+            <Trans>You've been invited to join ikigai</Trans>
+          </Typography.Title>
+          <Typography.Text strong>
+            <Trans>Email</Trans>
+          </Typography.Text>
+          <Input
+            placeholder={t`Type your email!`}
+            value={email}
+            readOnly={!!currentEmail}
+            onChange={(e) => setEmail(e.currentTarget.value)}
+          />
+          <Divider />
+          <Button
+            type="primary"
+            style={{ width: "100%" }}
+            loading={loading}
+            disabled={loading}
+            onClick={join}
+          >
+            <Trans>Join</Trans>
+          </Button>
+        </div>
+      )}
+      {status !== undefined && (
+        <div>
+          <Typography.Title level={5}>
+            <Trans>Joined!</Trans>
+          </Typography.Title>
+          <Typography.Text type="secondary">
+            <Trans>
+              You've joined. We've sent a magic email to{" "}
+              <b style={{ color: "black" }}>{email}</b>. Open the link in email
+              to access space.
+            </Trans>
+          </Typography.Text>
+        </div>
+      )}
     </div>
   );
 };

diff --git a/apps/ikigai/graphql/graphql-schema.json b/apps/ikigai/graphql/graphql-schema.json
@@ -6777,8 +6777,8 @@
               "kind": "NON_NULL",
               "name": null,
               "ofType": {
-                "kind": "OBJECT",
-                "name": "SpaceWithAccessToken",
+                "kind": "SCALAR",
+                "name": "Boolean",
                 "ofType": null
               }
             },
@@ -8685,49 +8685,6 @@
         "enumValues": null,
         "possibleTypes": null
       },
-      {
-        "kind": "OBJECT",
-        "name": "SpaceWithAccessToken",
-        "description": null,
-        "fields": [
-          {
-            "name": "starterDocument",
-            "description": null,
-            "args": [],
-            "type": {
-              "kind": "NON_NULL",
-              "name": null,
-              "ofType": {
-                "kind": "OBJECT",
-                "name": "Document",
-                "ofType": null
-              }
-            },
-            "isDeprecated": false,
-            "deprecationReason": null
-          },
-          {
-            "name": "accessToken",
-            "description": null,
-            "args": [],
-            "type": {
-              "kind": "NON_NULL",
-              "name": null,
-              "ofType": {
-                "kind": "SCALAR",
-                "name": "String",
-                "ofType": null
-              }
-            },
-            "isDeprecated": false,
-            "deprecationReason": null
-          }
-        ],
-        "inputFields": null,
-        "interfaces": [],
-        "enumValues": null,
-        "possibleTypes": null
-      },
       {
         "kind": "INPUT_OBJECT",
         "name": "NewComment",

diff --git a/apps/ikigai/graphql/mutation/SpaceMutation.ts b/apps/ikigai/graphql/mutation/SpaceMutation.ts
@@ -27,20 +27,6 @@ export const UPDATE_SPACE = gql`
   }
 `;
 
-export const RESTORE_SPACE = gql`
-  mutation RestoreSpace($spaceId: Int!) {
-    spaceRestore(spaceId: $spaceId) {
-      id
-    }
-  }
-`;
-
-export const DELETE_SPACE = gql`
-  mutation DeleteSpace($spaceId: Int!) {
-    spaceDelete(spaceId: $spaceId)
-  }
-`;
-
 export const GENERATE_SPACE_INVITE_TOKEN = gql`
   mutation GenerateSpaceInviteToken($data: SpaceInviteTokenInput!) {
     spaceGenerateInviteToken(data: $data) {
@@ -62,11 +48,6 @@ export const JOIN_SPACE_BY_INVITE_TOKEN = gql`
     $spaceId: Int!
     $token: String!
   ) {
-    spaceJoinByInviteToken(email: $email, spaceId: $spaceId, token: $token) {
-      starterDocument {
-        id
-      }
-      accessToken
-    }
+    spaceJoinByInviteToken(email: $email, spaceId: $spaceId, token: $token)
   }
 `;
diff --git a/apps/ikigai/graphql/types.ts b/apps/ikigai/graphql/types.ts
@@ -907,44 +907,6 @@ export interface UpdateSpaceVariables {
 // @generated
 // This file was automatically generated and should not be edited.
 
-// ====================================================
-// GraphQL mutation operation: RestoreSpace
-// ====================================================
-
-export interface RestoreSpace_spaceRestore {
-  id: number;
-}
-
-export interface RestoreSpace {
-  spaceRestore: RestoreSpace_spaceRestore;
-}
-
-export interface RestoreSpaceVariables {
-  spaceId: number;
-}
-
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
-// ====================================================
-// GraphQL mutation operation: DeleteSpace
-// ====================================================
-
-export interface DeleteSpace {
-  spaceDelete: boolean;
-}
-
-export interface DeleteSpaceVariables {
-  spaceId: number;
-}
-
-/* tslint:disable */
-/* eslint-disable */
-// @generated
-// This file was automatically generated and should not be edited.
-
 // ====================================================
 // GraphQL mutation operation: GenerateSpaceInviteToken
 // ====================================================
@@ -989,17 +951,8 @@ export interface DeleteSpaceInviteTokenVariables {
 // GraphQL mutation operation: JoinSpaceByInviteToken
 // ====================================================
 
-export interface JoinSpaceByInviteToken_spaceJoinByInviteToken_starterDocument {
-  id: any;
-}
-
-export interface JoinSpaceByInviteToken_spaceJoinByInviteToken {
-  starterDocument: JoinSpaceByInviteToken_spaceJoinByInviteToken_starterDocument;
-  accessToken: string;
-}
-
 export interface JoinSpaceByInviteToken {
-  spaceJoinByInviteToken: JoinSpaceByInviteToken_spaceJoinByInviteToken;
+  spaceJoinByInviteToken: boolean;
 }
 
 export interface JoinSpaceByInviteTokenVariables {

diff --git a/apps/ikigai/hook/UseUpdateDocument.tsx b/apps/ikigai/hook/UseUpdateDocument.tsx
@@ -1,17 +1,21 @@
 import { useMutation } from "@apollo/client";
 
-import { UpdateDocumentData } from "graphql/types";
+import { DocumentActionPermission, UpdateDocumentData } from "graphql/types";
 import { UPDATE_DOCUMENT } from "graphql/mutation/SpaceMutation";
 import { handleError } from "graphql/ApolloClient";
 import useDocumentStore from "context/DocumentV2Store";
+import usePermission from "./UsePermission";
 
 const UseUpdateDocument = () => {
+  const allow = usePermission();
   const [updateDocumentServer] = useMutation(UPDATE_DOCUMENT, {
     onError: handleError,
   });
   const activeDocument = useDocumentStore((state) => state.activeDocument);
 
   return (data: Partial<UpdateDocumentData>) => {
+    if (!allow(DocumentActionPermission.EDIT_DOCUMENT)) return;
+
     const updateDocumentData: UpdateDocumentData = {
       title: activeDocument.title,
       coverPhotoId: activeDocument.coverPhotoId,