Fetch store name from the GraphQL server at compile time.

[revanth0212]

Is your feature request related to a problem? Please describe.
This is related to #1595. As part of that PR, we have created a global variable called STORE_NAME that can be added to the bundle at compile time using the Webpack Define plugin. Instead of hardcoding it in Define plugin, can we request that from the GraphQL server and then insert that into the global object just like the Define plugin?

Describe the solution you'd like

• Modify the getStoreConfigData.graphql file to include store_name, as per the StoreConfig schema.
• Modify the getAvailableStoresConfigData.graphql to also include the store_name.
• Using the data from these queries, if STORE*VIEW_CODE environment variable is used, use the store*name value from the corresponding availableStore. If not, use the default value returned by the getStoreConfigData query.
• Update jest config with whatever the sample data store name is from venia.

Describe alternatives you've considered
We can expect the partner developers to simply change the hardcoded string in webpack's Define plugin.

Please let us know what packages this feature is in regards to:

• <x] venia-concept
• venia-ui
• pwa-buildpack
• peregrine
• pwa-devdocs
• upward-js
• [ > upward-spec

Test Plan:

• On first load (clear cache) of home page route, url will be displayed initially as title in browser.
• After a short time, title will update to contain view name.
• Refresh page. Title should contain correct view name (from cache). You should not see url in title.
• Repeat above steps for:
  • CMS page
  • Category page
  • Product page
  • Account Information page
  • Address Book page
  • Communications page
  • Reset Password page
  • Order History page
  • Cart page
  • Checkout page
  • Order confirmation page (refresh will go back to cart page)
• Run MFTF

[supernova-at]

Check the Risks & Caveats section of #1739 for issues we may run into when fetching GraphQL data at build time.

That said, "store name" should theoretically not change all that often 😄

[zetlen]

We already have a relatively new plugin which gets the media URL from GraphQL at build time. Who wants to extend it?

You'll need:

• Some experience with NodeJS and Webpack plugins
• Connect a debugger (like Chrome or VSCode) to the running Node process
• The Webpack configuration API open in another tab
• A GraphiQL environment (or the GraphQL playground!) to test GraphQL queries