fix(sales): Filter only sellable items.

fix(queries): Invalidate queries after mutations.
2026-02-17 13:20:31 +00:00 · 2021-03-14 16:31:21 +02:00
parent 88eaaa3968
commit 0b59a44a4c
25 changed files with 911 additions and 464 deletions
--- a/client/src/containers/Customers/CustomerForm/CustomerFormProvider.js
+++ b/client/src/containers/Customers/CustomerForm/CustomerFormProvider.js
@@ -32,13 +32,6 @@ function CustomerFormProvider({ customerId, ...props }) {
      enabled: !!contactId,
    },
  );
-
-  // Handle fetch customers data table
-  const {
-    data: { customers },
-    isFetching: isCustomersLoading,
-  } = useCustomers();
-
  // Handle fetch Currencies data table
  const { data: currencies, isFetching: isCurrenciesLoading } = useCurrencies();

@@ -54,14 +47,12 @@ function CustomerFormProvider({ customerId, ...props }) {
  const provider = {
    customerId,
    customer,
-    customers,
    currencies,
    contactDuplicate,
    submitPayload,
    isNewMode,

    isCustomerLoading,
-    isCustomersLoading,
    isCurrenciesLoading,

    setSubmitPayload,
--- a/client/src/containers/Purchases/Bills/BillForm/BillFormProvider.js
+++ b/client/src/containers/Purchases/Bills/BillForm/BillFormProvider.js
@@ -25,11 +25,19 @@ function BillFormProvider({ billId, ...props }) {
    isFetching: isVendorsLoading,
  } = useVendors({ page_size: 10000 });

+  // Filter all purchasable items only.
+  const stringifiedFilterRoles = React.useMemo(() => JSON.stringify(
+    [{ "fieldKey": "purchasable", "value":true, "condition":"equals"}]
+  ), []);
+
  // Handle fetch Items data table or list
  const {
    data: { items },
    isFetching: isItemsLoading,
-  } = useItems({ page_size: 10000 });
+  } = useItems({
+    page_size: 10000,
+    stringified_filter_roles: stringifiedFilterRoles
+  });

  // Handle fetch bill details.
  const { data: bill, isFetching: isBillLoading } = useBill(billId, {
--- a/client/src/containers/Sales/Estimates/EstimateForm/EstimateFormProvider.js
+++ b/client/src/containers/Sales/Estimates/EstimateForm/EstimateFormProvider.js
@@ -19,11 +19,19 @@ function EstimateFormProvider({ estimateId, ...props }) {
    estimateId, { enabled: !!estimateId }
  );

+  // Filter all sellable items only.
+  const stringifiedFilterRoles = React.useMemo(() => JSON.stringify(
+    [{ "fieldKey": "sellable", "value":true, "condition":"equals"}]
+  ), []);
+
  // Handle fetch Items data table or list
  const {
    data: { items },
    isFetching: isItemsFetching,
-  } = useItems({ page_size: 10000 });
+  } = useItems({
+    page_size: 10000,
+    stringified_filter_roles: stringifiedFilterRoles
+  });

  // Handle fetch customers data table or list
  const {
--- a/client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormProvider.js
+++ b/client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormProvider.js
@@ -38,11 +38,19 @@ function InvoiceFormProvider({ invoiceId, ...props }) {
      })
    : [];

+  // Filter all sellable items only.
+  const stringifiedFilterRoles = React.useMemo(() => JSON.stringify(
+    [{ "fieldKey": "sellable", "value":true, "condition":"equals"}]
+  ), []);
+
  // Handle fetching the items table based on the given query.
  const {
    data: { items },
    isLoading: isItemsLoading,
-  } = useItems({ page_size: 10000 });
+  } = useItems({
+    page_size: 10000,
+    stringified_filter_roles: stringifiedFilterRoles
+  });

  // Handle fetch customers data table or list
  const {
--- a/client/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormProvider.js
+++ b/client/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormProvider.js
@@ -32,11 +32,19 @@ function ReceiptFormProvider({ receiptId, ...props }) {
    isFetching: isCustomersLoading,
  } = useCustomers({ page_size: 10000 });

+  // Filter all sellable items only.
+  const stringifiedFilterRoles = React.useMemo(() => JSON.stringify(
+    [{ "fieldKey": "sellable", "value":true, "condition":"equals"}]
+  ), []);
+
  // Handle fetch Items data table or list
  const {
    data: { items },
    isFetching: isItemsLoading,
-  } = useItems({ page_size: 10000 });
+  } = useItems({
+    page_size: 10000,
+    stringified_filter_roles: stringifiedFilterRoles
+  });

  // Fetch receipt settings.
  const { isLoading: isSettingLoading } = useSettingsReceipts();
--- a/client/src/hooks/query/accounts.js
+++ b/client/src/hooks/query/accounts.js
@@ -1,50 +1,62 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
+import t from './types';

 // Transform the account.
 const transformAccount = (response) => {
  return response.data.account;
 };

+const commonInvalidateQueries = (query) => {
+  // Invalidate accounts.
+  query.invalidateQueries(t.ACCOUNTS);
+
+  // Invalidate financial reports.
+  query.invalidateQueries(t.FINANCIAL_REPORT);
+}
+
 /**
 * Retrieve accounts list.
 */
 export function useAccounts(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['ACCOUNTS', query],
+  return useQuery(
+    [t.ACCOUNTS, query],
    () => apiRequest.get('accounts', { params: query }),
    {
      select: (response) => {
        return response.data.accounts;
      },
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          accounts: []
+        },
+      },
      ...props,
    },
  );
