diff --git a/apps/red-ui/src/app/modules/admin/screens/license/components/license-analysis-capacity-usage/license-analysis-capacity-usage.component.ts b/apps/red-ui/src/app/modules/admin/screens/license/components/license-analysis-capacity-usage/license-analysis-capacity-usage.component.ts index 6077a44c5..dea13ae32 100644 --- a/apps/red-ui/src/app/modules/admin/screens/license/components/license-analysis-capacity-usage/license-analysis-capacity-usage.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/license/components/license-analysis-capacity-usage/license-analysis-capacity-usage.component.ts @@ -3,10 +3,11 @@ import { LicenseService } from '@services/license.service'; import { map } from 'rxjs/operators'; import { ChartDataset } from 'chart.js'; import { ChartBlue, ChartGreen, ChartRed } from '../../utils/constants'; -import { getDataUntilCurrentMonth, getLabelsFromLicense, getLineConfig } from '../../utils/functions'; +import { getDataUntilCurrentMonth, getLabelsFromLicense, getLineConfig, isCurrentMonthAndYear } from '../../utils/functions'; import { TranslateService } from '@ngx-translate/core'; import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; import { size } from '@iqser/common-ui/lib/utils'; +import { ILicenseData } from '@red/domain'; @Component({ selector: 'red-license-analysis-capacity-usage', @@ -35,7 +36,13 @@ export class LicenseAnalysisCapacityUsageComponent { } #getCapacityDatasets(): ChartDataset[] { - const monthlyData = this.licenseService.selectedLicenseReport.monthlyData; + const monthlyData = [...this.licenseService.selectedLicenseReport.monthlyData]; + const dataUntilCurrentMonth = getDataUntilCurrentMonth(monthlyData); + if (monthlyData.length === 1 || isCurrentMonthAndYear(monthlyData[0].startDate)) { + const empty = { analysedFilesBytes: null } as ILicenseData; + dataUntilCurrentMonth.splice(0, 0, empty); + monthlyData.splice(0, 0, empty); + } const datasets: ChartDataset[] = [ { @@ -48,9 +55,11 @@ export class LicenseAnalysisCapacityUsageComponent { }, { - data: getDataUntilCurrentMonth(monthlyData).map( - (month, monthIndex) => - month.analysedFilesBytes + monthlyData.slice(0, monthIndex).reduce((acc, curr) => acc + curr.analysedFilesBytes, 0), + data: dataUntilCurrentMonth.map((month, monthIndex) => + month.analysedFilesBytes + ? month.analysedFilesBytes + + monthlyData.slice(0, monthIndex).reduce((acc, curr) => acc + (curr.analysedFilesBytes ?? 0), 0) + : 0, ), label: this._translateService.instant('license-info-screen.analysis-capacity-usage.analyzed-cumulative'), yAxisID: 'y1', diff --git a/apps/red-ui/src/app/modules/admin/screens/license/components/license-page-usage/license-page-usage.component.ts b/apps/red-ui/src/app/modules/admin/screens/license/components/license-page-usage/license-page-usage.component.ts index 7a15e85a1..742ba0c28 100644 --- a/apps/red-ui/src/app/modules/admin/screens/license/components/license-page-usage/license-page-usage.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/license/components/license-page-usage/license-page-usage.component.ts @@ -3,10 +3,9 @@ import { LicenseService } from '@services/license.service'; import { map } from 'rxjs/operators'; import { ChartDataset } from 'chart.js'; import { ChartBlue, ChartGreen, ChartRed } from '../../utils/constants'; -import { getDataUntilCurrentMonth, getLabelsFromLicense, getLineConfig } from '../../utils/functions'; +import { getDataUntilCurrentMonth, getLabelsFromLicense, getLineConfig, isCurrentMonthAndYear } from '../../utils/functions'; import { TranslateService } from '@ngx-translate/core'; import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; -import { addPaddingToArray } from '@utils/functions'; import { ILicenseData } from '@red/domain'; @Component({ @@ -35,10 +34,12 @@ export class LicensePageUsageComponent { } #getPagesDatasets(): ChartDataset[] { - const monthlyData = this.licenseService.selectedLicenseReport.monthlyData; - if (monthlyData.length === 1) { - const empty = monthlyData.map(() => ({ numberOfAnalyzedPages: 0 }) as ILicenseData)[0]; - addPaddingToArray(monthlyData, empty); + const monthlyData = [...this.licenseService.selectedLicenseReport.monthlyData]; + const dataUntilCurrentMonth = getDataUntilCurrentMonth(monthlyData); + if (monthlyData.length === 1 || isCurrentMonthAndYear(monthlyData[0].startDate)) { + const empty = { numberOfAnalyzedPages: null } as ILicenseData; + dataUntilCurrentMonth.splice(0, 0, empty); + monthlyData.splice(0, 0, empty); } return [ @@ -58,10 +59,11 @@ export class LicensePageUsageComponent { order: 1, }, { - data: getDataUntilCurrentMonth(monthlyData).map( - (month, monthIndex) => - month.numberOfAnalyzedPages + - monthlyData.slice(0, monthIndex).reduce((acc, curr) => acc + curr.numberOfAnalyzedPages, 0), + data: dataUntilCurrentMonth.map((month, monthIndex) => + month.numberOfAnalyzedPages + ? month.numberOfAnalyzedPages + + monthlyData.slice(0, monthIndex).reduce((acc, curr) => acc + (curr.numberOfAnalyzedPages ?? 0), 0) + : 0, ), label: this._translateService.instant('license-info-screen.page-usage.cumulative-pages'), yAxisID: 'y1', diff --git a/apps/red-ui/src/app/modules/admin/screens/license/components/license-retention-capacity-usage/license-retention-capacity.component.ts b/apps/red-ui/src/app/modules/admin/screens/license/components/license-retention-capacity-usage/license-retention-capacity.component.ts index 5873ed5c4..e0cf890b9 100644 --- a/apps/red-ui/src/app/modules/admin/screens/license/components/license-retention-capacity-usage/license-retention-capacity.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/license/components/license-retention-capacity-usage/license-retention-capacity.component.ts @@ -3,7 +3,7 @@ import { TranslateService } from '@ngx-translate/core'; import { size } from '@iqser/common-ui/lib/utils'; import { LicenseService } from '@services/license.service'; import { map } from 'rxjs/operators'; -import type { DonutChartConfig, ILicenseReport } from '@red/domain'; +import { DonutChartConfig, ILicenseData, ILicenseReport } from '@red/domain'; import { ChartDataset } from 'chart.js'; import { ChartBlack, ChartBlue, ChartGreen, ChartGrey, ChartRed } from '../../utils/constants'; import { getDataUntilCurrentMonth, getLabelsFromLicense, getLineConfig } from '../../utils/functions'; @@ -61,6 +61,14 @@ export class LicenseRetentionCapacityComponent { #getDatasets(license: ILicenseReport): ChartDataset[] { const monthlyData = getDataUntilCurrentMonth(license.monthlyData); + if (monthlyData.length === 1) { + const empty = { + archivedFilesUploadedBytes: 0, + activeFilesUploadedBytes: 0, + trashFilesUploadedBytes: 0, + } as ILicenseData; + monthlyData.splice(0, 0, empty); + } return [ { diff --git a/apps/red-ui/src/app/modules/admin/screens/license/utils/functions.ts b/apps/red-ui/src/app/modules/admin/screens/license/utils/functions.ts index 2490ef9fe..6ea6bf796 100644 --- a/apps/red-ui/src/app/modules/admin/screens/license/utils/functions.ts +++ b/apps/red-ui/src/app/modules/admin/screens/license/utils/functions.ts @@ -1,11 +1,12 @@ import dayjs, { Dayjs } from 'dayjs'; import { FillTarget } from 'chart.js'; -import { addPaddingToArray, hexToRgba } from '@utils/functions'; +import { hexToRgba } from '@utils/functions'; import { ILicenseData, ILicenseReport } from '@red/domain'; import { ComplexFillTarget } from 'chart.js/dist/types'; const monthNames = dayjs.monthsShort(); -const currentMonth = dayjs(Date.now()).month() + 1; +const currentMonth = dayjs(Date.now()).month(); +const currentYear = dayjs(Date.now()).year(); export const verboseDate = (date: Dayjs) => `${monthNames[date.month()]} ${date.year()}`; @@ -44,13 +45,17 @@ export const getLabelsFromLicense = (license: ILicenseReport) => { monthIterator = monthIterator.add(1, 'month'); } - if (startMonth.month() === endMonth.month()) { - addPaddingToArray(result, ''); + if (startMonth.month() === endMonth.month() || startMonth.month() === currentMonth) { + result.splice(0, 0, ''); } return result; }; export const getDataUntilCurrentMonth = (monthlyData: ILicenseData[]) => { - return monthlyData.slice(0, currentMonth); + return monthlyData.filter(data => dayjs(data.startDate).month() <= currentMonth && dayjs(data.startDate).year() <= currentYear); +}; + +export const isCurrentMonthAndYear = (date: Date | string) => { + return dayjs(date).month() === currentMonth && dayjs(date).year() === currentYear; };