Merge pull request #7 from dakshesh14/main

fix: workspace invitation page not showing workspaces
2022-11-28 17:46:22 +05:30 · 2022-11-28 17:46:22 +05:30 · 0be30c0b78
commit 0be30c0b78
parent d2cc452de8 a58abecc0e
6 changed files with 70 additions and 82 deletions
--- a/lib/hoc/withAuthWrapper.tsx
+++ b/lib/hoc/withAuthWrapper.tsx
@ -1,30 +1,32 @@
-import React, { useEffect } from "react";
+import React from "react";
 // next
 import type { NextPage } from "next";
-// axios configurations
-import { setAxiosHeader } from "configuration/axios-configuration";
 // redirect
 import redirect from "lib/redirect";

-const withAuthWrapper = (WrappedComponent: NextPage) => {
+const withAuth = (WrappedComponent: NextPage) => {
  const Wrapper: NextPage<any> = (props) => {
-    useEffect(() => {
-      if (props?.tokenDetails && props?.tokenDetails?.access_token) {
-        setAxiosHeader(props.tokenDetails.access_token);
-      }
-    }, [props]);
-
    return <WrappedComponent {...props} />;
  };

  Wrapper.getInitialProps = async (ctx) => {
-    const componentProps =
-      WrappedComponent.getInitialProps &&
-      (await WrappedComponent.getInitialProps(ctx));
-    return { ...componentProps };
+    const isServer = typeof window === "undefined";
+
+    const cookies = isServer ? ctx?.req?.headers.cookie : document.cookie;
+
+    const token = cookies?.split("accessToken=")?.[1]?.split(";")?.[0];
+
+    if (!token) {
+      redirect(ctx, "/signin");
+    }
+
+    const pageProps =
+      WrappedComponent.getInitialProps && (await WrappedComponent.getInitialProps(ctx));
+
+    return { ...pageProps };
  };

  return Wrapper;
 };

-export default withAuthWrapper;
+export default withAuth;
--- a/lib/redirect.ts
+++ b/lib/redirect.ts
@ -1,7 +1,8 @@
 // next imports
+import type { NextPageContext } from "next";
 import Router from "next/router";

-const redirect = (context: any, target: any) => {
+const redirect = (context: NextPageContext, target: any) => {
  if (context.res) {
    // server
    // 303: "See other"
--- a/pages/invitations.tsx
+++ b/pages/invitations.tsx
@ -5,8 +5,6 @@ import Link from "next/link";
 import { useRouter } from "next/router";
 // swr
 import useSWR from "swr";
-// headless ui
-import { Dialog, Transition } from "@headlessui/react";
 // services
 import workspaceService from "lib/services/workspace.service";
 import userService from "lib/services/user.service";
@ -14,19 +12,16 @@ import userService from "lib/services/user.service";
 import useUser from "lib/hooks/useUser";
 // constants
 import { USER_WORKSPACE_INVITATIONS } from "constants/api-routes";
-// hoc
-import withAuthWrapper from "lib/hoc/withAuthWrapper";
 // layouts
 import DefaultLayout from "layouts/DefaultLayout";
 // ui
 import { Button, Spinner } from "ui";
 // types
 import type { IWorkspaceInvitation } from "types";
-import { ChartBarIcon, ChevronRightIcon, CubeIcon, PlusIcon } from "@heroicons/react/24/outline";
+import { CubeIcon, PlusIcon } from "@heroicons/react/24/outline";
 import { EmptySpace, EmptySpaceItem } from "ui/EmptySpace";

 const OnBoard: NextPage = () => {
-  const [canRedirect, setCanRedirect] = useState(true);
  const router = useRouter();

  const { workspaces, mutateWorkspaces, user } = useUser();
@ -63,28 +58,18 @@ const OnBoard: NextPage = () => {
        console.log(res);
        await mutate();
        await mutateWorkspaces();
+        router.push("/workspace");
      })
      .catch((err) => {
        console.log(err);
      });
  };

-  // useEffect(() => {
-  //   if (!invitations) return;
-  //   else
-  //     invitations.forEach((invite) => {
-  //       if (invite.accepted)
-  //         setInvitationsRespond((prevData) => {
-  //           return [...prevData, invite.workspace.id];
-  //         });
-  //     });
-  // }, [invitations, router, workspaces]);
-
  useEffect(() => {
-    if (workspaces && workspaces.length === 0) {
-      setCanRedirect(false);
-    }
-  }, [workspaces]);
+    userService.updateUserOnBoard().then((response) => {
+      console.log(response);
+    });
+  }, []);

  return (
    <DefaultLayout
@ -101,7 +86,7 @@ const OnBoard: NextPage = () => {
          </div>
        )}
        <div className="w-full md:w-2/3 lg:w-1/3 p-8 rounded-lg">
-          {invitations ? (
+          {invitations && workspaces ? (
            invitations.length > 0 ? (
              <div className="mt-3 sm:mt-5">
                <div className="mt-2">
@ -139,23 +124,6 @@ const OnBoard: NextPage = () => {
                              Accept
                            </label>
                          </div>
-                          {/* <div className="h-full flex items-center gap-x-1">
-                            <input
-                              id={`${item.id}`}
-                              aria-describedby="workspaces"
-                              name={`${item.id}`}
-                              checked={invitationsRespond.includes(item.workspace.id)}
-                              value={item.workspace.name}
-                              onChange={() => {
-                                handleInvitation(item, invitationsRespond.includes(item.workspace.id) ? "withdraw" : "accepted");
-                              }}
-                              type="checkbox"
-                              className="h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
-                            />
-                            <label htmlFor={item.id} className="text-sm">
-                              Reject
-                            </label>
-                          </div> */}
                        </div>
                      </div>
                    ))}
@ -167,27 +135,46 @@ const OnBoard: NextPage = () => {
                  </Button>
                </div>
              </div>
+            ) : workspaces && workspaces.length > 0 ? (
+              <div className="mt-3 flex flex-col gap-y-3">
+                <h2 className="text-2xl font-medium mb-4">Your workspaces</h2>
+                {workspaces.map((workspace) => (
+                  <div
+                    className="flex items-center justify-between border px-4 py-2 rounded mb-2"
+                    key={workspace.id}
+                  >
+                    <div className="flex items-center gap-x-2">
+                      <CubeIcon className="h-5 w-5 text-gray-400" />
+                      <Link href={"/workspace"}>
+                        <a>{workspace.name}</a>
+                      </Link>
+                    </div>
+                    <div className="flex items-center gap-x-2">
+                      <p className="text-sm">{workspace.owner.first_name}</p>
+                    </div>
+                  </div>
+                ))}
+                <Link href={"/workspace"}>
+                  <Button type="button">Go to workspaces</Button>
+                </Link>
+              </div>
            ) : (
+              invitations.length === 0 &&
+              workspaces.length === 0 && (
                <EmptySpace
-                title={`${
-                  canRedirect
-                    ? `You haven't been invited to any workspace yet.`
-                    : "You don't have any workspaces, Start by creating one."
-                }`}
+                  title="You don't have any workspaces yet"
                  description="Your workspace is where you'll create projects, collaborate on your issues, and organize different streams of work in your Plane account."
                >
                  <EmptySpaceItem
-                  Icon={canRedirect ? CubeIcon : PlusIcon}
-                  title={canRedirect ? "Continue to Dashboard" : "Create your Workspace"}
+                    Icon={PlusIcon}
+                    title={"Create your Workspace"}
                    action={() => {
-                    userService.updateUserOnBoard().then((response) => {
-                      console.log(response);
-                    });
-                    router.push(canRedirect ? "/" : "/create-workspace");
+                      router.push("/create-workspace");
                    }}
                  />
                </EmptySpace>
              )
+            )
          ) : (
            <div className="w-full h-full flex justify-center items-center">
              <Spinner />
@ -199,4 +186,4 @@ const OnBoard: NextPage = () => {
  );
 };

-export default withAuthWrapper(OnBoard);
+export default OnBoard;
--- a/pages/signin.tsx
+++ b/pages/signin.tsx
@ -8,8 +8,6 @@ import Image from "next/image";
 import useUser from "lib/hooks/useUser";
 // services
 import authenticationService from "lib/services/authentication.service";
-// hoc
-import withAuthWrapper from "lib/hoc/withAuthWrapper";
 // layouts
 import DefaultLayout from "layouts/DefaultLayout";
 // social button
@ -180,4 +178,4 @@ const SignIn: NextPage = () => {
  );
 };

-export default withAuthWrapper(SignIn);
+export default SignIn;
--- a/pages/workspace-member-invitation/[invitationId].tsx
+++ b/pages/workspace-member-invitation/[invitationId].tsx
@ -11,8 +11,6 @@ import workspaceService from "lib/services/workspace.service";
 import { WORKSPACE_INVITATION } from "constants/fetch-keys";
 // hooks
 import useUser from "lib/hooks/useUser";
-// hoc
-import withAuthWrapper from "lib/hoc/withAuthWrapper";
 // layouts
 import DefaultLayout from "layouts/DefaultLayout";
 // ui
@ -149,4 +147,4 @@ const WorkspaceInvitation: NextPage = () => {
  );
 };

-export default withAuthWrapper(WorkspaceInvitation);
+export default WorkspaceInvitation;
--- a/pages/workspace/index.tsx
+++ b/pages/workspace/index.tsx
@ -9,6 +9,8 @@ import AdminLayout from "layouts/AdminLayout";
 import useSWR from "swr";
 // hooks
 import useUser from "lib/hooks/useUser";
+// hoc
+import withAuthWrapper from "lib/hoc/withAuthWrapper";
 // fetch keys
 import { USER_ISSUE } from "constants/fetch-keys";
 // services
@ -167,4 +169,4 @@ const Workspace: NextPage = () => {
  );
 };

-export default Workspace;
+export default withAuthWrapper(Workspace);