From ecf56f3b990fc1d2080959fe4cfdd34cd828bb48 Mon Sep 17 00:00:00 2001 From: elforjani13 <39470382+elforjani13@users.noreply.github.com> Date: Tue, 21 Sep 2021 22:09:41 +0200 Subject: [PATCH 01/41] fix: table header overflow. --- src/style/components/DataTable/DataTable.scss | 43 +++++++++---------- 1 file changed, 20 insertions(+), 23 deletions(-) diff --git a/src/style/components/DataTable/DataTable.scss b/src/style/components/DataTable/DataTable.scss index 36bd7f5a9..62bbdc146 100644 --- a/src/style/components/DataTable/DataTable.scss +++ b/src/style/components/DataTable/DataTable.scss @@ -17,8 +17,9 @@ display: block; .thead { - overflow-y: auto; - overflow-x: hidden; + overflow: hidden; + // overflow-y: auto; + // overflow-x: hidden; .th { padding: 0.7rem 0.5rem; @@ -28,7 +29,7 @@ font-weight: 600; border-bottom: 1px solid rgb(224, 224, 224); - > div{ + > div { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; @@ -65,16 +66,16 @@ } } - .bp3-context-menu-popover-target{ + .bp3-context-menu-popover-target { z-index: 100; } - .tr-context{ + .tr-context { display: flex; flex: 1 0 auto; } - &:hover .td.clickable{ + &:hover .td.clickable { cursor: pointer; } } @@ -89,7 +90,7 @@ margin: 0; padding: 0.5rem; - .cell-inner{ + .cell-inner { flex: 1 0 0; } @@ -115,7 +116,7 @@ .inner-resizer { height: 100%; width: 1px; - border-left: 1px solid #E6E6E6; + border-left: 1px solid #e6e6e6; margin: 0 auto; } @@ -141,11 +142,11 @@ } } - .skeleton{ - animation: skeleton-fade-in .3s linear forwards, + .skeleton { + animation: skeleton-fade-in 0.3s linear forwards, skeleton-glow 1s linear infinite alternate; - animation-delay: 0s,.3s; + animation-delay: 0s, 0.3s; height: 8px; opacity: 1; width: 65%; @@ -153,8 +154,8 @@ } } - .th{ - .skeleton{ + .th { + .skeleton { margin: 5px 0; } } @@ -177,7 +178,7 @@ .placeholder { color: #a0a0a0; } - .text-overview{ + .text-overview { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; @@ -188,7 +189,7 @@ } &.is-text-overview { - .expend-padding{ + .expend-padding { display: flex; width: 100%; } @@ -219,7 +220,6 @@ } } .tr.no-results { - .td { flex-direction: column; padding: 18px 20px; @@ -228,7 +228,7 @@ font-size: 14px; border-bottom: 0; - &:hover{ + &:hover { background: transparent; } } @@ -269,7 +269,7 @@ } } - .tr-inner{ + .tr-inner { display: flex; width: 100%; } @@ -332,14 +332,11 @@ } } - - .ReactVirtualized__Grid{ + .ReactVirtualized__Grid { will-change: auto !important; } } - - .table-constrant { .table { .thead .th { @@ -360,4 +357,4 @@ border-bottom: 1px solid #d2dce2; } } -} \ No newline at end of file +} From 14012c4d7e028b3f18df7e1a4b7a6718746b75fd Mon Sep 17 00:00:00 2001 From: Ahmed Bouhuolia Date: Tue, 21 Sep 2021 22:25:24 +0200 Subject: [PATCH 02/41] test circleci --- src/components/Card.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Card.js b/src/components/Card.js index 4e8c3e256..65dd41eed 100644 --- a/src/components/Card.js +++ b/src/components/Card.js @@ -1,6 +1,6 @@ import React from 'react'; import classNames from 'classnames'; - + export default function Card({ className, children }) { return
{children}
; } From 7b85dfee5daf9ac4b58c7383c2c24b9148b50c14 Mon Sep 17 00:00:00 2001 From: Ahmed Bouhuolia Date: Tue, 21 Sep 2021 22:32:14 +0200 Subject: [PATCH 03/41] chore: add circleci build and publish workflow. --- .circleci/config.yml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/.circleci/config.yml b/.circleci/config.yml index 52753d496..82db60c76 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -40,3 +40,11 @@ jobs: command: | docker login -u abouhuolia -p 1532015325_ASdfqwer docker push abouhuolia/bigcapital-client:latest + +workflows: + build_and_publish: # name of your workflow + jobs: + - build: + filters: + branches: + only: master From 5fc4897663f453dfd4ec35dbc0bf033880d512e2 Mon Sep 17 00:00:00 2001 From: elforjani13 <39470382+elforjani13@users.noreply.github.com> Date: Wed, 22 Sep 2021 13:56:43 +0200 Subject: [PATCH 04/41] BIG-116: payment made transcation. --- .../PaymentMadeDetailDrawer/PaymentMadeDetailProvider.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailProvider.js b/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailProvider.js index b51368ba5..35f039283 100644 --- a/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailProvider.js +++ b/src/containers/Drawers/PaymentMadeDetailDrawer/PaymentMadeDetailProvider.js @@ -34,7 +34,7 @@ function PaymentMadeDetailProvider({ paymentMadeId, ...props }) { } = useTransactionsByReference( { reference_id: paymentMadeId, - reference_type: 'paymentMade', + reference_type: 'BillPayment', }, { enabled: !!paymentMadeId }, ); From fd07306102fdb545dbc2f24fb60ba777d0a68482 Mon Sep 17 00:00:00 2001 From: elforjani13 <39470382+elforjani13@users.noreply.github.com> Date: Wed, 22 Sep 2021 15:25:30 +0200 Subject: [PATCH 05/41] fix: inventory adjustment style. --- .../Drawers/InventoryAdjustmentDetailDrawer/index.js | 7 +------ .../Drawers/InventoryAdjustmentDrawer.module.scss | 2 ++ 2 files changed, 3 insertions(+), 6 deletions(-) diff --git a/src/containers/Drawers/InventoryAdjustmentDetailDrawer/index.js b/src/containers/Drawers/InventoryAdjustmentDetailDrawer/index.js index f614bc782..fd9b0a12d 100644 --- a/src/containers/Drawers/InventoryAdjustmentDetailDrawer/index.js +++ b/src/containers/Drawers/InventoryAdjustmentDetailDrawer/index.js @@ -19,12 +19,7 @@ function InventoryAdjustmentDetailDrawer({ payload: { inventoryId }, }) { return ( - + diff --git a/src/style/components/Drawers/InventoryAdjustmentDrawer.module.scss b/src/style/components/Drawers/InventoryAdjustmentDrawer.module.scss index 52706bbfb..211c2f9ba 100644 --- a/src/style/components/Drawers/InventoryAdjustmentDrawer.module.scss +++ b/src/style/components/Drawers/InventoryAdjustmentDrawer.module.scss @@ -1,6 +1,7 @@ .detail_panel { :global .card { padding: 22px 15px; + margin: 15px; } &_header { @@ -9,6 +10,7 @@ &_table { :global .bigcapital-datatable { + margin-top: 30px; .thead, .tbody { .quantity, From 364859a79352b3f8864b592fe546d0a0d5cd6bac Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Thu, 23 Sep 2021 09:44:30 +0200 Subject: [PATCH 06/41] BIG-117: fix dashboard redirect all routes to homepage once refresh the page. --- src/components/AppIntlLoader.js | 87 +++++++++++++------ src/components/Authentication.js | 2 - src/components/Dashboard/DashboardBoot.js | 68 ++++++++++----- src/components/Dashboard/PrivatePages.js | 7 +- .../Dashboard/PrivatePagesProvider.js | 26 +++++- src/components/Dashboard/SplashScreen.js | 9 +- .../Guards/EnsureOrganizationIsReady.js | 11 ++- .../Authentication/AuthenticationBoot.js | 15 ---- src/containers/Dashboard/withDashboard.js | 4 +- .../Dashboard/withDashboardActions.js | 11 +-- src/hooks/index.js | 43 ++++++++- src/hooks/state/authentication.js | 4 +- src/hooks/state/dashboard.js | 21 +++-- 13 files changed, 205 insertions(+), 103 deletions(-) delete mode 100644 src/containers/Authentication/AuthenticationBoot.js diff --git a/src/components/AppIntlLoader.js b/src/components/AppIntlLoader.js index 68623edaf..801e3cd45 100644 --- a/src/components/AppIntlLoader.js +++ b/src/components/AppIntlLoader.js @@ -7,9 +7,10 @@ import rtlDetect from 'rtl-detect'; import * as R from 'ramda'; import { AppIntlProvider } from './AppIntlProvider'; +import { useSplashLoading } from '../hooks/state'; +import { useWatch } from '../hooks'; import withDashboardActions from '../containers/Dashboard/withDashboardActions'; -import withDashboard from '../containers/Dashboard/withDashboard'; const SUPPORTED_LOCALES = [ { name: 'English', value: 'en' }, @@ -63,20 +64,13 @@ function transformMomentLocale(currentLocale) { } /** - * Application Intl loader. + * Loads application locales of the given current locale. + * @param {string} currentLocale + * @returns {{ isLoading: boolean }} */ -function AppIntlLoader({ appIntlIsLoading, setAppIntlIsLoading, children }) { - const [isLocalsLoading, setIsLocalsLoading] = React.useState(true); - const [isYupLoading, setIsYupLoading] = React.useState(true); - - // Retrieve the current locale. - const currentLocale = getCurrentLocal(); - - // Detarmines the document direction based on the given locale. - const isRTL = rtlDetect.isRtlLang(currentLocale); - - // Modifies the html document direction - useDocumentDirectionModifier(currentLocale, isRTL); +function useAppLoadLocales(currentLocale) { + const [startLoading, stopLoading] = useSplashLoading(); + const [isLoading, setIsLoading] = React.useState(true); React.useEffect(() => { // Lodas the locales data file. @@ -91,33 +85,72 @@ function AppIntlLoader({ appIntlIsLoading, setAppIntlIsLoading, children }) { }) .then(() => { moment.locale(transformMomentLocale(currentLocale)); - setIsLocalsLoading(false); + setIsLoading(false); }); - }, [currentLocale, setIsLocalsLoading]); + }, [currentLocale, stopLoading]); + + // Watches the value to start/stop splash screen. + useWatch(isLoading, (value) => (value ? startLoading() : stopLoading()), { + immediate: true, + }); + + return { isLoading }; +} + +/** + * Loads application yup locales based on the given current locale. + * @param {string} currentLocale + * @returns {{ isLoading: boolean }} + */ +function useAppYupLoadLocales(currentLocale) { + const [startLoading, stopLoading] = useSplashLoading(); + const [isLoading, setIsLoading] = React.useState(true); React.useEffect(() => { loadYupLocales(currentLocale) .then(({ locale }) => { setLocale(locale); - setIsYupLoading(false); + setIsLoading(false); }) .then(() => {}); - }, [currentLocale]); + }, [currentLocale, stopLoading]); - React.useEffect(() => { - if (!isLocalsLoading && !isYupLoading) { - setAppIntlIsLoading(false); - } + // Watches the valiue to start/stop splash screen. + useWatch(isLoading, (value) => (value ? startLoading() : stopLoading()), { + immediate: true, }); + return { isLoading }; +} + +/** + * Application Intl loader. + */ +function AppIntlLoader({ children }) { + // Retrieve the current locale. + const currentLocale = getCurrentLocal(); + + // Detarmines the document direction based on the given locale. + const isRTL = rtlDetect.isRtlLang(currentLocale); + + // Modifies the html document direction + useDocumentDirectionModifier(currentLocale, isRTL); + + // Loads yup localization of the given locale. + const { isLoading: isAppYupLocalesLoading } = + useAppYupLoadLocales(currentLocale); + + // Loads application locales of the given locale. + const { isLoading: isAppLocalesLoading } = useAppLoadLocales(currentLocale); + + // Detarmines whether the app locales loading. + const isLoading = isAppYupLocalesLoading && isAppLocalesLoading; + return ( - {appIntlIsLoading ? null : children} + {isLoading ? null : children} ); } -export default R.compose( - withDashboardActions, - withDashboard(({ appIntlIsLoading }) => ({ appIntlIsLoading })), -)(AppIntlLoader); +export default R.compose(withDashboardActions)(AppIntlLoader); diff --git a/src/components/Authentication.js b/src/components/Authentication.js index a9b8575c2..a34060825 100644 --- a/src/components/Authentication.js +++ b/src/components/Authentication.js @@ -6,7 +6,6 @@ import authenticationRoutes from 'routes/authentication'; import { FormattedMessage as T } from 'components'; import Icon from 'components/Icon'; import { useIsAuthenticated } from 'hooks/state'; -import {AuthenticationBoot} from '../containers/Authentication/AuthenticationBoot'; import 'style/pages/Authentication/Auth.scss'; function PageFade(props) { @@ -26,7 +25,6 @@ export default function AuthenticationWrapper({ ...rest }) { ) : (
- { - // Once the all requests complete change the app loading state. - if ( - isAuthUserSuccess && + const [startLoading, stopLoading] = useSplashLoading(); + + // Splash loading when organization request loading and + // applicaiton still not booted. + useWatch(isOrgLoading, (value) => { + value && !isBooted.current && startLoading(); + }); + + // Splash loading when request authenticated user loading and + // application still not booted yet. + useWatch(isAuthUserLoading, (value) => { + value && !isBooted.current && startLoading(); + }); + + // Stop splash loading once organization request success. + useWatch(isCurrentOrganizationSuccess, (value) => { + value && stopLoading(); + }); + + // Stop splash loading once authenticated user request success. + useWatch(isAuthUserSuccess, (value) => { + value && stopLoading(); + }); + + // Once the all requests complete change the app loading state. + useWhen( + isAuthUserSuccess && isCurrentOrganizationSuccess && - localeCookie === organization?.metadata?.language - ) { - setAppIsLoading(false); + localeCookie === organization?.metadata?.language, + () => { isBooted.current = true; - } - }, [ - isAuthUserSuccess, - isCurrentOrganizationSuccess, - organization, - setAppIsLoading, - localeCookie, - ]); + }, + ); return null; } @@ -72,5 +95,4 @@ export const DashboardBoot = R.compose( withAuthentication(({ authenticatedUserId }) => ({ authenticatedUserId, })), - withDashboardActions, )(DashboardBootJSX); diff --git a/src/components/Dashboard/PrivatePages.js b/src/components/Dashboard/PrivatePages.js index 8c2a2d421..643752389 100644 --- a/src/components/Dashboard/PrivatePages.js +++ b/src/components/Dashboard/PrivatePages.js @@ -4,10 +4,9 @@ import { Switch, Route } from 'react-router'; import Dashboard from 'components/Dashboard/Dashboard'; import SetupWizardPage from 'containers/Setup/WizardSetupPage'; -import EnsureOrganizationIsReady from 'components/Guards/EnsureOrganizationIsReady'; -import EnsureOrganizationIsNotReady from 'components/Guards/EnsureOrganizationIsNotReady'; +import EnsureOrganizationIsReady from '../../components/Guards/EnsureOrganizationIsReady'; +import EnsureOrganizationIsNotReady from '../../components/Guards/EnsureOrganizationIsNotReady'; import { PrivatePagesProvider } from './PrivatePagesProvider'; -import { DashboardBoot } from '../../components'; import 'style/pages/Dashboard/Dashboard.scss'; @@ -17,8 +16,6 @@ import 'style/pages/Dashboard/Dashboard.scss'; export default function DashboardPrivatePages() { return ( - - diff --git a/src/components/Dashboard/PrivatePagesProvider.js b/src/components/Dashboard/PrivatePagesProvider.js index 956c6063a..1f7098817 100644 --- a/src/components/Dashboard/PrivatePagesProvider.js +++ b/src/components/Dashboard/PrivatePagesProvider.js @@ -1,9 +1,31 @@ import React from 'react'; +import * as R from 'ramda'; + import { AuthenticatedUser } from './AuthenticatedUser'; +import { DashboardBoot } from '../../components'; + +import withDashboard from '../../containers/Dashboard/withDashboard'; /** * Private pages provider. */ -export function PrivatePagesProvider({ children }) { - return {children}; +function PrivatePagesProviderComponent({ + splashScreenCompleted, + + // #ownProps + children, +}) { + return ( + + + + {splashScreenCompleted ? children : null} + + ); } + +export const PrivatePagesProvider = R.compose( + withDashboard(({ splashScreenCompleted }) => ({ + splashScreenCompleted, + })), +)(PrivatePagesProviderComponent); diff --git a/src/components/Dashboard/SplashScreen.js b/src/components/Dashboard/SplashScreen.js index fc32548e4..238cc94f0 100644 --- a/src/components/Dashboard/SplashScreen.js +++ b/src/components/Dashboard/SplashScreen.js @@ -3,13 +3,12 @@ import * as R from 'ramda'; import BigcapitalLoading from './BigcapitalLoading'; import withDashboard from '../../containers/Dashboard/withDashboard'; -function SplashScreenComponent({ appIsLoading, appIntlIsLoading }) { - return appIsLoading || appIntlIsLoading ? : null; +function SplashScreenComponent({ splashScreenLoading }) { + return splashScreenLoading ? : null; } export const SplashScreen = R.compose( - withDashboard(({ appIsLoading, appIntlIsLoading }) => ({ - appIsLoading, - appIntlIsLoading, + withDashboard(({ splashScreenLoading }) => ({ + splashScreenLoading, })), )(SplashScreenComponent); diff --git a/src/components/Guards/EnsureOrganizationIsReady.js b/src/components/Guards/EnsureOrganizationIsReady.js index ba9e8024f..097efcdd4 100644 --- a/src/components/Guards/EnsureOrganizationIsReady.js +++ b/src/components/Guards/EnsureOrganizationIsReady.js @@ -6,7 +6,6 @@ import { compose } from 'utils'; import withAuthentication from 'containers/Authentication/withAuthentication'; import withOrganization from 'containers/Organization/withOrganization'; - function EnsureOrganizationIsReady({ // #ownProps children, @@ -15,10 +14,10 @@ function EnsureOrganizationIsReady({ // #withOrganizationByOrgId isOrganizationReady, }) { - return (isOrganizationReady) ? children : ( - + return isOrganizationReady ? ( + children + ) : ( + ); } @@ -28,4 +27,4 @@ export default compose( organizationId: props.currentOrganizationId, })), withOrganization(({ isOrganizationReady }) => ({ isOrganizationReady })), -)(EnsureOrganizationIsReady); \ No newline at end of file +)(EnsureOrganizationIsReady); diff --git a/src/containers/Authentication/AuthenticationBoot.js b/src/containers/Authentication/AuthenticationBoot.js deleted file mode 100644 index 4ac6c9899..000000000 --- a/src/containers/Authentication/AuthenticationBoot.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import * as R from 'ramda'; - -import withDashboardActions from '../../containers/Dashboard/withDashboardActions'; - -function AuthenticationBootJSX({ setAppIsLoading }) { - React.useEffect(() => { - setAppIsLoading(false); - }, [setAppIsLoading]); - - return null; -} -export const AuthenticationBoot = R.compose(withDashboardActions)( - AuthenticationBootJSX, -); diff --git a/src/containers/Dashboard/withDashboard.js b/src/containers/Dashboard/withDashboard.js index d4303c6dc..d3e885adc 100644 --- a/src/containers/Dashboard/withDashboard.js +++ b/src/containers/Dashboard/withDashboard.js @@ -11,8 +11,8 @@ export default (mapState) => { sidebarExpended: state.dashboard.sidebarExpended, preferencesPageTitle: state.dashboard.preferencesPageTitle, dashboardBackLink: state.dashboard.backLink, - appIsLoading: state.dashboard.appIsLoading, - appIntlIsLoading: state.dashboard.appIntlIsLoading + splashScreenLoading: state.dashboard.splashScreenLoading > 0, + splashScreenCompleted: state.dashboard.splashScreenLoading === 0, }; return mapState ? mapState(mapped, state, props) : mapped; }; diff --git a/src/containers/Dashboard/withDashboardActions.js b/src/containers/Dashboard/withDashboardActions.js index 8c188539e..69b00a3d4 100644 --- a/src/containers/Dashboard/withDashboardActions.js +++ b/src/containers/Dashboard/withDashboardActions.js @@ -2,9 +2,8 @@ import { connect } from 'react-redux'; import t from 'store/types'; import { toggleExpendSidebar, - appIsLoading, - appIntlIsLoading } from 'store/dashboard/dashboard.actions'; +import { splashStartLoading, splashStopLoading } from '../../store/dashboard/dashboard.actions'; const mapActionsToProps = (dispatch) => ({ changePageTitle: (pageTitle) => @@ -50,15 +49,17 @@ const mapActionsToProps = (dispatch) => ({ dispatch({ type: 'CHANGE_PREFERENCES_PAGE_TITLE', pageTitle, - }), + }), setDashboardBackLink: (backLink) => dispatch({ type: t.SET_DASHBOARD_BACK_LINK, payload: { backLink }, }), - setAppIsLoading: (isLoading) => dispatch(appIsLoading(isLoading)), - setAppIntlIsLoading: (isLoading) => dispatch(appIntlIsLoading(isLoading)), + + // Splash screen start/stop loading. + splashStartLoading: () => splashStartLoading(), + splashStopLoading: () => splashStopLoading(), }); export default connect(null, mapActionsToProps); diff --git a/src/hooks/index.js b/src/hooks/index.js index cc615a214..dbb2944e0 100644 --- a/src/hooks/index.js +++ b/src/hooks/index.js @@ -1,3 +1,4 @@ +import { isEqual } from 'lodash'; import React, { useRef, useEffect, useMemo } from 'react'; import useAsync from './async'; import useAutofocus from './useAutofocus'; @@ -97,7 +98,6 @@ export function useLocalStorage(key, initialValue) { return [storedValue, setValue]; } - export function useMemorizedColumnsWidths(tableName) { const [get, save] = useLocalStorage(`${tableName}.columns_widths`, {}); @@ -105,4 +105,43 @@ export function useMemorizedColumnsWidths(tableName) { save(columnsResizing.columnWidths); }; return [get, save, handleColumnResizing]; -} \ No newline at end of file +} + +// Hook +function usePrevious(value) { + // The ref object is a generic container whose current property is mutable ... + // ... and can hold any value, similar to an instance property on a class + const ref = useRef(); + // Store current value in ref + useEffect(() => { + ref.current = value; + }, [value]); // Only re-run if value changes + // Return previous value (happens before update in useEffect above) + return ref.current; +} + +export function useWhen(condition, callback) { + React.useEffect(() => { + if (condition) { + callback(); + } + }, [condition, callback]); +} + +export function useWhenNot(condition, callback) { + return useWhen(!condition, callback); +} + +export function useWatch(state, callback, props) { + const config = { immediate: false, ...props }; + + const previosuState = usePrevious(state); + const flag = React.useRef(false); + + React.useEffect(() => { + if (!isEqual(previosuState, state) || (config.immediate && !flag.current)) { + flag.current = true; + callback(state); + } + }, [previosuState, state, config.immediate, callback]); +} diff --git a/src/hooks/state/authentication.js b/src/hooks/state/authentication.js index 6116988b7..8a0afd385 100644 --- a/src/hooks/state/authentication.js +++ b/src/hooks/state/authentication.js @@ -3,11 +3,13 @@ import { useCallback } from 'react'; import { isAuthenticated } from 'store/authentication/authentication.reducer'; import { setLogin, - setStoreReset, } from 'store/authentication/authentication.actions'; import { useQueryClient } from 'react-query'; import { removeCookie } from '../../utils'; +/** + * Removes the authentication cookies. + */ function removeAuthenticationCookies() { removeCookie('token'); removeCookie('organization_id'); diff --git a/src/hooks/state/dashboard.js b/src/hooks/state/dashboard.js index 542fe458b..04c22e37f 100644 --- a/src/hooks/state/dashboard.js +++ b/src/hooks/state/dashboard.js @@ -1,6 +1,10 @@ import { useCallback } from 'react'; import { useDispatch } from 'react-redux'; -import { dashboardPageTitle } from 'store/dashboard/dashboard.actions'; +import { + splashStopLoading, + splashStartLoading, + dashboardPageTitle, +} from '../../store/dashboard/dashboard.actions'; export const useDispatchAction = (action) => { const dispatch = useDispatch(); @@ -17,11 +21,12 @@ export const useDashboardPageTitle = () => { return useDispatchAction(dashboardPageTitle); }; -export const useSetAccountsTableQuery = () => { - +/** + * Splash loading screen actions. + */ +export const useSplashLoading = () => { + return [ + useDispatchAction(splashStartLoading), + useDispatchAction(splashStopLoading), + ]; }; - -export const useAccountsTableQuery = () => { - -} - From 9b7382e2222511140e91cc4b7fe07a123b3402fd Mon Sep 17 00:00:00 2001 From: "a.bouhuolia" Date: Thu, 23 Sep 2021 09:48:32 +0200 Subject: [PATCH 07/41] BIG-18: missing locales in Arabic. --- .../AdvancedFilterValueField.js | 20 +++++++++---------- .../CustomerDetailsActionsBar.js | 2 +- .../ManualJournalDrawerFooter.js | 10 +++++++--- .../ManualJournalDrawerHeader.js | 5 ++++- .../VendorDetailsActionsBar.js | 2 +- .../PaymentMadesEmptyStatus.js | 2 +- src/lang/ar/index.json | 16 +++++++++++++-- src/lang/en/index.json | 15 ++++++++++++-- src/store/dashboard/dashboard.actions.js | 18 +++++++++++++++++ src/store/dashboard/dashboard.reducer.js | 18 ++++++++++------- src/store/dashboard/dashboard.types.js | 4 ++-- 11 files changed, 82 insertions(+), 30 deletions(-) diff --git a/src/components/AdvancedFilter/AdvancedFilterValueField.js b/src/components/AdvancedFilter/AdvancedFilterValueField.js index 04b8fd9f9..128e1a0ff 100644 --- a/src/components/AdvancedFilter/AdvancedFilterValueField.js +++ b/src/components/AdvancedFilter/AdvancedFilterValueField.js @@ -4,8 +4,9 @@ import { DateInput } from '@blueprintjs/datetime'; import moment from 'moment'; import intl from 'react-intl-universal'; import { isUndefined } from 'lodash'; + import { useAutofocus } from 'hooks'; -import { Choose, ListSelect } from 'components'; +import { T, Choose, ListSelect } from 'components'; import { momentFormatter } from 'utils'; function AdvancedFilterEnumerationField({ options, value, ...rest }) { @@ -19,7 +20,7 @@ function AdvancedFilterEnumerationField({ options, value, ...rest }) { minimal: true, captureDismiss: true, }} - defaultText={`Select an option`} + defaultText={} textProp={'label'} selectedItemProp={'key'} {...rest} @@ -32,8 +33,7 @@ const IFieldType = { BOOLEAN: 'boolean', NUMBER: 'number', DATE: 'date', -} - +}; function tansformDateValue(date, defaultValue = null) { return date ? moment(date).toDate() : defaultValue; @@ -46,13 +46,13 @@ export default function AdvancedFilterValueField2({ fieldType, options, onChange, - isFocus + isFocus, }) { const [localValue, setLocalValue] = React.useState(value); React.useEffect(() => { if (localValue !== value && !isUndefined(value)) { - setLocalValue(value) + setLocalValue(value); } }, [localValue, value]); @@ -106,10 +106,10 @@ export default function AdvancedFilterValueField2({ position: Position.BOTTOM, }} shortcuts={true} - placeholder={'Enter date'} + placeholder={intl.get('filter.enter_date')} fill={true} inputProps={{ - fill: true + fill: true, }} /> @@ -120,7 +120,7 @@ export default function AdvancedFilterValueField2({ ); -} \ No newline at end of file +} diff --git a/src/containers/Drawers/CustomerDetailsDrawer/CustomerDetailsActionsBar.js b/src/containers/Drawers/CustomerDetailsDrawer/CustomerDetailsActionsBar.js index 62d903e79..42763b866 100644 --- a/src/containers/Drawers/CustomerDetailsDrawer/CustomerDetailsActionsBar.js +++ b/src/containers/Drawers/CustomerDetailsDrawer/CustomerDetailsActionsBar.js @@ -108,7 +108,7 @@ function CustomerDetailsActionsBar({