From da81479d9ba501a29963d8d09ec6890d2cfbf3f5 Mon Sep 17 00:00:00 2001
From: sebseb7 <sebgreenbus@gmail.com>
Date: Fri, 21 Nov 2025 11:57:39 +0100
Subject: [PATCH] refactor(App): update Box component to use 'main' role for
 improved semantics

- Changed Box component in App.js and PrerenderAppContent.js to use 'main' as the component role, enhancing accessibility and semantic structure of the application.
---
 src/App.js                 | 2 +-
 src/PrerenderAppContent.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/App.js b/src/App.js
index c287595..1f3978f 100644
--- a/src/App.js
+++ b/src/App.js
@@ -228,7 +228,7 @@ const AppContent = ({ currentTheme, dynamicTheme, onThemeChange }) => {
       <TitleUpdater />
       <ScrollToTop />
       <Header active categoryId={categoryId} key={authVersion} />
-      <Box sx={{ flexGrow: 1 }}>
+      <Box component="main" sx={{ flexGrow: 1 }}>
         <Suspense fallback={
           // Use prerender fallback if available, otherwise show loading spinner
           typeof window !== "undefined" && window.__PRERENDER_FALLBACK__ ? (
diff --git a/src/PrerenderAppContent.js b/src/PrerenderAppContent.js
index 600e2ea..cb24484 100644
--- a/src/PrerenderAppContent.js
+++ b/src/PrerenderAppContent.js
@@ -44,7 +44,7 @@ const PrerenderAppContent = (socket) => (
         <CategoryList categoryId={209} activeCategoryId={null} socket={socket}/>
       </AppBar>
  
-      <Box sx={{ flexGrow: 1 }}>
+      <Box component="main" sx={{ flexGrow: 1 }}>
           <CarouselProvider>
             <Routes>
               <Route path="/" element={<MainPageLayout />} />