@zeniai/client-epic-state 5.1.79 → 5.1.81-betaAK0

package/lib/esm/reducer.js

@@ -169,6 +169,7 @@ import invoicingSubscriptionAction, { initialState as initialInvoicingSubscripti
 import monthEndCloseChecksView, { initialState as initialMonthEndCloseChecksViewState, } from './view/monthEndCloseChecksView/monthEndCloseChecksViewReducer';
 import netBurnOrIncome, { initialState as initialNetBurnOrIncomeWithForecastState, } from './view/netBurnOrIncome/netBurnOrIncomeReducer';
 import netBurnOrIncomeClassesView, { initialState as initialNetBurnOrIncomeClassesViewState, } from './view/netBurnOrIncomeClassesView/netBurnOrIncomeClassesViewReducer';
+import netBurnOrIncomeProjectView, { initialState as initialNetBurnOrIncomeProjectViewState, } from './view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewReducer';
 import netBurnOrIncomeStoryCard, { initialState as initialNetBurnOrIncomeStoryCardState, } from './view/netBurnOrIncomeStoryCard/netBurnOrIncomeStoryCardReducer';
 import notificationPreferencesView, { initialState as initialNotificationPreferencesViewState, } from './view/notificationPreferencesView/notificationPreferencesViewReducer';
 import notificationView, { initialState as initialNotificationViewState, } from './view/notificationView/notificationViewReducer';
@@ -177,6 +178,7 @@ import onboardingCustomerView, { initialState as initialOnboardingCustomerViewSt
 import opEx, { initialState as initialOpExState } from './view/opEx/opExReducer';
 import opExByVendor, { initialState as initialOpExByVendorState, } from './view/opExByVendor/opExByVendorReducer';
 import opExClassesView, { initialState as initialOpExClassesViewState, } from './view/opExClassesView/opExClassesViewReducer';
+import opExProjectView, { initialState as initialOpExProjectViewState, } from './view/opExProjectView/opExProjectViewReducer';
 import ownerList, { initialState as initialOwnerListState, } from './view/ownerList/ownerListReducer';
 import people, { initialState as initialPeopleState, } from './view/people/peopleReducer';
 import profitAndLoss, { initialState as initialProfitAndLossState, } from './view/profitAndLoss/profitAndLossReducer';
@@ -190,6 +192,7 @@ import reportUIOptionsReducer, { initialState as initialReportUIOptionsState, }
 import reportsResync, { initialReportsResyncState, } from './view/reportsResync/reportsResyncReducer';
 import revenue, { initialState as initialRevenueWithForecastState, } from './view/revenue/revenueReducer';
 import revenueClassesView, { initialState as initialRevenueClassesViewState, } from './view/revenueClassesView/revenueClassesViewReducer';
+import revenueProjectView, { initialState as initialRevenueProjectViewState, } from './view/revenueProjectView/revenueProjectViewReducer';
 import reviewCompanyView, { initialState as initialReviewCompanyViewState, } from './view/reviewCompanyView/reviewCompanyViewReducer';
 import scheduleAccruedDetailView, { initialState as initialScheduleAccruedDetailViewState, } from './view/scheduleView/scheduleAccruedDetailView/scheduleAccruedDetailReducer';
 import scheduleDetailView, { initialState as initialScheduleDetailViewState, } from './view/scheduleView/scheduleDetailView/scheduleDetailReducer';
@@ -483,6 +486,7 @@ const initialViewsState = {
     merchantListState: initialMerchantListState,
     monthEndCloseChecksViewState: initialMonthEndCloseChecksViewState,
     netBurnOrIncomeClassesViewState: initialNetBurnOrIncomeClassesViewState,
+    netBurnOrIncomeProjectViewState: initialNetBurnOrIncomeProjectViewState,
     netBurnOrIncomeState: initialNetBurnOrIncomeWithForecastState,
     netBurnOrIncomeStoryCardState: initialNetBurnOrIncomeStoryCardState,
     notificationPreferencesViewState: initialNotificationPreferencesViewState,
@@ -492,6 +496,7 @@ const initialViewsState = {
     onboardingCustomerViewState: initialOnboardingCustomerViewState,
     opExByVendorState: initialOpExByVendorState,
     opExClassesViewState: initialOpExClassesViewState,
+    opExProjectViewState: initialOpExProjectViewState,
     opExState: initialOpExState,
     ownerListState: initialOwnerListState,
     paymentAccountListState: initialPaymentAccountListState,
@@ -514,6 +519,7 @@ const initialViewsState = {
     reportsResyncState: initialReportsResyncState,
     reportUIOptionsState: initialReportUIOptionsState,
     revenueClassesViewState: initialRevenueClassesViewState,
+    revenueProjectViewState: initialRevenueProjectViewState,
     revenueState: initialRevenueWithForecastState,
     reviewCompanyViewState: initialReviewCompanyViewState,
     scheduleAccruedDetailState: initialScheduleAccruedDetailViewState,
@@ -773,6 +779,7 @@ const viewReducers = {
     merchantListState: merchantList,
     monthEndCloseChecksViewState: monthEndCloseChecksView,
     netBurnOrIncomeClassesViewState: netBurnOrIncomeClassesView,
+    netBurnOrIncomeProjectViewState: netBurnOrIncomeProjectView,
     netBurnOrIncomeState: netBurnOrIncome,
     netBurnOrIncomeStoryCardState: netBurnOrIncomeStoryCard,
     notificationPreferencesViewState: notificationPreferencesView,
@@ -782,6 +789,7 @@ const viewReducers = {
     onboardingCustomerViewState: onboardingCustomerView,
     opExByVendorState: opExByVendor,
     opExClassesViewState: opExClassesView,
+    opExProjectViewState: opExProjectView,
     opExState: opEx,
     ownerListState: ownerList,
     paymentAccountListState: paymentAccountList,
@@ -805,6 +813,7 @@ const viewReducers = {
     reportsResyncState: reportsResync,
     reportUIOptionsState: reportUIOptionsReducer,
     revenueClassesViewState: revenueClassesView,
+    revenueProjectViewState: revenueProjectView,
     revenueState: revenue,
     reviewCompanyViewState: reviewCompanyView,
     scheduleAccruedDetailState: scheduleAccruedDetailView,

package/lib/esm/view/invoicing/issueCreditNote/issueCreditNoteSelector.js

@@ -1,20 +1,17 @@
+import { getInvoiceDetail } from '../invoiceDetail/invoiceDetailSelector';
 import { INVOICING_CREDIT_NOTE_REASON_CODES } from './issueCreditNoteFormConfig';
-export const getIssueCreditNoteView = (state) => {
-    const { error, fetchState, issuedCreditNoteId } = state.invoicingIssueCreditNoteState;
+export const getIssueCreditNoteView = (state, invoiceId) => {
+    const invoiceView = getInvoiceDetail(state, invoiceId);
+    const { draft, error, fetchState, issuedCreditNoteId } = state.invoicingIssueCreditNoteState;
     return {
-        error,
-        fetchState,
+        invoice: invoiceView.invoice,
+        isPageReady: invoiceView.fetchState === 'Completed' && draft.lineItems.length > 0,
         issuedCreditNoteId,
-        version: 1.0,
-    };
-};
-export const getIssueCreditNoteFormView = (state) => {
-    const { draft, error, fetchState } = state.invoicingIssueCreditNoteState;
-    return {
         localData: draft,
         reasonCodeValues: [...INVOICING_CREDIT_NOTE_REASON_CODES],
-        error,
-        fetchState,
+        submitState: { error, fetchState },
+        error: invoiceView.error,
+        fetchState: invoiceView.fetchState,
         version: 1.0,
     };
 };

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeForTimeframeProjectViewEpic.js

@@ -0,0 +1,45 @@
+import { from, of } from 'rxjs';
+import { catchError, filter, mergeMap } from 'rxjs/operators';
+import { updateProjects } from '../../entity/project/projectReducer';
+import { updateSectionProjectView } from '../../entity/sectionProjectView/sectionProjectViewReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../responsePayload';
+import { fetchNetBurnOrIncomeForTimeframeProjectView, updateNetBurnOrIncomeForTimeframeProjectView, updateNetBurnOrIncomeForTimeframeProjectViewFailure, } from './netBurnOrIncomeProjectViewReducer';
+export const fetchNetBurnOrIncomeForTimeframeProjectViewEpic = (actions$, _, zeniAPI) => actions$.pipe(filter(fetchNetBurnOrIncomeForTimeframeProjectView.match), mergeMap((action) => {
+    const getTimeSeriesGroup = (timeframe) => {
+        switch (timeframe) {
+            case 'month':
+                return 'months';
+            case 'quarter':
+                return 'quarters';
+            case 'year':
+                return 'years';
+        }
+    };
+    const queryValue = {
+        is_full_response: action.payload.fetchFullReport,
+        time_series_groups: [getTimeSeriesGroup(action.payload.timeframe)],
+        is_group_by_project: true,
+    };
+    return zeniAPI
+        .getJSON(`${zeniAPI.apiEndPoints.accountMicroServiceBaseUrl}/2.0/reports/net_burn_or_income?query=${encodeURIComponent(JSON.stringify(queryValue))}`)
+        .pipe(mergeMap((response) => {
+        if (response.data != null && isSuccessResponse(response)) {
+            const actions = [];
+            const report = response.data.report;
+            const currency = report.currency;
+            actions.push(updateProjects(report.projects));
+            actions.push(updateSectionProjectView(action.payload.timeframe, 'cogs', 'net_burn_or_income_by_projects', report.cogs, report.accounts, currency));
+            actions.push(updateSectionProjectView(action.payload.timeframe, 'expenses', 'net_burn_or_income_by_projects', report.expenses, report.accounts, currency));
+            actions.push(updateSectionProjectView(action.payload.timeframe, 'income', 'net_burn_or_income_by_projects', report.income, report.accounts, currency));
+            actions.push(updateNetBurnOrIncomeForTimeframeProjectView({
+                timeframe: action.payload.timeframe,
+                report: response.data,
+            }));
+            return from(actions);
+        }
+        else {
+            return of(updateNetBurnOrIncomeForTimeframeProjectViewFailure(response.status, action.payload.timeframe));
+        }
+    }), catchError((error) => of(updateNetBurnOrIncomeForTimeframeProjectViewFailure(createZeniAPIStatus('Unexpected Error', 'Net Burn by Projects REST API call errored out' +
+        (error instanceof Error ? error.message : String(error))), action.payload.timeframe))));
+}));

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewEpic.js

@@ -0,0 +1,30 @@
+import { from } from 'rxjs';
+import { filter, switchMap } from 'rxjs/operators';
+import { fetchNetBurnOrIncomeForTimeframeProjectView, fetchNetBurnOrIncomeProjectView, } from './netBurnOrIncomeProjectViewReducer';
+export const fetchNetBurnOrIncomeProjectViewEpic = (actions$, state) => actions$.pipe(filter(fetchNetBurnOrIncomeProjectView.match), switchMap((action) => {
+    const { cacheOverride } = action.payload;
+    if (cacheOverride === true) {
+        return from([
+            fetchNetBurnOrIncomeForTimeframeProjectView('month'),
+            fetchNetBurnOrIncomeForTimeframeProjectView('quarter'),
+            fetchNetBurnOrIncomeForTimeframeProjectView('year'),
+        ]);
+    }
+    else {
+        const fetchActions = [];
+        const projectFetchState = state.value.netBurnOrIncomeProjectViewState.fetchState;
+        if (projectFetchState['month'].fetchState !== 'In-Progress' &&
+            projectFetchState['month'].fetchState !== 'Completed') {
+            fetchActions.push(fetchNetBurnOrIncomeForTimeframeProjectView('month'));
+        }
+        if (projectFetchState['quarter'].fetchState !== 'In-Progress' &&
+            projectFetchState['quarter'].fetchState !== 'Completed') {
+            fetchActions.push(fetchNetBurnOrIncomeForTimeframeProjectView('quarter'));
+        }
+        if (projectFetchState['year'].fetchState !== 'In-Progress' &&
+            projectFetchState['year'].fetchState !== 'Completed') {
+            fetchActions.push(fetchNetBurnOrIncomeForTimeframeProjectView('year'));
+        }
+        return from(fetchActions);
+    }
+}));

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewPayload.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewReducer.js

@@ -0,0 +1,111 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { mapReportPayloadV2ToReportV2 } from '../../commonPayloadTypes/v2/viewAndReportPayloadv2';
+export const initialState = {
+    fetchState: {
+        month: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+        quarter: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+        year: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+    },
+    firstMonthOfFY: 1,
+    projectIds: [],
+    reportId: 'net_burn_or_income_by_projects',
+    reportTitle: 'Net Income',
+    uiState: {
+        accountViewMode: 'account_group',
+        nodeCollapseState: {},
+        projectsToFilterOut: [],
+        scrollPosition: undefined,
+    },
+};
+const netBurnOrIncomeProjectView = createSlice({
+    name: 'netBurnOrIncomeProjectView',
+    initialState,
+    reducers: {
+        fetchNetBurnOrIncomeProjectView: {
+            prepare(cacheOverride = false) {
+                return { payload: { cacheOverride } };
+            },
+            reducer(
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            _draft, 
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            _action) {
+                // nothing to do here
+            },
+        },
+        fetchNetBurnOrIncomeForTimeframeProjectView: {
+            prepare(timeframe, fetchFullReport = true, cacheOverride = false) {
+                return { payload: { timeframe, fetchFullReport, cacheOverride } };
+            },
+            reducer(draft, action) {
+                const timeframe = action.payload.timeframe;
+                draft.fetchState[timeframe].fetchState = 'In-Progress';
+                draft.fetchState[timeframe].error = undefined;
+            },
+        },
+        updateNetBurnOrIncomeForTimeframeProjectView(draft, action) {
+            doUpdateNetBurnOrIncomeProjectView(draft, action.payload.timeframe, action.payload.report);
+        },
+        updateNetBurnOrIncomeForTimeframeProjectViewFailure: {
+            prepare(error, timeframe) {
+                return {
+                    payload: {
+                        error,
+                        timeframe,
+                    },
+                };
+            },
+            reducer(draft, action) {
+                draft.fetchState[action.payload.timeframe] = {
+                    fetchState: 'Error',
+                    error: action.payload.error,
+                };
+            },
+        },
+        updateProjectsToFilterOut(draft, action) {
+            draft.uiState.projectsToFilterOut = action.payload.projectsToFilterOut;
+        },
+        updateNetBurnOrIncomeProjectViewUIState(draft, action) {
+            const { nodeCollapseState, scrollPosition } = action.payload;
+            if (nodeCollapseState != null) {
+                draft.uiState.nodeCollapseState = Object.assign({}, draft.uiState.nodeCollapseState, {
+                    [nodeCollapseState.nodeId]: nodeCollapseState.isCollapsed,
+                });
+            }
+            if (scrollPosition != null) {
+                draft.uiState.scrollPosition = scrollPosition;
+            }
+        },
+        updateProjectViewAccountViewMode(draft, action) {
+            draft.uiState.accountViewMode = action.payload.viewMode;
+        },
+        resetProjectNodeCollapseState(draft) {
+            draft.uiState.nodeCollapseState = {};
+        },
+        clearNetBurnOrIncomeProjectView(draft) {
+            Object.assign(draft, initialState);
+        },
+    },
+});
+export const { fetchNetBurnOrIncomeProjectView, fetchNetBurnOrIncomeForTimeframeProjectView, updateNetBurnOrIncomeForTimeframeProjectView, updateNetBurnOrIncomeForTimeframeProjectViewFailure, updateProjectsToFilterOut, updateNetBurnOrIncomeProjectViewUIState, updateProjectViewAccountViewMode, resetProjectNodeCollapseState, clearNetBurnOrIncomeProjectView, } = netBurnOrIncomeProjectView.actions;
+export default netBurnOrIncomeProjectView.reducer;
+const doUpdateNetBurnOrIncomeProjectView = (draft, timeframe, netBurnReport) => {
+    const report = mapReportPayloadV2ToReportV2(netBurnReport.report);
+    draft.dataAvailable = report.dataAvailable;
+    draft.firstMonthOfFY = report.firstMonthOfFY;
+    draft.bookCloseDate = report.bookCloseDate;
+    draft.status = report.status;
+    draft.fetchState[timeframe].fetchState = 'Completed';
+    if (draft.projectIds.length <= 0) {
+        draft.projectIds = netBurnReport.report.projects.map((project) => project.accounting_project_id);
+    }
+};

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewSelector.js

@@ -0,0 +1,65 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { getDifferenceOfBalancesGroupedByPeriod } from '../../commonStateTypes/coaBalance/classBalances/getDifferenceOfBalancesGroupedByPeriod';
+import { getSumOfBalancesByGroupedByPeriod } from '../../commonStateTypes/coaBalance/classBalances/getSumOfBalancesGroupedByPeriod';
+import { getCOABalances } from '../../commonStateTypes/coaBalance/coaBalance';
+import { newBalancesFilterProjectView, } from '../../commonStateTypes/coaBalance/coaBalancesFilterProjectView';
+import { reduceFetchStateParallelTimeframes } from '../../commonStateTypes/reduceFetchState';
+import { getProjectsByIds } from '../../entity/project/projectSelector';
+import { getSectionProjectViewReport } from '../../entity/sectionProjectView/sectionProjectViewSelector';
+import { ALL_NETBURN_OR_INCOME_CLASSES_VIEW_SECTION_IDS, } from '../netBurnOrIncomeClassesView/netBurnOrIncomeClassesViewSelectorTypes';
+export const netBurnOrIncomeProjectIdsInOrder = ['income', 'cogs', 'expenses', 'grossBurn', 'netBurnOrIncome'];
+export const getNetBurnOrIncomeProjectView = (filter, accountState, projectState, sectionsState, netBurnOrIncomeWithForecastState, netBurnOrIncomeProjectViewState) => {
+    const fetchState = reduceFetchStateParallelTimeframes([
+        netBurnOrIncomeProjectViewState.fetchState.month,
+        netBurnOrIncomeProjectViewState.fetchState.quarter,
+        netBurnOrIncomeProjectViewState.fetchState.year,
+    ]);
+    const reportId = 'net_burn_or_income_by_projects';
+    const sections = {};
+    const calculatedSections = {};
+    if (fetchState.fetchState === 'Completed') {
+        ALL_NETBURN_OR_INCOME_CLASSES_VIEW_SECTION_IDS.forEach((sectionId) => {
+            sections[`${sectionId}`] = getSectionProjectViewReport(accountState, projectState, sectionsState, netBurnOrIncomeProjectViewState.projectIds, {
+                reportId,
+                sectionId,
+            }, filter);
+        });
+        const grossBurnBalancesByPeriod = getSumOfBalancesByGroupedByPeriod([
+            sections['expenses'].sectionBalancesTotalByPeriod,
+            sections['cogs'].sectionBalancesTotalByPeriod,
+        ]);
+        calculatedSections['grossBurn'] = getCOABalances(grossBurnBalancesByPeriod, filter);
+        const netBurnOrIncomeBalances = getDifferenceOfBalancesGroupedByPeriod(sections['income'].sectionBalancesTotalByPeriod, grossBurnBalancesByPeriod);
+        calculatedSections['netBurnOrIncome'] = getCOABalances(netBurnOrIncomeBalances, filter);
+    }
+    return {
+        sections,
+        calculatedSections,
+        reportId: netBurnOrIncomeProjectViewState.reportId,
+        reportTitle: netBurnOrIncomeProjectViewState.reportTitle,
+        firstMonthOfFY: netBurnOrIncomeProjectViewState.firstMonthOfFY,
+        dataAvailable: netBurnOrIncomeProjectViewState.dataAvailable,
+        bookCloseDate: netBurnOrIncomeProjectViewState.bookCloseDate,
+        version: netBurnOrIncomeProjectViewState.version,
+        status: netBurnOrIncomeProjectViewState.status,
+        fetchState: fetchState.fetchState,
+        error: fetchState.error,
+        filter,
+        uiState: netBurnOrIncomeProjectViewState.uiState,
+        projects: getProjectsByIds(projectState, netBurnOrIncomeProjectViewState.projectIds),
+        projectsToFilterOut: netBurnOrIncomeProjectViewState.uiState.projectsToFilterOut,
+        idsInOrder: netBurnOrIncomeProjectIdsInOrder,
+        runwayAndAverages: netBurnOrIncomeWithForecastState.netBurnOrIncome.runwayAndAverages,
+    };
+};
+export const getNetBurnOrIncomeProjectViewForSelectedRange = createSelector((state) => state.accountState, (state) => state.projectState, (state) => state.sectionProjectViewState, (state) => state.netBurnOrIncomeState, (state) => state.netBurnOrIncomeProjectViewState, (accountState, projectState, sectionsState, netBurnOrIncomeState, netBurnOrIncomeProjectViewState) => {
+    const { timeframe, selectedCOABalancesRange, selectedAdditionalBalances } = netBurnOrIncomeState.uiState;
+    const noFilter = newBalancesFilterProjectView(netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, timeframe, selectedCOABalancesRange.numberOfPeriods, selectedCOABalancesRange.thisPeriod, 'ascending_date', selectedAdditionalBalances, netBurnOrIncomeProjectViewState.uiState.projectsToFilterOut);
+    return getNetBurnOrIncomeProjectView(noFilter, accountState, projectState, sectionsState, netBurnOrIncomeState, netBurnOrIncomeProjectViewState);
+});
+export const getNetBurnOrIncomeProjectViewForHighlightedRange = createSelector((state) => state.accountState, (state) => state.projectState, (state) => state.sectionProjectViewState, (state) => state.netBurnOrIncomeState, (state) => state.netBurnOrIncomeProjectViewState, (accountState, projectState, sectionsState, netBurnOrIncomeState, netBurnOrIncomeProjectViewState) => {
+    const { timeframe, highlightedCOABalancesRange, selectedAdditionalBalances, maxNumOfPeriodsToHighlight, } = netBurnOrIncomeState.uiState;
+    const filter = newBalancesFilterProjectView(netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, timeframe, highlightedCOABalancesRange?.numberOfPeriods ??
+        maxNumOfPeriodsToHighlight, highlightedCOABalancesRange?.thisPeriod, 'ascending_date', selectedAdditionalBalances, netBurnOrIncomeProjectViewState.uiState.projectsToFilterOut);
+    return getNetBurnOrIncomeProjectView(filter, accountState, projectState, sectionsState, netBurnOrIncomeState, netBurnOrIncomeProjectViewState);
+});

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewSelectorTypes.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/netBurnOrIncomeProjectView/netBurnOrIncomeProjectViewState.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/opExProjectView/opExForTimeframeProjectViewEpic.js

@@ -0,0 +1,43 @@
+import { from, of } from 'rxjs';
+import { catchError, filter, mergeMap } from 'rxjs/operators';
+import { updateProjects } from '../../entity/project/projectReducer';
+import { updateSectionProjectView } from '../../entity/sectionProjectView/sectionProjectViewReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../responsePayload';
+import { fetchOpExForTimeframeProjectView, updateOpExForTimeframeProjectView, updateOpExForTimeframeProjectViewFailure, } from './opExProjectViewReducer';
+export const fetchOpExForTimeframeProjectViewEpic = (actions$, _, zeniAPI) => actions$.pipe(filter(fetchOpExForTimeframeProjectView.match), mergeMap((action) => {
+    const getTimeSeriesGroup = (timeframe) => {
+        switch (timeframe) {
+            case 'month':
+                return 'months';
+            case 'quarter':
+                return 'quarters';
+            case 'year':
+                return 'years';
+        }
+    };
+    const queryValue = {
+        is_full_response: action.payload.fetchFullReport,
+        time_series_groups: [getTimeSeriesGroup(action.payload.timeframe)],
+        is_group_by_project: true,
+    };
+    return zeniAPI
+        .getJSON(`${zeniAPI.apiEndPoints.accountMicroServiceBaseUrl}/2.0/reports/operating_expenses?query=${encodeURIComponent(JSON.stringify(queryValue))}`)
+        .pipe(mergeMap((response) => {
+        if (response.data != null && isSuccessResponse(response)) {
+            const actions = [];
+            const report = response.data.report;
+            const currency = report.currency;
+            actions.push(updateProjects(report.projects));
+            actions.push(updateSectionProjectView(action.payload.timeframe, 'expenses', 'operating_expenses_by_projects', report.expenses, report.accounts, currency));
+            actions.push(updateOpExForTimeframeProjectView({
+                timeframe: action.payload.timeframe,
+                report: response.data,
+            }));
+            return from(actions);
+        }
+        else {
+            return of(updateOpExForTimeframeProjectViewFailure(response.status, action.payload.timeframe));
+        }
+    }), catchError((error) => of(updateOpExForTimeframeProjectViewFailure(createZeniAPIStatus('Unexpected Error', 'OpEx by Projects REST API call errored out' +
+        (error instanceof Error ? error.message : String(error))), action.payload.timeframe))));
+}));

package/lib/esm/view/opExProjectView/opExProjectViewEpic.js

@@ -0,0 +1,30 @@
+import { from } from 'rxjs';
+import { filter, switchMap } from 'rxjs/operators';
+import { fetchOpExForTimeframeProjectView, fetchOpExProjectView, } from './opExProjectViewReducer';
+export const fetchOpExProjectViewEpic = (actions$, state) => actions$.pipe(filter(fetchOpExProjectView.match), switchMap((action) => {
+    const { cacheOverride } = action.payload;
+    if (cacheOverride === true) {
+        return from([
+            fetchOpExForTimeframeProjectView('month'),
+            fetchOpExForTimeframeProjectView('quarter'),
+            fetchOpExForTimeframeProjectView('year'),
+        ]);
+    }
+    else {
+        const fetchActions = [];
+        const projectFetchState = state.value.opExProjectViewState.fetchState;
+        if (projectFetchState['month'].fetchState !== 'In-Progress' &&
+            projectFetchState['month'].fetchState !== 'Completed') {
+            fetchActions.push(fetchOpExForTimeframeProjectView('month'));
+        }
+        if (projectFetchState['quarter'].fetchState !== 'In-Progress' &&
+            projectFetchState['quarter'].fetchState !== 'Completed') {
+            fetchActions.push(fetchOpExForTimeframeProjectView('quarter'));
+        }
+        if (projectFetchState['year'].fetchState !== 'In-Progress' &&
+            projectFetchState['year'].fetchState !== 'Completed') {
+            fetchActions.push(fetchOpExForTimeframeProjectView('year'));
+        }
+        return from(fetchActions);
+    }
+}));

package/lib/esm/view/opExProjectView/opExProjectViewPayload.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/opExProjectView/opExProjectViewReducer.js

@@ -0,0 +1,111 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { mapReportPayloadV2ToReportV2 } from '../../commonPayloadTypes/v2/viewAndReportPayloadv2';
+export const initialState = {
+    fetchState: {
+        month: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+        quarter: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+        year: {
+            fetchState: 'Not-Started',
+            error: undefined,
+        },
+    },
+    firstMonthOfFY: 1,
+    projectIds: [],
+    reportId: 'operating_expenses_by_projects',
+    reportTitle: 'operating_expenses_by_projects',
+    uiState: {
+        accountViewMode: 'account_group',
+        nodeCollapseState: {},
+        projectsToFilterOut: [],
+        scrollPosition: undefined,
+    },
+};
+const opExProjectView = createSlice({
+    name: 'opExProjectView',
+    initialState,
+    reducers: {
+        fetchOpExProjectView: {
+            prepare(cacheOverride = false) {
+                return { payload: { cacheOverride } };
+            },
+            reducer(
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            _draft, 
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            _action) {
+                // nothing to do here
+            },
+        },
+        fetchOpExForTimeframeProjectView: {
+            prepare(timeframe, fetchFullReport = true, cacheOverride = false) {
+                return { payload: { timeframe, fetchFullReport, cacheOverride } };
+            },
+            reducer(draft, action) {
+                const timeframe = action.payload.timeframe;
+                draft.fetchState[timeframe].fetchState = 'In-Progress';
+                draft.fetchState[timeframe].error = undefined;
+            },
+        },
+        updateOpExForTimeframeProjectView(draft, action) {
+            doUpdateOpExProjectView(draft, action.payload.timeframe, action.payload.report);
+        },
+        updateOpExForTimeframeProjectViewFailure: {
+            prepare(error, timeframe) {
+                return {
+                    payload: {
+                        error,
+                        timeframe,
+                    },
+                };
+            },
+            reducer(draft, action) {
+                draft.fetchState[action.payload.timeframe] = {
+                    fetchState: 'Error',
+                    error: action.payload.error,
+                };
+            },
+        },
+        updateProjectsToFilterOut(draft, action) {
+            draft.uiState.projectsToFilterOut = action.payload.projectsToFilterOut;
+        },
+        updateOpExProjectViewUIState(draft, action) {
+            const { nodeCollapseState, scrollPosition } = action.payload;
+            if (nodeCollapseState != null) {
+                draft.uiState.nodeCollapseState = Object.assign({}, draft.uiState.nodeCollapseState, {
+                    [nodeCollapseState.nodeId]: nodeCollapseState.isCollapsed,
+                });
+            }
+            if (scrollPosition != null) {
+                draft.uiState.scrollPosition = scrollPosition;
+            }
+        },
+        updateProjectViewAccountViewMode(draft, action) {
+            draft.uiState.accountViewMode = action.payload.viewMode;
+        },
+        resetProjectNodeCollapseState(draft) {
+            draft.uiState.nodeCollapseState = {};
+        },
+        clearOpExProjectView(draft) {
+            Object.assign(draft, initialState);
+        },
+    },
+});
+export const { fetchOpExProjectView, fetchOpExForTimeframeProjectView, updateOpExForTimeframeProjectView, updateOpExForTimeframeProjectViewFailure, updateProjectsToFilterOut, updateOpExProjectViewUIState, updateProjectViewAccountViewMode, resetProjectNodeCollapseState, clearOpExProjectView, } = opExProjectView.actions;
+export default opExProjectView.reducer;
+const doUpdateOpExProjectView = (draft, timeframe, opExReport) => {
+    const report = mapReportPayloadV2ToReportV2(opExReport.report);
+    draft.dataAvailable = report.dataAvailable;
+    draft.firstMonthOfFY = report.firstMonthOfFY;
+    draft.bookCloseDate = report.bookCloseDate;
+    draft.status = report.status;
+    draft.fetchState[timeframe].fetchState = 'Completed';
+    if (draft.projectIds.length <= 0) {
+        draft.projectIds = opExReport.report.projects.map((project) => project.accounting_project_id);
+    }
+};

package/lib/esm/view/opExProjectView/opExProjectViewSelector.js

@@ -0,0 +1,52 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { newBalancesFilterProjectView, } from '../../commonStateTypes/coaBalance/coaBalancesFilterProjectView';
+import { reduceFetchStateParallelTimeframes } from '../../commonStateTypes/reduceFetchState';
+import { getProjectsByIds } from '../../entity/project/projectSelector';
+import { getSectionProjectViewReport } from '../../entity/sectionProjectView/sectionProjectViewSelector';
+export const opExProjectIdsInOrder = ['expenses'];
+export const getOpExProjectView = (filter, accountState, projectState, sectionsState, opExProjectViewState) => {
+    const fetchState = reduceFetchStateParallelTimeframes([
+        opExProjectViewState.fetchState.month,
+        opExProjectViewState.fetchState.quarter,
+        opExProjectViewState.fetchState.year,
+    ]);
+    const reportId = 'operating_expenses_by_projects';
+    const sectionId = 'expenses';
+    const sections = {};
+    const calculatedSections = {};
+    if (fetchState.fetchState === 'Completed') {
+        sections.expenses = getSectionProjectViewReport(accountState, projectState, sectionsState, opExProjectViewState.projectIds, {
+            reportId,
+            sectionId,
+        }, filter);
+    }
+    return {
+        sections,
+        calculatedSections,
+        reportId: opExProjectViewState.reportId,
+        reportTitle: opExProjectViewState.reportTitle,
+        firstMonthOfFY: opExProjectViewState.firstMonthOfFY,
+        dataAvailable: opExProjectViewState.dataAvailable,
+        bookCloseDate: opExProjectViewState.bookCloseDate,
+        version: opExProjectViewState.version,
+        status: opExProjectViewState.status,
+        fetchState: fetchState.fetchState,
+        error: fetchState.error,
+        filter,
+        uiState: opExProjectViewState.uiState,
+        projects: getProjectsByIds(projectState, opExProjectViewState.projectIds),
+        projectsToFilterOut: opExProjectViewState.uiState.projectsToFilterOut,
+        idsInOrder: opExProjectIdsInOrder,
+    };
+};
+export const getOpExProjectViewForSelectedRange = createSelector((state) => state.accountState, (state) => state.projectState, (state) => state.sectionProjectViewState, (state) => state.opExState, (state) => state.opExProjectViewState, (accountState, projectState, sectionsState, opExState, opExProjectViewState) => {
+    const { timeframe, selectedCOABalancesRange, selectedAdditionalBalances } = opExState.uiState;
+    const noFilter = newBalancesFilterProjectView(opExState.opEx.firstMonthOfFY, timeframe, selectedCOABalancesRange.numberOfPeriods, selectedCOABalancesRange.thisPeriod, 'ascending_date', selectedAdditionalBalances, opExProjectViewState.uiState.projectsToFilterOut);
+    return getOpExProjectView(noFilter, accountState, projectState, sectionsState, opExProjectViewState);
+});
+export const getOpExProjectViewForHighlightedRange = createSelector((state) => state.accountState, (state) => state.projectState, (state) => state.sectionProjectViewState, (state) => state.opExState, (state) => state.opExProjectViewState, (accountState, projectState, sectionsState, opExState, opExProjectViewState) => {
+    const { timeframe, highlightedCOABalancesRange, selectedAdditionalBalances, maxNumOfPeriodsToHighlight, } = opExState.uiState;
+    const filter = newBalancesFilterProjectView(opExState.opEx.firstMonthOfFY, timeframe, highlightedCOABalancesRange?.numberOfPeriods ??
+        maxNumOfPeriodsToHighlight, highlightedCOABalancesRange?.thisPeriod, 'ascending_date', selectedAdditionalBalances, opExProjectViewState.uiState.projectsToFilterOut);
+    return getOpExProjectView(filter, accountState, projectState, sectionsState, opExProjectViewState);
+});

package/lib/esm/view/opExProjectView/opExProjectViewSelectorTypes.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/opExProjectView/opExProjectViewState.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/reportsResync/reportsClassViewRefetchingEpic.js

@@ -3,7 +3,6 @@ import { filter, switchMap } from 'rxjs/operators';
 import { fetchNetBurnOrIncomeClassesView } from '../netBurnOrIncomeClassesView/netBurnOrIncomeClassesViewReducer';
 import { fetchOpExClassesView } from '../opExClassesView/opExClassesViewReducer';
 import { fetchProfitAndLossClassesView } from '../profitAndLossClassesView/profitAndLossClassesViewReducer';
-import { fetchProfitAndLossProjectView } from '../profitAndLossProjectView/profitAndLossProjectViewReducer';
 import { fetchRevenueClassesView } from '../revenueClassesView/revenueClassesViewReducer';
 import { initiateReportsClassViewRefetching } from './reportsResyncReducer';
 export const initiateReportsClassViewRefetchingEpic = (actions$, 
@@ -24,9 +23,6 @@ _) => actions$.pipe(filter(initiateReportsClassViewRefetching.match), switchMap(
         case 'net_burn_or_income_by_classes':
             actions.push(fetchNetBurnOrIncomeClassesView(true));
             break;
-        case 'profit_and_loss_by_projects':
-            actions.push(fetchProfitAndLossProjectView(true));
-            break;
         default:
             break;
     }