-  return {
-    ...states,
-    data: defaultTo(states.data, []),
-  };
 }

 /**
 * Retrieve the given account details.
- * @param {number} id -
+ * @param {number} id - Account id.
 */
 export function useAccount(id, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['ACCOUNT', id],
+  return useQuery(
+    [t.ACCOUNT, id],
    () => apiRequest.get(`accounts/${id}`).then(transformAccount),
-    props,
+    {
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: { account: {} }
+      },
+      ...props
+    },
  );
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }

 /**
@@ -53,18 +65,20 @@ export function useAccount(id, props) {
 export function useAccountsTypes(props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['ACCOUNTS_TYPES'],
+  return useQuery(
+    [t.ACCOUNTS_TYPES],
    () => apiRequest.get('account_types'),
    {
      select: (res) => res.data.account_types,
+      initialData: {
+        data: {
+          account_types: [],
+        },
+      },
+      initialDataUpdatedAt: 0,
      ...props,
    },
  );
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }

 /**
@@ -76,7 +90,8 @@ export function useCreateAccount(props) {

  return useMutation((values) => apiRequest.post('accounts', values), {
    onSuccess: () => {
-      client.invalidateQueries('ACCOUNTS');
+      // Common invalidate queries.
+      commonInvalidateQueries(client);
    },
    ...props,
  });
@@ -86,14 +101,15 @@ export function useCreateAccount(props) {
 * Edits the given account.
 */
 export function useEditAccount(props) {
-  const query = useQueryClient();
+  const client = useQueryClient();
  const apiRequest = useApiRequest();

  return useMutation(
    ([id, values]) => apiRequest.post(`accounts/${id}`, values),
    {
      onSuccess: () => {
-        query.invalidateQueries('ACCOUNTS');
+        // Common invalidate queries.
+        commonInvalidateQueries(client);
      },
      ...props,
    },
@@ -104,12 +120,13 @@ export function useEditAccount(props) {
 * Edits the given account.
 */
 export function useDeleteAccount(props) {
-  const query = useQueryClient();
+  const client = useQueryClient();
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`accounts/${id}`), {
    onSuccess: () => {
-      query.invalidateQueries('ACCOUNTS');
+      // Common invalidate queries.
+      commonInvalidateQueries(client);
    },
    ...props,
  });
@@ -119,12 +136,13 @@ export function useDeleteAccount(props) {
 * Actiavte the give account.
 */
 export function useActivateAccount(props) {
-  const query = useQueryClient();
+  const client = useQueryClient();
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.post(`accounts/${id}/activate`), {
    onSuccess: () => {
-      query.invalidateQueries('ACCOUNTS');
+      // Common invalidate queries.
+      commonInvalidateQueries(client);
    },
    ...props,
  });
@@ -139,7 +157,8 @@ export function useInactivateAccount(props) {

  return useMutation((id) => apiRequest.post(`accounts/${id}/inactivate`), {
    onSuccess: () => {
-      query.invalidateQueries('ACCOUNTS');
+      // Common invalidate queries.
+      commonInvalidateQueries(query);
    },
    ...props,
  });
--- a/client/src/hooks/query/bills.js
+++ b/client/src/hooks/query/bills.js
@@ -2,6 +2,27 @@ import { useQueryClient, useQuery, useMutation } from 'react-query';
 import { defaultTo } from 'lodash';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';
+
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate bills.
+  queryClient.invalidateQueries(t.BILLS);
+
+  // Invalidate items.
+  queryClient.invalidateQueries(t.ITEMS);
+  queryClient.invalidateQueries(t.ITEM);
+
+  // Invalidate vendors.
+  queryClient.invalidateQueries([t.VENDORS]);
+  queryClient.invalidateQueries(t.VENDOR);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+};

 /**
 * Creates a new sale invoice.
@@ -12,10 +33,8 @@ export function useCreateBill(props) {

  return useMutation((values) => apiRequest.post('purchases/bills', values), {
    onSuccess: (res, values) => {
-      queryClient.invalidateQueries('BILLS');
-      queryClient.invalidateQueries('BILL');
-      queryClient.invalidateQueries(['VENDORS']);
-      queryClient.invalidateQueries(['VENDOR', values.vendor_id]);
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -32,10 +51,27 @@ export function useEditBill(props) {
    ([id, values]) => apiRequest.post(`purchases/bills/${id}`, values),
    {
      onSuccess: (res, [id, values]) => {
-        queryClient.invalidateQueries('BILLS');
-        queryClient.invalidateQueries('BILL');
-        queryClient.invalidateQueries(['VENDORS']);
-        queryClient.invalidateQueries(['VENDOR', values.vendor_id]);
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+      },
+      ...props,
+    },
+  );
+}
+
+/**
+ * Marks the given bill as open.
+ */
+ export function useOpenBill(props) {
+  const queryClient = useQueryClient();
+  const apiRequest = useApiRequest();
+
+  return useMutation(
+    (id) => apiRequest.post(`purchases/bills/${id}/open`),
+    {
+      onSuccess: (res, id) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -51,9 +87,8 @@ export function useDeleteBill(props) {

  return useMutation((id) => apiRequest.delete(`purchases/bills/${id}`), {
    onSuccess: (res, id) => {
-      queryClient.invalidateQueries('BILLS');
-      queryClient.invalidateQueries('BILL');
-      queryClient.invalidateQueries(['VENDORS']);
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -66,7 +101,7 @@ export function useBills(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['BILLS', query],
+    [t.BILLS, query],
    () =>
      apiRequest.get('purchases/bills', { params: query }),
    {
@@ -101,7 +136,7 @@ export function useBill(id, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['BILL', id],
+    [t.BILL, id],
    () => apiRequest.get(`/purchases/bills/${id}`),
    {
      select: (res) => res.data.bill,
@@ -115,34 +150,15 @@ export function useBill(id, props) {
  }
 }

-/**
- * Marks the given bill as open.
- */
-export function useOpenBill(props) {
-  const queryClient = useQueryClient();
-  const apiRequest = useApiRequest();
-
-  return useMutation(
-    (id) => apiRequest.post(`purchases/bills/${id}/open`),
-    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('BILLS');
-        queryClient.invalidateQueries(['VENDORS']);
-      },
-      ...props,
-    },
-  );
-}
-
 /**
 * Retrieve the due bills of the given vendor id.
 * @param {number} vendorId -
 */
-export function useDueBills(vendorId, props) {
+ export function useDueBills(vendorId, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['BILLS_DUE', vendorId],
+    [t.BILLS, t.BILLS_DUE, vendorId],
    () =>
      apiRequest.get(`purchases/bills/due`, {
        params: { vendor_id: vendorId },
--- a/client/src/hooks/query/currencies.js
+++ b/client/src/hooks/query/currencies.js
@@ -1,6 +1,6 @@
 import { useMutation, useQueryClient, useQuery } from 'react-query';
-import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
+import t from './types';

 /**
 * Create a new currency.
@@ -11,7 +11,8 @@ export function useCreateCurrency(props) {

  return useMutation((values) => apiRequest.post('currencies', values), {
    onSuccess: () => {
-      queryClient.invalidateQueries('CURRENCIES');
+      // Invalidate currencies.
+      queryClient.invalidateQueries(t.CURRENCIES);
    },
    ...props,
  });
@@ -29,7 +30,8 @@ export function useEditCurrency(props) {
      apiRequest.post(`currencies/${currencyCode}`, values),
    {
      onSuccess: () => {
-        queryClient.invalidateQueries('CURRENCIES');
+        // Invalidate currencies.
+        queryClient.invalidateQueries(t.CURRENCIES);
      },
      ...props,
    },
@@ -47,7 +49,8 @@ export function useDeleteCurrency(props) {
    (currencyCode) => apiRequest.delete(`currencies/${currencyCode}`),
    {
      onSuccess: () => {
-        queryClient.invalidateQueries('CURRENCIES');
+        // Invalidate currencies.
+        queryClient.invalidateQueries(t.CURRENCIES);
      },
      ...props,
    },
@@ -60,14 +63,13 @@ export function useDeleteCurrency(props) {
 export function useCurrencies(props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['CURRENCIES'],
+  return useQuery(
+    [t.CURRENCIES],
    () => apiRequest.get('currencies').then((res) => res.data.currencies),
-    props,
+    {
+      initialDataUpdatedAt: 0,
+      initialData: [],
+      ...props
+    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, []),
-  };
 }
--- a/client/src/hooks/query/customers.js
+++ b/client/src/hooks/query/customers.js
@@ -1,7 +1,7 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';

 const defaultPagination = {
  pageSize: 12,
@@ -9,33 +9,44 @@ const defaultPagination = {
  pagesCount: 0,
 };

+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate customers.
+  queryClient.invalidateQueries(t.CUSTOMERS);
+
+  // Invalidate the financial reports.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate the financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+};
+
 /**
 * Retrieve customers list with pagination meta.
 */
 export function useCustomers(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['CUSTOMERS', query],
+  return useQuery(
+    [t.CUSTOMERS, query],
    () => apiRequest.get(`customers`, { params: query }),
    {
      select: (response) => ({
        customers: response.data.customers,
        pagination: transformPagination(response.data.pagination),
-        filterMeta: response.data.filter_meta
+        filterMeta: response.data.filter_meta,
      }),
+      initialDataUpdatedAt: 0,
+      initialData: {  
+        data: {
+          customers: [],
+          pagination: defaultPagination,
+          filter_meta: {},
+        }
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      customers: [],
-      pagination: defaultPagination,
-      filterMeta: {},
-    })
-  }
 }

 /**
@@ -49,9 +60,12 @@ export function useEditCustomer(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`customers/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('CUSTOMERS');
-        queryClient.invalidateQueries('CUSTOMER');
+      onSuccess: (res, [id, values]) => {
+        // Invalidate specific customer.
+        queryClient.invalidateQueries([t.CUSTOMER, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -68,9 +82,12 @@ export function useDeleteCustomer(props) {
  return useMutation(
    (id) => apiRequest.delete(`customers/${id}`),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('CUSTOMERS');
-        queryClient.invalidateQueries('CUSTOMER');
+      onSuccess: (res, id) => {
+        // Invalidate specific customer.
+        queryClient.invalidateQueries([t.CUSTOMER, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    }
@@ -88,8 +105,8 @@ export function useCreateCustomer(props) {
    (values) => apiRequest.post('customers', values),
    {
      onSuccess: () => {
-        queryClient.invalidateQueries('CUSTOMERS');
-        queryClient.invalidateQueries('CUSTOMER');
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props
    });
@@ -99,14 +116,19 @@ export function useCreateCustomer(props) {
 * Retrieve the customer details.
 */
 export function useCustomer(id, props) {
-  const queryClient = useQueryClient();
  const apiRequest = useApiRequest();

  return useQuery(
-    ['CUSTOMER', id],
+    [t.CUSTOMER, id],
    () => apiRequest.get(`customers/${id}`),
    {
      select: (res) => res.data.customer,
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          customer: {}
+        }
+      },
      ...props
    },
  );
--- a/client/src/hooks/query/estimates.js
+++ b/client/src/hooks/query/estimates.js
@@ -1,7 +1,13 @@
 import { useQueryClient, useQuery, useMutation } from 'react-query';
-import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
 import { transformPagination } from 'utils';
+import t from './types';
+
+
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate estimates.
+  queryClient.invalidateQueries(t.SALE_ESTIMATES);
+};

 /**
 * Creates a new sale estimate.
@@ -12,8 +18,11 @@ export function useCreateEstimate(props) {

  return useMutation((values) => apiRequest.post('sales/estimates', values), {
    onSuccess: () => {
-      queryClient.invalidateQueries('SALE_ESTIMATES');
-      queryClient.invalidateQueries(['SETTINGS', 'ESTIMATES']);
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+
+      // Invalidate the settings.
+      queryClient.invalidateQueries([t.SETTING, t.SETTING_ESTIMATES]);
    },
    ...props,
  });
@@ -29,8 +38,12 @@ export function useEditEstimate(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`sales/estimates/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('SALE_ESTIMATES');
+      onSuccess: (res, [id, values]) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+
+        // Invalidate specific sale estimate.
+        queryClient.invalidateQueries([t.SALE_ESTIMATE, id]);
      },
      ...props,
    },
@@ -43,19 +56,18 @@ export function useEditEstimate(props) {
 export function useEstimate(id, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['SALE_ESTIMATE', id],
+  return useQuery(
+    [t.SALE_ESTIMATE, id],
    () => apiRequest.get(`sales/estimates/${id}`),
    {
      select: (res) => res.data.estimate,
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: { estimate: {} },
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }

 /**
@@ -64,8 +76,8 @@ export function useEstimate(id, props) {
 export function useEstimates(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['SALE_ESTIMATES', query],
+  return useQuery(
+    [t.SALE_ESTIMATES, query],
    () => apiRequest.get('sales/estimates', { params: query }),
    {
      select: (res) => ({
@@ -73,22 +85,21 @@ export function useEstimates(query, props) {
        pagination: transformPagination(res.data.pagination),
        filterMeta: res.data.filter_meta,
      }),
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data:{ 
+          sales_estimates: [],
+          pagination: {
+            page: 1,
+            pageSize: 12,
+            total: 0,
+          },
+          filter_meta: {},
+        }
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      estimates: [],
-      pagination: {
-        page: 1,
-        pageSize: 12,
-        total: 0,
-      },
-      filterMeta: {},
-    }),
-  };
 }

 /**
@@ -99,8 +110,12 @@ export function useDeleteEstimate(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`sales/estimates/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('SALE_ESTIMATES');
+    onSuccess: (res, id) => {
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+
+      // Invalidate specific sale estimate.
+      queryClient.invalidateQueries([t.SALE_ESTIMATE, id]);
    },
    ...props,
  });
@@ -116,8 +131,12 @@ export function useDeliverEstimate(props) {
  return useMutation(
    (id) => apiRequest.post(`sales/estimates/${id}/deliver`),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('SALE_ESTIMATES');
+      onSuccess: (res, id) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+
+        // Invalidate specific sale estimate.
+        queryClient.invalidateQueries([t.SALE_ESTIMATE, id]);
      },
      ...props,
    },
@@ -134,8 +153,12 @@ export function useApproveEstimate(props) {
  return useMutation(
    (id) => apiRequest.post(`sales/estimates/${id}/approve`),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('SALE_ESTIMATES');
+      onSuccess: (res, id) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+
+        // Invalidate specific sale estimate.
+        queryClient.invalidateQueries([t.SALE_ESTIMATE, id]);
      },
      ...props,
    },
@@ -152,8 +175,12 @@ export function useRejectEstimate(props) {
  return useMutation(
    (id) => apiRequest.post(`sales/estimates/${id}/reject`),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('SALE_ESTIMATES');
+      onSuccess: (res, id) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+
+        // Invalidate specific sale estimate.
+        queryClient.invalidateQueries([t.SALE_ESTIMATE, id]);
      },
      ...props,
    },
--- a/client/src/hooks/query/expenses.js
+++ b/client/src/hooks/query/expenses.js
@@ -1,7 +1,7 @@
 import { useQuery, useMutation, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
 import { transformPagination } from 'utils';
+import t from './types';

 const defaultPagination = {
  pageSize: 12,
@@ -9,14 +9,27 @@ const defaultPagination = {
  pagesCount: 0,
 };

+// Common invalidate queries.
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate expenses.
+  queryClient.invalidateQueries(t.EXPENSES);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+};
+
 /**
 * Retrieve the expenses list.
 */
 export function useExpenses(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['EXPENSES', query],
+  return useQuery(
+    [t.EXPENSES, query],
    () => apiRequest.get(`expenses`, { params: { ...query } }),
    {
      select: (response) => ({
@@ -24,18 +37,17 @@ export function useExpenses(query, props) {
        pagination: transformPagination(response.data.pagination),
        filterMeta: response.data.filter_meta,
      }),
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          expenses: [],
+          pagination: defaultPagination,
+          filter_meta: {},
+        },
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      customers: [],
-      pagination: defaultPagination,
-      filterMeta: {},
-    }),
-  };
 }

 /**
@@ -45,19 +57,20 @@ export function useExpenses(query, props) {
 export function useExpense(id, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['EXPENSE', id],
+  return useQuery(
+    [t.EXPENSE, id],
    () => apiRequest.get(`expenses/${id}`),
    {
      select: (res) => res.data.expense,
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          expense: {},
+        }
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }

 /**
@@ -68,9 +81,12 @@ export function useDeleteExpense(props) {
  const queryClient = useQueryClient();

  return useMutation((id) => apiRequest.delete(`expenses/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('EXPENSES');
-      queryClient.invalidateQueries('EXPENSE');
+    onSuccess: (res, id) => {
+      // Invalidate specific expense.
+      queryClient.invalidateQueries([t.EXPENSE, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -86,9 +102,12 @@ export function useEditExpense(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`expenses/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('EXPENSES');
-        queryClient.invalidateQueries('EXPENSE');
+      onSuccess: (res, [id, values]) => {
+        // Invalidate specific expense.
+        queryClient.invalidateQueries([t.EXPENSE, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -103,9 +122,9 @@ export function useCreateExpense(props) {
  const apiRequest = useApiRequest();

  return useMutation((values) => apiRequest.post('expenses', values), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('EXPENSES');
-      queryClient.invalidateQueries('EXPENSE');
+    onSuccess: (res, [values]) => {
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -119,9 +138,12 @@ export function usePublishExpense(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.post(`expenses/${id}/publish`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('EXPENSES');
-      queryClient.invalidateQueries('EXPENSE');
+    onSuccess: (res, id) => {
+      // Invalidate specific expense.
+      queryClient.invalidateQueries([t.EXPENSE, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
--- a/client/src/hooks/query/financialReports.js
+++ b/client/src/hooks/query/financialReports.js
@@ -10,6 +10,7 @@ import {
  APAgingSummaryTableRowsMapper
 } from 'containers/FinancialStatements/reducers';
 import useApiRequest from '../useRequest';
+import t from './types';

 /**
 * Retrieve balance sheet.
@@ -18,7 +19,7 @@ export function useBalanceSheet(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['FINANCIAL-REPORT', 'BALANCE-SHEET', query],
+    [t.FINANCIAL_REPORT, t.BALANCE_SHEET, query],
    () =>
      apiRequest.get('/financial_statements/balance_sheet', {
        params: query,
@@ -50,7 +51,7 @@ export function useTrialBalanceSheet(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['FINANCIAL-REPORT', 'TRIAL-BALANCE-SHEET', query],
+    [t.FINANCIAL_REPORT, t.TRIAL_BALANCE_SHEET, query],
    () =>
      apiRequest.get('/financial_statements/trial_balance_sheet', {
        params: query,
@@ -81,7 +82,7 @@ export function useProfitLossSheet(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['FINANCIAL-REPORT', 'PROFIT-LOSS-SHEET', query],
+    [t.FINANCIAL_REPORT, t.PROFIT_LOSS_SHEET, query],
    () =>
      apiRequest.get('/financial_statements/profit_loss_sheet', {
        params: query,
@@ -112,7 +113,7 @@ export function useGeneralLedgerSheet(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['FINANCIAL-REPORT', 'GENERAL-LEDGER', query],
+    [t.FINANCIAL_REPORT, t.GENERAL_LEDGER, query],
    () =>
      apiRequest.get('/financial_statements/general_ledger', {
        params: query,
@@ -143,7 +144,7 @@ export function useJournalSheet(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['FINANCIAL-REPORT', 'JOURNAL', query],
+    [t.FINANCIAL_REPORT, t.JOURNAL, query],
    () => apiRequest.get('/financial_statements/journal', { params: query }),
    {
      select: (res) => ({
@@ -165,13 +166,13 @@ export function useJournalSheet(query, props) {
 }

 /**
- * Retrieve AR aging summary report.
+ * Retrieve A/R aging summary report.
 */
 export function useARAgingSummaryReport(query, props) {
  const apiRequest = useApiRequest();

  return useQuery(
-    ['FINANCIAL-REPORT', 'AR-AGING-SUMMARY', query],
+    [t.FINANCIAL_REPORT, t.AR_AGING_SUMMARY, query],
    () =>
      apiRequest.get('/financial_statements/receivable_aging_summary', {
        params: query,
@@ -204,13 +205,13 @@ export function useARAgingSummaryReport(query, props) {
 }

 /**
- * Retrieve AP aging summary report.
+ * Retrieve A/P aging summary report.
 */
 export function useAPAgingSummaryReport(query, props) {
  const apiRequest = useApiRequest();

  return useQuery(
-    ['FINANCIAL-REPORT', 'AP-AGING-SUMMARY', query],
+    [t.FINANCIAL_REPORT, t.AP_AGING_SUMMARY, query],
    () =>
      apiRequest.get('/financial_statements/payable_aging_summary', {
        params: query,
--- a/client/src/hooks/query/inventoryAdjustments.js
+++ b/client/src/hooks/query/inventoryAdjustments.js
@@ -1,13 +1,23 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';

-const invalidateQueries = (queryClient) => {
-  queryClient.invalidateQueries('INVENTORY_ADJUSTMENTS');

-  queryClient.invalidateQueries('ITEMS');
-  queryClient.invalidateQueries('ITEM');
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate inventory adjustments.
+  queryClient.invalidateQueries(t.INVENTORY_ADJUSTMENTS);
+
+  // Invalidate items.
+  queryClient.invalidateQueries(t.ITEMS);
+  queryClient.invalidateQueries(t.ITEM);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
 };

 /**
@@ -21,7 +31,8 @@ export function useCreateInventoryAdjustment(props) {
    (values) => apiRequest.post('inventory_adjustments/quick', values),
    {
      onSuccess: () => {
-        invalidateQueries(queryClient)
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -38,8 +49,9 @@ export function useDeleteInventoryAdjustment(props) {
  return useMutation(
    (id) => apiRequest.delete(`inventory_adjustments/${id}`),
    {
-      onSuccess: () => {
-        invalidateQueries(queryClient)
+      onSuccess: (res, id) => {
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -59,22 +71,24 @@ const inventoryAdjustmentsTransformer = (response) => {
 export function useInventoryAdjustments(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
+  return useQuery(
    ['INVENTORY_ADJUSTMENTS', query],
    () => apiRequest.get('inventory_adjustments', { params: query })  
      .then(inventoryAdjustmentsTransformer),
-    props,
+    {
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          transactions: [],
+          pagination: {
+            page: 1,
+            pageSize: 12,
+            total: 0,
+            pagesCount: 0,
+          },
+        }
+      },
+      ...props
+    },
  );
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      transactions: [],
-      pagination: {
-        page: 1,
-        pageSize: 12,
-        total: 0,
-        pagesCount: 0,
-      }
-    })
-  }
 }
--- a/client/src/hooks/query/invoices.js
+++ b/client/src/hooks/query/invoices.js
@@ -1,7 +1,30 @@
-import { defaultTo } from 'lodash';
 import { useQueryClient, useQuery, useMutation } from 'react-query';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';
+
+// Common invalidate queries.
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate invoices.
+  queryClient.invalidateQueries(t.SALE_INVOICES);
+
+  // Invalidate customers.
+  queryClient.invalidateQueries(t.CUSTOMERS);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ITEMS);
+  queryClient.invalidateQueries(t.ITEM);
+
+  // Invalidate settings.
+  queryClient.invalidateQueries([t.SETTING, t.SETTING_INVOICES]);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+};

 /**
 * Creates a new sale invoice.
@@ -11,13 +34,12 @@ export function useCreateInvoice(props) {
  const apiRequest = useApiRequest();

  return useMutation((values) => apiRequest.post('sales/invoices', values), {
-    onSuccess: (values) => {
-      queryClient.invalidateQueries('SALE_INVOICES');
+    onSuccess: (res, values) => {
+      // Invalidate invoice customer.
+      queryClient.invalidateQueries([t.CUSTOMER, values.customer_id]);

-      queryClient.invalidateQueries('CUSTOMERS');
-      queryClient.invalidateQueries(['CUSTOMER', values.customer_id]);
-
-      queryClient.invalidateQueries(['SETTINGS', 'INVOICES']);
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -34,10 +56,14 @@ export function useEditInvoice(props) {
    ([id, values]) => apiRequest.post(`sales/invoices/${id}`, values),
    {
      onSuccess: (res, [id, values]) => {
-        queryClient.invalidateQueries('SALE_INVOICES');
-        queryClient.invalidateQueries(['SALE_INVOICE', id]);
-        queryClient.invalidateQueries('CUSTOMERS');
-        queryClient.invalidateQueries(['CUSTOMER', values.customer_id]);
+        // Invalidate specific sale invoice.
+        queryClient.invalidateQueries([t.SALE_INVOICE, id]);
+
+        // Invalidate invoice customer.
+        queryClient.invalidateQueries([t.CUSTOMER, values.customer_id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -53,9 +79,11 @@ export function useDeleteInvoice(props) {

  return useMutation((id) => apiRequest.delete(`sales/invoices/${id}`), {
    onSuccess: (res, id) => {
-      queryClient.invalidateQueries('SALE_INVOICES');
-      queryClient.invalidateQueries(['SALE_INVOICE', id]);
-      queryClient.invalidateQueries('CUSTOMERS');
+      // Invalidate specific invoice.
+      queryClient.invalidateQueries([t.SALE_INVOICE, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -67,8 +95,8 @@ export function useDeleteInvoice(props) {
 export function useInvoices(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['SALE_INVOICES', query],
+  return useQuery(
+    [t.SALE_INVOICES, query],
    () => apiRequest.get('sales/invoices', { params: query }),
    {
      select: (res) => ({
@@ -76,22 +104,21 @@ export function useInvoices(query, props) {
        pagination: transformPagination(res.data.pagination),
        filterMeta: res.data.filter_meta,
      }),
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          sales_invoices: [],
+          pagination: {
+            page: 1,
+            pageSize: 12,
+            total: 0,
+          },
+          filter_meta: {},
+        },
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      invoices: [],
-      pagination: {
-        page: 1,
-        pageSize: 12,
-        total: 0,
-      },
-      filterMeta: {},
-    }),
-  };
 }

 /**
@@ -101,35 +128,42 @@ export function useDeliverInvoice(props) {
  const queryClient = useQueryClient();
  const apiRequest = useApiRequest();

-  return useMutation((id) => apiRequest.post(`sales/invoices/${id}/deliver`), {
-    onSuccess: (res, id) => {
-      queryClient.invalidateQueries('SALE_INVOICES');
-      queryClient.invalidateQueries(['SALE_INVOICE', id]);
-      queryClient.invalidateQueries('CUSTOMERS');
+  return useMutation(
+    (invoiceId) => apiRequest.post(`sales/invoices/${invoiceId}/deliver`),
+    {
+      onSuccess: (res, invoiceId) => {
+        // Invalidate specific invoice.
+        queryClient.invalidateQueries([t.SALE_INVOICE, invoiceId]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+      },
+      ...props,
    },
-    ...props,
-  });
+  );
 }

 /**
 * Retrieve the sale invoice details.
+ * @param {number} invoiceId - Invoice id.
 */
-export function useInvoice(id, props) {
+export function useInvoice(invoiceId, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['SALE_INVOICE', id],
-    () => apiRequest.get(`sales/invoices/${id}`),
+  return useQuery(
+    [t.SALE_INVOICE, invoiceId],
+    () => apiRequest.get(`sales/invoices/${invoiceId}`),
    {
      select: (res) => res.data.sale_invoice,
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          sale_invoice: {}
+        },
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }

 /**
@@ -139,8 +173,8 @@ export function useInvoice(id, props) {
 export function useDueInvoices(customerId, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['SALE_INVOICE_DUE', customerId],
+  return useQuery(
+    [t.SALE_INVOICES, t.SALE_INVOICES_DUE, customerId],
    () =>
      apiRequest.get(`sales/invoices/payable`, {
        params: { customer_id: customerId },
@@ -156,9 +190,4 @@ export function useDueInvoices(customerId, props) {
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, []),
-  };
 }
--- a/client/src/hooks/query/items.js
+++ b/client/src/hooks/query/items.js
@@ -1,14 +1,23 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import { transformPagination, transformResponse } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';

-const defaultPagination = {
+const DEFAULT_PAGINATION = {
  pageSize: 12,
  page: 0,
  pagesCount: 0,
 };

+// Common invalidate queries.
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate items.
+  queryClient.invalidateQueries(t.ITEMS);
+
+  // Invalidate items categories.
+  queryClient.invalidateQueries(t.ITEMS_CATEGORIES);
+};
+
 /**
 * Creates a new item.
 */
@@ -17,9 +26,8 @@ export function useCreateItem(props) {
  const apiRequest = useApiRequest();

  return useMutation((values) => apiRequest.post('items', values), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS');
-      queryClient.invalidateQueries('ITEMS_CATEGORIES');
+    onSuccess: (res, values) => {
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -33,10 +41,12 @@ export function useEditItem(props) {
  const apiRequest = useApiRequest();

  return useMutation(([id, values]) => apiRequest.post(`items/${id}`, values), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS');
-      queryClient.invalidateQueries('ITEM');
-      queryClient.invalidateQueries('ITEMS_CATEGORIES');
+    onSuccess: (res, [id, values]) => {
+      // Invalidate specific item.
+      queryClient.invalidateQueries([t.ITEM, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -50,10 +60,50 @@ export function useDeleteItem(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`items/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS');
-      queryClient.invalidateQueries('ITEM');
-      queryClient.invalidateQueries('ITEMS_CATEGORIES');
+    onSuccess: (res, id) => {
+      // Invalidate specific item.
+      queryClient.invalidateQueries([t.ITEM, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+    },
+    ...props,
+  });
+}
+
+/**
+ * Activate the given item.
+ */
+ export function useActivateItem(props) {
+  const queryClient = useQueryClient();
+  const apiRequest = useApiRequest();
+
+  return useMutation((id) => apiRequest.post(`items/${id}/activate`), {
+    onSuccess: (res, id) => {
+      // Invalidate specific item.
+      queryClient.invalidateQueries([t.ITEM, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+    },
+    ...props,
+  });
+}
+
+/**
+ * Inactivate the given item.
+ */
+export function useInactivateItem(props) {
+  const queryClient = useQueryClient();
+  const apiRequest = useApiRequest();
+
+  return useMutation((id) => apiRequest.post(`items/${id}/inactivate`), {
+    onSuccess: (res, id) => {
+      // Invalidate specific item.
+      queryClient.invalidateQueries([t.ITEM, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -76,21 +126,19 @@ const transformItemsResponse = (response) => {
 export function useItems(query, props) {
  const apiRequest = useApiRequest();

-  const result = useQuery(
+  return useQuery(
    ['ITEMS', query],
-    () =>
-      apiRequest.get(`items`, { params: query }).then(transformItemsResponse),
-    props,
+    () => apiRequest.get(`items`, { params: query }).then(transformItemsResponse),
+    {
+      initialDataUpdatedAt: 0,
+      initialData: {
+        items: [],
+        pagination: DEFAULT_PAGINATION,
+        filterMeta: {},
+      },
+      ...props,
+    }
  );
-
-  return {
-    ...result,
-    data: defaultTo(result.data, {
-      items: [],
-      pagination: defaultPagination,
-      filterMeta: {},
-    }),
-  };
 }

 /**
@@ -103,38 +151,10 @@ export function useItem(id, props) {
  return useQuery(
    ['ITEM', id],
    () => apiRequest.get(`items/${id}`).then((response) => response.data.item),
-    props,
+    {
+      initialDataUpdatedAt: 0,
+      initialData: {},
+      ...props
+    },
  );
-}
-
-/**
- * Activate the given item.
- */
-export function useActivateItem(props) {
-  const queryClient = useQueryClient();
-  const apiRequest = useApiRequest();
-
-  return useMutation((id) => apiRequest.post(`items/${id}/activate`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS');
-      queryClient.invalidateQueries('ITEM');
-    },
-    ...props,
-  });
-}
-
-/**
- * Inactivate the given item.
- */
-export function useInactivateItem(props) {
-  const queryClient = useQueryClient();
-  const apiRequest = useApiRequest();
-
-  return useMutation((id) => apiRequest.post(`items/${id}/inactivate`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS');
-      queryClient.invalidateQueries('ITEM');
-    },
-    ...props,
-  });
-}
+}
--- a/client/src/hooks/query/itemsCategories.js
+++ b/client/src/hooks/query/itemsCategories.js
@@ -1,6 +1,14 @@
 import { useQuery, useMutation, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
+import t from './types';
+
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate items categories.
+  queryClient.invalidateQueries(t.ITEMS_CATEGORIES);
+
+  // Invalidate items.
+  queryClient.invalidateQueries(t.ITEMS);
+};

 /**
 * Creates a new item category.
@@ -11,7 +19,8 @@ export function useCreateItemCategory(props) {

  return useMutation((values) => apiRequest.post('item_categories', values), {
    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS_CATEGORIES');
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -27,9 +36,12 @@ export function useEditItemCategory(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`item_categories/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('ITEMS_CATEGORIES');
-        queryClient.invalidateQueries('ITEMS');
+      onSuccess: (res, [id, values]) => {
+        // Invalidate specific item category.
+        queryClient.invalidateQueries([t.ITEM_CATEGORY, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -44,44 +56,41 @@ export function useDeleteItemCategory(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`item_categories/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('ITEMS_CATEGORIES');
-      queryClient.invalidateQueries('ITEMS');
+    onSuccess: (res, id) => {
+      // Invalidate specific item category.
+      queryClient.invalidateQueries([t.ITEM_CATEGORY, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
 }

-// Transforms items categories.
-const transformItemsCategories = (response) => {
-  return {
-    itemsCategories: response.data.item_categories,
-    pagination: response.data.pagination,
-  };
-};
-
 /**
 * Retrieve the items categories.
 */
 export function useItemsCategories(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['ITEMS_CATEGORIES', query],
-    () =>
-      apiRequest.get(`item_categories`, { params: query }).then(
-        transformItemsCategories,
-      ),
-    props,
+  return useQuery(
+    [t.ITEMS_CATEGORIES, query],
+    () => apiRequest.get(`item_categories`, { params: query }),
+    {
+      select: (response) => ({
+        itemsCategories: response.data.item_categories,
+        pagination: response.data.pagination,
+      }),
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          item_categories: [],
+          pagination: {}
+        },
+      },
+      ...props,
+    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      itemsCategories: [],
-      pagination: {},
-    }),
-  };
 }

 /**
@@ -91,15 +100,14 @@ export function useItemsCategories(query, props) {
 export function useItemCategory(id, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['ITEMS_CATEGORY', id],
+  return useQuery(
+    [t.ITEM_CATEGORY, id],
    () =>
      apiRequest.get(`item_categories/${id}`).then((res) => res.data.category),
-    props,
+    {
+      initialDataUpdatedAt: 0,
+      initialData: {},
+      ...props,
+    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {}),
-  };
 }
--- a/client/src/hooks/query/manualJournals.js
+++ b/client/src/hooks/query/manualJournals.js
@@ -2,6 +2,27 @@ import { defaultTo } from 'lodash';
 import { useMutation, useQuery, useQueryClient } from 'react-query';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';
+
+const commonInvalidateQueries = (client) => {
+  // Invalidate manual journals.
+  client.invalidateQueries(t.MANUAL_JOURNALS);
+
+  // Invalidate customers.
+  client.invalidateQueries(t.CUSTOMERS);
+  client.invalidateQueries(t.CUSTOMER);
+
+  // Invalidate vendors.
+  client.invalidateQueries(t.VENDORS);
+  client.invalidateQueries(t.VENDOR);
+
+  // Invalidate accounts.
+  client.invalidateQueries(t.ACCOUNTS);
+  client.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  client.invalidateQueries(t.FINANCIAL_REPORT);
+};

 /**
 * Creates a new manual journal.
@@ -14,7 +35,8 @@ export function useCreateJournal(props) {
    (values) => apiRequest.post('manual-journals', values),
    {
      onSuccess: () => {
-        queryClient.invalidateQueries('JOURNALS');
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -32,8 +54,11 @@ export function useEditJournal(props) {
    ([id, values]) => apiRequest.post(`manual-journals/${id}`, values),
    {
      onSuccess: (res, [id]) => {
-        queryClient.invalidateQueries('JOURNALS');
-        queryClient.invalidateQueries('JOURNAL', id);
+        // Invalidate specific manual journal.
+        queryClient.invalidateQueries(t.MANUAL_JOURNAL, id);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -51,8 +76,10 @@ export function useDeleteJournal(props) {
    (id) => apiRequest.delete(`manual-journals/${id}`),
    {
      onSuccess: (res, id) => {
-        queryClient.invalidateQueries('JOURNALS');
-        queryClient.invalidateQueries('JOURNAL', id);
+        // Invalidate specific manual journal.
+        queryClient.invalidateQueries(t.MANUAL_JOURNAL, id);
+
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -70,8 +97,10 @@ export function usePublishJournal(props) {
    (id) => apiRequest.post(`manual-journals/${id}/publish`),
    {
      onSuccess: (res, id) => {
-        queryClient.invalidateQueries('JOURNALS');
-        queryClient.invalidateQueries('JOURNAL', id);
+        // Invalidate specific manual journal.
+        queryClient.invalidateQueries(t.MANUAL_JOURNAL, id);
+
+        commonInvalidateQueries(queryClient);
      },
      ...props
    },
@@ -85,7 +114,7 @@ export function useJournals(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['JOURNALS', query],
+    [t.MANUAL_JOURNALS, query],
    () => apiRequest.get('manual-journals', { params: query }),
    {
      select: (response) => ({
@@ -114,7 +143,7 @@ export function useJournal(id, props) {
  const apiRequest = useApiRequest();

  return useQuery(
-    ['JOURNAL', id],
+    [t.MANUAL_JOURNAL, id],
    () => apiRequest.get(`manual-journals/${id}`),
    {
      select: (res) => res.data.manual_journal,
--- a/client/src/hooks/query/paymentMades.js
+++ b/client/src/hooks/query/paymentMades.js
@@ -2,6 +2,32 @@ import { defaultTo } from 'lodash';
 import { useMutation, useQuery, useQueryClient } from 'react-query';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';
+import t from './types';
+
+
+const commonInvalidateQueries = (client) => {
+  // Invalidate payment mades.
+  client.invalidateQueries(t.PAYMENT_MADES);
+        
+  // Invalidate payment made new entries.
+  client.invalidateQueries(t.PAYMENT_MADE_NEW_ENTRIES);
+  client.invalidateQueries(t.PAYMENT_MADE_EDIT_PAGE);
+
+  // Invalidate financial reports.
+  client.invalidateQueries(t.FINANCIAL_REPORT);
+
+  // Invalidate accounts.
+  client.invalidateQueries(t.ACCOUNTS);
+  client.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate bills.
+  client.invalidateQueries(t.BILLS);
+  client.invalidateQueries(t.BILL);
+
+  // Invalidate vendors.
+  client.invalidateQueries(t.VENDORS);
+  client.invalidateQueries(t.VENDOR);
+};

 /**
 * Retrieve payment mades list.
@@ -10,7 +36,7 @@ export function usePaymentMades(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['PAYMENT_MADES', query],
+    [t.PAYMENT_MADES, query],
    () => apiRequest.get('purchases/bill_payments', { params: query }),
    {
      select: (res) => ({
@@ -43,8 +69,8 @@ export function useCreatePaymentMade(props) {
    (values) => apiRequest.post('purchases/bill_payments', values),
    {
      onSuccess: (res, values) => {
-        client.invalidateQueries('PAYMENT_MADES');
-        client.invalidateQueries(['PAYMENT_MADE_NEW_PAGE_ENTRIES', values.vendor_id]);
+        // Common invalidation queries.
+        commonInvalidateQueries(client);
      },
      ...props,
    },
@@ -62,10 +88,11 @@ export function useEditPaymentMade(props) {
    ([id, values]) => apiRequest.post(`purchases/bill_payments/${id}`, values),
    {
      onSuccess: (res, [id, values]) => {
-        client.invalidateQueries('PAYMENT_MADES');
-        client.invalidateQueries(['PAYMENT_MADE', id]);
+        // Common invalidation queries.
+        commonInvalidateQueries(client);

-        client.invalidateQueries(['PAYMENT_MADE_NEW_PAGE_ENTRIES', values.vendor_id]);
+        // Invalidate specific payment made.
+        client.invalidateQueries([t.PAYMENT_MADE, id]);
      },
      ...props,
    },
@@ -83,9 +110,11 @@ export function useDeletePaymentMade(props) {
    (id) => apiRequest.delete(`purchases/bill_payments/${id}`),
    {
      onSuccess: (res, id) => {
-        client.invalidateQueries('PAYMENT_MADES');
-        client.invalidateQueries(['PAYMENT_MADE', id]);
-        
+        // Common invalidation queries.
+        commonInvalidateQueries(client);
+
+        // Invalidate specific payment made.
+        client.invalidateQueries([t.PAYMENT_MADE, id]);
      },
      ...props,
    },
@@ -99,7 +128,7 @@ export function usePaymentMadeEditPage(id, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['PAYMENT_MADE', id],
+    [t.PAYMENT_MADE_EDIT_PAGE, id],
    () => apiRequest.get(`purchases/bill_payments/${id}/edit-page`),
    {
      select: (res) => ({
@@ -124,7 +153,7 @@ export function usePaymentMadeNewPageEntries(vendorId, props) {
  const apiRequest = useApiRequest();

  return useQuery(
-    ['PAYMENT_MADE_NEW_PAGE_ENTRIES', vendorId],
+    [t.PAYMENT_MADE_NEW_ENTRIES, vendorId],
    () =>
      apiRequest.get(`purchases/bill_payments/new-page/entries`, {
        params: { vendor_id: vendorId },
@@ -135,7 +164,7 @@ export function usePaymentMadeNewPageEntries(vendorId, props) {
      initialData: {
        data: {
          entries: [],
-        }
+        },
      },
      ...props,
    },
--- a/client/src/hooks/query/paymentReceives.js
+++ b/client/src/hooks/query/paymentReceives.js
@@ -2,6 +2,29 @@ import { useMutation, useQuery, useQueryClient } from 'react-query';
 import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
 import { transformPagination, saveInvoke } from 'utils';
+import t from './types';
+
+// Common invalidate queries.
+const commonInvalidateQueries = (client) => {
+  // Invalidate payment receives.
+  client.invalidateQueries(t.PAYMENT_RECEIVES);
+  client.invalidateQueries(t.PAYMENT_RECEIVE_EDIT_PAGE);
+
+  // Invalidate invoices.
+  client.invalidateQueries(t.SALE_INVOICES);
+  client.invalidateQueries(t.SALE_INVOICE);
+
+  // Invalidate accounts.
+  client.invalidateQueries(t.ACCOUNTS);
+  client.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  client.invalidateQueries(t.FINANCIAL_REPORT);
+
+  // Invalidate customers.
+  client.invalidateQueries(t.CUSTOMERS);
+  client.invalidateQueries(t.CUSTOMER);
+};

 /**
 * Retrieve accounts list.
@@ -10,7 +33,7 @@ export function usePaymentReceives(query, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['PAYMENT_RECEIVES', query],
+    [t.PAYMENT_RECEIVES, query],
    () => apiRequest.get('sales/payment_receives', { params: query }),
    {
      select: (res) => ({
@@ -47,11 +70,11 @@ export function useCreatePaymentReceive(props) {
    (values) => apiRequest.post('sales/payment_receives', values),
    {
      onSuccess: (data, values) => {
-        client.invalidateQueries('PAYMENT_RECEIVES');
-        client.invalidateQueries('SALE_INVOICE_DUE');
-        client.invalidateQueries('SALE_INVOICES');
-        client.invalidateQueries('SALE_INVOICE');
-        client.invalidateQueries(['SETTINGS', 'PAYMENT_RECEIVES']);
+        // Invalidate specific payment receive.
+        commonInvalidateQueries(client);
+
+        // Invalidate payment receive settings.
+        client.invalidateQueries([t.SETTING, t.SETTING_PAYMENT_RECEIVES]);

        saveInvoke(props?.onSuccess, data);
      },
@@ -70,12 +93,12 @@ export function useEditPaymentReceive(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`sales/payment_receives/${id}`, values),
    {
-      onSuccess: (data) => {
-        client.invalidateQueries('PAYMENT_RECEIVES');
-        client.invalidateQueries('SALE_INVOICE_DUE');
-        client.invalidateQueries('SALE_INVOICES');
-        client.invalidateQueries('SALE_INVOICE');
-        client.invalidateQueries(['SETTINGS', 'PAYMENT_RECEIVES']);
+      onSuccess: (data, [id, values]) => {
+        // Invalidate specific payment receive.
+        client.invalidateQueries([t.PAYMENT_RECEIVE, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(client);

        saveInvoke(props?.onSuccess, data);
      },
@@ -94,11 +117,11 @@ export function useDeletePaymentReceive(props) {
  return useMutation(
    (id) => apiRequest.delete(`sales/payment_receives/${id}`),
    {
-      onSuccess: (data, [id]) => {
-        client.invalidateQueries('PAYMENT_RECEIVES');
-        client.invalidateQueries('SALE_INVOICE_DUE');
-        client.invalidateQueries('SALE_INVOICES');
-        client.invalidateQueries('SALE_INVOICE');
+      onSuccess: (data, id) => {
+        // Invalidate specific payment receive.
+        client.invalidateQueries([t.PAYMENT_RECEIVE, id]);
+
+        commonInvalidateQueries(client);

        saveInvoke(props?.onSuccess, data);
      },
@@ -115,7 +138,7 @@ export function usePaymentReceive(id, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['PAYMENT_RECEIVE', id],
+    [t.PAYMENT_RECEIVE, id],
    () => apiRequest.get(`sales/payment_receives/${id}`),
    {
      select: (res) => ({
@@ -139,7 +162,7 @@ export function usePaymentReceiveEditPage(id, props) {
  const apiRequest = useApiRequest();

  const states = useQuery(
-    ['PAYMENT_RECEIVE_EDIT_PAGE', id],
+    [t.PAYMENT_RECEIVE_EDIT_PAGE, id],
    () => apiRequest.get(`sales/payment_receives/${id}/edit-page`),
    {
      select: (res) => ({
--- a/client/src/hooks/query/receipts.js
+++ b/client/src/hooks/query/receipts.js
@@ -2,6 +2,26 @@ import { useQueryClient, useQuery, useMutation } from 'react-query';
 import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
 import { transformPagination } from 'utils';
+import t from './types';
+
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate receipts.
+  queryClient.invalidateQueries(t.SALE_RECEIPTS);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ITEMS);
+  queryClient.invalidateQueries(t.ITEM);
+
+  // Invalidate accounts.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+
+  // Invalidate the settings.
+  queryClient.invalidateQueries([t.SETTING, t.SETTING_RECEIPTS]);
+};

 /**
 * Creates a new sale invoice.
@@ -12,8 +32,8 @@ export function useCreateReceipt(props) {

  return useMutation((values) => apiRequest.post('sales/receipts', values), {
    onSuccess: () => {
-      queryClient.invalidateQueries('SALE_RECEIPTS');
-      queryClient.invalidateQueries(['SETTINGS', 'RECEIPTS']);
+      // Invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -29,9 +49,12 @@ export function useEditReceipt(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`sales/receipts/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('SALE_RECEIPTS');
-        queryClient.invalidateQueries(['SETTINGS', 'RECEIPTS']);
+      onSuccess: (res, [id, values]) => {
+        // Invalidate specific receipt.
+        queryClient.invalidateQueries([t.SALE_RECEIPT, id]);
+
+        // Invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
      ...props,
    },
@@ -46,8 +69,12 @@ export function useDeleteReceipt(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`sales/receipts/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('SALE_RECEIPTS');
+    onSuccess: (res, id) => {
+      // Invalidate specific receipt.
+      queryClient.invalidateQueries([t.SALE_RECEIPT, id]);
+
+      // Invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -61,8 +88,11 @@ export function useCloseReceipt(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.post(`sales/receipts/${id}/close`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('SALE_RECEIPTS');
+    onSuccess: (res, id) => {
+      queryClient.invalidateQueries([t.SALE_RECEIPT, id]);
+      
+      // Invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
--- a/client/src/hooks/query/settings.js
+++ b/client/src/hooks/query/settings.js
@@ -13,7 +13,7 @@ export function useSaveSettings(props) {

  return useMutation((settings) => apiRequest.post('settings', settings), {
    onSuccess: () => {
-      queryClient.invalidateQueries('SETTINGS');
+      queryClient.invalidateQueries(t.SETTING);
    },
    ...props,
  });
@@ -51,7 +51,7 @@ function useSettingsQuery(key, query, props) {
 * Retrieve the all settings of the organization.
 */
 export function useSettings() {
-  return useSettingsQuery(['SETTINGS', 'ALL'], {});
+  return useSettingsQuery([t.SETTING, 'ALL'], {});
 }

 /**
@@ -59,7 +59,7 @@ export function useSettings() {
 */
 export function useSettingsInvoices(props) {
  return useSettingsQuery(
-    ['SETTINGS', 'INVOICES'],
+    [t.SETTING, t.SETTING_INVOICES],
    { group: 'sale_invoices' },
    props,
  );
@@ -70,7 +70,7 @@ export function useSettingsInvoices(props) {
 */
 export function useSettingsEstimates(props) {
  return useSettingsQuery(
-    ['SETTINGS', 'ESTIMATES'],
+    [t.SETTING, t.SETTING_ESTIMATES],
    { group: 'sale_estimates' },
    props,
  );
@@ -81,7 +81,7 @@ export function useSettingsEstimates(props) {
 */
 export function useSettingsPaymentReceives(props) {
  return useSettingsQuery(
-    ['SETTINGS', 'PAYMENT_RECEIVES'],
+    [t.SETTING, t.SETTING_PAYMENT_RECEIVES],
    { group: 'payment_receives' },
    props,
  );
@@ -93,7 +93,7 @@ export function useSettingsPaymentReceives(props) {
 */
 export function useSettingsReceipts(props) {
  return useSettingsQuery(
-    ['SETTINGS', 'RECEIPTS'],
+    [t.SETTING, t.SETTING_RECEIPTS],
    { group: 'sale_receipts' },
    props,
  );
@@ -105,7 +105,7 @@ export function useSettingsReceipts(props) {
 */
 export function useSettingsManualJournals(props) {
  return useSettingsQuery(
-    ['SETTINGS', 'MANUAL_JOURNALS'],
+    [t.SETTING, t.SETTING_MANUAL_JOURNALS],
    { group: 'sale_receipts' },
    props,
  );
--- a/client/src/hooks/query/types.js
+++ b/client/src/hooks/query/types.js
@@ -0,0 +1,108 @@
+const ACCOUNTS = {
+  ACCOUNT: 'ACCOUNT',
+  ACCOUNTS: 'ACCOUNTS',
+  ACCOUNTS_TYPES: 'ACCOUNTS_TYPES'
+};
+
+const FINANCIAL_REPORTS = {
+  FINANCIAL_REPORT: 'FINANCIAL-REPORT',
+  BALANCE_SHEET: 'BALANCE-SHEET',
+  TRIAL_BALANCE_SHEET: 'TRIAL-BALANCE-SHEET',
+  PROFIT_LOSS_SHEET: 'PROFIT-LOSS-SHEET',
+  GENERAL_LEDGER: 'GENERAL-LEDGER',
+  JOURNAL: 'JOURNAL',
+  AR_AGING_SUMMARY: 'AR-AGING-SUMMARY',
+  AP_AGING_SUMMARY: 'AP-AGING-SUMMARY',
+};
+
+const BILLS = {
+  BILLS: 'BILLS',
+  BILL: 'BILL',
+  BILLS_DUE: 'BILLS_DUE'
+};
+
+const VENDORS = {
+  VENDORS: 'VENDORS',
+  VENDOR: 'VENDOR',
+};
+
+const CUSTOMERS = {
+  CUSTOMERS: 'CUSTOMERS',
+  CUSTOMER: 'CUSTOMER',
+};
+
+const ITEMS = {
+  ITEMS: 'ITEMS',
+  ITEM: 'ITEM',
+  ITEMS_CATEGORIES: 'ITEMS_CATEGORIES',
+};
+
+const SALE_ESTIMATES = {
+  SALE_ESTIMATES: 'SALE_ESTIMATES',
+  SALE_ESTIMATE: 'SALE_ESTIMATE',
+};
+
+const SALE_RECEIPTS = {
+  SALE_RECEIPTS: 'SALE_RECEIPTS',
+  SALE_RECEIPT: 'SALE_RECEIPT',
+}
+
+const INVENTORY_ADJUSTMENTS = {
+  INVENTORY_ADJUSTMENTS: 'INVENTORY_ADJUSTMENTS',
+};
+
+const CURRENCIES = {
+  CURRENCIES: 'CURRENCIES',
+};
+
+const PAYMENT_MADES = {
+  PAYMENT_MADES: 'PAYMENT_MADES',
+  PAYMENT_MADE: 'PAYMENT_MADE',
+  PAYMENT_MADE_NEW_ENTRIES: 'PAYMENT_MADE_NEW_ENTRIES',
+  PAYMENT_MADE_EDIT_PAGE: 'PAYMENT_MADE_EDIT_PAGE',
+};
+
+const PAYMENT_RECEIVES = {
+  PAYMENT_RECEIVES: 'PAYMENT_RECEIVES',
+  PAYMENT_RECEIVE: 'PAYMENT_RECEIVE',
+  PAYMENT_RECEIVE_NEW_ENTRIES: 'PAYMENT_RECEIVE_NEW_ENTRIES',
+  PAYMENT_RECEIVE_EDIT_PAGE: 'PAYMENT_RECEIVE_EDIT_PAGE',
+};
+
+const SALE_INVOICES = {
+  SALE_INVOICES: 'SALE_INVOICES',
+  SALE_INVOICE: 'SALE_INVOICE',
+  SALE_INVOICES_DUE: 'SALE_INVOICES_DUE',
+};
+
+const USERS = {
+  USERS: 'USERS',
+  USER: 'USER'
+};
+
+const SETTING = {
+  SETTING: 'SETTING',
+  SETTING_INVOICES: 'SETTING_INVOICES',
+  SETTING_ESTIMATES: 'SETTING_ESTIMATES',
+  SETTING_RECEIPTS: 'SETTING_RECEIPTS',
+  SETTING_PAYMENT_RECEIVES: 'SETTING_PAYMENT_RECEIVES',
+  SETTING_MANUAL_JOURNALS: 'SETTING_MANUAL_JOURNALS',
+};
+
+export default {
+  ...ACCOUNTS,
+  ...BILLS,
+  ...VENDORS,
+  ...CUSTOMERS,
+  ...FINANCIAL_REPORTS,
+  ...ITEMS,
+  ...SALE_ESTIMATES,
+  ...INVENTORY_ADJUSTMENTS,
+  ...CURRENCIES,
+  ...SALE_RECEIPTS,
+  ...PAYMENT_MADES,
+  ...PAYMENT_RECEIVES,
+  ...SALE_INVOICES,
+  ...USERS,
+  ...SETTING
+}
--- a/client/src/hooks/query/users.js
+++ b/client/src/hooks/query/users.js
@@ -1,7 +1,12 @@
 import { useMutation, useQueryClient, useQuery } from 'react-query';
 import { defaultTo } from 'lodash';
 import useApiRequest from '../useRequest';
+import t from './types';

+// Common invalidate queries.
+const commonInvalidateQueries = (queryClient) => {
+  queryClient.invalidateQueries(t.USERS);
+};

 /**
 * Create a new invite user.
@@ -12,7 +17,8 @@ export function useCreateInviteUser(props) {

  return useMutation((values) => apiRequest.post('invite/send', values), {
    onSuccess: () => {
-      queryClient.invalidateQueries('USERS');
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -27,8 +33,11 @@ export function useEditUser(props) {
  const apiRequest = useApiRequest();

  return useMutation(([id, values]) => apiRequest.post(`users/${id}`, values), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('USERS');
+    onSuccess: (res, [id, values]) => {
+      queryClient.invalidateQueries([t.USER, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -42,9 +51,11 @@ export function useDeleteUser(props) {
  const apiRequest = useApiRequest();

  return useMutation((id) => apiRequest.delete(`users/${id}`), {
-    onSuccess: () => {
-      queryClient.invalidateQueries('USERS');
-      queryClient.invalidateQueries('USER');
+    onSuccess: (res, id) => {
+      queryClient.invalidateQueries([t.USER, id]);
+      
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
    },
    ...props,
  });
@@ -57,7 +68,7 @@ export function useUsers(props) {
  const apiRequest = useApiRequest();

  const result = useQuery(
-    ['USERS'],
+    [t.USERS],
    () => apiRequest.get(`USERS`).then((response) => response.data.users),
    props,
  );
--- a/client/src/hooks/query/vendors.js
+++ b/client/src/hooks/query/vendors.js
@@ -1,16 +1,29 @@
 import { useMutation, useQuery, useQueryClient } from 'react-query';
-import { defaultTo } from 'lodash';
+import t from './types';
 import { transformPagination } from 'utils';
 import useApiRequest from '../useRequest';

+// Common invalidate queries.
+const commonInvalidateQueries = (queryClient) => {
+  // Invalidate vendors list.
+  queryClient.invalidateQueries(t.VENDORS);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.ACCOUNTS);
+  queryClient.invalidateQueries(t.ACCOUNT);
+
+  // Invalidate financial reports.
+  queryClient.invalidateQueries(t.FINANCIAL_REPORT);
+};
+
 /**
 * Retrieve vendors list.
 */
 export function useVendors(query, props) {
  const apiRequest = useApiRequest();

-  const states = useQuery(
-    ['VENDORS', query],
+  return useQuery(
+    [t.VENDORS, query],
    () => apiRequest.get(`vendors`, { params: query }),
    {
      select: (res) => ({
@@ -18,18 +31,17 @@ export function useVendors(query, props) {
        pagination: transformPagination(res.data.pagination),
        filterMeta: res.data.filter_meta,
      }),
+      initialDataUpdatedAt: 0,
+      initialData: {
+        data: {
+          vendors: [],
+          pagination: {},
+          filter_meta: {},
+        },
+      },
      ...props,
    },
  );
-
-  return {
-    ...states,
-    data: defaultTo(states.data, {
-      vendors: [],
-      pagination: {},
-      filterMeta: {}
-    }),
-  };
 }

 /**
@@ -42,11 +54,14 @@ export function useEditVendor(props) {
  return useMutation(
    ([id, values]) => apiRequest.post(`vendors/${id}`, values),
    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('VENDORS');
-        queryClient.invalidateQueries('VENDOR');
+      onSuccess: (res, [id, values]) => {
+        // Invalidate specific vendor.
+        queryClient.invalidateQueries([t.VENDOR, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
      },
-      ...props
+      ...props,
    },
  );
 }
@@ -58,15 +73,16 @@ export function useDeleteVendor(props) {
  const queryClient = useQueryClient();
  const apiRequest = useApiRequest();

-  return useMutation(
-    (id) => apiRequest.delete(`vendors/${id}`),
-    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('VENDORS');
-        queryClient.invalidateQueries('VENDOR');
-      },
-      ...props
-    });
+  return useMutation((id) => apiRequest.delete(`vendors/${id}`), {
+    onSuccess: (res, id) => {
+      // Invalidate specific vendor.
+      queryClient.invalidateQueries([t.VENDOR, id]);
+
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+    },
+    ...props,
+  });
 }

 /**
@@ -76,15 +92,13 @@ export function useCreateVendor(props) {
  const queryClient = useQueryClient();
  const apiRequest = useApiRequest();

-  return useMutation(
-    (values) => apiRequest.post('vendors', values),
-    {
-      onSuccess: () => {
-        queryClient.invalidateQueries('VENDORS');
-      },
-      ...props
-    }
-  );
+  return useMutation((values) => apiRequest.post('vendors', values), {
+    onSuccess: () => {
+      // Common invalidate queries.
+      commonInvalidateQueries(queryClient);
+    },
+    ...props,
+  });
 }

 /**
@@ -93,12 +107,12 @@ export function useCreateVendor(props) {
 export function useVendor(id, props) {
  const apiRequest = useApiRequest();

-  return useQuery(
-    ['VENDOR', id],
-    () => apiRequest.get(`vendors/${id}`),
-    {
-      select: (res) => res.data.vendor,
-      ...props
+  return useQuery([t.VENDOR, id], () => apiRequest.get(`vendors/${id}`), {
+    select: (res) => res.data.vendor,
+    initialDataUpdatedAt: 0,
+    initialData: {
+      data: { vendor: {} },
    },
-  );
+    ...props,
+  });
 }
--- a/client/src/style/containers/Dashboard/Sidebar.scss
+++ b/client/src/style/containers/Dashboard/Sidebar.scss
@@ -59,7 +59,7 @@
        font-size: 15px;

        &:not([class*="bp3-intent-"]):not(.bp3-minimal) {
-          color: rgba(255, 255, 255, 0.8);
+          color: rgba(255, 255, 255, 0.85);
        }
        &:hover,
        &:focus,