after.ts

import {ChartData} from "chart.js";
import {getDateOfISOWeek, getDateStringOfISOWeek, getWeekNumber} from "../../../commons/src";
import {addMonths, addWeeks, differenceInCalendarMonths, differenceInCalendarWeeks, isPast, isFuture, addDays} from 'date-fns';

export interface IMonthlyChartData {
    Invoicer__c?: string;
    Reviewed_Agreed_Payment_Date__c?: string;
    Agreed_Payment_Date__c?: string;
    year?: number;
    month?: number;
    total?: number;
}

export interface IWeeklyChartData {
    Invoicer__c?: string;
    Reviewed_Agreed_Payment_Date__c?: string;
    Agreed_Payment_Date__c?: string;
    year?: number;
    week?: number;
    total?: number;
}

export interface IChartDataResponse {
    frequency: "MONTHLY" | "WEEKLY",
    period: string,
    data: IMonthlyChartData[] | IWeeklyChartData[]
}

interface IParsedData {
    labels: string[];
    agreedOK: number[];
    agreedKO: number[];
    reviewedOK: number[];
    reviewedKO: number[];
}

const monthsLabels = ["Gen", "Feb", "Mar", "Apr", "Mag", "Giu", "Lug", "Ago", "Set", "Ott", "Nov", "Dic"];

export function parseMonthlyChartData(data: IMonthlyChartData[], period: string): ChartData {
    if (data.length === 0) {
        return {
            labels: [],
            datasets: [
                {
                    label: 'Amount',
                    backgroundColor: '#006600',
                    data: []
                }
            ]
        }
    }

    const initialData: IParsedData = {
        labels: [],
        agreedOK: [],
        agreedKO: [],
        reviewedOK: [],
        reviewedKO: []
    };

    let firstDate;
    let lastDate;

    if (period === 'ALL') {
        firstDate = new Date(data[0].year!, data[0].month!);
        lastDate = new Date(data[data.length - 1].year!, data[data.length - 1].month!);
    } else {
        firstDate = addMonths(new Date(), -period / 2);
        lastDate = addMonths(new Date(), (+period / 2) + 1);
    }

    let firstMonth = firstDate.getMonth();
    let firstYear = firstDate.getFullYear();

    let difference = differenceInCalendarMonths(lastDate, firstDate);

    let mockArray = new Array<IMonthlyChartData>(difference)
        .fill({Invoicer__c: data[0].Invoicer__c, total: undefined, month: undefined, year: undefined})
        .map((item, index) => ({
            Invoicer__c: item.Invoicer__c,
            Reviewed_Agreed_Payment_Date__c: undefined,
            Agreed_Payment_Date__c: undefined,
            total: NaN,
            month: (firstMonth + index) % 12 + 1, year: NaN
        }));

    for (let i = 0; i < mockArray.length; i++) {
        let year;
        if (i === 0) {
            mockArray[i].year = firstYear;
        } else if (mockArray[i - 1].month > mockArray[i].month) {
            mockArray[i].year = mockArray[i - 1].year! + 1;
        } else {
            mockArray[i].year = mockArray[i - 1].year!;
        }
    }

    let mapped = mockArray.map((item, index) => {
        let dataTwin = data.filter(d => d.month === item.month && d.year == item.year)[0];
        return ({
            Invoicer__c: data[0].Invoicer__c,
            Reviewed_Agreed_Payment_Date__c: dataTwin ? dataTwin.Reviewed_Agreed_Payment_Date__c : undefined,
            Agreed_Payment_Date__c: dataTwin ? dataTwin.Agreed_Payment_Date__c : undefined,
            total: dataTwin ? dataTwin.total : NaN,
            month: item.month,
            year: item.year
        })
    });

    const parsedData = mapped.reduce((res: IParsedData, curr: IMonthlyChartData) => {
        res.labels.push(`${monthsLabels[curr.month! - 1]} ${curr.year}`);
        let currDate = new Date(curr.year!, curr.month!);
        const checkDateFuture = addDays(new Date(), 7);
        const checkDatePast = addDays(new Date(), -7);
        if (curr.Reviewed_Agreed_Payment_Date__c !== undefined) {
            const revDate = new Date(curr.Reviewed_Agreed_Payment_Date__c);
            if (revDate.getTime() < checkDatePast.getTime()) {
                res.reviewedKO.push(curr.total!);
                res.reviewedOK.push(0);
                res.agreedKO.push(0);
                res.agreedOK.push(0);
            } else if (revDate.getTime() > checkDateFuture.getTime()) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(curr.total!);
                res.agreedKO.push(0);
                res.agreedOK.push(0);
            }
        } else {
            const agreedDate = new Date(curr.Agreed_Payment_Date__c!);
            console.log("Agreed: " + agreedDate);
            console.log("Check future" + checkDateFuture);
            if (agreedDate.getTime() < checkDatePast.getTime()) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(0);
                res.agreedKO.push(curr.total!);
                res.agreedOK.push(0);
            } else if (agreedDate.getTime() > checkDateFuture.getTime()) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(0);
                res.agreedKO.push(0);
                res.agreedOK.push(curr.total!);
            }
        }
        return res;
    }, initialData);

    return {
        labels: parsedData.labels,
        datasets: [
            {
                label: 'Reviewed',
                backgroundColor: '#006600',
                data: parsedData.reviewedKO
            },
            {
                label: 'Reviewed',
                backgroundColor: '#660000',
                data: parsedData.reviewedOK
            },
            {
                label: 'Agreed',
                backgroundColor: '#ff6e00',
                data: parsedData.agreedOK
            },
            {
                label: 'Agreed',
                backgroundColor: '#660000',
                data: parsedData.agreedKO
            }
        ]
    };
}

