Add show_reg_status to URL params in competitions overview

app/webpacker/components/CompetitionsOverview/CompetitionsFilters.js

@@ -348,7 +348,6 @@ export function CompDisplayCheckboxes({
   shouldIncludeCancelled,
   dispatchFilter,
   shouldShowRegStatus,
-  setShouldShowRegStatus,
   shouldShowAdminDetails,
   canViewAdminDetails,
   displayMode,
@@ -376,7 +375,9 @@ export function CompDisplayCheckboxes({
                 name="show_registration_status"
                 id="show_registration_status"
                 checked={shouldShowRegStatus}
-                onChange={() => setShouldShowRegStatus(!shouldShowRegStatus)}
+                onChange={() => dispatchFilter(
+                  { shouldShowRegStatus: !shouldShowRegStatus },
+                )}
               />
             </div>
             {canViewAdminDetails && (

app/webpacker/components/CompetitionsOverview/CompetitionsView.js

@@ -44,7 +44,6 @@ function CompetitionsView({ canViewAdminDetails = false }) {
   );
   const debouncedFilterState = useDebounce(filterState, DEBOUNCE_MS);
   const [displayMode, setDisplayMode] = useState(() => getDisplayMode(searchParams));
-  const [shouldShowRegStatus, setShouldShowRegStatus] = useState(false);
   const competitionQueryKey = useMemo(
     () => calculateQueryKey(debouncedFilterState, canViewAdminDetails),
     [debouncedFilterState, canViewAdminDetails],
@@ -99,20 +98,20 @@ function CompetitionsView({ canViewAdminDetails = false }) {
       body: JSON.stringify({ ids: compIds }),
     }),
     queryKey: ['registration-info', ...compIds],
-    enabled: shouldShowRegStatus && compIds.length > 0,
+    enabled: filterState.shouldShowRegStatus && compIds.length > 0,
     // This is where the magic happens: Using `keepPreviousData` makes it so that
     //   all previously loaded indicators are held in-cache while the fetcher for the next
     //   batch is running in the background. (Adding comment here because it's not in the docs)
     placeholderData: keepPreviousData,
     select: (data) => data.data,
   });
 
-  const competitions = useMemo(() => (shouldShowRegStatus ? (
+  const competitions = useMemo(() => (filterState.shouldShowRegStatus ? (
     baseCompetitions?.map((comp) => {
       const regData = compRegistrationData?.find((reg) => reg.id === comp.id);
       return regData ? { ...comp, ...regData } : comp;
     })
-  ) : baseCompetitions), [baseCompetitions, compRegistrationData, shouldShowRegStatus]);
+  ) : baseCompetitions), [baseCompetitions, compRegistrationData, filterState.shouldShowRegStatus]);
 
   const [showFilters, setShowFilters] = useState(true);
 
@@ -162,8 +161,7 @@ function CompetitionsView({ canViewAdminDetails = false }) {
           <CompDisplayCheckboxes
             shouldIncludeCancelled={filterState.shouldIncludeCancelled}
             dispatchFilter={dispatchFilter}
-            shouldShowRegStatus={shouldShowRegStatus}
-            setShouldShowRegStatus={setShouldShowRegStatus}
+            shouldShowRegStatus={filterState.shouldShowRegStatus}
             shouldShowAdminDetails={shouldShowAdminDetails}
             canViewAdminDetails={canViewAdminDetails}
             displayMode={displayMode}
@@ -184,7 +182,7 @@ function CompetitionsView({ canViewAdminDetails = false }) {
             <ListView
               competitions={competitions}
               filterState={debouncedFilterState}
-              shouldShowRegStatus={shouldShowRegStatus}
+              shouldShowRegStatus={filterState.shouldShowRegStatus}
               shouldShowAdminDetails={shouldShowAdminDetails}
               isLoading={competitionsIsFetching}
               regStatusLoading={regDataIsPending}

app/webpacker/components/CompetitionsOverview/filterUtils.js

@@ -22,6 +22,7 @@ const DELEGATE = 'delegate';
 const SEARCH = 'search';
 const SELECTED_EVENTS = 'event_ids[]';
 const INCLUDE_CANCELLED = 'show_cancelled';
+const SHOW_REGISTRATION_STATUS = 'show_reg_status';
 const SHOW_ADMIN_DETAILS = 'show_admin_details';
 const ADMIN_STATUS = 'admin_status';
 const LEGACY_ADMIN_STATUS = 'status';
@@ -36,6 +37,7 @@ const DEFAULT_DELEGATE = '';
 const DEFAULT_SEARCH = '';
 const DEFAULT_ADMIN_STATUS = 'all';
 const INCLUDE_CANCELLED_TRUE = 'on';
+const SHOW_REGISTRATION_STATUS_TRUE = 'on';
 const SHOW_ADMIN_DETAILS_TRUE = 'yes';
 const LEGACY_DISPLAY_MODE_ADMIN = 'admin';
 
@@ -111,6 +113,7 @@ export const createFilterState = (searchParams) => ({
   selectedEvents:
     sanitizeEvents(searchParams.getAll(SELECTED_EVENTS)),
   shouldIncludeCancelled: searchParams.get(INCLUDE_CANCELLED) === INCLUDE_CANCELLED_TRUE,
+  shouldShowRegStatus: searchParams.get(SHOW_REGISTRATION_STATUS) === SHOW_REGISTRATION_STATUS_TRUE,
   shouldShowAdminDetails: searchParams.get(SHOW_ADMIN_DETAILS) === SHOW_ADMIN_DETAILS_TRUE
     || searchParams.get(DISPLAY_MODE) === LEGACY_DISPLAY_MODE_ADMIN,
   adminStatus: sanitizeAdminStatus(
@@ -130,6 +133,7 @@ export const updateSearchParams = (searchParams, filterState, displayMode) => {
     search,
     selectedEvents,
     shouldIncludeCancelled,
+    shouldShowRegStatus,
     shouldShowAdminDetails,
     adminStatus,
   } = filterState;
@@ -185,6 +189,12 @@ export const updateSearchParams = (searchParams, filterState, displayMode) => {
     searchParams.delete(INCLUDE_CANCELLED);
   }
 
+  if (shouldShowRegStatus) {
+    searchParams.set(SHOW_REGISTRATION_STATUS, SHOW_REGISTRATION_STATUS_TRUE);
+  } else {
+    searchParams.delete(SHOW_REGISTRATION_STATUS);
+  }
+
   if (shouldShowAdminDetails) {
     searchParams.set(SHOW_ADMIN_DETAILS, SHOW_ADMIN_DETAILS_TRUE);
   } else {

app/webpacker/components/CompetitionsOverview/queryUtils.js

@@ -22,6 +22,7 @@ export function calculateQueryKey(filterState, canViewAdminDetails = false) {
     search: filterState?.search,
     time: timeKey,
     shouldIncludeCancelled: filterState?.shouldIncludeCancelled,
+    shouldShowRegStatus: filterState?.shouldShowRegStatus,
     adminStatus,
   };
 }
@@ -38,6 +39,7 @@ export function createSearchParams(filterState, pageParam, canViewAdminDetails =
     customEndDate,
     adminStatus,
     shouldIncludeCancelled,
+    shouldShowRegStatus,
   } = filterState;
 
   const dateNow = DateTime.now();
@@ -60,6 +62,7 @@ export function createSearchParams(filterState, pageParam, canViewAdminDetails =
     searchParams.append('admin_status', adminStatus);
   }
   searchParams.append('include_cancelled', shouldIncludeCancelled);
+  searchParams.append('include_registration_status', shouldShowRegStatus);
 
   if (timeOrder === 'present') {
     searchParams.append('sort', 'start_date,end_date,name');