fix issue on fetch data and styles

TogetherCrew · Jan 19, 2024 · 7e26509 · 7e26509
1 parent e3f8e16
commit 7e26509
Show file tree

Hide file tree

Showing 7 changed files with 40 additions and 24 deletions.
diff --git a/src/components/announcements/TcAnnouncementsTable.tsx b/src/components/announcements/TcAnnouncementsTable.tsx
@@ -131,7 +131,7 @@ function TcAnnouncementsTable({
             colSpan={6}
             style={{ textAlign: 'center' }}
             sx={{ borderBottom: 'none' }}
-            className="min-h-[70vh] pt-[14rem]"
+            className="min-h-[70vh] pt-[20dvh]"
             data-testid="loading-indicator"
           >
             <Loading />

diff --git a/src/components/announcements/TcConfirmSchaduledAnnouncementsDialog.tsx b/src/components/announcements/TcConfirmSchaduledAnnouncementsDialog.tsx
@@ -46,6 +46,17 @@ function TcConfirmSchaduledAnnouncementsDialog({
     <>
       <TcButton
         text={buttonLabel}
+        sx={{
+          maxWidth: {
+            xs: '100%',
+            sm: '8rem',
+          },
+          padding: {
+            xs: 'auto',
+            sm: '0.4rem 1.5rem',
+          },
+          height: '2.4rem',
+        }}
         variant="contained"
         disabled={isDisabled}
         onClick={() => setConfirmSchadulerDialog(true)}

diff --git a/src/components/announcements/create/privateMessaageContainer/TcPrivateMessageContainer.tsx b/src/components/announcements/create/privateMessaageContainer/TcPrivateMessageContainer.tsx
@@ -129,11 +129,11 @@ function TcPrivateMessageContainer({
 
           if (!templateText) {
             templateText = item.template;
+            setPrivateMessage(true);
           }
         }
       });
 
-      setPrivateMessage(true);
       setSelectedRoles(rolesArray);
       setSelectedUsers(usersArray);
       setMessage(templateText);
@@ -213,7 +213,7 @@ function TcPrivateMessageContainer({
               className="text-gray-400"
             />
           </div>
-          <div className="flex justify-between space-x-3">
+          <div className="flex flex-col md:flex-row justify-between space-y-3 md:space-y-0 md:space-x-3">
             <FormControl
               variant="filled"
               fullWidth

diff --git a/...omponents/announcements/create/privateMessaageContainer/TcPrivateMessagePreviewDialog.tsx b/...omponents/announcements/create/privateMessaageContainer/TcPrivateMessagePreviewDialog.tsx
@@ -28,6 +28,10 @@ function TcPublicMessagePreviewDialog({
             xs: '100%',
             sm: '8rem',
           },
+          padding: {
+            xs: 'auto',
+            sm: '0.4rem 1.5rem',
+          },
           height: '2.4rem',
         }}
         disabled={!isPreviewDialogEnabled}

diff --git a/src/components/shared/TcBreadcrumbs.tsx b/src/components/shared/TcBreadcrumbs.tsx
@@ -1,9 +1,7 @@
 import React from 'react';
 import Breadcrumbs from '@mui/material/Breadcrumbs';
-import Link from '@mui/material/Link';
 import { useRouter } from 'next/router';
 import TcLink from './TcLink';
-import { ArrowDropDownIcon } from '@mui/x-date-pickers';
 import { MdChevronRight } from 'react-icons/md';
 import TcText from './TcText';
 

diff --git a/src/pages/announcements/edit-announcements/index.tsx b/src/pages/announcements/edit-announcements/index.tsx
@@ -113,6 +113,7 @@ function Index() {
             (channel) => channel.channelId
           );
         }
+        console.log({ channelIds });
 
         await refreshData(platformId, 'channel', channelIds, undefined, false);
       }
@@ -130,9 +131,12 @@ function Index() {
     };
 
     fetchAnnouncement();
-    fetchPlatformChannels();
   }, [id]);
 
+  useEffect(() => {
+    fetchPlatformChannels();
+  }, [fetchedAnnouncements]);
+
   const handleEditAnnouncements = async (isDrafted: boolean) => {
     if (!community) return;
 

diff --git a/src/pages/announcements/index.tsx b/src/pages/announcements/index.tsx
@@ -159,8 +159,8 @@ function Index() {
       <div className="flex flex-col container px-4 md:px-12 py-4">
         <TcBoxContainer
           contentContainerChildren={
-            <div className="flex flex-col justify-between p-4 md:p-10 space-y-4 min-h-[92dvh]">
-              <div>
+            <div className="flex flex-col justify-between p-4 md:p-10 space-y-4 min-h-[97dvh] max-h-[97dvh]">
+              <div className="flex-grow overflow-auto min-h-[calc(100vh-100px)]">
                 <div className="flex flex-col md:flex-row md:justify-between space-y-3 md:space-y-0 md:items-center">
                   <TcText text="Announcement Scheduling" variant="h5" />
                   <TcButton
@@ -217,22 +217,21 @@ function Index() {
                   </div>
                 )}
               </div>
-
-              {fetchedAnnouncements.totalResults > 8 ? (
-                <div className="flex justify-end">
-                  <TcPagination
-                    totalItems={fetchedAnnouncements.totalResults}
-                    itemsPerPage={Math.ceil(
-                      fetchedAnnouncements.totalResults /
-                        fetchedAnnouncements.totalPages
-                    )}
-                    currentPage={page}
-                    onChangePage={handlePageChange}
-                  />
-                </div>
-              ) : (
-                ''
-              )}
+              <div className="sticky bottom-0 bg-white px-4 py-2 min-h-[70px]">
+                {fetchedAnnouncements.totalResults > 8 && (
+                  <div className="flex justify-end">
+                    <TcPagination
+                      totalItems={fetchedAnnouncements.totalResults}
+                      itemsPerPage={Math.ceil(
+                        fetchedAnnouncements.totalResults /
+                          fetchedAnnouncements.totalPages
+                      )}
+                      currentPage={page}
+                      onChangePage={handlePageChange}
+                    />
+                  </div>
+                )}
+              </div>
             </div>
           }
         />