add progress alert state

TogetherCrew · Dec 11, 2023 · e05362d · e05362d
1 parent 20de115
commit e05362d
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 33 deletions.
diff --git a/src/components/communitySettings/platform/TcDisconnectPlatform.tsx b/src/components/communitySettings/platform/TcDisconnectPlatform.tsx
@@ -18,7 +18,8 @@ function TcDisconnectPlatform({ platform }: TcDisconnectPlatformProps) {
 
   const [openDialog, setOpenDialog] = useState<boolean>(false);
   const router = useRouter();
-  const { id } = router.query;
+
+  const id = router.query.platformId as string;
 
   const handleDeletePlatform = async (deleteType: 'hard' | 'soft') => {
     try {

diff --git a/src/components/layouts/shared/TcPrompt.tsx b/src/components/layouts/shared/TcPrompt.tsx
@@ -1,36 +1,50 @@
-import React, { useEffect, useMemo } from 'react';
+import React, { useMemo } from 'react';
 import TcAlert from '../../shared/TcAlert';
 import TcButton from '../../shared/TcButton';
 import TcCollapse from '../../shared/TcCollapse';
 import TcText from '../../shared/TcText';
 import { useRouter } from 'next/router';
-import { StorageService } from '../../../services/StorageService';
-import { IDiscordModifiedCommunity } from '../../../utils/interfaces';
+import { useToken } from '../../../context/TokenContext';
 
 function TcPrompt() {
   const router = useRouter();
-  const community =
-    StorageService.readLocalStorage<IDiscordModifiedCommunity>('community');
+  const { community } = useToken();
+
   const shouldShowPrompt = useMemo(() => {
     const currentRoute = router.pathname;
     const isExcludedRoute =
       currentRoute.startsWith('/cetric') ||
       currentRoute.startsWith('/community-settings');
+
     const hasNoPlatforms = community?.platforms.length === 0;
 
-    return !isExcludedRoute && hasNoPlatforms;
+    const isPlatformInProgress = community?.platforms.some(
+      (platform) => platform?.metadata.isInProgress === true
+    );
+
+    return !isExcludedRoute && (hasNoPlatforms || isPlatformInProgress);
   }, [router.pathname, community?.platforms]);
 
   if (!shouldShowPrompt) {
     return null;
   }
 
-  const promptData = {
-    backgroundColor: 'bg-orange',
-    message: 'To see the data, connect your community platforms.',
-    buttonText: 'Connect Platform',
-    redirectRouteParams: '/?platform=Discord',
-  };
+  const isPlatformInProgress = community?.platforms.some(
+    (platform) => platform?.metadata?.isInProgress === true
+  );
+
+  const promptData = isPlatformInProgress
+    ? {
+        backgroundColor: 'bg-orange',
+        message:
+          'Data import is in progress. It might take up to 6 hours to finish the data import. Once it is done we will send you a message on Discord.',
+      }
+    : {
+        backgroundColor: 'bg-orange',
+        message: 'To see the data, connect your community platforms.',
+        buttonText: 'Connect Platform',
+        redirectRouteParams: '/?platform=Discord',
+      };
 
   const { backgroundColor, message, buttonText, redirectRouteParams } =
     promptData;
@@ -61,24 +75,26 @@ function TcPrompt() {
       >
         <div className="md:space-x-3 flex flex-col md:flex-row items-center justify-center p-0">
           <TcText text={message} color={'white'} variant={'subtitle1'} />
-          <TcButton
-            text={buttonText}
-            size="small"
-            variant="outlined"
-            onClick={() =>
-              router.push(`/community-settings${redirectRouteParams}`)
-            }
-            sx={{
-              border: '1px solid white',
-              color: 'white',
-              paddingY: '0',
-              '&:hover': {
-                background: 'white',
+          {buttonText && (
+            <TcButton
+              text={buttonText}
+              size="small"
+              variant="outlined"
+              onClick={() =>
+                router.push(`/community-settings${redirectRouteParams}`)
+              }
+              sx={{
                 border: '1px solid white',
-                color: 'black',
-              },
-            }}
-          />
+                color: 'white',
+                py: 0,
+                '&:hover': {
+                  backgroundColor: 'white',
+                  borderColor: 'white',
+                  color: 'black',
+                },
+              }}
+            />
+          )}
         </div>
       </TcAlert>
     </TcCollapse>

diff --git a/src/utils/interfaces.ts b/src/utils/interfaces.ts
@@ -155,9 +155,10 @@ export interface ICommunityDiscordPlatfromProps {
     id: string;
     icon: string;
     name: string;
-    selectedChannels: string[];
-    period: string;
-    analyzerStartedAt: string;
+    selectedChannels?: string[];
+    period?: string;
+    analyzerStartedAt?: string;
+    isInProgress?: boolean;
   };
   disconnectedAt: string | null;
 }