fix: dashboard sidebar expanding.

This commit is contained in:
a.bouhuolia
2021-04-19 18:34:02 +02:00
parent c6aca4ecfa
commit f29c1b6cec
27 changed files with 178 additions and 230 deletions

View File

@@ -72,20 +72,6 @@ export function ActionsMenu({
);
}
/**
* Actions cell.
*/
export function ActionsCell(props) {
return (
<Popover
position={Position.RIGHT_BOTTOM}
content={<ActionsMenu {...props} />}
>
<Button icon={<Icon icon="more-h-16" iconSize={16} />} />
</Popover>
);
}
/**
* Normal cell.
*/

View File

@@ -1,8 +1,8 @@
import React from 'react';
import { Intent } from '@blueprintjs/core';
import { Intent, Tag } from '@blueprintjs/core';
import { If, AppToaster } from 'components';
import { formatMessage } from 'services/intl';
import { NormalCell, BalanceCell, ActionsCell } from './components';
import { NormalCell, BalanceCell } from './components';
/**
* Account name accessor.
@@ -40,6 +40,13 @@ export const handleDeleteErrors = (errors) => {
}
};
export const AccountCodeAccessor = (row) => (
<Tag minimal={true} round={true} intent={Intent.NONE}>
{ row.code }
</Tag>
);
/**
* Accounts table columns.
*/
@@ -56,7 +63,7 @@ export const useAccountsTableColumns = () => {
{
id: 'code',
Header: formatMessage({ id: 'code' }),
accessor: 'code',
accessor: AccountCodeAccessor,
className: 'code',
width: 80,
},
@@ -88,14 +95,6 @@ export const useAccountsTableColumns = () => {
Cell: BalanceCell,
width: 150,
},
{
id: 'actions',
Header: '',
Cell: ActionsCell,
className: 'actions',
width: 50,
skeletonWidthMin: 100,
},
],
[],
)

View File

@@ -49,20 +49,6 @@ export function ActionsMenu({
);
}
/**
* Actions cell.
*/
export function ActionsCell(props) {
return (
<Popover
content={<ActionsMenu {...props} />}
position={Position.RIGHT_BOTTOM}
>
<Button icon={<Icon icon="more-h-16" iconSize={16} />} />
</Popover>
);
}
/**
* Avatar cell.
*/
@@ -129,14 +115,6 @@ export function useCustomersTableColumns() {
className: 'receivable_balance',
width: 100,
},
{
id: 'actions',
Cell: ActionsCell,
className: 'actions',
width: 70,
disableResizing: true,
disableSortBy: true,
},
],
[formatMessage],
);

View File

@@ -1,5 +1,8 @@
import { connect } from 'react-redux';
import t from 'store/types';
import {
toggleExpendSidebar,
} from 'store/dashboard/dashboard.actions';
const mapActionsToProps = (dispatch) => ({
changePageTitle: (pageTitle) =>
@@ -14,10 +17,10 @@ const mapActionsToProps = (dispatch) => ({
pageSubtitle,
}),
changePageHint: (pageHint) =>
changePageHint: (pageHint) =>
dispatch({
type: t.CHANGE_DASHBOARD_PAGE_HINT,
payload: { pageHint }
payload: { pageHint },
}),
setTopbarEditView: (id) =>
@@ -36,32 +39,22 @@ const mapActionsToProps = (dispatch) => ({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
}),
toggleSidebarExpend: () =>
/**
* Toggles the sidebar expend.
*/
toggleSidebarExpand: (toggle) => dispatch(toggleExpendSidebar(toggle)),
changePreferencesPageTitle: (pageTitle) =>
dispatch({
type: t.SIDEBAR_EXPEND_TOGGLE,
type: 'CHANGE_PREFERENCES_PAGE_TITLE',
pageTitle,
}),
setDashboardBackLink: (backLink) =>
dispatch({
type: t.SET_DASHBOARD_BACK_LINK,
payload: { backLink },
}),
changePreferencesPageTitle: (pageTitle) => dispatch({
type: 'CHANGE_PREFERENCES_PAGE_TITLE',
pageTitle,
}),
setSidebarShrink: () => dispatch({
type: t.SIDEBAR_SHRINK,
}),
setSidebarExpand: () => dispatch({
type: t.SIDEBAR_SHRINK,
}),
resetSidebarPreviousExpand: () => dispatch({
type: t.RESET_SIDEBAR_PREVIOUS_EXPAND,
}),
recordSidebarPreviousExpand: () => dispatch({
type: t.RECORD_SIDEBAR_PREVIOUS_EXPAND,
}),
setDashboardBackLink: (backLink) => dispatch({
type: t.SET_DASHBOARD_BACK_LINK,
payload: { backLink }
})
});
export default connect(null, mapActionsToProps);

