From 361ef9236e412ced80ddd9c6bc7a80e68abe9183 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Thu, 19 Sep 2024 17:51:22 +0530
Subject: [PATCH] [WEB-1970] fix: onboarding invitation page fluctuation on
 refresh. (#5627)

---
 web/app/onboarding/page.tsx                                | 2 +-
 .../components/onboarding/create-or-join-workspaces.tsx    | 1 +
 web/core/components/onboarding/invitations.tsx             | 7 ++-----
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/web/app/onboarding/page.tsx b/web/app/onboarding/page.tsx
index ecfa07fccd..6d915dfcbc 100644
--- a/web/app/onboarding/page.tsx
+++ b/web/app/onboarding/page.tsx
@@ -156,7 +156,7 @@ const OnboardingPage = observer(() => {
             />
           ) : step === EOnboardingSteps.WORKSPACE_CREATE_OR_JOIN ? (
             <CreateOrJoinWorkspaces
-                invitations={invitations ?? []}
+              invitations={invitations ?? []}
               totalSteps={totalSteps}
               stepChange={stepChange}
               finishOnboarding={finishOnboarding}
diff --git a/web/core/components/onboarding/create-or-join-workspaces.tsx b/web/core/components/onboarding/create-or-join-workspaces.tsx
index bec44a85ea..3bfc71a2be 100644
--- a/web/core/components/onboarding/create-or-join-workspaces.tsx
+++ b/web/core/components/onboarding/create-or-join-workspaces.tsx
@@ -61,6 +61,7 @@ export const CreateOrJoinWorkspaces: React.FC<Props> = observer((props) => {
         <div className="flex flex-col w-full items-center justify-center p-8 mt-6">
           {currentView === ECreateOrJoinWorkspaceViews.WORKSPACE_JOIN ? (
             <Invitations
+              invitations={invitations}
               handleNextStep={handleNextStep}
               handleCurrentViewChange={() => setCurrentView(ECreateOrJoinWorkspaceViews.WORKSPACE_CREATE)}
             />
diff --git a/web/core/components/onboarding/invitations.tsx b/web/core/components/onboarding/invitations.tsx
index 92bcade23d..d5dde220dc 100644
--- a/web/core/components/onboarding/invitations.tsx
+++ b/web/core/components/onboarding/invitations.tsx
@@ -1,14 +1,12 @@
 "use client";
 
 import React, { useState } from "react";
-import useSWR from "swr";;
 // types
 import { IWorkspaceMemberInvitation } from "@plane/types";
 // ui
 import { Button, Checkbox, Spinner } from "@plane/ui";
 // constants
 import { MEMBER_ACCEPTED } from "@/constants/event-tracker";
-import { USER_WORKSPACE_INVITATIONS } from "@/constants/fetch-keys";
 import { ROLE } from "@/constants/workspace";
 // helpers
 import { truncateText } from "@/helpers/string.helper";
@@ -19,13 +17,14 @@ import { useEventTracker, useUserSettings, useWorkspace } from "@/hooks/store";
 import { WorkspaceService } from "@/plane-web/services";
 
 type Props = {
+  invitations: IWorkspaceMemberInvitation[];
   handleNextStep: () => Promise<void>;
   handleCurrentViewChange: () => void;
 };
 const workspaceService = new WorkspaceService();
 
 export const Invitations: React.FC<Props> = (props) => {
-  const { handleNextStep, handleCurrentViewChange } = props;
+  const { invitations, handleNextStep, handleCurrentViewChange } = props;
   // states
   const [isJoiningWorkspaces, setIsJoiningWorkspaces] = useState(false);
   const [invitationsRespond, setInvitationsRespond] = useState<string[]>([]);
@@ -34,8 +33,6 @@ export const Invitations: React.FC<Props> = (props) => {
   const { fetchWorkspaces } = useWorkspace();
   const { fetchCurrentUserSettings } = useUserSettings();
 
-  const { data: invitations } = useSWR(USER_WORKSPACE_INVITATIONS, () => workspaceService.userWorkspaceInvitations());
-
   const handleInvitation = (workspace_invitation: IWorkspaceMemberInvitation, action: "accepted" | "withdraw") => {
     if (action === "accepted") {
       setInvitationsRespond((prevData) => [...prevData, workspace_invitation.id]);