fixed ps season bug

src/components/Events/PublishedScheduleTable.jsx

@@ -13,12 +13,11 @@ import AUTH_ROLES from '../../utils/auth_config.js';
 const { ADMIN_ROLE } = AUTH_ROLES.AUTH_ROLES;
 
 
-const PublishedScheduleTable = ({ season, allSeasons }) => {
+const PublishedScheduleTable = ({ season, allSeasons, dataShouldRevalidate, setShouldDataRevalidate}) => {
   const {currentUser} = useAuthContext();
   const [eventsInDay, setEventsInDay] = useState([]);
   const seasonType = season.split(' ')[0];
   const seasonYear = season.split(' ')[1];
-  const [dataShouldRevalidate, setShouldDataRevalidate] = useState(false);
   const { isOpen: isOpenDay, onOpen: onOpenDay, onClose: onCloseDay } = useDisclosure();
   const { isOpen: isOpenStats, onOpen: onOpenStats, onClose: onCloseStats } = useDisclosure();
 
@@ -140,6 +139,8 @@ const PublishedScheduleTable = ({ season, allSeasons }) => {
 PublishedScheduleTable.propTypes = {
   season: PropTypes.string.isRequired,
   allSeasons: PropTypes.array.isRequired,
+  dataShouldRevalidate: PropTypes.bool.isRequired,
+  setShouldDataRevalidate: PropTypes.func.isRequired,
 };
 
 export default PublishedScheduleTable;

src/pages/PublishedSchedule/PublishedSchedule.jsx

@@ -12,6 +12,8 @@ const PublishedSchedule = () => {
   const [allSeasons, setAllSeasons] = useState([]);
   const [selectedSeason, setSelectedSeason] = useState('');
   const [seasonHover, setSeasonHover] = useState(false);
+  const [dataShouldRevalidate, setShouldDataRevalidate] = useState(false);
+
 
   const getTodaySeason = () => {
     let today = new Date();
@@ -31,33 +33,39 @@ const PublishedSchedule = () => {
 
   const curSeason = getTodaySeason();
 
-  useEffect(() => {
-    const renderTable = async () => {
-      const { data } = await NPOBackend.get('/published-schedule/all-seasons');
-      if (data.indexOf(curSeason) == -1) {
-        data.unshift(curSeason);
-      }
+  const renderSeasons = async () => {
+    const { data } = await NPOBackend.get('/published-schedule/all-seasons');
+    if (data.indexOf(curSeason) == -1) {
+      data.unshift(curSeason);
+    }
 
-      if (selectedSeason === '') {
-        setSelectedSeason(curSeason);
+    const seasonOrder = ['Fall', 'Summer', 'Spring'];
+    data.sort((a, b) => {
+      // Compare years first
+      if (a.split(' ')[1] !== b.split(' ')[1]) {
+        return b.split(' ')[1] - a.split(' ')[1];
+      } else {
+        return seasonOrder.indexOf(a.split(' ')[0]) - seasonOrder.indexOf(b.split(' ')[0]);
       }
+    });
 
-      const seasonOrder = ['Fall', 'Summer', 'Spring'];
-      data.sort((a, b) => {
-        // Compare years first
-        if (a.split(' ')[1] !== b.split(' ')[1]) {
-          return b.split(' ')[1] - a.split(' ')[1];
-        } else {
-          return seasonOrder.indexOf(a.split(' ')[0]) - seasonOrder.indexOf(b.split(' ')[0]);
-        }
-      });
-
-      setAllSeasons(data);
+    setAllSeasons(data);
+  };
 
-    };
-    renderTable();
+  useEffect(() => {
+    if (selectedSeason === '') {
+      setSelectedSeason(curSeason);
+    }
+    renderSeasons();
   }, []);
 
+  useEffect(() => {
+    if (dataShouldRevalidate) {
+      renderSeasons();
+      setShouldDataRevalidate(false);
+    }
+  }, [dataShouldRevalidate, renderSeasons])
+
   //update chakra table container accordingly
   return (
     <Box pt={10} pb={10} pl={100} pr={100}>
@@ -94,9 +102,9 @@ const PublishedSchedule = () => {
 
       {/* tables for each season */}
       {selectedSeason != '' ? (
-        <PublishedScheduleTable season={selectedSeason} allSeasons={allSeasons} />
+        <PublishedScheduleTable season={selectedSeason} allSeasons={allSeasons} dataShouldRevalidate={dataShouldRevalidate} setShouldDataRevalidate={setShouldDataRevalidate} />
       ) : (
-        <PublishedScheduleTable season={curSeason} allSeasons={allSeasons} />
+        <PublishedScheduleTable season={curSeason} allSeasons={allSeasons} dataShouldRevalidate={dataShouldRevalidate} setShouldDataRevalidate={setShouldDataRevalidate} />
       )}
     </Box>
   );