From 4a34feb991740d9685173aef4f8bb77985169759 Mon Sep 17 00:00:00 2001
From: martin-mfg <2026226+martin-mfg@users.noreply.github.com>
Date: Tue, 4 Nov 2025 09:15:57 +0100
Subject: [PATCH] add top-langs option 'hide_progress'

---
 frontend/frontend/src/pages/Home/Home.js            |  7 +++++++
 .../frontend/src/pages/Home/stages/Customize.js     | 13 +++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/frontend/frontend/src/pages/Home/Home.js b/frontend/frontend/src/pages/Home/Home.js
index 619b1e51..72a03a98 100644
--- a/frontend/frontend/src/pages/Home/Home.js
+++ b/frontend/frontend/src/pages/Home/Home.js
@@ -54,6 +54,7 @@ const HomeScreen = () => {
   const [showTitle, setShowTitle] = useState(true);
   const [customTitle, setCustomTitle] = useState('');
   const [langsCount, setLangsCount] = useState();
+  const [hideProgress, setHideProgress] = useState(false);
 
   const resetCustomization = () => {
     setSelectedTimeRange(defaultTimeRange);
@@ -109,6 +110,10 @@ const HomeScreen = () => {
     fullSuffix += `&langs_count=${langsCount}`;
   }
 
+  if (hideProgress) {
+    fullSuffix += `&hide_progress=${hideProgress}`;
+  }
+
   // for stage three
   const [theme, setTheme] = useState('default');
   const themeSuffix = `${fullSuffix}&theme=${theme}`;
@@ -227,6 +232,8 @@ const HomeScreen = () => {
               setCustomTitle={setCustomTitle}
               langsCount={langsCount}
               setLangsCount={setLangsCount}
+              hideProgress={hideProgress}
+              setHideProgress={setHideProgress}
               fullSuffix={fullSuffix}
             />
           )}
diff --git a/frontend/frontend/src/pages/Home/stages/Customize.js b/frontend/frontend/src/pages/Home/stages/Customize.js
index 136fb968..7ab27c28 100644
--- a/frontend/frontend/src/pages/Home/stages/Customize.js
+++ b/frontend/frontend/src/pages/Home/stages/Customize.js
@@ -29,6 +29,8 @@ const CustomizeStage = ({
   setCustomTitle,
   langsCount,
   setLangsCount,
+  hideProgress,
+  setHideProgress,
   fullSuffix,
 }) => {
   const cardType = selectedCard || CardTypes.STATS;
@@ -113,6 +115,15 @@ const CustomizeStage = ({
             disabled={useCompact}
           />
         )}
+        {cardType === CardTypes.TOP_LANGS && (
+          <CheckboxSection
+            title="Compact View"
+            text="Use default view or compact view."
+            question="Use compact view?"
+            variable={hideProgress}
+            setVariable={setHideProgress}
+          />
+        )}
         <CheckboxSection
           title="LOC Metric"
           text="By default, LOC are measured as Added: (+) - (-). Alternatively, you can use Changed: (+) + (-)"
@@ -144,6 +155,8 @@ CustomizeStage.propTypes = {
   privateAccess: PropTypes.bool.isRequired,
   useCompact: PropTypes.bool.isRequired,
   setUseCompact: PropTypes.func.isRequired,
+  hideProgress: PropTypes.bool.isRequired,
+  setHideProgress: PropTypes.func.isRequired,
   usePercent: PropTypes.bool.isRequired,
   setUsePercent: PropTypes.func.isRequired,
   useLocChanged: PropTypes.bool.isRequired,