From 857ebd8be0a8ebd5ef51d291d1c779dda308322d Mon Sep 17 00:00:00 2001 From: Christian Maddox Date: Tue, 8 Oct 2024 13:54:51 -0400 Subject: [PATCH] chore: Cleanup Admin columns and default values (#2236) * Fixed columns for each app. * Fixed default values for add screen modal. * Handle error instead of ignoring it. * Handle default object access better. * Fix defaults so they use the header config the app supports. --- .../src/components/admin/admin_add_modal.tsx | 80 ++-- assets/src/components/admin/admin_tables.tsx | 374 +++++++----------- 2 files changed, 181 insertions(+), 273 deletions(-) diff --git a/assets/src/components/admin/admin_add_modal.tsx b/assets/src/components/admin/admin_add_modal.tsx index 4fa63bb6a..493b7db84 100644 --- a/assets/src/components/admin/admin_add_modal.tsx +++ b/assets/src/components/admin/admin_add_modal.tsx @@ -12,19 +12,13 @@ const fields = [ key: "app_id", label: "App ID", FormCell: buildFormSelect([ - "bus_eink", "bus_eink_v2", "bus_shelter_v2", "busway_v2", - "dup", "dup_v2", - "gl_eink_double", - "gl_eink_single", "gl_eink_v2", "pre_fare_v2", "solari", - "solari_large", - "solari_large_v2", ]), }, { @@ -42,66 +36,60 @@ const fields = [ { key: "device_id", label: "Device ID", FormCell: FormTextCell }, ]; +const departuresWidgetParams = { sections: [] }; +const footerWidgetParams = { stop_id: "" }; +const alertsWidgetParams = { stop_id: "" }; + const defaultAppParamsByAppId = { - bus_eink: { stop_id: "STOP_ID" }, bus_eink_v2: { - departures: {}, - footer: {}, - header: {}, - alerts: {}, - }, - gl_eink_single: { - stop_id: "STOP_ID", - platform_id: "PLATFORM_ID", - route_id: "ROUTE_ID", - direction_id: -1, - }, - gl_eink_double: { - stop_id: "STOP_ID", - platform_id: "PLATFORM_ID", - route_id: "ROUTE_ID", - direction_id: -1, + header: { stop_id: "" }, + evergreen_content: [], + departures: departuresWidgetParams, + footer: footerWidgetParams, + alerts: alertsWidgetParams, }, gl_eink_v2: { - departures: {}, - footer: {}, - header: {}, - alerts: {}, + header: { stop_id: "" }, + evergreen_content: [], + departures: departuresWidgetParams, + footer: footerWidgetParams, + alerts: alertsWidgetParams, }, solari: { station_name: "STATION_NAME" }, - dup: { header: "STATION_NAME" }, + dup_v2: { + header: { stop_id: "" }, + evergreen_content: [], + primary_departures: departuresWidgetParams, + secondary_departures: departuresWidgetParams, + alerts: alertsWidgetParams, + }, bus_shelter_v2: { - departures: {}, - footer: {}, - header: {}, - alerts: {}, + header: { stop_id: "" }, + evergreen_content: [], + departures: departuresWidgetParams, + footer: footerWidgetParams, + alerts: alertsWidgetParams, }, busway_v2: { - departures: {}, - header: {}, - }, - solari_large_v2: { - departures: {}, - header: {}, + header: { stop_name: "" }, + evergreen_content: [], + departures: departuresWidgetParams, }, pre_fare_v2: { - header: { - stop_name: "", - }, + header: { stop_id: "" }, + evergreen_content: [], }, }; -const initialFormValues = _.fromPairs( - fields.map(({ key }) => [key, undefined]), -); +const initialFormValues = _.fromPairs(fields.map(({ key }) => [key, ""])); const AddModal = ({ setData, closeModal }): JSX.Element => { - const [formValues, setFormValues] = useState(initialFormValues); + const [formValues, setFormValues] = + useState<_.Dictionary>(initialFormValues); const addScreen = () => { const newRow = { app_id: formValues.app_id, - // @ts-expect-error app_params: defaultAppParamsByAppId[formValues.app_id], device_id: formValues.device_id, disabled: false, diff --git a/assets/src/components/admin/admin_tables.tsx b/assets/src/components/admin/admin_tables.tsx index 00269afff..a248fa141 100644 --- a/assets/src/components/admin/admin_tables.tsx +++ b/assets/src/components/admin/admin_tables.tsx @@ -187,62 +187,6 @@ const SolariScreensTable = (): JSX.Element => { return ; }; -const DupV2ScreensTable = (): JSX.Element => { - const columns = [ - { - Header: "Screen ID", - accessor: "id", - Cell: InspectorLink, - Filter: DefaultColumnFilter, - }, - { - Header: "Header", - accessor: buildAppParamAccessor("header"), - mutator: buildAppParamMutator("header"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - { - Header: "Primary Departures", - accessor: buildAppParamAccessor("primary_departures"), - mutator: buildAppParamMutator("primary_departures"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - { - Header: "Secondary Departures", - accessor: buildAppParamAccessor("secondary_departures"), - mutator: buildAppParamMutator("secondary_departures"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - { - Header: "Alerts", - accessor: buildAppParamAccessor("alerts"), - mutator: buildAppParamMutator("alerts"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - { - Header: "Evergreen Content", - accessor: buildAppParamAccessor("evergreen_content"), - mutator: buildAppParamMutator("evergreen_content"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - ]; - - const dataFilter = ({ app_id }) => { - return app_id === "dup_v2"; - }; - return ; -}; - const v2Columns = [ { Header: "Screen ID", @@ -258,22 +202,6 @@ const v2Columns = [ Filter: DefaultColumnFilter, FormCell: FormTextCell, }, - { - Header: "Departures", - accessor: buildAppParamAccessor("departures"), - mutator: buildAppParamMutator("departures"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, - { - Header: "Footer", - accessor: buildAppParamAccessor("footer"), - mutator: buildAppParamMutator("footer"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }, { Header: "Header", accessor: buildAppParamAccessor("header"), @@ -292,6 +220,24 @@ const v2Columns = [ }, ]; +const departuresColumn = { + Header: "Departures", + accessor: buildAppParamAccessor("departures"), + mutator: buildAppParamMutator("departures"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, +}; + +const footerColumn = { + Header: "Footer", + accessor: buildAppParamAccessor("footer"), + mutator: buildAppParamMutator("footer"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, +}; + const alertsColumn = { Header: "Alerts", accessor: buildAppParamAccessor("alerts"), @@ -301,72 +247,83 @@ const alertsColumn = { FormCell: FormTextarea, }; -const surveyColumn = { - Header: "Survey", - accessor: buildAppParamAccessor("survey"), - mutator: buildAppParamMutator("survey"), +const audioColumn = { + Header: "Audio", + accessor: buildAppParamAccessor("audio"), + mutator: buildAppParamMutator("audio"), Cell: EditableTextarea, disableFilters: true, FormCell: FormTextarea, }; +const DupV2ScreensTable = (): JSX.Element => { + const columns = [ + ...v2Columns, + { + Header: "Primary Departures", + accessor: buildAppParamAccessor("primary_departures"), + mutator: buildAppParamMutator("primary_departures"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + { + Header: "Secondary Departures", + accessor: buildAppParamAccessor("secondary_departures"), + mutator: buildAppParamMutator("secondary_departures"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + alertsColumn, + ]; + + const dataFilter = ({ app_id }) => { + return app_id === "dup_v2"; + }; + return ; +}; + const BusEinkV2ScreensTable = (): JSX.Element => { const dataFilter = ({ app_id }) => { return app_id === "bus_eink_v2"; }; - return ( - - ); + const columns = [...v2Columns, departuresColumn, footerColumn, alertsColumn]; + + return ; }; const GLEinkV2ScreensTable = (): JSX.Element => { - const lineMapColumn = { - Header: "Line Map", - accessor: buildAppParamAccessor("line_map"), - mutator: buildAppParamMutator("line_map"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, - }; - - const platformLocationColumn = { - Header: "Platform Location", - accessor: buildAppParamAccessor("platform_location"), - mutator: buildAppParamMutator("platform_location"), - Cell: EditableSelect, - disableFilters: true, - FormCell: buildFormSelect(["front", "back"], false), - }; + const columns = [ + ...v2Columns, + { + Header: "Line Map", + accessor: buildAppParamAccessor("line_map"), + mutator: buildAppParamMutator("line_map"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + { + Header: "Platform Location", + accessor: buildAppParamAccessor("platform_location"), + mutator: buildAppParamMutator("platform_location"), + Cell: EditableSelect, + disableFilters: true, + FormCell: buildFormSelect(["front", "back"], false), + }, + departuresColumn, + footerColumn, + alertsColumn, + audioColumn, + ]; const dataFilter = ({ app_id }) => { return app_id === "gl_eink_v2"; }; - return ( - - ); -}; - -const audioColumn = { - Header: "Audio", - accessor: buildAppParamAccessor("audio"), - mutator: buildAppParamMutator("audio"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, + return ; }; const BusShelterV2ScreensTable = (): JSX.Element => { @@ -374,75 +331,23 @@ const BusShelterV2ScreensTable = (): JSX.Element => { return app_id === "bus_shelter_v2"; }; - return ( - - ); -}; - -const elevatorStatusColumn = { - Header: "Elevator Status", - accessor: buildAppParamAccessor("elevator_status"), - mutator: buildAppParamMutator("elevator_status"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; - -const reconstructedAlertWidgetColumn = { - Header: "Alert Widget", - accessor: buildAppParamAccessor("reconstructed_alert_widget"), - mutator: buildAppParamMutator("reconstructed_alert_widget"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; - -const lineMapColumn = { - Header: "Full Line Map", - accessor: buildAppParamAccessor("full_line_map"), - mutator: buildAppParamMutator("full_line_map"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; - -const contentSummaryColumn = { - Header: "Content Summary", - accessor: buildAppParamAccessor("content_summary"), - mutator: buildAppParamMutator("content_summary"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; - -const crDeparturesColumn = { - Header: "Commuter Rail", - accessor: buildAppParamAccessor("cr_departures"), - mutator: buildAppParamMutator("cr_departures"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; - -const blueBikesColumn = { - Header: "BlueBikes", - accessor: buildAppParamAccessor("blue_bikes"), - mutator: buildAppParamMutator("blue_bikes"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, -}; + const columns = [ + ...v2Columns, + departuresColumn, + footerColumn, + alertsColumn, + audioColumn, + { + Header: "Survey", + accessor: buildAppParamAccessor("survey"), + mutator: buildAppParamMutator("survey"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + ]; -const shuttleBusInfoColumn = { - Header: "Shuttle Bus Info", - accessor: buildAppParamAccessor("shuttle_bus_info"), - mutator: buildAppParamMutator("shuttle_bus_info"), - Cell: EditableTextarea, - disableFilters: true, - FormCell: FormTextarea, + return ; }; const PreFareV2ScreensTable = (): JSX.Element => { @@ -450,65 +355,80 @@ const PreFareV2ScreensTable = (): JSX.Element => { return app_id === "pre_fare_v2"; }; - return ( - - ); -}; - -const BuswayV2ScreensTable = (): JSX.Element => { - const dataFilter = ({ app_id }) => { - return app_id === "busway_v2"; - }; - const columns = [ + ...v2Columns, { - Header: "Screen ID", - accessor: "id", - Cell: InspectorLink, - Filter: DefaultColumnFilter, - FormCell: FormStaticCell, + Header: "Elevator Status", + accessor: buildAppParamAccessor("elevator_status"), + mutator: buildAppParamMutator("elevator_status"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, }, { - Header: "Name", - accessor: "name", - Cell: EditableCell, - Filter: DefaultColumnFilter, - FormCell: FormTextCell, + Header: "Alert Widget", + accessor: buildAppParamAccessor("reconstructed_alert_widget"), + mutator: buildAppParamMutator("reconstructed_alert_widget"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + { + Header: "Full Line Map", + accessor: buildAppParamAccessor("full_line_map"), + mutator: buildAppParamMutator("full_line_map"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, }, { - Header: "Departures", - accessor: buildAppParamAccessor("departures"), - mutator: buildAppParamMutator("departures"), + Header: "Content Summary", + accessor: buildAppParamAccessor("content_summary"), + mutator: buildAppParamMutator("content_summary"), Cell: EditableTextarea, disableFilters: true, FormCell: FormTextarea, }, { - Header: "Header", - accessor: buildAppParamAccessor("header"), - mutator: buildAppParamMutator("header"), + Header: "Commuter Rail", + accessor: buildAppParamAccessor("cr_departures"), + mutator: buildAppParamMutator("cr_departures"), Cell: EditableTextarea, disableFilters: true, FormCell: FormTextarea, }, + { + Header: "BlueBikes", + accessor: buildAppParamAccessor("blue_bikes"), + mutator: buildAppParamMutator("blue_bikes"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + { + Header: "Shuttle Bus Info", + accessor: buildAppParamAccessor("shuttle_bus_info"), + mutator: buildAppParamMutator("shuttle_bus_info"), + Cell: EditableTextarea, + disableFilters: true, + FormCell: FormTextarea, + }, + audioColumn, ]; return ; }; +const BuswayV2ScreensTable = (): JSX.Element => { + const dataFilter = ({ app_id }) => { + return app_id === "busway_v2"; + }; + + const columns = [...v2Columns, departuresColumn]; + + return ; +}; + export { AllScreensTable, BusEinkV2ScreensTable,