View File

@@ -1,13 +1,9 @@
import React, { useCallback } from 'react';
import classNames from 'classnames';
import { useHistory } from 'react-router-dom';
import { compose } from 'utils';
import { useExpensesListContext } from './ExpensesListProvider';
import { Choose } from 'components';
import { CLASSES } from 'common/classes';
import DataTable from 'components/DataTable';
import ExpensesEmptyStatus from './ExpensesEmptyStatus';
import TableSkeletonRows from 'components/Datatable/TableSkeletonRows';

View File

@@ -175,14 +175,6 @@ export function useExpensesTableColumns() {
className: 'description',
disableSortBy: true,
},
{
id: 'actions',
Header: '',
Cell: ActionsCell,
className: 'actions',
width: 50,
disableResizing: true,
},
],
[],
);

View File

@@ -1,5 +1,7 @@
import React from 'react';
import 'style/pages/InventoryAdjustments/List.scss';
import { DashboardContentTable, DashboardPageContent } from 'components';
import InventoryAdjustmentsAlerts from './InventoryAdjustmentsAlerts';

View File

@@ -179,14 +179,6 @@ export const useInventoryAdjustmentsColumns = () => {
width: 125,
className: 'created_at',
},
{
id: 'actions',
Header: '',
Cell: ActionsCell,
className: 'actions',
width: 50,
disableResizing: true,
},
],
[formatMessage],
);

View File

@@ -1,11 +1,9 @@
import React, { useEffect, createContext } from 'react';
import { useIntl } from 'react-intl';
import React, { createContext } from 'react';
import { transformTableQueryToParams, isTableEmptyStatus } from 'utils';
import DashboardInsider from 'components/Dashboard/DashboardInsider';
import { useResourceViews, useResourceFields, useItems } from 'hooks/query';
import { useDashboardPageTitle } from 'hooks/state';
const ItemsContext = createContext();
@@ -40,17 +38,6 @@ function ItemsListProvider({
data: items, pagination, filterMeta,
}) && !isItemsFetching;
// Format message intl.
const { formatMessage } = useIntl();
// Change page title dispatcher.
const changePageTitle = useDashboardPageTitle();
// Changeas the page title once the page mount.
useEffect(() => {
changePageTitle(formatMessage({ id: 'items_list' }));
}, [changePageTitle, formatMessage]);
const state = {
itemsViews,
itemsFields,

View File

@@ -181,7 +181,6 @@ export const useItemsTableColumns = () => {
{
id: 'sell_price',
Header: formatMessage({ id: 'sell_price' }),
// Cell: SellPriceCell,
accessor: 'sell_price_formatted',
className: 'sell-price',
width: 150,
@@ -189,7 +188,6 @@ export const useItemsTableColumns = () => {
{
id: 'cost_price',
Header: formatMessage({ id: 'cost_price' }),
// Cell: CostPriceCell,
accessor: 'cost_price_formatted',
className: 'cost-price',
width: 150,
@@ -201,12 +199,6 @@ export const useItemsTableColumns = () => {
Cell: QuantityOnHandCell,
width: 140,
},
{
id: 'actions',
Cell: ItemsActionsTableCell,
width: 60,
skeletonWidthMin: 100,
},
],
[formatMessage],
);

View File

@@ -1,4 +1,6 @@
import React from 'react';
import 'style/pages/ItemsCategories/List.scss';
import { DashboardContentTable, DashboardPageContent } from 'components';
import ItemsCategoriesAlerts from './ItemsCategoriesAlerts';
@@ -11,7 +13,7 @@ import ItemCategoriesTable from './ItemCategoriesTable';
*/
export default function ItemCategoryList() {
return (
<ItemsCategoriesProvider query={{}}>
<ItemsCategoriesProvider>
<ItemsCategoryActionsBar />
<DashboardPageContent>

View File

@@ -25,7 +25,7 @@ function ItemsCategoriesProvider({ query, ...props }) {
};
return (
<DashboardInsider name={'item-category-list'}>
<DashboardInsider name={'items-categories-list'}>
<ItemsCategoriesContext.Provider value={state} {...props} />
</DashboardInsider>
);

View File

@@ -81,14 +81,7 @@ export function useItemsCategoriesTableColumns() {
accessor: 'description',
className: 'description',
width: 220,
},
{
id: 'actions',
Header: '',
Cell: TableActionsCell,
className: 'actions',
width: 50,
},
}
],
[formatMessage],
);