Unable to access the /admin/events/create page

[LeonardSchmitt67]

When trying to access the page /admin/events/create I get a blank page with an error in the console.

This was tested on Firefox 124.0 / Edge 122.0.2365.92 + Ubuntu 22.04.4 and on Windows 10 + Chrome 122.0.6261.112

The error is :

TypeError: t.match is not a function
    G utils.ts:9
    d1 index.tsx:116
    React 10
        Ea
        xs
        El
        wc
        bc
        vc
        ac
        cc
        Vo
        oc
react-dom.production.min.js:189:29
    React 11
        fs
        callback
        Ui
        _l
        wl
        yl
        xc
        xc
        cc
        Vo
        oc

The error seems to be from here :

export function isValidFullDate({ date, granularity }: { date: string; granularity: CalendarProps.Granularity }) {
  const regex = granularity === 'month' ? /^\d{4}-\d{2}(-\d{2})?$/ : /^\d{4}-\d{2}-\d{2}$/;
  return !!date.match(regex);
}

Here is also the full content of the console :

InstallTrigger est obsolète et sera supprimé prochainement. constants.js:50:15
i18next::backendConnector: loaded namespace translation for language en 
Object { "app.signup.signin": "Sign in", "app.signup.create-account": "Create account", "app.signup.username": "Username", "app.signup.enter-your-username": "Enter your username", "app.signup.password": "Password", "app.signup.enter-your-password": "Enter your password", "app.signup.forgot-your-password": "Forgot your password?", "app.signup.acknowledgement-label": "I agree with the Terms & Conditions", "app.signup.terms-and-conditions": "Terms and Conditions", "app.signup.acknowledgement": "You must agree to the Terms & Conditions", … }
i18next.js:13:48
i18next: languageChanged en i18next.js:13:48
i18next: initialized 
Object { debug: true, initImmediate: true, ns: (2) […], defaultNS: (1) […], fallbackLng: (1) […], fallbackNS: false, supportedLngs: false, nonExplicitSupportedLngs: false, load: "all", preload: false, … }
i18next.js:13:48
i18next::translator: missingKey en translation home.header DeepRacer Event Manager i18next.js:13:48
Object { countryCode: null, createdAt: "2024-03-14T01:07:00.746Z", createdBy: "0d103d6e-19c4-4aea-945f-997a64dd4890", eventDate: null, eventId: "db164003-d629-4b3b-abdf-55908dc1a0a1", eventName: "AwsInnovationDay", landingPageConfig: null, raceConfig: {…}, sponsor: null, tracks: (1) […], … }
eventSelectorModal.jsx:145:12
ON UPDATE RACE SUBSCRIPTION SETUP db164003-d629-4b3b-abdf-55908dc1a0a1 false useRacesApi.js:72:12
MODELS_IS_LOADING DISPATCH FUNCTION true modelsStore.js:44:14
register onUserCreated subscription useUsersApi.js:61:14
db164003-d629-4b3b-abdf-55908dc1a0a1 useRacesApi.js:14:14
ON UPDATE RACE SUBSCRIPTION SETUP db164003-d629-4b3b-abdf-55908dc1a0a1 true useRacesApi.js:72:12
CARS_IS_LOADING DISPATCH FUNCTION true 2 carsStore.js:25:14
GET FLEETS useFleetsApi.js:14:14
FLEETS_IS_LOADING DISPATCH FUNCTION true fleetsStore.js:33:14
EVENTS_IS_LOADING DISPATCH FUNCTION true eventsStore.js:33:14
SIDE_NAV_IS_OPEN DISPATCH FUNCTION true sideNavStore.js:6:14
ADD_EVENTS DISPATCH FUNCTION eventsStore.js:6:14
EVENTS_IS_LOADING DISPATCH FUNCTION false eventsStore.js:33:14
Object { countryCode: null, createdAt: "2024-03-14T01:07:00.746Z", createdBy: "0d103d6e-19c4-4aea-945f-997a64dd4890", eventDate: null, eventId: "db164003-d629-4b3b-abdf-55908dc1a0a1", eventName: "AwsInnovationDay", landingPageConfig: null, raceConfig: {…}, sponsor: null, tracks: (1) […], … }
eventSelectorModal.jsx:145:12
Object { countryCode: null, createdAt: "2024-03-14T01:07:00.746Z", createdBy: "0d103d6e-19c4-4aea-945f-997a64dd4890", eventDate: null, eventId: "db164003-d629-4b3b-abdf-55908dc1a0a1", eventName: "AwsInnovationDay", landingPageConfig: null, raceConfig: {…}, sponsor: null, tracks: (1) […], … }
eventSelectorModal.jsx:148:14
ADD_CARS DISPATCH FUNCTION carsStore.js:6:14
CARS_IS_LOADING DISPATCH FUNCTION false carsStore.js:25:14
ADD_FLEETS DISPATCH FUNCTION fleetsStore.js:6:14
FLEETS_IS_LOADING DISPATCH FUNCTION false fleetsStore.js:33:14
getRaces useRacesApi.js:17:16
RACES_IS_LOADING DISPATCH FUNCTION false racesStore.js:52:14
ADD_CARS DISPATCH FUNCTION carsStore.js:6:14
CARS_IS_LOADING DISPATCH FUNCTION false carsStore.js:25:14
ADD_MODELS DISPATCH FUNCTION 
Array(39) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, … ]
modelsStore.js:6:14
MODELS_IS_LOADING DISPATCH FUNCTION false 2 modelsStore.js:44:14
i18next::backendConnector: loaded namespace help-admin-events for language en 
Object { header: "## Events administration", content: "On this page, you can create, edit, and delete AWS DeepRacer events. When you create a new event, you add the following details:\n* **Ranking method** – Choose a method for ranking participating racers. Currently, DREM offers **Best lap time**.\n* **Track** – Choose the track you’ll be using for the event.\n* **Race time** – Race time is generally 2 minutes.\n* **Allowed resets per lap** – This is how many times a car can be reset on the track after it has gone off track with all 4 wheels leaving the track.\n\n* **Sponsor** – If there is a sponsor for the event, enter the sponsor name.", footer: "" }
i18next.js:13:48
defaultSortingColumn undefined pageTable.jsx:41:12
defaultSortingIsDescending undefined pageTable.jsx:47:12
UPDATE_HELP_PANEL DISPATCH FUNCTION 
Object { isHidden: false, content: {…} }
helpPanelStore.js:19:14
show split panel adminEvents.jsx:69:12
UPDATE_SPLIT_PANEL DISPATCH FUNCTION splitPanelStore.js:17:14
defaultSortingColumn undefined pageTable.jsx:41:12
defaultSortingIsDescending undefined pageTable.jsx:47:12
TypeError: t.match is not a function
    G utils.ts:9
    d1 index.tsx:116
    React 10
