From 51df9fb21d825cd6d9a831ca7494cb865a36b919 Mon Sep 17 00:00:00 2001 From: Devin Matte Date: Sat, 1 Mar 2025 16:39:31 -0500 Subject: [PATCH] Clean up date selection and remaining small bugs --- .../inputs/DateSelection/DatePickers.tsx | 6 ++-- common/components/nav/MenuDropdown.tsx | 2 +- common/constants/dashboardTabs.ts | 2 +- common/constants/dates.ts | 24 ++++++++++++-- common/state/defaults/dateDefaults.ts | 3 +- common/utils/middleware.ts | 32 ++++++++++++++----- common/utils/router.tsx | 5 ++- modules/landing/LineButton.tsx | 2 +- 8 files changed, 56 insertions(+), 20 deletions(-) diff --git a/common/components/inputs/DateSelection/DatePickers.tsx b/common/components/inputs/DateSelection/DatePickers.tsx index 9dcbd2ec8..fbf05d87e 100644 --- a/common/components/inputs/DateSelection/DatePickers.tsx +++ b/common/components/inputs/DateSelection/DatePickers.tsx @@ -7,7 +7,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import Flatpickr from 'react-flatpickr'; import 'flatpickr/dist/themes/light.css'; import { useDelimitatedRoute, useUpdateQuery } from '../../../utils/router'; -import { FLAT_PICKER_OPTIONS, TODAY_STRING, RANGE_PRESETS } from '../../../constants/dates'; +import { TODAY_STRING, RANGE_PRESETS, getDatePickerOptions } from '../../../constants/dates'; import { buttonHighlightFocus } from '../../../styles/general'; import type { Line } from '../../../types/lines'; import { ALL_PAGES } from '../../../constants/pages'; @@ -108,7 +108,7 @@ export const DatePickers: React.FC = ({ range, setRange, type, value={startDate ?? date} key={'start'} placeholder={'mm/dd/yyyy'} - options={FLAT_PICKER_OPTIONS[tab]} + options={getDatePickerOptions(tab, page)} onChange={(dates, currentDateString) => { if (isSingleDate) { handleDateChange(currentDateString); @@ -135,7 +135,7 @@ export const DatePickers: React.FC = ({ range, setRange, type, value={endDate} key={'end'} placeholder={'mm/dd/yyyy'} - options={FLAT_PICKER_OPTIONS[tab]} + options={getDatePickerOptions(tab, page)} onChange={(dates, currentDateString) => { handleEndDateChange(currentDateString); }} diff --git a/common/components/nav/MenuDropdown.tsx b/common/components/nav/MenuDropdown.tsx index 11e14a640..971694f1e 100644 --- a/common/components/nav/MenuDropdown.tsx +++ b/common/components/nav/MenuDropdown.tsx @@ -44,7 +44,7 @@ export const MenuDropdown: React.FC = ({ line, route, childre case 'line-bus': return `/bus/trips/single?busRoute=1&date=${BUS_DEFAULTS.singleTripConfig.date}`; case 'line-commuter-rail': - return `/commuter-rail/trips/single?crRoute=CR-Lowell&date=${COMMUTER_RAIL_DEFAULTS.singleTripConfig.date}`; + return `/commuter-rail/trips/single?crRoute=CR-Fairmount&date=${COMMUTER_RAIL_DEFAULTS.singleTripConfig.date}`; default: return getLineSelectionItemHref(line, route); } diff --git a/common/constants/dashboardTabs.ts b/common/constants/dashboardTabs.ts index bbfd46a21..938f03876 100644 --- a/common/constants/dashboardTabs.ts +++ b/common/constants/dashboardTabs.ts @@ -14,6 +14,6 @@ export const DASHBOARD_TABS: { 'Commuter Rail': { name: 'Commuter Rail', path: '/commuter-rail', - query: { crRoute: 'CR-Lowell', date: COMMUTER_RAIL_DEFAULTS.singleTripConfig.date }, + query: { crRoute: 'CR-Fairmount', date: COMMUTER_RAIL_DEFAULTS.singleTripConfig.date }, }, }; diff --git a/common/constants/dates.ts b/common/constants/dates.ts index eff7c5d66..ed32b12b8 100644 --- a/common/constants/dates.ts +++ b/common/constants/dates.ts @@ -9,6 +9,7 @@ import type { SingleDateParams, } from '../components/inputs/DateSelection/types/DateSelectionTypes'; import type { Tab } from '../types/router'; +import type { Page } from './pages'; dayjs.extend(utc); dayjs.extend(timezone); @@ -40,13 +41,30 @@ export const BUS_MAX_DAY = dayjs(BUS_MAX_DATE); export const BUS_MAX_DATE_MINUS_ONE_WEEK = dayjs(BUS_MAX_DATE) .subtract(7, 'days') .format(DATE_FORMAT); -export const COMMUTER_RAIL_MIN_DATE = '2022-06-22'; + +// Commuter Rail earliest Ridership date +export const COMMUTER_RAIL_RIDERSHIP_MIN_DATE = '2022-06-22'; +export const COMMUTER_RAIL_DATA_MIN_DATE = '2024-01-01'; export const getESTDayjs = (date: string) => { return dayjs(date).tz(est); }; -export const FLAT_PICKER_OPTIONS: { +export const getDatePickerOptions = (tab: Tab, page?: Page) => { + if (tab === 'Commuter Rail') { + if (page === 'ridership') { + return { + ...FLAT_PICKER_OPTIONS[tab], + minDate: COMMUTER_RAIL_RIDERSHIP_MIN_DATE, + maxDate: TODAY_STRING, + }; + } + } + + return FLAT_PICKER_OPTIONS[tab]; +}; + +const FLAT_PICKER_OPTIONS: { [key in Tab]: DateTimePickerProps['options']; } = { Subway: { @@ -75,7 +93,7 @@ export const FLAT_PICKER_OPTIONS: { }, 'Commuter Rail': { enableTime: false, - minDate: COMMUTER_RAIL_MIN_DATE, + minDate: COMMUTER_RAIL_DATA_MIN_DATE, maxDate: TODAY_STRING, altInput: true, altFormat: 'M j, Y', diff --git a/common/state/defaults/dateDefaults.ts b/common/state/defaults/dateDefaults.ts index 1551ae7a6..568ab90fe 100644 --- a/common/state/defaults/dateDefaults.ts +++ b/common/state/defaults/dateDefaults.ts @@ -7,7 +7,6 @@ import { TODAY_STRING, YESTERDAY_STRING, TODAY_SERVICE_STARTED, - COMMUTER_RAIL_MIN_DATE, } from '../../constants/dates'; import type { WithOptional } from '../../types/general'; @@ -41,7 +40,7 @@ export const COMMUTER_RAIL_DEFAULTS: WithOptional< > = { lineConfig: { startDate: OVERVIEW_OPTIONS.year.startDate, endDate: TODAY_STRING }, multiTripConfig: { - startDate: COMMUTER_RAIL_MIN_DATE, + startDate: ONE_WEEK_AGO_STRING, endDate: TODAY_STRING, }, singleTripConfig: { diff --git a/common/utils/middleware.ts b/common/utils/middleware.ts index 41f17532c..b1767759a 100644 --- a/common/utils/middleware.ts +++ b/common/utils/middleware.ts @@ -1,16 +1,25 @@ import type { ReadonlyURLSearchParams } from 'next/navigation'; import { useSearchParams } from 'next/navigation'; import { useRouter } from 'next/router'; -import { RAIL_LINES, type BusRoute, type LinePath, BUS_ROUTES } from '../types/lines'; +import { + type CommuterRailRoute, + type BusRoute, + type LinePath, + COMMUTER_RAIL_ROUTES, + BUS_ROUTES, + RAIL_LINES, +} from '../types/lines'; import { TODAY_STRING } from '../constants/dates'; -const getBusOrLine = ( +const getLineOrRoute = ( lineString: string | BusRoute -): { type: 'rail' | 'bus'; value: LinePath | BusRoute } | undefined => { +): { type: 'rail' | 'bus' | 'cr'; value: LinePath | BusRoute | CommuterRailRoute } | undefined => { if (RAIL_LINES.includes(lineString.toLowerCase())) return { type: 'rail', value: lineString.toLowerCase() as LinePath }; if (BUS_ROUTES.includes(lineString.toString() as BusRoute)) return { type: 'bus', value: lineString as BusRoute }; + if (COMMUTER_RAIL_ROUTES.includes(lineString.toString() as CommuterRailRoute)) + return { type: 'cr', value: lineString as CommuterRailRoute }; }; export const configToQueryParams = (search: ReadonlyURLSearchParams | URLSearchParams) => { @@ -21,8 +30,8 @@ export const configToQueryParams = (search: ReadonlyURLSearchParams | URLSearchP : search.get('config')?.split(','); if (!configArr || configArr.length !== 5) return; - const busOrLine = getBusOrLine(configArr[0]); - if (!busOrLine) return; + const lineOrRoute = getLineOrRoute(configArr[0]); + if (!lineOrRoute) return; const query = { from: configArr[1] || undefined, @@ -42,13 +51,20 @@ export const configToQueryParams = (search: ReadonlyURLSearchParams | URLSearchP string, string, ][]; - if (busOrLine.type === 'bus') queryArr.push(['busRoute', busOrLine.value]); + if (lineOrRoute.type === 'bus') queryArr.push(['busRoute', lineOrRoute.value]); + if (lineOrRoute.type === 'cr') queryArr.push(['crRoute', lineOrRoute.value]); const newQueryParams = new URLSearchParams(queryArr); - if (busOrLine.type === 'rail') + if (lineOrRoute.type === 'rail') return { - line: busOrLine.value, + line: lineOrRoute.value, + queryParams: newQueryParams, + tripSection: singleOrMulti, + }; + if (lineOrRoute.type === 'cr') + return { + line: 'commuter-rail', queryParams: newQueryParams, tripSection: singleOrMulti, }; diff --git a/common/utils/router.tsx b/common/utils/router.tsx index f1bba8fc6..b3fb69295 100644 --- a/common/utils/router.tsx +++ b/common/utils/router.tsx @@ -159,8 +159,11 @@ export const getLineSelectionItemHref = (newLine: Line, route: Route): string => } delete query.from; delete query.to; + // Get queryParams but exclude busRoute and crRoute const queryParams = query - ? new URLSearchParams(Object.entries(query).filter(([key]) => key !== 'busRoute')) + ? new URLSearchParams( + Object.entries(query).filter(([key]) => key !== 'busRoute' && key !== 'crRoute') + ) : new URLSearchParams(); href += currentPath ? `${currentPath}` : ''; const queryString = queryParams.toString(); diff --git a/modules/landing/LineButton.tsx b/modules/landing/LineButton.tsx index 4439b66ab..38490fb6c 100644 --- a/modules/landing/LineButton.tsx +++ b/modules/landing/LineButton.tsx @@ -18,7 +18,7 @@ export const LineButton: React.FC = ({ children, line }) => {