export function parseWeeklyChartData(data: IWeeklyChartData[], period: string): ChartData {
    if (data.length === 0) {
        return {
            labels: [],
            datasets: [
                {
                    label: 'Amount',
                    backgroundColor: '#006600',
                    data: []
                }
            ]
        }
    }

    const initialData: IParsedData = {
        labels: [],
        agreedOK: [],
        agreedKO: [],
        reviewedOK: [],
        reviewedKO: []
    };

    let firstDate;
    let lastDate;
    let firstYear;
    let firstWeek : number;

    if (period === 'ALL') {
        firstDate = getDateOfISOWeek(data[0].week!, data[0].year!);
        lastDate = getDateOfISOWeek(data[data.length - 1].week!, data[data.length - 1].year!);
    } else {
        firstDate = addWeeks(new Date(), -period / 2);
        lastDate = addWeeks(new Date(), (+period / 2) + 1);
    }
    firstWeek = getWeekNumber(firstDate);
    firstYear = data[0].year!;

    let difference = differenceInCalendarWeeks(lastDate, firstDate);

    let mockArray = new Array<IWeeklyChartData>(difference)
        .fill({Invoicer__c: data[0].Invoicer__c, total: undefined, week: undefined, year: undefined})
        .map((item, index) => ({
            Invoicer__c: item.Invoicer__c,
            Reviewed_Agreed_Payment_Date__c: undefined,
            Agreed_Payment_Date__c: undefined,
            total: NaN,
            week: (firstWeek + index) % 53 === 0 ? 53 : (firstWeek + index) % 53,
            year: NaN
        }));

    for (let i = 0; i < mockArray.length; i++) {

        let year;
        if (i === 0) {
            mockArray[i].year = firstYear;
        } else if (mockArray[i - 1].week > mockArray[i].week) {
            mockArray[i].year = mockArray[i - 1].year! + 1;
        } else {
            mockArray[i].year = mockArray[i - 1].year!;
        }
    }

    let mapped = mockArray.map((item, index) => {
        let dataTwin = data.filter(d => d.week === item.week && d.year == item.year)[0];
        return ({
            Invoicer__c: data[0].Invoicer__c,
            Reviewed_Agreed_Payment_Date__c: dataTwin ? dataTwin.Reviewed_Agreed_Payment_Date__c : undefined,
            Agreed_Payment_Date__c: dataTwin ? dataTwin.Agreed_Payment_Date__c : undefined,
            total: dataTwin ? dataTwin.total : NaN,
            week: item.week,
            year: item.year
        })
    });

    const parsedData = mapped.reduce( (res: IParsedData, curr: IWeeklyChartData) => {
        res.labels.push(`${getDateStringOfISOWeek(curr.week!, curr.year!)}`);

        let currDate = getDateOfISOWeek(curr.week!, curr.year!);
        const checkDateFuture = addDays(new Date(), 7);
        const checkDatePast = addDays(new Date(), -7);
        if (curr.Reviewed_Agreed_Payment_Date__c !== undefined) {
            const revDate = new Date(curr.Reviewed_Agreed_Payment_Date__c);
            if (revDate < checkDatePast) {
                res.reviewedKO.push(curr.total!);
                res.reviewedOK.push(0);
                res.agreedKO.push(0);
                res.agreedOK.push(0);
            } else if (revDate > checkDateFuture) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(curr.total!);
                res.agreedKO.push(0);
                res.agreedOK.push(0);
            }
        } else {
            const agreedDate = new Date(curr.Agreed_Payment_Date__c!);
            if (agreedDate < checkDatePast) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(0);
                res.agreedKO.push(curr.total!);
                res.agreedOK.push(0);
            } else if (agreedDate > checkDateFuture) {
                res.reviewedKO.push(0);
                res.reviewedOK.push(0);
                res.agreedKO.push(0);
                res.agreedOK.push(curr.total!);
            }
        }
        return res;
    }, initialData);

    return {
        labels: parsedData.labels,
        datasets: [
            {
                label: 'Reviewed',
                backgroundColor: '#006600',
                data: parsedData.reviewedKO
            },
            {
                label: 'Reviewed',
                backgroundColor: '#660000',
                data: parsedData.reviewedOK
            },
            {
                label: 'Agreed',
                backgroundColor: '#ff6e00',
                data: parsedData.agreedOK
            },
            {
                label: 'Agreed',
                backgroundColor: '#660000',
                data: parsedData.agreedKO
            }
        ]
    };
}