react-dom.production.min.js:189:29
    React 11
Uncaught TypeError: t.match is not a function
    G utils.ts:9
    d1 index.tsx:116
    React 10
utils.ts:9:16
deregister onUserCreated subscription useUsersApi.js:80:16
deregister onUserCreated subscription useUsersApi.js:109:16
RESET_SPLIT_PANEL DISPATCH FUNCTION splitPanelStore.js:21:14
RESET_HELP_PANEL DISPATCH FUNCTION helpPanelStore.js:23:14

[davidfsmith]

Hello,

Thanks for reporting this - Was this an error when trying to save the event (clicking "Create event") or just whilst filling out the form, I'm testing on OSX using FF 124.0.1 and I'm unable to recreate the error.

What region / date format is your browser showing in the form, from reading your error log it looks like your locale is French (Fr) but wanted to check rather than assume.

Regards Dave

[LeonardSchmitt67]

Hello ! I was unable to even access this form, when I'm redirected to /admin/events/create I immediately get a blank page and this error, I also checked with my browser set to French and to English but same error every time.

[larsll]

I am getting the same issue. Browser independent.

There are some 403 issues:

[larsll]

The above has to do with CloudWatch / RUM - might not be that relevant; but there is also this:

[larsll]

Additionally: The issue is also impacting the edit page.

[larsll]

Looking into this a bit in detail the issue is around here -- a value of undefined is passed into the date-picker, this is causing the crash in the Cloudscape Design Date Picker...

https://vscode.dev/github/larsll/guidance-for-aws-deepracer-event-management/blob/main/website/src/admin/events/components/generalInfoPanel.jsx#L103