Fix date header for balance sheet

It should only show the month of the report for monthly
centrifuge · Sep 6, 2024 · 83bc918 · 83bc918
1 parent 52a5fba
commit 83bc918
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 53 deletions.
diff --git a/centrifuge-app/src/components/Report/BalanceSheet.tsx b/centrifuge-app/src/components/Report/BalanceSheet.tsx
@@ -13,6 +13,7 @@ import { Spinner } from '../Spinner'
 import { ReportContext } from './ReportContext'
 import { UserFeedback } from './UserFeedback'
 import type { TableDataRow } from './index'
+import { getColumnHeader } from './utils'
 
 type Row = TableDataRow & {
   formatter?: (v: any) => any
@@ -77,11 +78,7 @@ export function BalanceSheet({ pool }: { pool: Pool }) {
         poolStates.map((state, index) => ({
           align: 'right',
           timestamp: state.timestamp,
-          header: new Date(state.timestamp).toLocaleDateString('en-US', {
-            day: 'numeric',
-            month: 'short',
-            year: 'numeric',
-          }),
+          header: getColumnHeader(state.timestamp, groupBy),
           cell: (row: Row) => (
             <Text variant={row.heading ? 'heading4' : row.bold ? 'interactive2' : 'body3'}>
               {row.formatter ? row.formatter((row.value as any)[index]) : (row.value as any)[index]}

diff --git a/centrifuge-app/src/components/Report/CashflowStatement.tsx b/centrifuge-app/src/components/Report/CashflowStatement.tsx
@@ -17,6 +17,7 @@ import { Spinner } from '../Spinner'
 import { ReportContext } from './ReportContext'
 import { UserFeedback } from './UserFeedback'
 import type { TableDataRow } from './index'
+import { getColumnHeader } from './utils'
 
 type Row = TableDataRow & {
   formatter?: (v: any) => any
@@ -83,29 +84,6 @@ export function CashflowStatement({ pool }: { pool: Pool }) {
       return []
     }
 
-    const getColumnHeader = (timestamp: string) => {
-      if (groupBy === 'day' || groupBy === 'daily') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          day: 'numeric',
-          month: 'short',
-          year: 'numeric',
-        })
-      } else if (groupBy === 'month') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          month: 'long',
-          year: 'numeric',
-        })
-      } else if (groupBy === 'quarter') {
-        const date = new Date(timestamp)
-        return `Q${Math.floor(date.getMonth() / 3) + 1} ${date.getFullYear()}`
-      } else if (groupBy === 'year') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          year: 'numeric',
-        })
-      }
-      return ''
-    }
-
     return [
       {
         align: 'left',
@@ -125,7 +103,7 @@ export function CashflowStatement({ pool }: { pool: Pool }) {
         poolStates.map((state, index) => ({
           align: 'right',
           timestamp: state.timestamp,
-          header: getColumnHeader(state.timestamp),
+          header: getColumnHeader(state.timestamp, groupBy),
           cell: (row: Row) => (
             <Text variant={row.heading ? 'heading4' : row.bold ? 'interactive2' : 'body3'}>
               {row.formatter ? row.formatter((row.value as any)[index]) : (row.value as any)[index]}

diff --git a/centrifuge-app/src/components/Report/ProfitAndLoss.tsx b/centrifuge-app/src/components/Report/ProfitAndLoss.tsx
@@ -16,6 +16,7 @@ import { Spinner } from '../Spinner'
 import { ReportContext } from './ReportContext'
 import { UserFeedback } from './UserFeedback'
 import type { TableDataRow } from './index'
+import { getColumnHeader } from './utils'
 
 type Row = TableDataRow & {
   formatter?: (v: any) => any
@@ -75,29 +76,6 @@ export function ProfitAndLoss({ pool }: { pool: Pool }) {
       return []
     }
 
-    const getColumnHeader = (timestamp: string) => {
-      if (groupBy === 'day' || groupBy === 'daily') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          day: 'numeric',
-          month: 'short',
-          year: 'numeric',
-        })
-      } else if (groupBy === 'month') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          month: 'long',
-          year: 'numeric',
-        })
-      } else if (groupBy === 'quarter') {
-        const date = new Date(timestamp)
-        return `Q${Math.floor(date.getMonth() / 3) + 1} ${date.getFullYear()}`
-      } else if (groupBy === 'year') {
-        return new Date(timestamp).toLocaleDateString('en-US', {
-          year: 'numeric',
-        })
-      }
-      return ''
-    }
-
     return [
       {
         align: 'left',
@@ -117,7 +95,7 @@ export function ProfitAndLoss({ pool }: { pool: Pool }) {
         poolStates.map((state, index) => ({
           align: 'right',
           timestamp: state.timestamp,
-          header: getColumnHeader(state.timestamp),
+          header: getColumnHeader(state.timestamp, groupBy),
           cell: (row: Row) => (
             <Text variant={row.heading ? 'heading4' : row.bold ? 'interactive2' : 'body3'}>
               {row.formatter ? row.formatter((row.value as any)[index]) : (row.value as any)[index]}

diff --git a/centrifuge-app/src/components/Report/utils.tsx b/centrifuge-app/src/components/Report/utils.tsx
@@ -155,3 +155,26 @@ export function convertCSV(values: any[], columnConfig: any[]) {
     })
   )
 }
+
+export const getColumnHeader = (timestamp: string, groupBy: string) => {
+  if (groupBy === 'day' || groupBy === 'daily') {
+    return new Date(timestamp).toLocaleDateString('en-US', {
+      day: 'numeric',
+      month: 'short',
+      year: 'numeric',
+    })
+  } else if (groupBy === 'month') {
+    return new Date(timestamp).toLocaleDateString('en-US', {
+      month: 'long',
+      year: 'numeric',
+    })
+  } else if (groupBy === 'quarter') {
+    const date = new Date(timestamp)
+    return `Q${Math.floor(date.getMonth() / 3) + 1} ${date.getFullYear()}`
+  } else if (groupBy === 'year') {
+    return new Date(timestamp).toLocaleDateString('en-US', {
+      year: 'numeric',
+    })
+  }
+  return ''
+}