fix: LocalizationProvider in a Suspense boundary (#145)

Shopify · Nov 8, 2021 · 8b57e40 · 8b57e40
1 parent 2d58d8d
commit 8b57e40
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 9 deletions.
diff --git a/packages/create-hydrogen-app/CHANGELOG.md b/packages/create-hydrogen-app/CHANGELOG.md
@@ -5,7 +5,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
-<!-- ## Unreleased -->
+## Unreleased
+
+- Wrap LocalizationProvider in a proper Suspense boundary
+- Optimize `@headlessui/react` to prevent dev server slowness while we investigate a long term solution
 
 ## 0.6.0 - 2021-11-05
 

diff --git a/packages/dev/src/App.server.jsx b/packages/dev/src/App.server.jsx
@@ -17,10 +17,10 @@ export default function App({...serverState}) {
   const pages = import.meta.globEager('./pages/**/*.server.[jt]sx');
 
   return (
-    <ShopifyServerProvider shopifyConfig={shopifyConfig} {...serverState}>
-      <LocalizationProvider>
-        <CartProvider>
-          <Suspense fallback={<LoadingFallback />}>
+    <Suspense fallback={<LoadingFallback />}>
+      <ShopifyServerProvider shopifyConfig={shopifyConfig} {...serverState}>
+        <LocalizationProvider>
+          <CartProvider>
             <DefaultSeo />
             <Switch>
               <DefaultRoutes
@@ -29,9 +29,9 @@ export default function App({...serverState}) {
                 fallback={<NotFound />}
               />
             </Switch>
-          </Suspense>
-        </CartProvider>
-      </LocalizationProvider>
-    </ShopifyServerProvider>
+          </CartProvider>
+        </LocalizationProvider>
+      </ShopifyServerProvider>
+    </Suspense>
   );
 }