From 567c1c9673e113145c2635855ca69bfb961158c0 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Sat, 22 Feb 2025 11:17:05 -0600
Subject: [PATCH] Fix initial setup width bug

---
 src/admin/AdminAppConfigurationClient.tsx     |  5 +++--
 src/admin/AdminInfoPage.tsx                   |  8 +-------
 src/admin/insights/AdminAppInsightsClient.tsx |  5 +++--
 src/components/ScoreCardContainer.tsx         | 15 +++++++++++++++
 4 files changed, 22 insertions(+), 11 deletions(-)
 create mode 100644 src/components/ScoreCardContainer.tsx

diff --git a/src/admin/AdminAppConfigurationClient.tsx b/src/admin/AdminAppConfigurationClient.tsx
index 1c2da187..a0c7c202 100644
--- a/src/admin/AdminAppConfigurationClient.tsx
+++ b/src/admin/AdminAppConfigurationClient.tsx
@@ -27,6 +27,7 @@ import { IoMdGrid } from 'react-icons/io';
 import { CgDebug } from 'react-icons/cg';
 import EnvVar from '@/components/EnvVar';
 import AdminLink from './AdminLink';
+import ScoreCardContainer from '@/components/ScoreCardContainer';
 
 export default function AdminAppConfigurationClient({
   // Storage
@@ -162,7 +163,7 @@ export default function AdminAppConfigurationClient({
     </WarningNote>;
 
   return (
-    <>
+    <ScoreCardContainer>
       <ChecklistGroup
         title="Storage"
         icon={<BiData size={16} />}
@@ -670,6 +671,6 @@ export default function AdminAppConfigurationClient({
             </div>
           </div>}
       </div>
-    </>
+    </ScoreCardContainer>
   );
 }
diff --git a/src/admin/AdminInfoPage.tsx b/src/admin/AdminInfoPage.tsx
index d724b13e..0af159ee 100644
--- a/src/admin/AdminInfoPage.tsx
+++ b/src/admin/AdminInfoPage.tsx
@@ -1,6 +1,5 @@
 import Container from '@/components/Container';
 import SiteGrid from '@/components/SiteGrid';
-import clsx from 'clsx/lite';
 import { ReactNode } from 'react';
 
 export default function AdminInfoPage({
@@ -23,12 +22,7 @@ export default function AdminInfoPage({
             {accessory}
           </div>
           <Container spaceChildren={false}>
-            <div className={clsx(
-              'max-w-xl w-full',
-              'space-y-6 md:space-y-8',
-            )}>
-              {children}
-            </div>
+            {children}
           </Container>
         </div>}
     />
diff --git a/src/admin/insights/AdminAppInsightsClient.tsx b/src/admin/insights/AdminAppInsightsClient.tsx
index 0ca9d12d..c1fe6ccb 100644
--- a/src/admin/insights/AdminAppInsightsClient.tsx
+++ b/src/admin/insights/AdminAppInsightsClient.tsx
@@ -39,6 +39,7 @@ import AdminEmptyState from '../AdminEmptyState';
 import { pluralize } from '@/utility/string';
 import Tooltip from '@/components/Tooltip';
 import { useAppState } from '@/state/AppState';
+import ScoreCardContainer from '@/components/ScoreCardContainer';
 
 const DEBUG_COMMIT_SHA = '4cd29ed';
 const DEBUG_COMMIT_MESSAGE = 'Long commit message for debugging purposes';
@@ -119,7 +120,7 @@ export default function AdminAppInsightsClient({
   </a>;
 
   return (
-    <>
+    <ScoreCardContainer>
       {(codeMeta || debug) && <>
         <ScoreCard title="Source code">
           {(codeMeta?.didError || debug) &&
@@ -393,6 +394,6 @@ export default function AdminAppInsightsClient({
           content={descriptionWithSpaces}
         />}
       </ScoreCard>
-    </>
+    </ScoreCardContainer>
   );
 }
diff --git a/src/components/ScoreCardContainer.tsx b/src/components/ScoreCardContainer.tsx
new file mode 100644
index 00000000..0d3f7faa
--- /dev/null
+++ b/src/components/ScoreCardContainer.tsx
@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import clsx from 'clsx/lite';
+
+export default function ScoreCardContainer({
+  children,
+}: {
+  children: ReactNode
+}) {
+  return <div className={clsx(
+    'max-w-xl w-full',
+    'space-y-6 md:space-y-8',
+  )}>
+    {children}
+  </div>;
+}