fix(chunk-loading): handle stale chunk loading errors

[sentry]

Description

This PR addresses a SyntaxError where the browser attempts to import a minified export (e.g., 'C') from a JavaScript chunk, but the chunk served by the CDN no longer provides that export under the expected name. This typically occurs when a user's browser has a stale cached entry bundle or lazy-loaded chunk after a new deployment, leading to a version mismatch.

Root Cause: Vite/Rollup's minification process can change the single-letter names assigned to exports in JavaScript chunks across different builds, even if the source code for that specific chunk hasn't changed. If a user's browser loads an older, cached importer chunk that expects a specific minified export name (like 'C'), but the CDN serves a newer version of the target chunk where that export has a different minified name, a SyntaxError occurs.

Solution:
Implemented a lazyWithRetry helper function that wraps React.lazy calls. This helper catches chunk loading errors, specifically SyntaxError instances that indicate a missing export. If such an error occurs and the page has not already been force-reloaded (checked via sessionStorage to prevent infinite loops), it triggers a window.location.reload(). This forces the browser to fetch the latest index.html and all associated content-hashed JavaScript bundles, resolving the version mismatch. This ensures that users encountering stale-chunk errors are gracefully recovered with a hard refresh, preventing the application from breaking.

Code Example

// Example structure of lazyWithRetry
const lazyWithRetry = (componentImport: () => Promise<any>) => {
  return React.lazy(() => {
    return componentImport().catch((error) => {
      if (error instanceof SyntaxError && error.message.includes('Failed to fetch dynamically imported module')) {
        const hasReloaded = sessionStorage.getItem('hasReloadedOnChunkError');
        if (!hasReloaded) {
          sessionStorage.setItem('hasReloadedOnChunkError', 'true');
          window.location.reload();
        } else {
          sessionStorage.removeItem('hasReloadedOnChunkError'); // Clear for next session
          throw error; // Re-throw if already reloaded to prevent infinite loop
        }
      }
      throw error;
    });
  });
};

// Usage example:
const MyComponent = lazyWithRetry(() => import('./MyComponent'));

Notable Changes

• Introduced a new lazyWithRetry helper function to wrap React.lazy calls.
• This helper implements error handling for SyntaxError during dynamic chunk loading.
• Utilizes sessionStorage to track if a force-reload has already occurred, preventing infinite reload loops.
• Triggers window.location.reload() upon detecting a stale chunk SyntaxError to force a full page refresh and fetch the latest bundles.
• Improves application resilience against deployment-related version mismatches and stale browser caches.

Screenshots

N/A

Link to Sample Entry

N/A

Legal Boilerplate

Look, I get it. The entity doing business as "Codecov" is owned by Harness, Inc. In 2026 Harness acquired Codecov and as a result Harness is going to need some rights from me in order to utilize my contributions in this PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Harness can use, modify, copy, and redistribute my contributions, under Harness's choice of terms.

Fixes GAZEBO-1866

_{This PR was automatically generated by Sentry. You can adjust this setting at any time.}

[codecov-notifications]

Codecov Report

❌ Patch coverage is 80.00000% with 5 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
src/App.tsx	80.00%	4 Missing and 1 partial ⚠️

@@            Coverage Diff             @@
##             main    #4100      +/-   ##
==========================================
- Coverage   98.77%   98.74%   -0.04%     
==========================================
  Files         823      823              
  Lines       15147    15162      +15     
  Branches     4387     4389       +2     
==========================================
+ Hits        14961    14971      +10     
- Misses        179      183       +4     
- Partials        7        8       +1     

Files with missing lines	Coverage Δ
src/App.tsx	91.52% <80.00%> (-8.48%)	⬇️

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	99.72% <ø> (ø)
Pages	98.43% <ø> (ø)
Services	99.32% <ø> (ø)
Shared	98.94% <ø> (ø)
UI	99.02% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b8fbfc0...ffd6b2b. Read the comment docs.

[codecov]

Codecov Report

❌ Patch coverage is 80.00000% with 5 lines in your changes missing coverage. Please review.
✅ Project coverage is 98.74%. Comparing base (b8fbfc0) to head (ffd6b2b).
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
src/App.tsx	80.00%	4 Missing and 1 partial ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #4100      +/-   ##
==========================================
- Coverage   98.77%   98.74%   -0.04%     
==========================================
  Files         823      823              
  Lines       15147    15162      +15     
  Branches     4387     4381       -6     
==========================================
+ Hits        14961    14971      +10     
- Misses        179      183       +4     
- Partials        7        8       +1     

Files with missing lines	Coverage Δ
src/App.tsx	91.52% <80.00%> (-8.48%)	⬇️

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	99.72% <ø> (ø)
Pages	98.43% <ø> (ø)
Services	99.32% <ø> (ø)
Shared	98.94% <ø> (ø)
UI	99.02% <ø> (ø)

---

Continue to review full report in Codecov by Harness.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b8fbfc0...ffd6b2b. Read the comment docs.

[codecov-public-qa]

Codecov Report

Attention: Patch coverage is 80.00000% with 5 lines in your changes missing coverage. Please review.

Project coverage is 98.74%. Comparing base (b8fbfc0) to head (ffd6b2b).

✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
src/App.tsx	80.00%	4 Missing and 1 partial ⚠️

@@            Coverage Diff             @@
##             main    #4100      +/-   ##
==========================================
- Coverage   98.77%   98.74%   -0.04%     
==========================================
  Files         823      823              
  Lines       15147    15162      +15     
  Branches     4379     4381       +2     
==========================================
+ Hits        14961    14971      +10     
- Misses        179      183       +4     
- Partials        7        8       +1     

Files with missing lines	Coverage Δ
src/App.tsx	91.52% <80.00%> (-8.48%)	⬇️

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	99.72% <ø> (ø)
Pages	98.43% <ø> (ø)
Services	99.32% <ø> (ø)
Shared	98.94% <ø> (ø)
UI	99.02% <ø> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b8fbfc0...ffd6b2b. Read the comment docs.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[codecov-qa]

Codecov Report

❌ Patch coverage is 80.00000% with 5 lines in your changes missing coverage. Please review.
✅ Project coverage is 98.74%. Comparing base (b8fbfc0) to head (ffd6b2b).

Files with missing lines	Patch %	Lines
src/App.tsx	80.00%	4 Missing and 1 partial ⚠️

@@            Coverage Diff             @@
##             main    #4100      +/-   ##
==========================================
- Coverage   98.77%   98.74%   -0.04%     
==========================================
  Files         823      823              
  Lines       15147    15162      +15     
  Branches     4387     4381       -6     
==========================================
+ Hits        14961    14971      +10     
- Misses        179      183       +4     
- Partials        7        8       +1     

Files with missing lines	Coverage Δ
src/App.tsx	91.52% <80.00%> (-8.48%)	⬇️

Components	Coverage Δ
Assets	100.00% <ø> (ø)
Layouts	99.72% <ø> (ø)
Pages	98.43% <ø> (ø)
Services	99.32% <ø> (ø)
Shared	98.94% <ø> (ø)
UI	99.02% <ø> (ø)

---

Continue to review full report in Codecov by Harness.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b8fbfc0...ffd6b2b. Read the comment docs.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.