@W-17543565 implement update routes function

[hajinsuha1]

Description

Types of Changes

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Documentation update
• Breaking change (could cause existing functionality to not work as expected)
• Other changes (non-breaking changes that does not fit any of the above)

Breaking changes include:

• Removing a public function or component or prop
• Adding a required argument to a function
• Changing the data type of a function parameter or return value
• Adding a new peer dependency to package.json

Changes

• (change1)

How to Test-Drive This PR

• test CATEGORY, PRODUCT, and CONTENT_ASSET resource returned by getUrlMapping API

Checklists

General

• Changes are covered by test cases
• CHANGELOG.md updated with a short description of changes (not required for documentation updates)

Accessibility Compliance

You must check off all items in one of the follow two lists:

• There are no changes to UI

or...

• Changes were tested with a Screen Reader (iOS VoiceOver or Android Talkback) and had no issues
• Changes comply with WCAG 2.0 guidelines levels A and AA
• Changes to common UI patterns and interactions comply with WAI-ARIA best practices

Localization

• Changes include a UI text update in the Retail React App (which requires translation)

[hajinsuha1]

@bendvc here is the bulk of the changes where I update the beforeRouteMatch to get the routes from window.__CONFIG__.app.routes if it's client side and allRoutes if it's server

[hajinsuha1]

here is where we map the componentName to the actual component from extension-chakra-storefront/src/pages

[bendvc]

@hajinsuha1 Hey Jinsu.. here are some high level general comments.

1. My gut is telling me that any kind of logic for serializing/deserializing should be a SDK feature. This means the condition here would be somewhere inside the SDK code rather than in this extension.
2. Should we entertain the idea making the routes.jsx and extendRoutes async? That might make our lives easier. We could also infer that if there is an asyn router that we must serialize.
3. How do we get the page component map? I think we should be passing this to the extension via a configuration, we can then pass that value to the application component which will later use it when determining the route (we might have to flesh that out a little, but I'm making saying that this handling of serialized routes is also something that would be in the sdk)
4. What should be in this extension is an hoc to is used in the extendApp function. That hoc should take advantage of the useBlock hook from the sdk with a special implementation that looks at the seo url mapping api.
5. We want to make sure that this extension can accept a commerceAPI config. And also wraps the app with an optional provider like the store locator code is doing.
6. The custom code that makes an api called to get the seo mapping should also happen in extendRoutes, I don't thing beforeRouteMatch is the correct tie in point.