From 8776cbccb326c7215ac685b53dd9170613c44c37 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Mon, 17 Feb 2025 21:08:10 -0600
Subject: [PATCH] Add className to EnvVar

---
 src/admin/insights/AdminAppInsightsClient.tsx | 6 ++++--
 src/components/EnvVar.tsx                     | 3 +++
 src/components/ScoreCardRow.tsx               | 5 ++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/admin/insights/AdminAppInsightsClient.tsx b/src/admin/insights/AdminAppInsightsClient.tsx
index a2c50446..f823c229 100644
--- a/src/admin/insights/AdminAppInsightsClient.tsx
+++ b/src/admin/insights/AdminAppInsightsClient.tsx
@@ -314,8 +314,10 @@ export default function AdminAppInsightsClient({
                 {' '}
                 default view to grid by setting
                 {' '}
-                {/* eslint-disable-next-line max-len */}
-                <EnvVar variable="NEXT_PUBLIC_GRID_HOMEPAGE_ENABLED" value="1" />.
+                <EnvVar
+                  variable="NEXT_PUBLIC_GRID_HOMEPAGE_ENABLED"
+                  value="1"
+                />.
               </>}
             />}
           </>
diff --git a/src/components/EnvVar.tsx b/src/components/EnvVar.tsx
index eeecd836..e1d4956c 100644
--- a/src/components/EnvVar.tsx
+++ b/src/components/EnvVar.tsx
@@ -5,16 +5,19 @@ export default function EnvVar({
   variable,
   value,
   includeCopyButton = true,
+  className,
 }: {
   variable: string,
   value?: string,
   includeCopyButton?: boolean,
+  className?: string,
 }) {
   return (
     <div
       className={clsx(
         'inline-flex',
         'overflow-x-auto overflow-y-hidden',
+        className,
       )}
     >
       <span className="inline-flex items-center gap-1">
diff --git a/src/components/ScoreCardRow.tsx b/src/components/ScoreCardRow.tsx
index be7d338a..63303ebc 100644
--- a/src/components/ScoreCardRow.tsx
+++ b/src/components/ScoreCardRow.tsx
@@ -50,7 +50,10 @@ export default function ScoreCardRow({
           {content}
         </div>
         {isExpanded &&
-          <div className="text-medium leading-relaxed">
+          <div className={clsx(
+            // 'overflow-auto w-full flex flex-col min-w-0',
+            'text-medium leading-relaxed',
+          )}>
             {expandContent}
           </div>}
       </div>