before.ts

import {ChartData} from "chart.js";

export interface IMonthlyChartData {
    Invoicer__c: string;
    year: number;
    month: number;
    total: number;
}

export interface IWeeklyChartData {
    Invoicer__c: string;
    year: number;
    week: number;
    total: number;
}

export interface IChartDataResponse {
    frequency: "MONTHLY" | "WEEKLY",
    data: IMonthlyChartData[] | IWeeklyChartData[]
}

interface IParsedData {
    labels: string[];
    data: number[]
}

const monthsLabels = ["Gen", "Feb", "Mar", "Apr", "Mag", "Giu", "Lug", "Ago", "Set", "Ott", "Nov", "Dic"];

export function parseMonthlyChartData(data: IMonthlyChartData[]): ChartData {

    const initialData: IParsedData = {
        labels: [],
        data: []
    };

    const pardedData = data.reduce( (res: IParsedData, curr: IMonthlyChartData) => {
        res.labels.push(`${monthsLabels[curr.month - 1]} ${curr.year}`);
        res.data.push(curr.total);
        return res;
    }, initialData);

    return {
        labels: pardedData.labels,
        datasets: [
            {
                label: 'Amount',
                backgroundColor: '#006600',
                data: pardedData.data
            }
        ]
    };
}

export function parseWeeklyChartData(data: IWeeklyChartData[]): ChartData {

    const initialData: IParsedData = {
        labels: [],
        data: []
    };

    const pardedData = data.reduce( (res: IParsedData, curr: IWeeklyChartData) => {
        res.labels.push(`${curr.week} ${curr.year}`);
        res.data.push(curr.total);
        return res;
    }, initialData);

    return {
        labels: pardedData.labels,
        datasets: [
            {
                label: 'Amount',
                backgroundColor: '#006600',
                data: pardedData.data
            }
        ]
    };
}