feat(webapp): wip sales tax summary report

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/SalesTaxLiabilitySummaryActionsBar.tsx

@@ -27,7 +27,7 @@ function SalesTaxLiabilitySummaryActionsBar({
   salesTaxLiabilitySummaryFilter,
 
   // #withSalesTaxLiabilitySummaryActions
-  toggleBalanceSheetFilterDrawer: toggleFilterDrawer,
+  toggleSalesTaxLiabilitySummaryFilterDrawer: toggleFilterDrawer,
 
   // #ownProps
   numberFormat,

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/SalesTaxLiabilitySummaryBody.tsx

@@ -5,18 +5,13 @@ import { FinancialReportBody } from '../FinancialReportPage';
 import { FinancialSheetSkeleton } from '@/components';
 import { SalesTaxLiabilitySummaryTable } from './SalesTaxLiabilitySummaryTable';
 
-import withCurrentOrganization from '@/containers/Organization/withCurrentOrganization';
 import { useSalesTaxLiabilitySummaryContext } from './SalesTaxLiabilitySummaryBoot';
-import { compose } from '@/utils';
 
 /**
  * Sales tax liability summary body.
  * @returns {React.JSX}
  */
-function SalesTaxLiabilitySummaryBodyRoot({
+export function SalesTaxLiabilitySummaryBody() {
-  // #withCurrentOrganization
-  organizationName,
-}) {
   const { isLoading } = useSalesTaxLiabilitySummaryContext();
 
   return (
@@ -29,9 +24,3 @@ function SalesTaxLiabilitySummaryBodyRoot({
     </FinancialReportBody>
   );
 }
-
-export const SalesTaxLiabilitySummaryBody = compose(
-  withCurrentOrganization(({ organization }) => ({
-    organizationName: organization.name,
-  })),
-)(SalesTaxLiabilitySummaryBodyRoot);

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/SalesTaxLiabilitySummaryHeader.tsx

@@ -2,14 +2,11 @@
 import React from 'react';
 import styled from 'styled-components';
 import moment from 'moment';
-import { Tabs, Tab, Button, Intent } from '@blueprintjs/core';
+import { Button, Intent, Tab, Tabs } from '@blueprintjs/core';
 import { Formik, Form } from 'formik';
 
 import { FormattedMessage as T } from '@/components';
 import { useFeatureCan } from '@/hooks/state';
-import { Features } from '@/constants';
-
-import BalanceSheetHeaderGeneralPanal from './BalanceSheetHeaderGeneralPanal';
 import FinancialStatementHeader from '../../FinancialStatements/FinancialStatementHeader';
 
 import { compose, transformToForm } from '@/utils';
@@ -19,6 +16,7 @@ import {
 } from './utils';
 import withSalesTaxLiabilitySummary from './withSalesTaxLiabilitySummary';
 import withSalesTaxLiabilitySummaryActions from './withSalesTaxLiabilitySummaryActions';
+import { SalesTaxLiabilitySummaryHeaderGeneral } from './SalesTaxLiabilitySummaryHeaderGeneralPanel';
 
 /**
  * Sales tax liability summary header.
@@ -65,10 +63,9 @@ function SalesTaxLiabilitySummaryHeader({
   };
   // Detarmines the given feature whether is enabled.
   const { featureCan } = useFeatureCan();
-  const isBranchesFeatureCan = featureCan(Features.Branches);
 
   return (
-    <BalanceSheetFinancialHeader
+    <SalesTaxSummaryFinancialHeader
       isOpen={salesTaxLiabilitySummaryFilter}
       drawerProps={{
         onClose: handleDrawerClose,
@@ -80,13 +77,13 @@ function SalesTaxLiabilitySummaryHeader({
         onSubmit={handleSubmit}
       >
         <Form>
-          {/* <Tabs animate={true} vertical={true} renderActiveTabPanelOnly={true}>
+          <Tabs animate={true} vertical={true} renderActiveTabPanelOnly={true}>
             <Tab
               id="general"
               title={<T id={'general'} />}
-              panel={<BalanceSheetHeaderGeneralPanal />}
+              panel={<SalesTaxLiabilitySummaryHeaderGeneral />}
             />
-          </Tabs> */}
+          </Tabs>
 
           <div class="financial-header-drawer__footer">
             <Button className={'mr1'} intent={Intent.PRIMARY} type={'submit'}>
@@ -98,7 +95,7 @@ function SalesTaxLiabilitySummaryHeader({
           </div>
         </Form>
       </Formik>
-    </BalanceSheetFinancialHeader>
+    </SalesTaxSummaryFinancialHeader>
   );
 }
 
@@ -109,7 +106,7 @@ export default compose(
   withSalesTaxLiabilitySummaryActions,
 )(SalesTaxLiabilitySummaryHeader);
 
-const BalanceSheetFinancialHeader = styled(FinancialStatementHeader)`
+const SalesTaxSummaryFinancialHeader = styled(FinancialStatementHeader)`
   .bp3-drawer {
     max-height: 520px;
   }

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/SalesTaxLiabilitySummaryHeaderGeneralPanel.tsx

@@ -0,0 +1,13 @@
+// @ts-nocheck
+import React from 'react';
+import FinancialStatementDateRange from '../FinancialStatementDateRange';
+import RadiosAccountingBasis from '../RadiosAccountingBasis';
+
+export function SalesTaxLiabilitySummaryHeaderGeneral() {
+  return (
+    <div>
+      <FinancialStatementDateRange />
+      <RadiosAccountingBasis key={'basis'} />
+    </div>
+  );
+}

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/components.tsx

@@ -5,7 +5,7 @@ import { useSalesTaxLiabilitySummaryContext } from './SalesTaxLiabilitySummaryBo
 import FinancialLoadingBar from '../FinancialLoadingBar';
 
 /**
- * Balance sheet loading bar.
+ * Sales tax liability summary loading bar.
  */
 export function SalesTaxLiabilitySummaryLoadingBar() {
   const { isFetching } = useSalesTaxLiabilitySummaryContext();

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/dynamicColumns.ts

@@ -1,5 +1,5 @@
 // @ts-nocheck
-import React, { useMemo } from 'react';
+import React from 'react';
 import * as R from 'ramda';
 import { getColumnWidth } from '@/utils';
 import { Align } from '@/constants';

packages/webapp/src/containers/FinancialStatements/SalesTaxLiabilitySummary/withSalesTaxLiabilitySummaryActions.ts

@@ -1,10 +1,10 @@
 // @ts-nocheck
 import { connect } from 'react-redux';
-import { toggleBalanceSheetFilterDrawer } from '@/store/financialStatement/financialStatements.actions';
+import { toggleSalesTaxLiabilitySummaryFilterDrawer } from '@/store/financialStatement/financialStatements.actions';
 
 const mapDispatchToProps = (dispatch) => ({
   toggleSalesTaxLiabilitySummaryFilterDrawer: (toggle) =>
-    dispatch(toggleBalanceSheetFilterDrawer(toggle)),
+    dispatch(toggleSalesTaxLiabilitySummaryFilterDrawer(toggle)),
 });
 
 export default connect(null, mapDispatchToProps);

packages/webapp/src/store/financialStatement/financialStatements.actions.tsx

@@ -244,3 +244,16 @@ export function toggleProjectProfitabilitySummaryFilterDrawer(toggle) {
     },
   };
 }
+
+/**
+ * Toggles display of the sales tax liablilty summary filter drawer.
+ * @param {boolean} toggle
+ */
+export function toggleSalesTaxLiabilitySummaryFilterDrawer(toggle) {
+  return {
+    type: `${t.SALES_TAX_LIABILITY_SUMMARY}/${t.DISPLAY_FILTER_DRAWER_TOGGLE}`,
+    payload: {
+      toggle,
+    },
+  };
+}

packages/webapp/src/store/financialStatement/financialStatements.reducer.tsx

@@ -61,6 +61,9 @@ const initialState = {
   projectProfitabilitySummary: {
     dispalyFilterDrawer: false,
   },
+  salesTaxLiabilitySummary: {
+    displayFilterDrawer: false,
+  }
 };
 
 /**
@@ -124,4 +127,8 @@ export default createReducer(initialState, {
     t.PROJECT_PROFITABILITY_SUMMARY,
     'projectProfitabilitySummary',
   ),
+  ...financialStatementFilterToggle(
+    t.SALES_TAX_LIABILITY_SUMMARY,
+    'salesTaxLiabilitySummary',
+  )
 });

packages/webapp/src/store/financialStatement/financialStatements.selectors.tsx

@@ -87,7 +87,7 @@ export const projectProfitabilitySummaryFilterDrawerSelector = (state) => {
 };
 
 export const salesTaxLiabilitySummaryFilterDrawerSelector = (state) => {
-  return filterDrawerByTypeSelector('projectProfitabilitySummary')(state);
+  return filterDrawerByTypeSelector('salesTaxLiabilitySummary')(state);
 };
 
 /**

packages/webapp/src/store/financialStatement/financialStatements.types.tsx

@@ -20,4 +20,5 @@ export default {
   PROJECT_PROFITABILITY_SUMMARY: 'PROJECT PROFITABILITY SUMMARY',
   REALIZED_GAIN_OR_LOSS: 'REALIZED GAIN OR LOSS',
   UNREALIZED_GAIN_OR_LOSS: 'UNREALIZED GAIN OR LOSS',
+  SALES_TAX_LIABILITY_SUMMARY: 'SALES TAX LIABILITY SUMMARY',
 };