Merge pull request #1345 from openedx/eahmadjaved/ENT-9705

fix: download csv button text for data tables
openedx · Nov 8, 2024 · 0f957c5 · 0f957c5
2 parents dfaa444 + 01b37cb
commit 0f957c5
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 10 deletions.
diff --git a/src/components/AdvanceAnalyticsV2/AnalyticsV2Page.jsx b/src/components/AdvanceAnalyticsV2/AnalyticsV2Page.jsx
@@ -20,7 +20,7 @@ const PAGE_TITLE = 'AnalyticsV2';
 
 const AnalyticsV2Page = ({ enterpriseId }) => {
   const [activeTab, setActiveTab] = useState('enrollments');
-  const [granularity, setGranularity] = useState('Daily');
+  const [granularity, setGranularity] = useState(GRANULARITY.WEEKLY);
   const [calculation, setCalculation] = useState('Total');
   const [startDate, setStartDate] = useState('');
   const [endDate, setEndDate] = useState('');

diff --git a/src/components/AdvanceAnalyticsV2/Stats.jsx b/src/components/AdvanceAnalyticsV2/Stats.jsx
@@ -9,7 +9,10 @@ import classNames from 'classnames';
 const Stats = ({
   isFetching, isError, data,
 }) => {
-  const formatter = Intl.NumberFormat('en', { notation: 'compact', maximumFractionDigits: 2 });
+  const formatNumber = (number) => (number >= 10000
+    ? new Intl.NumberFormat('en', { notation: 'compact', maximumFractionDigits: 2 }).format(number)
+    : String(number));
+
   if (isError) {
     return (
       <FormattedMessage
@@ -35,7 +38,7 @@ const Stats = ({
               description="Title for the enrollments stat."
             />
           </p>
-          <p className="font-weight-bolder analytics-stat-number value-enrollments">{formatter.format(data?.enrolls || 0)}</p>
+          <p className="font-weight-bolder analytics-stat-number value-enrollments">{formatNumber(data?.enrolls || 0)}</p>
         </div>
         <div className="col d-flex flex-column justify-content-center align-items-center">
           <p className="mb-0 small title-distinct-courses">
@@ -45,7 +48,7 @@ const Stats = ({
               description="Title for the distinct courses stat."
             />
           </p>
-          <p className="font-weight-bolder analytics-stat-number value-distinct-courses">{formatter.format(data?.courses || 0)}</p>
+          <p className="font-weight-bolder analytics-stat-number value-distinct-courses">{formatNumber(data?.courses || 0)}</p>
         </div>
         <div className="col d-flex flex-column justify-content-center align-items-center">
           <p className="mb-0 small title-daily-sessions">
@@ -55,7 +58,7 @@ const Stats = ({
               description="Title for the daily sessions stat."
             />
           </p>
-          <p className="font-weight-bolder analytics-stat-number value-daily-sessions">{formatter.format(data?.sessions || 0)}</p>
+          <p className="font-weight-bolder analytics-stat-number value-daily-sessions">{formatNumber(data?.sessions || 0)}</p>
         </div>
         <div className="col d-flex flex-column justify-content-center align-items-center">
           <p className="mb-0 small title-learning-hours">
@@ -65,7 +68,7 @@ const Stats = ({
               description="Title for the learning hours stat."
             />
           </p>
-          <p className="font-weight-bolder analytics-stat-number value-learning-hours">{formatter.format(data?.hours || 0)}</p>
+          <p className="font-weight-bolder analytics-stat-number value-learning-hours">{formatNumber(data?.hours || 0)}</p>
         </div>
         <div className="col d-flex flex-column justify-content-center align-items-center">
           <p className="mb-0 small title-completions">
@@ -75,7 +78,7 @@ const Stats = ({
               description="Title for the completions stat."
             />
           </p>
-          <p className="font-weight-bolder analytics-stat-number value-completions">{formatter.format(data?.completions || 0)}</p>
+          <p className="font-weight-bolder analytics-stat-number value-completions">{formatNumber(data?.completions || 0)}</p>
         </div>
       </div>
     </div>

diff --git a/src/components/AdvanceAnalyticsV2/tabs/AnalyticsTable.jsx b/src/components/AdvanceAnalyticsV2/tabs/AnalyticsTable.jsx
@@ -66,8 +66,9 @@ const AnalyticsTable = ({
               <Icon src={Download} className="mr-2" />
               <FormattedMessage
                 id="adminPortal.AnalyticsV2.downloadCSV.button"
-                defaultMessage="Download Enrollments CSV"
-                description="Button to download the enrollments CSV file."
+                defaultMessage="Download {respectiveTableName} CSV"
+                description="Button to download CSV for respective table"
+                values={{ respectiveTableName: name.charAt(0).toUpperCase() + name.slice(1) }}
               />
             </Link>
           )}

diff --git a/src/components/AdvanceAnalyticsV2/tests/Stats.test.jsx b/src/components/AdvanceAnalyticsV2/tests/Stats.test.jsx
@@ -23,7 +23,7 @@ describe('Stats', () => {
     expect(wrapper.find('.title-distinct-courses').text()).toEqual('Distinct Courses');
     expect(wrapper.find('.value-distinct-courses').text()).toEqual('365');
     expect(wrapper.find('.title-daily-sessions').text()).toEqual('Daily Sessions');
-    expect(wrapper.find('.value-daily-sessions').text()).toEqual('1.89K');
+    expect(wrapper.find('.value-daily-sessions').text()).toEqual('1892');
     expect(wrapper.find('.title-learning-hours').text()).toEqual('Learning Hours');
     expect(wrapper.find('.value-learning-hours').text()).toEqual('25.35M');
     expect(wrapper.find('.title-completions').text()).toEqual('Completions');