{renderEmptyRowsFallback?.({ table }) ?? (
{globalFilter || columnFilters.length
@@ -155,12 +143,10 @@ const DataTable_TableBody = ({
row,
rowVirtualizer,
staticRowIndex,
- virtualRow: rowVirtualizer
- ? (rowOrVirtualRow)
- : undefined,
+ virtualRow: rowVirtualizer ? rowOrVirtualRow : undefined,
};
const key = `${row.id}-${row.index}`;
- return memoMode === 'rows' ? (
+ return memoMode === "rows" ? (
) : (
@@ -169,39 +155,37 @@ const DataTable_TableBody = ({
))}
- {!rowPinningDisplayMode?.includes('sticky') &&
- getIsSomeRowsPinned('bottom') && (
- ({
- bottom: tableFooterHeight - 1,
- display: layoutMode?.startsWith('grid') ? 'grid' : undefined,
- position: 'sticky',
- zIndex: 1,
- ...(parseFromValuesOrFunc(tableBodyProps?.sx, theme)),
- })}
- >
- {getBottomRows().map((row, staticRowIndex) => {
- const props = {
- ...commonRowProps,
- row,
- staticRowIndex,
- };
- return memoMode === 'rows' ? (
-
- ) : (
-
- );
- })}
-
- )}
+ {!rowPinningDisplayMode?.includes("sticky") && getIsSomeRowsPinned("bottom") && (
+ ({
+ bottom: tableFooterHeight - 1,
+ display: layoutMode?.startsWith("grid") ? "grid" : undefined,
+ position: "sticky",
+ zIndex: 1,
+ ...parseFromValuesOrFunc(tableBodyProps?.sx, theme),
+ })}
+ >
+ {getBottomRows().map((row, staticRowIndex) => {
+ const props = {
+ ...commonRowProps,
+ row,
+ staticRowIndex,
+ };
+ return memoMode === "rows" ? (
+
+ ) : (
+
+ );
+ })}
+
+ )}
);
-
-}
-export default DataTable_TableBody
+};
+export default DataTable_TableBody;
export const Memo_DataTable_TableBody = memo(
DataTable_TableBody,
- (prev, next) => prev.table.options.data === next.table.options.data,
-);
\ No newline at end of file
+ (prev, next) => prev.table.options.data === next.table.options.data
+);
diff --git a/src/core/components/DataTable/body/TableBodyCell.js b/src/core/components/DataTable/body/TableBodyCell.js
index 9ef022d..4c1804b 100644
--- a/src/core/components/DataTable/body/TableBodyCell.js
+++ b/src/core/components/DataTable/body/TableBodyCell.js
@@ -7,15 +7,7 @@ const { useState, useEffect, useMemo, memo } = require("react");
const { default: DataTable_CopyButton } = require("../buttons/CopyButton");
const { default: DataTable_TableBodyCellValue } = require("./TableBodyCellValue");
-const DataTable_TableBodyCell = ({
- cell,
- numRows,
- rowRef,
- staticColumnIndex,
- staticRowIndex,
- table,
- ...rest
-}) => {
+const DataTable_TableBodyCell = ({ cell, numRows, rowRef, staticColumnIndex, staticRowIndex, table, ...rest }) => {
const theme = useTheme();
const {
getState,
@@ -73,9 +65,7 @@ const DataTable_TableBodyCell = ({
if ((!isLoading && !showSkeletons) || skeletonWidth !== 100) return;
const size = column.getSize();
setSkeletonWidth(
- columnDefType === 'display'
- ? size / 2
- : Math.round(Math.random() * (size - size / 3) + size / 3),
+ columnDefType === "display" ? size / 2 : Math.round(Math.random() * (size - size / 3) + size / 3)
);
}, [isLoading, showSkeletons]);
@@ -88,77 +78,55 @@ const DataTable_TableBodyCell = ({
const isLastColumn = column.getIsLastColumn();
const isLastRow = numRows && staticRowIndex === numRows - 1;
const isResizingColumn = columnSizingInfo.isResizingColumn === column.id;
- const showResizeBorder =
- isResizingColumn && columnResizeMode === 'onChange';
+ const showResizeBorder = isResizingColumn && columnResizeMode === "onChange";
const borderStyle = showResizeBorder
? `2px solid ${draggingBorderColor} !important`
: isDraggingColumn || isDraggingRow
- ? `1px dashed ${theme.palette.grey[500]} !important`
- : isHoveredColumn || isHoveredRow || isResizingColumn
- ? `2px dashed ${draggingBorderColor} !important`
- : undefined;
+ ? `1px dashed ${theme.palette.grey[500]} !important`
+ : isHoveredColumn || isHoveredRow || isResizingColumn
+ ? `2px dashed ${draggingBorderColor} !important`
+ : undefined;
if (showResizeBorder) {
- return columnResizeDirection === 'ltr'
- ? { borderRight: borderStyle }
- : { borderLeft: borderStyle };
+ return columnResizeDirection === "ltr" ? { borderRight: borderStyle } : { borderLeft: borderStyle };
}
return borderStyle
? {
- borderBottom:
- isDraggingRow || isHoveredRow || (isLastRow && !isResizingColumn)
- ? borderStyle
- : undefined,
- borderLeft:
- isDraggingColumn ||
- isHoveredColumn ||
- ((isDraggingRow || isHoveredRow) && isFirstColumn)
- ? borderStyle
- : undefined,
- borderRight:
- isDraggingColumn ||
- isHoveredColumn ||
- ((isDraggingRow || isHoveredRow) && isLastColumn)
- ? borderStyle
- : undefined,
- borderTop: isDraggingRow || isHoveredRow ? borderStyle : undefined,
- }
+ borderBottom:
+ isDraggingRow || isHoveredRow || (isLastRow && !isResizingColumn) ? borderStyle : undefined,
+ borderLeft:
+ isDraggingColumn || isHoveredColumn || ((isDraggingRow || isHoveredRow) && isFirstColumn)
+ ? borderStyle
+ : undefined,
+ borderRight:
+ isDraggingColumn || isHoveredColumn || ((isDraggingRow || isHoveredRow) && isLastColumn)
+ ? borderStyle
+ : undefined,
+ borderTop: isDraggingRow || isHoveredRow ? borderStyle : undefined,
+ }
: undefined;
- }, [
- columnSizingInfo.isResizingColumn,
- draggingColumn,
- draggingRow,
- hoveredColumn,
- hoveredRow,
- staticRowIndex,
- ]);
+ }, [columnSizingInfo.isResizingColumn, draggingColumn, draggingRow, hoveredColumn, hoveredRow, staticRowIndex]);
- const isColumnPinned =
- enableColumnPinning &&
- columnDef.columnDefType !== 'group' &&
- column.getIsPinned();
+ const isColumnPinned = enableColumnPinning && columnDef.columnDefType !== "group" && column.getIsPinned();
const isEditable = isCellEditable({ cell, table });
const isEditing =
isEditable &&
- !['custom', 'modal'].includes(editDisplayMode) &&
- (editDisplayMode === 'table' ||
- editingRow?.id === row.id ||
- editingCell?.id === cell.id) &&
+ !["custom", "modal"].includes(editDisplayMode) &&
+ (editDisplayMode === "table" || editingRow?.id === row.id || editingCell?.id === cell.id) &&
!row.getIsGrouped();
- const isCreating =
- isEditable && createDisplayMode === 'row' && creatingRow?.id === row.id;
+ const isCreating = isEditable && createDisplayMode === "row" && creatingRow?.id === row.id;
const showClickToCopyButton =
(parseFromValuesOrFunc(enableClickToCopy, cell) === true ||
parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) === true) &&
- !['context-menu', false].includes(
+ !["context-menu", false].includes(
// @ts-ignore
- parseFromValuesOrFunc(columnDef.enableClickToCopy, cell),
+ parseFromValuesOrFunc(columnDef.enableClickToCopy, cell)
);
const isRightClickable = parseFromValuesOrFunc(enableCellActions, cell);
@@ -175,13 +143,11 @@ const DataTable_TableBodyCell = ({
const handleDragEnter = (e) => {
tableCellProps?.onDragEnter?.(e);
- if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
+ if (enableGrouping && hoveredColumn?.id === "drop-zone") {
setHoveredColumn(null);
}
if (enableColumnOrdering && draggingColumn) {
- setHoveredColumn(
- columnDef.enableColumnOrdering !== false ? column : null,
- );
+ setHoveredColumn(columnDef.enableColumnOrdering !== false ? column : null);
}
};
@@ -210,43 +176,39 @@ const DataTable_TableBodyCell = ({
onDragEnter={handleDragEnter}
onDragOver={handleDragOver}
sx={(theme) => ({
- '&:hover': {
+ "&:hover": {
outline:
actionCell?.id === cell.id ||
- (editDisplayMode === 'cell' && isEditable) ||
- (editDisplayMode === 'table' && (isCreating || isEditing))
+ (editDisplayMode === "cell" && isEditable) ||
+ (editDisplayMode === "table" && (isCreating || isEditing))
? `1px solid ${theme.palette.grey[500]}`
: undefined,
- textOverflow: 'clip',
+ textOverflow: "clip",
},
- alignItems: layoutMode?.startsWith('grid') ? 'center' : undefined,
+ alignItems: layoutMode?.startsWith("grid") ? "center" : undefined,
cursor: isRightClickable
- ? 'context-menu'
- : isEditable && editDisplayMode === 'cell'
- ? 'pointer'
- : 'inherit',
- outline:
- actionCell?.id === cell.id
- ? `1px solid ${theme.palette.grey[500]}`
- : undefined,
- outlineOffset: '-1px',
- overflow: 'hidden',
+ ? "context-menu"
+ : isEditable && editDisplayMode === "cell"
+ ? "pointer"
+ : "inherit",
+ outline: actionCell?.id === cell.id ? `1px solid ${theme.palette.grey[500]}` : undefined,
+ outlineOffset: "-1px",
+ overflow: "hidden",
p:
- density === 'compact'
- ? columnDefType === 'display'
- ? '0 0.5rem'
- : '0.5rem'
- : density === 'comfortable'
- ? columnDefType === 'display'
- ? '0.5rem 0.75rem'
- : '1rem'
- : columnDefType === 'display'
- ? '1rem 1.25rem'
- : '1.5rem',
+ density === "compact"
+ ? columnDefType === "display"
+ ? "0 0.5rem"
+ : "0.5rem"
+ : density === "comfortable"
+ ? columnDefType === "display"
+ ? "0.5rem 0.75rem"
+ : "1rem"
+ : columnDefType === "display"
+ ? "1rem 1.25rem"
+ : "1.5rem",
- textOverflow: columnDefType !== 'display' ? 'ellipsis' : undefined,
- whiteSpace:
- row.getIsPinned() || density === 'compact' ? 'nowrap' : 'normal',
+ textOverflow: columnDefType !== "display" ? "ellipsis" : undefined,
+ whiteSpace: row.getIsPinned() || density === "compact" ? "nowrap" : "normal",
...getCommonMRTCellStyles({
column,
table,
@@ -261,17 +223,10 @@ const DataTable_TableBodyCell = ({
{cell.getIsPlaceholder() ? (
columnDef.PlaceholderCell?.({ cell, column, row, table }) ?? null
) : showSkeletons !== false && (isLoading || showSkeletons) ? (
-
- ) : columnDefType === 'display' &&
- (['mrt-row-expand', 'mrt-row-numbers', 'mrt-row-select'].includes(
- column.id,
- ) ||
- !row.getIsGrouped()) ? (
+
+ ) : columnDefType === "display" &&
+ (["mrt-row-expand", "mrt-row-numbers", "mrt-row-select"].includes(column.id) ||
+ !row.getIsGrouped()) ? (
columnDef.Cell?.({
cell,
column,
@@ -289,18 +244,12 @@ const DataTable_TableBodyCell = ({
) : (
)}
- {cell.getIsGrouped() && !columnDef.GroupedCell && (
- <> ({row.subRows?.length})
- )}
+ {cell.getIsGrouped() && !columnDef.GroupedCell && <> ({row.subRows?.length})}
)}
);
-
-}
+};
export default DataTable_TableBodyCell;
-export const Memo_DataTable_TableBodyCell = memo(
- DataTable_TableBodyCell,
- (prev, next) => next.cell === prev.cell,
-);
\ No newline at end of file
+export const Memo_DataTable_TableBodyCell = memo(DataTable_TableBodyCell, (prev, next) => next.cell === prev.cell);
diff --git a/src/core/components/DataTable/body/TableBodyCellValue.js b/src/core/components/DataTable/body/TableBodyCellValue.js
index 6d4f05f..aea105f 100644
--- a/src/core/components/DataTable/body/TableBodyCellValue.js
+++ b/src/core/components/DataTable/body/TableBodyCellValue.js
@@ -2,111 +2,102 @@ import { Box } from "@mui/material";
const allowedTypes = ["string", "number"];
-const DataTable_TableBodyCellValue = ({
- cell,
- rowRef,
- staticColumnIndex,
- staticRowIndex,
- table,
-}) => {
- const {
- getState,
- options: {
- enableFilterMatchHighlighting,
- mrtTheme: { matchHighlightColor },
- },
- } = table;
- const { column, row } = cell;
- const { columnDef } = column;
- const { globalFilter, globalFilterFn } = getState();
- const filterValue = column.getFilterValue();
+const DataTable_TableBodyCellValue = ({ cell, rowRef, staticColumnIndex, staticRowIndex, table }) => {
+ const {
+ getState,
+ options: {
+ enableFilterMatchHighlighting,
+ mrtTheme: { matchHighlightColor },
+ },
+ } = table;
+ const { column, row } = cell;
+ const { columnDef } = column;
+ const { globalFilter, globalFilterFn } = getState();
+ const filterValue = column.getFilterValue();
- let renderedCellValue =
- cell.getIsAggregated() && columnDef.AggregatedCell
- ? columnDef.AggregatedCell({
- cell,
- column,
- row,
- table,
- })
- : row.getIsGrouped() && !cell.getIsGrouped()
- ? null
- : cell.getIsGrouped() && columnDef.GroupedCell
- ? columnDef.GroupedCell({
+ let renderedCellValue =
+ cell.getIsAggregated() && columnDef.AggregatedCell
+ ? columnDef.AggregatedCell({
+ cell,
+ column,
+ row,
+ table,
+ })
+ : row.getIsGrouped() && !cell.getIsGrouped()
+ ? null
+ : cell.getIsGrouped() && columnDef.GroupedCell
+ ? columnDef.GroupedCell({
+ cell,
+ column,
+ row,
+ table,
+ })
+ : undefined;
+
+ const isGroupedValue = renderedCellValue !== undefined;
+
+ if (!isGroupedValue) {
+ renderedCellValue = cell.renderValue();
+ }
+
+ if (
+ enableFilterMatchHighlighting &&
+ columnDef.enableFilterMatchHighlighting !== false &&
+ String(renderedCellValue) &&
+ allowedTypes.includes(typeof renderedCellValue) &&
+ ((filterValue &&
+ allowedTypes.includes(typeof filterValue) &&
+ ["autocomplete", "text"].includes(columnDef.filterVariant)) ||
+ (globalFilter && allowedTypes.includes(typeof globalFilter) && column.getCanGlobalFilter()))
+ ) {
+ const chunks = highlightWords?.({
+ matchExactly: (filterValue ? columnDef._filterFn : globalFilterFn) !== "fuzzy",
+ query: (filterValue ?? globalFilter ?? "").toString(),
+ text: renderedCellValue?.toString(),
+ });
+ if (chunks?.length > 1 || chunks?.[0]?.match) {
+ renderedCellValue = (
+
+ {chunks?.map(({ key, match, text }) => (
+
+ theme.palette.mode === "dark"
+ ? theme.palette.common.white
+ : theme.palette.common.black,
+ padding: "2px 1px",
+ }
+ : undefined
+ }
+ >
+ {text}
+
+ )) ?? renderedCellValue}
+
+ );
+ }
+ }
+
+ if (columnDef.Cell && !isGroupedValue) {
+ renderedCellValue = columnDef.Cell({
cell,
column,
+ renderedCellValue,
row,
+ rowRef,
+ staticColumnIndex,
+ staticRowIndex,
table,
- })
- : undefined;
-
- const isGroupedValue = renderedCellValue !== undefined;
-
- if (!isGroupedValue) {
- renderedCellValue = cell.renderValue();
- }
-
- if (
- enableFilterMatchHighlighting &&
- columnDef.enableFilterMatchHighlighting !== false &&
- String(renderedCellValue) &&
- allowedTypes.includes(typeof renderedCellValue) &&
- ((filterValue &&
- allowedTypes.includes(typeof filterValue) &&
- ["autocomplete", "text"].includes(columnDef.filterVariant)) ||
- (globalFilter &&
- allowedTypes.includes(typeof globalFilter) &&
- column.getCanGlobalFilter()))
- ) {
- const chunks = highlightWords?.({
- matchExactly:
- (filterValue ? columnDef._filterFn : globalFilterFn) !== "fuzzy",
- query: (filterValue ?? globalFilter ?? "").toString(),
- text: renderedCellValue?.toString(),
- });
- if (chunks?.length > 1 || chunks?.[0]?.match) {
- renderedCellValue = (
-
- {chunks?.map(({ key, match, text }) => (
-
- theme.palette.mode === "dark"
- ? theme.palette.common.white
- : theme.palette.common.black,
- padding: "2px 1px",
- }
- : undefined
- }
- >
- {text}
-
- )) ?? renderedCellValue}
-
- );
+ });
}
- }
- if (columnDef.Cell && !isGroupedValue) {
- renderedCellValue = columnDef.Cell({
- cell,
- column,
- renderedCellValue,
- row,
- rowRef,
- staticColumnIndex,
- staticRowIndex,
- table,
- });
- }
-
- return renderedCellValue;
+ return renderedCellValue;
};
export default DataTable_TableBodyCellValue;
diff --git a/src/core/components/DataTable/body/TableBodyRow.js b/src/core/components/DataTable/body/TableBodyRow.js
index e500eb0..a041d66 100644
--- a/src/core/components/DataTable/body/TableBodyRow.js
+++ b/src/core/components/DataTable/body/TableBodyRow.js
@@ -28,11 +28,7 @@ const DataTable_TableBodyRow = ({
enableStickyHeader,
layoutMode,
memoMode,
- mrtTheme: {
- baseBackgroundColor,
- pinnedRowBackgroundColor,
- selectedRowBackgroundColor,
- },
+ mrtTheme: { baseBackgroundColor, pinnedRowBackgroundColor, selectedRowBackgroundColor },
muiTableBodyRowProps,
renderDetailPanel,
rowPinningDisplayMode,
@@ -40,21 +36,12 @@ const DataTable_TableBodyRow = ({
refs: { tableFooterRef, tableHeadRef },
setHoveredRow,
} = table;
- const {
- density,
- draggingColumn,
- draggingRow,
- editingCell,
- editingRow,
- hoveredRow,
- isFullScreen,
- rowPinning,
- } = getState();
+ const { density, draggingColumn, draggingRow, editingCell, editingRow, hoveredRow, isFullScreen, rowPinning } =
+ getState();
const visibleCells = row.getVisibleCells();
- const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } =
- columnVirtualizer ?? {};
+ const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } = columnVirtualizer ?? {};
const isRowSelected = getIsRowSelected({ row, table });
const isRowPinned = enableRowPinning && row.getIsPinned();
@@ -71,30 +58,17 @@ const DataTable_TableBodyRow = ({
};
const [bottomPinnedIndex, topPinnedIndex] = useMemo(() => {
- if (
- !enableRowPinning ||
- !rowPinningDisplayMode?.includes('sticky') ||
- !pinnedRowIds ||
- !row.getIsPinned()
- )
+ if (!enableRowPinning || !rowPinningDisplayMode?.includes("sticky") || !pinnedRowIds || !row.getIsPinned())
return [];
- return [
- [...pinnedRowIds].reverse().indexOf(row.id),
- pinnedRowIds.indexOf(row.id),
- ];
+ return [[...pinnedRowIds].reverse().indexOf(row.id), pinnedRowIds.indexOf(row.id)];
}, [pinnedRowIds, rowPinning]);
- const tableHeadHeight =
- ((enableStickyHeader || isFullScreen) &&
- tableHeadRef.current?.clientHeight) ||
- 0;
- const tableFooterHeight =
- (enableStickyFooter && tableFooterRef.current?.clientHeight) || 0;
+ const tableHeadHeight = ((enableStickyHeader || isFullScreen) && tableHeadRef.current?.clientHeight) || 0;
+ const tableFooterHeight = (enableStickyFooter && tableFooterRef.current?.clientHeight) || 0;
const sx = parseFromValuesOrFunc(tableRowProps?.sx, theme);
- const defaultRowHeight =
- density === 'compact' ? 37 : density === 'comfortable' ? 53 : 69;
+ const defaultRowHeight = density === "compact" ? 37 : density === "comfortable" ? 53 : 69;
const customRowHeight =
// @ts-ignore
@@ -117,16 +91,16 @@ const DataTable_TableBodyRow = ({
const cellHighlightColor = isRowSelected
? selectedRowBackgroundColor
: isRowPinned
- ? pinnedRowBackgroundColor
- : undefined;
+ ? pinnedRowBackgroundColor
+ : undefined;
const cellHighlightColorHover =
tableRowProps?.hover !== false
? isRowSelected
? cellHighlightColor
- : theme.palette.mode === 'dark'
- ? `${lighten(baseBackgroundColor, 0.3)}`
- : `${darken(baseBackgroundColor, 0.3)}`
+ : theme.palette.mode === "dark"
+ ? `${lighten(baseBackgroundColor, 0.3)}`
+ : `${darken(baseBackgroundColor, 0.3)}`
: undefined;
return (
@@ -146,91 +120,81 @@ const DataTable_TableBodyRow = ({
selected={isRowSelected}
{...tableRowProps}
style={{
- transform: virtualRow
- ? `translateY(${virtualRow.start}px)`
- : undefined,
+ transform: virtualRow ? `translateY(${virtualRow.start}px)` : undefined,
...tableRowProps?.style,
}}
sx={(theme) => ({
- '&:hover td:after': cellHighlightColorHover
+ "&:hover td:after": cellHighlightColorHover
? {
- backgroundColor: alpha(cellHighlightColorHover, 0.3),
- ...commonCellBeforeAfterStyles,
- }
+ backgroundColor: alpha(cellHighlightColorHover, 0.3),
+ ...commonCellBeforeAfterStyles,
+ }
: undefined,
backgroundColor: `${baseBackgroundColor} !important`,
bottom:
!virtualRow && bottomPinnedIndex !== undefined && isRowPinned
- ? `${bottomPinnedIndex * rowHeight +
- (enableStickyFooter ? tableFooterHeight - 1 : 0)
- }px`
+ ? `${bottomPinnedIndex * rowHeight + (enableStickyFooter ? tableFooterHeight - 1 : 0)}px`
: undefined,
- boxSizing: 'border-box',
- display: layoutMode?.startsWith('grid') ? 'flex' : undefined,
+ boxSizing: "border-box",
+ display: layoutMode?.startsWith("grid") ? "flex" : undefined,
opacity: isRowPinned ? 0.97 : isDraggingRow || isHoveredRow ? 0.5 : 1,
position: virtualRow
- ? 'absolute'
- : rowPinningDisplayMode?.includes('sticky') && isRowPinned
- ? 'sticky'
- : 'relative',
+ ? "absolute"
+ : rowPinningDisplayMode?.includes("sticky") && isRowPinned
+ ? "sticky"
+ : "relative",
td: {
...getCommonPinnedCellStyles({ table, theme }),
},
- 'td:after': cellHighlightColor
+ "td:after": cellHighlightColor
? {
- backgroundColor: cellHighlightColor,
- ...commonCellBeforeAfterStyles,
- }
+ backgroundColor: cellHighlightColor,
+ ...commonCellBeforeAfterStyles,
+ }
: undefined,
top: virtualRow
? 0
: topPinnedIndex !== undefined && isRowPinned
- ? `${topPinnedIndex * rowHeight +
- (enableStickyHeader || isFullScreen ? tableHeadHeight - 1 : 0)
+ ? `${
+ topPinnedIndex * rowHeight +
+ (enableStickyHeader || isFullScreen ? tableHeadHeight - 1 : 0)
}px`
- : undefined,
- transition: virtualRow ? 'none' : 'all 150ms ease-in-out',
- width: '100%',
- zIndex:
- rowPinningDisplayMode?.includes('sticky') && isRowPinned ? 2 : 0,
- ...(sx),
+ : undefined,
+ transition: virtualRow ? "none" : "all 150ms ease-in-out",
+ width: "100%",
+ zIndex: rowPinningDisplayMode?.includes("sticky") && isRowPinned ? 2 : 0,
+ ...sx,
})}
>
- {virtualPaddingLeft ? (
- |
- ) : null}
- {(virtualColumns ?? visibleCells).map(
- (cellOrVirtualCell, staticColumnIndex) => {
- let cell = cellOrVirtualCell;
- if (columnVirtualizer) {
- staticColumnIndex = (cellOrVirtualCell).index;
- cell = visibleCells[staticColumnIndex];
- }
- const props = {
- cell,
- numRows,
- rowRef,
- staticColumnIndex,
- staticRowIndex,
- table,
- };
- return cell ? (
- memoMode === 'cells' &&
- cell.column.columnDef.columnDefType === 'data' &&
- !draggingColumn &&
- !draggingRow &&
- editingCell?.id !== cell.id &&
- editingRow?.id !== row.id ? (
-
- ) : (
-
- )
- ) : null;
- },
- )}
- {virtualPaddingRight ? (
- |
- ) : null}
+ {virtualPaddingLeft ? | : null}
+ {(virtualColumns ?? visibleCells).map((cellOrVirtualCell, staticColumnIndex) => {
+ let cell = cellOrVirtualCell;
+ if (columnVirtualizer) {
+ staticColumnIndex = cellOrVirtualCell.index;
+ cell = visibleCells[staticColumnIndex];
+ }
+ const props = {
+ cell,
+ numRows,
+ rowRef,
+ staticColumnIndex,
+ staticRowIndex,
+ table,
+ };
+ return cell ? (
+ memoMode === "cells" &&
+ cell.column.columnDef.columnDefType === "data" &&
+ !draggingColumn &&
+ !draggingRow &&
+ editingCell?.id !== cell.id &&
+ editingRow?.id !== row.id ? (
+
+ ) : (
+
+ )
+ ) : null;
+ })}
+ {virtualPaddingRight ? | : null}
{renderDetailPanel && !row.getIsGrouped() && (
);
-}
-export default DataTable_TableBodyRow
+};
+export default DataTable_TableBodyRow;
export const Memo_DataTable_TableBodyRow = memo(
DataTable_TableBodyRow,
- (prev, next) =>
- prev.row === next.row && prev.staticRowIndex === next.staticRowIndex,
-);
\ No newline at end of file
+ (prev, next) => prev.row === next.row && prev.staticRowIndex === next.staticRowIndex
+);
diff --git a/src/core/components/DataTable/body/TableDetailPanel.js b/src/core/components/DataTable/body/TableDetailPanel.js
index 0c9f8a9..853aab5 100644
--- a/src/core/components/DataTable/body/TableDetailPanel.js
+++ b/src/core/components/DataTable/body/TableDetailPanel.js
@@ -23,7 +23,6 @@ const DataTable_TableDetailPanel = ({
} = table;
const { isLoading } = getState();
-
const tableRowProps = parseFromValuesOrFunc(muiTableBodyRowProps, {
isDetailPanel: true,
row,
@@ -52,16 +51,12 @@ const DataTable_TableDetailPanel = ({
}}
{...tableRowProps}
sx={(theme) => ({
- display: layoutMode?.startsWith('grid') ? 'flex' : undefined,
- position: virtualRow ? 'absolute' : undefined,
- top: virtualRow
- ? `${parentRowRef.current?.getBoundingClientRect()?.height}px`
- : undefined,
- transform: virtualRow
- ? `translateY(${virtualRow?.start}px)`
- : undefined,
- width: '100%',
- ...(parseFromValuesOrFunc(tableRowProps?.sx, theme)),
+ display: layoutMode?.startsWith("grid") ? "flex" : undefined,
+ position: virtualRow ? "absolute" : undefined,
+ top: virtualRow ? `${parentRowRef.current?.getBoundingClientRect()?.height}px` : undefined,
+ transform: virtualRow ? `translateY(${virtualRow?.start}px)` : undefined,
+ width: "100%",
+ ...parseFromValuesOrFunc(tableRowProps?.sx, theme),
})}
>
({
backgroundColor: virtualRow ? baseBackgroundColor : undefined,
- borderBottom: !row.getIsExpanded() ? 'none' : undefined,
- display: layoutMode?.startsWith('grid') ? 'flex' : undefined,
- py: !!DetailPanel && row.getIsExpanded() ? '1rem' : 0,
- transition: !virtualRow ? 'all 150ms ease-in-out' : undefined,
+ borderBottom: !row.getIsExpanded() ? "none" : undefined,
+ display: layoutMode?.startsWith("grid") ? "flex" : undefined,
+ py: !!DetailPanel && row.getIsExpanded() ? "1rem" : 0,
+ transition: !virtualRow ? "all 150ms ease-in-out" : undefined,
width: `100%`,
- ...(parseFromValuesOrFunc(tableCellProps?.sx, theme)),
+ ...parseFromValuesOrFunc(tableCellProps?.sx, theme),
})}
>
{virtualRow ? (
@@ -88,6 +83,5 @@ const DataTable_TableDetailPanel = ({
);
-
-}
-export default DataTable_TableDetailPanel
\ No newline at end of file
+};
+export default DataTable_TableDetailPanel;
diff --git a/src/core/components/DataTable/buttons/CopyButton.js b/src/core/components/DataTable/buttons/CopyButton.js
index c8878e0..c4dfe4b 100644
--- a/src/core/components/DataTable/buttons/CopyButton.js
+++ b/src/core/components/DataTable/buttons/CopyButton.js
@@ -2,11 +2,7 @@ import { getCommonTooltipProps, parseFromValuesOrFunc } from "@/core/utils/utils
import { Button, Tooltip } from "@mui/material";
import { useState } from "react";
-const DataTable_CopyButton = ({
- cell,
- table,
- ...rest
-}) => {
+const DataTable_CopyButton = ({ cell, table, ...rest }) => {
const {
options: { localization, muiCopyButtonProps },
} = table;
@@ -40,11 +36,8 @@ const DataTable_CopyButton = ({
return (
);
-}
-export default DataTable_CopyButton
\ No newline at end of file
+};
+export default DataTable_CopyButton;
diff --git a/src/core/components/DataTable/buttons/GrabHandleButton.js b/src/core/components/DataTable/buttons/GrabHandleButton.js
index 5619abb..2071eed 100644
--- a/src/core/components/DataTable/buttons/GrabHandleButton.js
+++ b/src/core/components/DataTable/buttons/GrabHandleButton.js
@@ -1,11 +1,7 @@
import { getCommonTooltipProps, parseFromValuesOrFunc } from "@/core/utils/utils";
import { IconButton, Tooltip } from "@mui/material";
-const DataTable_GrabHandleButton = ({
- location,
- table,
- ...rest
-}) => {
+const DataTable_GrabHandleButton = ({ location, table, ...rest }) => {
const {
options: {
icons: { DragHandleIcon },
@@ -14,10 +10,7 @@ const DataTable_GrabHandleButton = ({
} = table;
return (
-
+
({
- '&:active': {
- cursor: 'grabbing',
+ "&:active": {
+ cursor: "grabbing",
},
- '&:hover': {
- backgroundColor: 'transparent',
+ "&:hover": {
+ backgroundColor: "transparent",
opacity: 1,
},
- cursor: 'grab',
- m: '0 -0.1rem',
- opacity: location === 'row' ? 1 : 0.5,
- p: '2px',
- transition: 'all 150ms ease-in-out',
- ...(parseFromValuesOrFunc(rest?.sx, theme)),
+ cursor: "grab",
+ m: "0 -0.1rem",
+ opacity: location === "row" ? 1 : 0.5,
+ p: "2px",
+ transition: "all 150ms ease-in-out",
+ ...parseFromValuesOrFunc(rest?.sx, theme),
})}
title={undefined}
>
@@ -49,6 +42,5 @@ const DataTable_GrabHandleButton = ({
);
-
-}
-export default DataTable_GrabHandleButton
\ No newline at end of file
+};
+export default DataTable_GrabHandleButton;
diff --git a/src/core/components/DataTable/buttons/ShowHideColumnsButton.js b/src/core/components/DataTable/buttons/ShowHideColumnsButton.js
index d46281e..cd6c8ac 100644
--- a/src/core/components/DataTable/buttons/ShowHideColumnsButton.js
+++ b/src/core/components/DataTable/buttons/ShowHideColumnsButton.js
@@ -19,23 +19,12 @@ const DataTable_ShowHideColumnsButton = ({ table, ...rest }) => {
return (
<>
-
+
- {anchorEl && (
-
- )}
+ {anchorEl && }
);
-}
-export default DataTable_ShowHideColumnsButton
\ No newline at end of file
+};
+export default DataTable_ShowHideColumnsButton;
diff --git a/src/core/components/DataTable/buttons/ToggleFiltersButton.js b/src/core/components/DataTable/buttons/ToggleFiltersButton.js
index 9885183..6298223 100644
--- a/src/core/components/DataTable/buttons/ToggleFiltersButton.js
+++ b/src/core/components/DataTable/buttons/ToggleFiltersButton.js
@@ -1,4 +1,4 @@
const DataTable_ToggleFiltersButton = ({ table, ...rest }) => {
- return <>
-}
-export default DataTable_ToggleFiltersButton
\ No newline at end of file
+ return <>;
+};
+export default DataTable_ToggleFiltersButton;
diff --git a/src/core/components/DataTable/filter/FilterBody.jsx b/src/core/components/DataTable/filter/FilterBody.jsx
index 385981b..9dafb03 100644
--- a/src/core/components/DataTable/filter/FilterBody.jsx
+++ b/src/core/components/DataTable/filter/FilterBody.jsx
@@ -1,38 +1,38 @@
-'use client'
+"use client";
-import {Box, Button, Drawer, styled} from "@mui/material";
-import {Form, Formik} from "formik";
+import { Box, Button, Drawer, styled } from "@mui/material";
+import { Form, Formik } from "formik";
import useTableSetting from "@/lib/hooks/useTableSetting";
-import {useEffect, useRef, useState} from "react";
+import { useEffect, useRef, useState } from "react";
import FilterHeader from "@/core/components/DataTable/filter/FilterHeader";
import * as Yup from "yup";
import FilterBodyField from "@/core/components/DataTable/filter/FilterBodyField";
-import {toast} from "react-toastify";
+import { toast } from "react-toastify";
import AskForKeep from "@/core/components/NotificationDesign/AskForKeep";
import useDataTable from "@/lib/hooks/useDataTable";
const ScrollBox = styled(Box)({
flexGrow: 1,
- overflowY: 'scroll',
+ overflowY: "scroll",
maxWidth: "450px",
- '::-webkit-scrollbar': {
- width: '5px',
+ "::-webkit-scrollbar": {
+ width: "5px",
},
- '::-webkit-scrollbar-track': {
- boxShadow: 'inset 0 0 5px #fff',
- borderRadius: '5px',
+ "::-webkit-scrollbar-track": {
+ boxShadow: "inset 0 0 5px #fff",
+ borderRadius: "5px",
+ },
+ "::-webkit-scrollbar-thumb": {
+ background: "#155175",
+ borderRadius: "0px",
},
- '::-webkit-scrollbar-thumb': {
- background: '#155175',
- borderRadius: '0px',
- }
});
-function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, table_name}) {
- const {settingStore, filterAction} = useTableSetting();
+function FilterBody({ columns, drawerState, setDrawerState, user_id, page_name, table_name }) {
+ const { settingStore, filterAction } = useTableSetting();
const [initialValues, setInitialValues] = useState({});
const [validationSchema, setValidationSchema] = useState({});
- const {filterData, setFilterData} = useDataTable();
+ const { filterData, setFilterData } = useDataTable();
const filterDataRef = useRef(filterData);
useEffect(() => {
filterDataRef.current = filterData;
@@ -41,27 +41,29 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
useEffect(() => {
const values = columns.reduce((acc, column) => {
if (!column.enableColumnFilter) return acc;
- const filter = settingStore?.[user_id]?.[page_name]?.[table_name]?.['filters']?.find((filter) => filter.id === column.id);
- if (column.datatype === 'array') {
+ const filter = settingStore?.[user_id]?.[page_name]?.[table_name]?.["filters"]?.find(
+ (filter) => filter.id === column.id
+ );
+ if (column.datatype === "array") {
acc[column.id] = {
id: column.id,
value: filter?.value || [],
filterFn: filter?.fn || column._filterFn,
- datatype: column.datatype
+ datatype: column.datatype,
};
} else if (column._filterFn === "between") {
acc[column.id] = {
id: column.id,
value: filter?.value || ["", ""],
filterFn: filter?.fn || column._filterFn,
- datatype: column.datatype
+ datatype: column.datatype,
};
} else {
acc[column.id] = {
id: column.id,
- value: filter?.value || '',
+ value: filter?.value || "",
filterFn: filter?.fn || column._filterFn,
- datatype: column.datatype
+ datatype: column.datatype,
};
}
return acc;
@@ -69,7 +71,6 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
setInitialValues(Object.keys(filterData).length !== 0 ? filterData : values);
}, [columns, settingStore, user_id, page_name, table_name, filterData]);
-
useEffect(() => {
const generatedSchema = Yup.object().shape(
Object.keys(initialValues).reduce((acc, key) => {
@@ -81,7 +82,10 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
.test({
test(value, ctx) {
const [start, end] = value || ["", ""];
- if (initialValue.datatype === "numeric" && parseInt(end, 10) <= parseInt(start, 10)) {
+ if (
+ initialValue.datatype === "numeric" &&
+ parseInt(end, 10) <= parseInt(start, 10)
+ ) {
return ctx.createError({
message: `مقدار وارده باید بیشتر از (${start}) باشد`,
});
@@ -102,12 +106,11 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
setValidationSchema(generatedSchema);
}, [initialValues]);
-
- const handleSubmit = (values, {setSubmitting}) => {
- toast.dismiss({containerId: "filtering"});
+ const handleSubmit = (values, { setSubmitting }) => {
+ toast.dismiss({ containerId: "filtering" });
setDrawerState(false);
setFilterData(values);
- toast(, {
+ toast(, {
containerId: "filtering",
className: "filter-toast",
position: "bottom-left",
@@ -119,84 +122,98 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
const onSaveFilter = () => {
const currentFilterData = filterDataRef.current;
- const arrayOfObjects = Object.keys(currentFilterData).map(key => {
- const value = currentFilterData[key].value;
- if (value !== "" &&
- !(Array.isArray(value) && (value.length === 0 || (value.length === 2 && value[0] === "" && value[1] === "")))) {
- return currentFilterData[key];
- }
- }).filter(Boolean);
- filterAction(user_id, page_name, table_name, arrayOfObjects, columns)
- toast.dismiss({containerId: "filtering"});
+ const arrayOfObjects = Object.keys(currentFilterData)
+ .map((key) => {
+ const value = currentFilterData[key].value;
+ if (
+ value !== "" &&
+ !(
+ Array.isArray(value) &&
+ (value.length === 0 || (value.length === 2 && value[0] === "" && value[1] === ""))
+ )
+ ) {
+ return currentFilterData[key];
+ }
+ })
+ .filter(Boolean);
+ filterAction(user_id, page_name, table_name, arrayOfObjects, columns);
+ toast.dismiss({ containerId: "filtering" });
};
return (
- setDrawerState(false)}
- sx={{overflowY: "hidden", display: "flex", flexDirection: "column", height: "100%"}}>
-
+ setDrawerState(false)}
+ sx={{
+ overflowY: "hidden",
+ display: "flex",
+ flexDirection: "column",
+ height: "100%",
+ }}
+ >
+
{Object.keys(initialValues).length > 0 && (
-
- {
- ({
- values,
- handleChange,
- handleBlur,
- setFieldValue,
- errors,
- touched,
- isSubmitting,
- isValid,
- dirty,
- resetForm
- }) => (
-
- )}
+
+ {({
+ values,
+ handleChange,
+ handleBlur,
+ setFieldValue,
+ errors,
+ touched,
+ isSubmitting,
+ isValid,
+ dirty,
+ resetForm,
+ }) => (
+
+ )}
)}
@@ -204,4 +221,4 @@ function FilterBody({columns, drawerState, setDrawerState, user_id, page_name, t
);
}
-export default FilterBody;
\ No newline at end of file
+export default FilterBody;
diff --git a/src/core/components/DataTable/filter/FilterBodyField.jsx b/src/core/components/DataTable/filter/FilterBodyField.jsx
index b12e770..a9bef12 100644
--- a/src/core/components/DataTable/filter/FilterBodyField.jsx
+++ b/src/core/components/DataTable/filter/FilterBodyField.jsx
@@ -1,4 +1,4 @@
-import {useState} from "react";
+import { useState } from "react";
import FilterOptionList from "@/core/components/DataTable/filter/FilterOptionList";
import CustomSelect from "@/core/components/DataTable/filter/fieldsType/CustomSelect";
import CustomTextField from "@/core/components/DataTable/filter/fieldsType/CustomTextField";
@@ -14,19 +14,19 @@ const columnFilterModeOptionFa = {
lessThan: "کوچکتر",
greaterThan: "بزرگتر",
fuzzy: "فازی",
- between: "مابین"
+ between: "مابین",
};
function FilterBodyField({
- column,
- filterParameters,
- handleChange,
- handleBlur,
- setFieldValue,
- errors,
- touched,
- resetForm
- }) {
+ column,
+ filterParameters,
+ handleChange,
+ handleBlur,
+ setFieldValue,
+ errors,
+ touched,
+ resetForm,
+}) {
const [anchorEl, setAnchorEl] = useState(null);
const defaultFilterTranslation = columnFilterModeOptionFa[filterParameters.filterFn] || filterParameters.filterFn;
@@ -47,7 +47,9 @@ function FilterBodyField({
errors={errors}
touched={touched}
/>
- ) : filterParameters.datatype === "numeric" && filterParameters.filterFn === "equals" && Array.isArray(column.columnSelectOption) ? (
+ ) : filterParameters.datatype === "numeric" &&
+ filterParameters.filterFn === "equals" &&
+ Array.isArray(column.columnSelectOption) ? (
- {
- setDrawerState(!drawerState)
- }} aria-label="filter table">
-
+ {
+ setDrawerState(!drawerState);
+ }}
+ aria-label="filter table"
+ >
+
);
diff --git a/src/core/components/DataTable/filter/FilterHeader.jsx b/src/core/components/DataTable/filter/FilterHeader.jsx
index 2acd0b7..76980ce 100644
--- a/src/core/components/DataTable/filter/FilterHeader.jsx
+++ b/src/core/components/DataTable/filter/FilterHeader.jsx
@@ -1,10 +1,10 @@
-'use client'
+"use client";
-import {Box, IconButton, Typography} from "@mui/material";
-import CancelIcon from '@mui/icons-material/Cancel';
-import FilterAltIcon from '@mui/icons-material/FilterAlt';
+import { Box, IconButton, Typography } from "@mui/material";
+import CancelIcon from "@mui/icons-material/Cancel";
+import FilterAltIcon from "@mui/icons-material/FilterAlt";
-function FilterHeader({setDrawerState}) {
+function FilterHeader({ setDrawerState }) {
return (
-
-
- فیلتر
+
+
+
+ فیلتر
+
- setDrawerState(false)}>
-
+ setDrawerState(false)}>
+
);
}
-export default FilterHeader;
\ No newline at end of file
+export default FilterHeader;
diff --git a/src/core/components/DataTable/filter/FilterOptionList.jsx b/src/core/components/DataTable/filter/FilterOptionList.jsx
index ce02c23..e088832 100644
--- a/src/core/components/DataTable/filter/FilterOptionList.jsx
+++ b/src/core/components/DataTable/filter/FilterOptionList.jsx
@@ -1,17 +1,17 @@
-'use client'
+"use client";
-import {ListItem, Menu} from "@mui/material";
-import {useState} from "react";
+import { ListItem, Menu } from "@mui/material";
+import { useState } from "react";
function FilterOptionList({
- column,
- filterType,
- filterOption,
- anchorEl,
- columnFilterModeOptionFa,
- setAnchorEl,
- setFieldValue
- }) {
+ column,
+ filterType,
+ filterOption,
+ anchorEl,
+ columnFilterModeOptionFa,
+ setAnchorEl,
+ setFieldValue,
+}) {
const [selectedFilter, setSelectedFilter] = useState(filterType);
const handleChangeItem = (event, index) => {
@@ -19,25 +19,26 @@ function FilterOptionList({
setFieldValue(`${column.id}.filterFn`, filterOption[index]);
setSelectedFilter(filterOption[index]);
setAnchorEl(null);
- }
+ };
const handleCloseFilterBox = () => {
setAnchorEl(null);
};
return (
- }
+ helperText={
+
+ نوع فیلتر: {defaultFilterTranslation}
+
+ }
variant="outlined"
size="normal"
- sx={{marginY: 1}}
+ sx={{ marginY: 1 }}
InputProps={{
endAdornment: (
-
-
+
+
),
}}
@@ -36,4 +37,4 @@ function CustomTextField({
);
}
-export default CustomTextField;
\ No newline at end of file
+export default CustomTextField;
diff --git a/src/core/components/DataTable/filter/fieldsType/CustomTextFieldRange.jsx b/src/core/components/DataTable/filter/fieldsType/CustomTextFieldRange.jsx
index 35c9358..fea4169 100644
--- a/src/core/components/DataTable/filter/fieldsType/CustomTextFieldRange.jsx
+++ b/src/core/components/DataTable/filter/fieldsType/CustomTextFieldRange.jsx
@@ -1,18 +1,18 @@
-import {Box, InputAdornment, TextField, Typography} from "@mui/material";
-import FilterListIcon from '@mui/icons-material/FilterList';
+import { Box, InputAdornment, TextField, Typography } from "@mui/material";
+import FilterListIcon from "@mui/icons-material/FilterList";
function CustomTextFieldRange({
- column,
- filterParameters,
- defaultFilterTranslation,
- handleOpenFilterBox,
- handleChange,
- handleBlur,
- errors,
- touched
- }) {
+ column,
+ filterParameters,
+ defaultFilterTranslation,
+ handleOpenFilterBox,
+ handleChange,
+ handleBlur,
+ errors,
+ touched,
+}) {
return (
-
+
نوع
- فیلتر: {defaultFilterTranslation}}
+ helperText={
+
+ نوع فیلتر: {defaultFilterTranslation}
+
+ }
variant="outlined"
size="normal"
- sx={{marginY: 1, marginRight: 1}}
+ sx={{ marginY: 1, marginRight: 1 }}
/>
-
+
+
),
}}
@@ -53,4 +56,4 @@ function CustomTextFieldRange({
);
}
-export default CustomTextFieldRange;
\ No newline at end of file
+export default CustomTextFieldRange;
diff --git a/src/core/components/DataTable/filter/index.jsx b/src/core/components/DataTable/filter/index.jsx
index 65a93d2..8d26594 100644
--- a/src/core/components/DataTable/filter/index.jsx
+++ b/src/core/components/DataTable/filter/index.jsx
@@ -1,17 +1,23 @@
-'use client'
+"use client";
-import {useState} from "react";
+import { useState } from "react";
import FilterButton from "@/core/components/DataTable/filter/FilterButton";
import FilterBody from "@/core/components/DataTable/filter/FilterBody";
-function FilterColumn({columns, user_id, page_name, table_name}) {
+function FilterColumn({ columns, user_id, page_name, table_name }) {
const [open, setOpen] = useState(false);
return (
<>
-
-
+
+
);
}
diff --git a/src/core/components/DataTable/head/TableHead.js b/src/core/components/DataTable/head/TableHead.js
index 5e5dd99..39ee214 100644
--- a/src/core/components/DataTable/head/TableHead.js
+++ b/src/core/components/DataTable/head/TableHead.js
@@ -1,26 +1,17 @@
-import {parseFromValuesOrFunc} from "@/core/utils/utils";
-import {TableHead} from "@mui/material";
+import { parseFromValuesOrFunc } from "@/core/utils/utils";
+import { TableHead } from "@mui/material";
import DataTable_TableHeadRow from "./TableHeadRow";
-const DataTable_TableHead = ({
- columnVirtualizer,
- table,
- ...rest
- }) => {
+const DataTable_TableHead = ({ columnVirtualizer, table, ...rest }) => {
const {
getState,
- options: {
- enableStickyHeader,
- layoutMode,
- muiTableHeadProps,
- positionToolbarAlertBanner,
- },
- refs: {tableHeadRef},
+ options: { enableStickyHeader, layoutMode, muiTableHeadProps, positionToolbarAlertBanner },
+ refs: { tableHeadRef },
} = table;
- const {isFullScreen, showAlertBanner} = getState();
+ const { isFullScreen, showAlertBanner } = getState();
const tableHeadProps = {
- ...parseFromValuesOrFunc(muiTableHeadProps, {table}),
+ ...parseFromValuesOrFunc(muiTableHeadProps, { table }),
...rest,
};
@@ -37,28 +28,24 @@ const DataTable_TableHead = ({
}
}}
sx={(theme) => ({
- display: layoutMode?.startsWith('grid') ? 'grid' : undefined,
+ display: layoutMode?.startsWith("grid") ? "grid" : undefined,
opacity: 0.97,
- position: stickyHeader ? 'sticky' : 'relative',
- top: stickyHeader && layoutMode?.startsWith('grid') ? 0 : undefined,
+ position: stickyHeader ? "sticky" : "relative",
+ top: stickyHeader && layoutMode?.startsWith("grid") ? 0 : undefined,
zIndex: stickyHeader ? 2 : undefined,
- ...(parseFromValuesOrFunc(tableHeadProps?.sx, theme)),
+ ...parseFromValuesOrFunc(tableHeadProps?.sx, theme),
})}
>
- {table
- .getHeaderGroups()
- .map((headerGroup, index) => (
-
- ))
- }
+ {table.getHeaderGroups().map((headerGroup, index) => (
+
+ ))}
);
-
-}
-export default DataTable_TableHead
\ No newline at end of file
+};
+export default DataTable_TableHead;
diff --git a/src/core/components/DataTable/head/TableHeadCell.js b/src/core/components/DataTable/head/TableHeadCell.js
index 6248d63..a0b8fc5 100644
--- a/src/core/components/DataTable/head/TableHeadCell.js
+++ b/src/core/components/DataTable/head/TableHeadCell.js
@@ -1,16 +1,10 @@
-import {getCommonMRTCellStyles, parseFromValuesOrFunc} from "@/core/utils/utils";
-import {useTheme} from "@emotion/react";
-import {Box, TableCell} from "@mui/material";
-import {MRT_TableHeadCellSortLabel} from "material-react-table";
-import {useMemo} from "react";
+import { getCommonMRTCellStyles, parseFromValuesOrFunc } from "@/core/utils/utils";
+import { useTheme } from "@emotion/react";
+import { Box, TableCell } from "@mui/material";
+import { MRT_TableHeadCellSortLabel } from "material-react-table";
+import { useMemo } from "react";
-const DataTable_TableHeadCell = ({
- columnVirtualizer,
- header,
- staticColumnIndex,
- table,
- ...rest
- }) => {
+const DataTable_TableHeadCell = ({ columnVirtualizer, header, staticColumnIndex, table, ...rest }) => {
const theme = useTheme();
const {
getState,
@@ -24,26 +18,19 @@ const DataTable_TableHeadCell = ({
enableGrouping,
enableMultiSort,
layoutMode,
- mrtTheme: {draggingBorderColor},
+ mrtTheme: { draggingBorderColor },
muiTableHeadCellProps,
},
- refs: {tableHeadCellRefs},
+ refs: { tableHeadCellRefs },
setHoveredColumn,
} = table;
- const {
- columnSizingInfo,
- density,
- draggingColumn,
- grouping,
- hoveredColumn,
- showColumnFilters,
- } = getState();
- const {column} = header;
- const {columnDef} = column;
- const {columnDefType} = columnDef;
+ const { columnSizingInfo, density, draggingColumn, grouping, hoveredColumn, showColumnFilters } = getState();
+ const { column } = header;
+ const { columnDef } = column;
+ const { columnDefType } = columnDef;
const tableCellProps = {
- ...parseFromValuesOrFunc(muiTableHeadCellProps, {column, table}),
+ ...parseFromValuesOrFunc(muiTableHeadCellProps, { column, table }),
...parseFromValuesOrFunc(columnDef.muiTableHeadCellProps, {
column,
table,
@@ -51,23 +38,17 @@ const DataTable_TableHeadCell = ({
...rest,
};
- const isColumnPinned =
- enableColumnPinning &&
- columnDef.columnDefType !== 'group' &&
- column.getIsPinned();
+ const isColumnPinned = enableColumnPinning && columnDef.columnDefType !== "group" && column.getIsPinned();
const showColumnActions =
- (enableColumnActions || columnDef.enableColumnActions) &&
- columnDef.enableColumnActions !== false;
+ (enableColumnActions || columnDef.enableColumnActions) && columnDef.enableColumnActions !== false;
const showDragHandle =
enableColumnDragging !== false &&
columnDef.enableColumnDragging !== false &&
(enableColumnDragging ||
(enableColumnOrdering && columnDef.enableColumnOrdering !== false) ||
- (enableGrouping &&
- columnDef.enableGrouping !== false &&
- !grouping.includes(column.id)));
+ (enableGrouping && columnDef.enableGrouping !== false && !grouping.includes(column.id)));
const headerPL = useMemo(() => {
let pl = 0;
@@ -80,41 +61,37 @@ const DataTable_TableHeadCell = ({
const draggingBorders = useMemo(() => {
const showResizeBorder =
columnSizingInfo.isResizingColumn === column.id &&
- columnResizeMode === 'onChange' &&
+ columnResizeMode === "onChange" &&
!header.subHeaders.length;
const borderStyle = showResizeBorder
? `2px solid ${draggingBorderColor} !important`
: draggingColumn?.id === column.id
- ? `1px dashed ${theme.palette.grey[500]}`
- : hoveredColumn?.id === column.id
- ? `2px dashed ${draggingBorderColor}`
- : undefined;
+ ? `1px dashed ${theme.palette.grey[500]}`
+ : hoveredColumn?.id === column.id
+ ? `2px dashed ${draggingBorderColor}`
+ : undefined;
if (showResizeBorder) {
- return columnResizeDirection === 'ltr'
- ? {borderRight: borderStyle}
- : {borderLeft: borderStyle};
+ return columnResizeDirection === "ltr" ? { borderRight: borderStyle } : { borderLeft: borderStyle };
}
const draggingBorders = borderStyle
? {
- borderLeft: borderStyle,
- borderRight: borderStyle,
- borderTop: borderStyle,
- }
+ borderLeft: borderStyle,
+ borderRight: borderStyle,
+ borderTop: borderStyle,
+ }
: undefined;
return draggingBorders;
}, [draggingColumn, hoveredColumn, columnSizingInfo.isResizingColumn]);
const handleDragEnter = (_e) => {
- if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
+ if (enableGrouping && hoveredColumn?.id === "drop-zone") {
setHoveredColumn(null);
}
- if (enableColumnOrdering && draggingColumn && columnDefType !== 'group') {
- setHoveredColumn(
- columnDef.enableColumnOrdering !== false ? column : null,
- );
+ if (enableColumnOrdering && draggingColumn && columnDefType !== "group") {
+ setHoveredColumn(columnDef.enableColumnOrdering !== false ? column : null);
}
};
@@ -124,7 +101,6 @@ const DataTable_TableHeadCell = ({
}
};
-
const HeaderElement =
parseFromValuesOrFunc(columnDef.Header, {
column,
@@ -132,12 +108,9 @@ const DataTable_TableHeadCell = ({
table,
}) ?? columnDef.header;
-
const columnRelativeDepth = header.depth - column.depth;
- if (
- columnRelativeDepth > 1
- ) {
+ if (columnRelativeDepth > 1) {
return null;
}
@@ -149,13 +122,7 @@ const DataTable_TableHeadCell = ({
return (
{
if (node) {
tableHeadCellRefs.current[column.id] = node;
- if (columnDefType !== 'group') {
+ if (columnDefType !== "group") {
columnVirtualizer?.measureElement?.(node);
}
}
}}
{...tableCellProps}
sx={(theme) => ({
- '& :hover': {
- '.MuiButtonBase-root': {
- opacity: 1,
- },
+ "& :hover": {
+ ".MuiButtonBase-root": {
+ opacity: 1,
},
- flexDirection: layoutMode?.startsWith('grid') ? 'column' : undefined,
- fontWeight: 'bold',
- overflow: 'visible',
- p:
- density === 'compact'
- ? '0.5rem'
- : density === 'comfortable'
- ? columnDefType === 'display'
- ? '0.75rem'
- : '1rem'
- : columnDefType === 'display'
- ? '1rem 1.25rem'
- : '1.5rem',
- pb:
- columnDefType === 'display'
- ? 0
- : showColumnFilters || density === 'compact'
- ? '0.4rem'
- : '0.6rem',
- pt:
- columnDefType === 'group' || density === 'compact'
- ? '0.25rem'
- : density === 'comfortable'
- ? '.75rem'
- : '1.25rem',
- userSelect: enableMultiSort && column.getCanSort() ? 'none' : undefined,
- verticalAlign: 'middle',
- ...getCommonMRTCellStyles({
- column,
- header,
- table,
- tableCellProps,
- theme,
- }),
- ...draggingBorders,
- }
- )}
+ },
+ flexDirection: layoutMode?.startsWith("grid") ? "column" : undefined,
+ fontWeight: "bold",
+ overflow: "visible",
+ p:
+ density === "compact"
+ ? "0.5rem"
+ : density === "comfortable"
+ ? columnDefType === "display"
+ ? "0.75rem"
+ : "1rem"
+ : columnDefType === "display"
+ ? "1rem 1.25rem"
+ : "1.5rem",
+ pb: columnDefType === "display" ? 0 : showColumnFilters || density === "compact" ? "0.4rem" : "0.6rem",
+ pt:
+ columnDefType === "group" || density === "compact"
+ ? "0.25rem"
+ : density === "comfortable"
+ ? ".75rem"
+ : "1.25rem",
+ userSelect: enableMultiSort && column.getCanSort() ? "none" : undefined,
+ verticalAlign: "middle",
+ ...getCommonMRTCellStyles({
+ column,
+ header,
+ table,
+ tableCellProps,
+ theme,
+ }),
+ ...draggingBorders,
+ })}
>
{tableCellProps.children ?? (
{HeaderElement}
- {(column.getCanSort() && columnDefType !== 'group') && (
-
+ {column.getCanSort() && columnDefType !== "group" && (
+
)}
)}
);
-
-}
-export default DataTable_TableHeadCell;
\ No newline at end of file
+};
+export default DataTable_TableHeadCell;
diff --git a/src/core/components/DataTable/head/TableHeadRow.js b/src/core/components/DataTable/head/TableHeadRow.js
index 33a23e2..512147a 100644
--- a/src/core/components/DataTable/head/TableHeadRow.js
+++ b/src/core/components/DataTable/head/TableHeadRow.js
@@ -1,25 +1,20 @@
-import {parseFromValuesOrFunc} from "@/core/utils/utils";
-import {TableRow} from "@mui/material";
+import { parseFromValuesOrFunc } from "@/core/utils/utils";
+import { TableRow } from "@mui/material";
import DataTable_TableHeadCell from "./TableHeadCell";
const DataTable_TableHeadRow = ({
- columnVirtualizer,
- headerGroup,
- table,
- index, // Add index prop
- ...rest
- }) => {
+ columnVirtualizer,
+ headerGroup,
+ table,
+ index, // Add index prop
+ ...rest
+}) => {
const {
- options: {
- enableStickyHeader,
- layoutMode,
- muiTableHeadRowProps,
- },
+ options: { enableStickyHeader, layoutMode, muiTableHeadRowProps },
} = table;
- const {virtualColumns, virtualPaddingLeft, virtualPaddingRight} =
- columnVirtualizer ?? {};
+ const { virtualColumns, virtualPaddingLeft, virtualPaddingRight } = columnVirtualizer ?? {};
- const backgroundColor = index % 2 === 0 ? '#015688' : '#ff5c0f';
+ const backgroundColor = index % 2 === 0 ? "#015688" : "#ff5c0f";
const tableRowProps = {
...parseFromValuesOrFunc(muiTableHeadRowProps, {
@@ -27,20 +22,23 @@ const DataTable_TableHeadRow = ({
table,
}),
...rest,
- sx: (theme) => ({ // Access theme from the sx function
+ sx: (theme) => ({
+ // Access theme from the sx function
...(parseFromValuesOrFunc(muiTableHeadRowProps?.sx, theme) || {}),
backgroundColor, // Apply background color
- display: layoutMode?.startsWith('grid') ? 'flex' : undefined,
- position: enableStickyHeader && layoutMode === 'semantic' ? 'sticky' : 'relative',
+ display: layoutMode?.startsWith("grid") ? "flex" : undefined,
+ position: enableStickyHeader && layoutMode === "semantic" ? "sticky" : "relative",
top: 0,
}),
};
return (
- {virtualPaddingLeft && | }
+ {virtualPaddingLeft && | }
{(virtualColumns ?? headerGroup.headers).map((headerOrVirtualHeader, staticColumnIndex) => {
- const header = columnVirtualizer ? headerGroup.headers[headerOrVirtualHeader.index] : headerOrVirtualHeader;
+ const header = columnVirtualizer
+ ? headerGroup.headers[headerOrVirtualHeader.index]
+ : headerOrVirtualHeader;
return header ? (
) : null;
})}
- {virtualPaddingRight && | }
+ {virtualPaddingRight && | }
);
};
-export default DataTable_TableHeadRow;
\ No newline at end of file
+export default DataTable_TableHeadRow;
diff --git a/src/core/components/DataTable/index.js b/src/core/components/DataTable/index.js
index e440895..f387d06 100644
--- a/src/core/components/DataTable/index.js
+++ b/src/core/components/DataTable/index.js
@@ -4,9 +4,9 @@ import DataTableProvider from "@/lib/contexts/DataTable";
const DataTable = (props) => {
return (
-
+
);
};
-export default DataTable;
\ No newline at end of file
+export default DataTable;
diff --git a/src/core/components/DataTable/localization/fa/datatable.js b/src/core/components/DataTable/localization/fa/datatable.js
index f80b7e0..e36f366 100644
--- a/src/core/components/DataTable/localization/fa/datatable.js
+++ b/src/core/components/DataTable/localization/fa/datatable.js
@@ -67,8 +67,7 @@ export const FA_DATATABLE_LOCALIZATION = {
rowsPerPage: "ردیف در هر صفحه",
save: "ذخیره",
search: "جستجو",
- selectedCountOfRowCountRowsSelected:
- "{selectedCount} از {rowCount} ردیف انتخاب شده",
+ selectedCountOfRowCountRowsSelected: "{selectedCount} از {rowCount} ردیف انتخاب شده",
select: "انتخاب",
showAll: "نمایش همه",
showAllColumns: "نمایش همه ستونها",
@@ -89,4 +88,4 @@ export const FA_DATATABLE_LOCALIZATION = {
unpin: "رها کردن",
unpinAll: "رها کردن همه",
unsorted: "بدون مرتب سازی",
-};
\ No newline at end of file
+};
diff --git a/src/core/components/DataTable/menus/ActionMenuItem.js b/src/core/components/DataTable/menus/ActionMenuItem.js
index 2b208b9..012fcc5 100644
--- a/src/core/components/DataTable/menus/ActionMenuItem.js
+++ b/src/core/components/DataTable/menus/ActionMenuItem.js
@@ -1,12 +1,6 @@
import { Box, IconButton, ListItemIcon, MenuItem } from "@mui/material";
-const DataTable_ActionMenuItem = ({
- icon,
- label,
- onOpenSubMenu,
- table,
- ...rest
-}) => {
+const DataTable_ActionMenuItem = ({ icon, label, onOpenSubMenu, table, ...rest }) => {
const {
options: {
icons: { ArrowRightIcon },
@@ -16,35 +10,29 @@ const DataTable_ActionMenuItem = ({
return (
);
-
-}
-export default DataTable_ActionMenuItem
\ No newline at end of file
+};
+export default DataTable_ActionMenuItem;
diff --git a/src/core/components/DataTable/menus/CellActionMenu.js b/src/core/components/DataTable/menus/CellActionMenu.js
index 36638e0..5b27ca9 100644
--- a/src/core/components/DataTable/menus/CellActionMenu.js
+++ b/src/core/components/DataTable/menus/CellActionMenu.js
@@ -2,10 +2,7 @@ import { parseFromValuesOrFunc } from "@/core/utils/utils";
import { Menu } from "@mui/material";
import DataTable_ActionMenuItem from "./ActionMenuItem";
-const DataTable_CellActionMenu = ({
- table,
- ...rest
-}) => {
+const DataTable_CellActionMenu = ({ table, ...rest }) => {
const {
getState,
options: {
@@ -32,12 +29,11 @@ const DataTable_CellActionMenu = ({
};
const internalMenuItems = [
- (parseFromValuesOrFunc(enableClickToCopy, cell) === 'context-menu' ||
- parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) ===
- 'context-menu') && (
+ (parseFromValuesOrFunc(enableClickToCopy, cell) === "context-menu" ||
+ parseFromValuesOrFunc(columnDef.enableClickToCopy, cell) === "context-menu") && (
}
- key={'mrt-copy'}
+ key={"mrt-copy"}
label={localization.copy}
onClick={(event) => {
event.stopPropagation();
@@ -47,10 +43,10 @@ const DataTable_CellActionMenu = ({
table={table}
/>
),
- parseFromValuesOrFunc(enableEditing, row) && editDisplayMode === 'cell' && (
+ parseFromValuesOrFunc(enableEditing, row) && editDisplayMode === "cell" && (
}
- key={'mrt-edit'}
+ key={"mrt-edit"}
label={localization.edit}
onClick={() => {
openEditingCell({ cell, table });
@@ -71,14 +67,13 @@ const DataTable_CellActionMenu = ({
};
const menuItems =
- columnDef.renderCellActionMenuItems?.(renderActionProps) ??
- renderCellActionMenuItems?.(renderActionProps);
+ columnDef.renderCellActionMenuItems?.(renderActionProps) ?? renderCellActionMenuItems?.(renderActionProps);
return (
(!!menuItems?.length || !!internalMenuItems?.length) && (
);
-}
-export default DataTable_BottomToolbar
\ No newline at end of file
+};
+export default DataTable_BottomToolbar;
diff --git a/src/core/components/DataTable/toolbar/LinearProgressBar.js b/src/core/components/DataTable/toolbar/LinearProgressBar.js
index cdcbc0a..74c465f 100644
--- a/src/core/components/DataTable/toolbar/LinearProgressBar.js
+++ b/src/core/components/DataTable/toolbar/LinearProgressBar.js
@@ -1,11 +1,7 @@
import { parseFromValuesOrFunc } from "@/core/utils/utils";
import { Collapse, LinearProgress } from "@mui/material";
-const DataTable_LinearProgressBar = ({
- isTopToolbar,
- table,
- ...rest
-}) => {
+const DataTable_LinearProgressBar = ({ isTopToolbar, table, ...rest }) => {
const {
getState,
options: { muiLinearProgressProps },
@@ -26,19 +22,19 @@ const DataTable_LinearProgressBar = ({
mountOnEnter
sx={{
bottom: isTopToolbar ? 0 : undefined,
- position: 'absolute',
+ position: "absolute",
top: !isTopToolbar ? 0 : undefined,
- width: '100%',
+ width: "100%",
}}
unmountOnExit
>
);
-}
-export default DataTable_LinearProgressBar
\ No newline at end of file
+};
+export default DataTable_LinearProgressBar;
diff --git a/src/core/components/DataTable/toolbar/TablePagination.js b/src/core/components/DataTable/toolbar/TablePagination.js
index cd70fda..6492b41 100644
--- a/src/core/components/DataTable/toolbar/TablePagination.js
+++ b/src/core/components/DataTable/toolbar/TablePagination.js
@@ -1,16 +1,23 @@
import { flipIconStyles, getCommonTooltipProps, parseFromValuesOrFunc } from "@/core/utils/utils";
import { useTheme } from "@emotion/react";
-import { Box, IconButton, InputLabel, MenuItem, Pagination, PaginationItem, Select, Tooltip, Typography, useMediaQuery } from "@mui/material";
+import {
+ Box,
+ IconButton,
+ InputLabel,
+ MenuItem,
+ Pagination,
+ PaginationItem,
+ Select,
+ Tooltip,
+ Typography,
+ useMediaQuery,
+} from "@mui/material";
const defaultRowsPerPage = [5, 10, 15, 20, 25, 30, 50, 100];
-const DataTable_TablePagination = ({
- position = 'bottom',
- table,
- ...rest
-}) => {
+const DataTable_TablePagination = ({ position = "bottom", table, ...rest }) => {
const theme = useTheme();
- const isMobile = useMediaQuery('(max-width: 720px)');
+ const isMobile = useMediaQuery("(max-width: 720px)");
const {
getState,
@@ -64,26 +71,21 @@ const DataTable_TablePagination = ({
{showRowsPerPage && (
-
+
{localization.rowsPerPage}
@@ -92,22 +94,19 @@ const DataTable_TablePagination = ({
disableUnderline
disabled={disabled}
inputProps={{
- 'aria-label': localization.rowsPerPage,
- id: 'mrt-rows-per-page',
+ "aria-label": localization.rowsPerPage,
+ id: "mrt-rows-per-page",
}}
label={localization.rowsPerPage}
- onChange={(event) =>
- table.setPageSize(+(event.target.value))
- }
+ onChange={(event) => table.setPageSize(+event.target.value)}
sx={{ mb: 0 }}
value={pageSize}
variant="standard"
{...SelectProps}
>
{rowsPerPageOptions.map((option) => {
- const value = typeof option !== 'number' ? option.value : option;
- const label =
- typeof option !== 'number' ? option.label : `${option}`;
+ const value = typeof option !== "number" ? option.value : option;
+ const label = typeof option !== "number" ? option.label : `${option}`;
return (
SelectProps?.children ??
(SelectProps?.native ? (
@@ -124,7 +123,7 @@ const DataTable_TablePagination = ({
)}
- {paginationDisplayMode === 'pages' ? (
+ {paginationDisplayMode === "pages" ? (
- ) : paginationDisplayMode === 'default' ? (
+ ) : paginationDisplayMode === "default" ? (
<>
{`${lastRowIndex === 0 ? 0 : (firstRowIndex + 1).toLocaleString()
- }-${lastRowIndex.toLocaleString()} ${localization.of
- } ${totalRowCount.toLocaleString()}`}
+ >{`${
+ lastRowIndex === 0 ? 0 : (firstRowIndex + 1).toLocaleString()
+ }-${lastRowIndex.toLocaleString()} ${
+ localization.of
+ } ${totalRowCount.toLocaleString()}`}
{showFirstButton && (
@@ -213,5 +214,5 @@ const DataTable_TablePagination = ({
) : null}
);
-}
-export default DataTable_TablePagination
\ No newline at end of file
+};
+export default DataTable_TablePagination;
diff --git a/src/core/components/DataTable/toolbar/ToolbarInternalButtons.js b/src/core/components/DataTable/toolbar/ToolbarInternalButtons.js
index 606add0..9250b89 100644
--- a/src/core/components/DataTable/toolbar/ToolbarInternalButtons.js
+++ b/src/core/components/DataTable/toolbar/ToolbarInternalButtons.js
@@ -16,32 +16,29 @@ const DataTable_ToolbarInternalButtons = ({ table, ...rest }) => {
},
} = table;
-
return (
({
- alignItems: 'center',
- display: 'flex',
+ alignItems: "center",
+ display: "flex",
zIndex: 3,
- ...(parseFromValuesOrFunc(rest?.sx, theme)),
+ ...parseFromValuesOrFunc(rest?.sx, theme),
})}
>
{renderToolbarInternalActions?.({
table,
}) ?? (
- <>
- {enableFilters &&
- enableColumnFilters &&
- columnFilterDisplayMode !== 'popover' && (
-
- )}
- {(enableHiding || enableColumnOrdering || enableColumnPinning) && (
-
- )}
-
- )}
+ <>
+ {enableFilters && enableColumnFilters && columnFilterDisplayMode !== "popover" && (
+
+ )}
+ {(enableHiding || enableColumnOrdering || enableColumnPinning) && (
+
+ )}
+
+ )}
);
-}
-export default DataTable_ToolbarInternalButtons
\ No newline at end of file
+};
+export default DataTable_ToolbarInternalButtons;
diff --git a/src/core/components/DataTable/toolbar/TopToolbar.js b/src/core/components/DataTable/toolbar/TopToolbar.js
index 7a321e2..b0e5297 100644
--- a/src/core/components/DataTable/toolbar/TopToolbar.js
+++ b/src/core/components/DataTable/toolbar/TopToolbar.js
@@ -1,12 +1,12 @@
-import {getCommonToolbarStyles, parseFromValuesOrFunc} from "@/core/utils/utils";
-import {Box, useMediaQuery} from "@mui/material";
+import { getCommonToolbarStyles, parseFromValuesOrFunc } from "@/core/utils/utils";
+import { Box, useMediaQuery } from "@mui/material";
import DataTable_LinearProgressBar from "./LinearProgressBar";
import DataTable_TablePagination from "./TablePagination";
import DataTable_ToolbarInternalButtons from "./ToolbarInternalButtons";
import FilterColumn from "@/core/components/DataTable/filter";
import RefactorTable from "@/core/components/DataTable/refactor/RefactorTable";
-const DataTable_TopToolbar = ({table, columns, table_url, user_id, page_name, table_name}) => {
+const DataTable_TopToolbar = ({ table, columns, table_url, user_id, page_name, table_name }) => {
const {
getState,
options: {
@@ -16,19 +16,16 @@ const DataTable_TopToolbar = ({table, columns, table_url, user_id, page_name, ta
positionPagination,
renderTopToolbarCustomActions,
},
- refs: {topToolbarRef},
+ refs: { topToolbarRef },
} = table;
- const {isFullScreen, showGlobalFilter} = getState();
+ const { isFullScreen, showGlobalFilter } = getState();
- const isMobile = useMediaQuery('(max-width:720px)');
- const isTablet = useMediaQuery('(max-width:1024px)');
+ const isMobile = useMediaQuery("(max-width:720px)");
+ const isTablet = useMediaQuery("(max-width:1024px)");
- const toolbarProps = parseFromValuesOrFunc(muiTopToolbarProps, {table});
+ const toolbarProps = parseFromValuesOrFunc(muiTopToolbarProps, { table });
- const stackAlertBanner =
- isMobile ||
- !!renderTopToolbarCustomActions ||
- (showGlobalFilter && isTablet);
+ const stackAlertBanner = isMobile || !!renderTopToolbarCustomActions || (showGlobalFilter && isTablet);
return (
({
- ...getCommonToolbarStyles({table, theme}),
- position: isFullScreen ? 'sticky' : 'relative',
- top: isFullScreen ? '0' : undefined,
- ...(parseFromValuesOrFunc(toolbarProps?.sx, theme)),
+ ...getCommonToolbarStyles({ table, theme }),
+ position: isFullScreen ? "sticky" : "relative",
+ top: isFullScreen ? "0" : undefined,
+ ...parseFromValuesOrFunc(toolbarProps?.sx, theme),
})}
>
- {renderTopToolbarCustomActions?.({table}) ?? }
+ {renderTopToolbarCustomActions?.({ table }) ?? }
{enableToolbarInternalActions && (
-
-
-
+
+
+
)}
- {enablePagination &&
- ['both', 'top'].includes(positionPagination ?? '') && (
-
- )}
-
+ {enablePagination && ["both", "top"].includes(positionPagination ?? "") && (
+
+ )}
+
);
-}
+};
-export default DataTable_TopToolbar
\ No newline at end of file
+export default DataTable_TopToolbar;
diff --git a/src/core/components/NotificationDesign/AskForKeep.jsx b/src/core/components/NotificationDesign/AskForKeep.jsx
index 7a68d2f..d4721bb 100644
--- a/src/core/components/NotificationDesign/AskForKeep.jsx
+++ b/src/core/components/NotificationDesign/AskForKeep.jsx
@@ -1,47 +1,61 @@
-'use client'
+"use client";
-import SaveIcon from '@mui/icons-material/Save';
-import {Box, Button, Typography} from "@mui/material";
-import DownloadIcon from '@mui/icons-material/Download';
-import {toast} from "react-toastify";
-
-function AskForKeep({onSaveFilter}) {
+import SaveIcon from "@mui/icons-material/Save";
+import { Box, Button, Typography } from "@mui/material";
+import DownloadIcon from "@mui/icons-material/Download";
+import { toast } from "react-toastify";
+function AskForKeep({ onSaveFilter }) {
const handleDismiss = () => {
- toast.dismiss({containerId: "filtering"});
+ toast.dismiss({ containerId: "filtering" });
};
return (
-
-
-
+
+
+
ذخیره سازی اطلاعات
-
+
-
-
- آیا مایل به ذخیره فیلتر های اعمال شده برای دفعات بعد هستید؟
-
+
+ آیا مایل به ذخیره فیلتر های اعمال شده برای دفعات بعد هستید؟
-
-
-
+
+
+ }
+ onClick={onSaveFilter}
+ sx={{
+ backgroundColor: "#155175",
+ ":hover": { backgroundColor: "#155175" },
+ boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
+ }}
+ >
+ ذخیره فیلتر
+
);
}
-export default AskForKeep;
\ No newline at end of file
+export default AskForKeep;
diff --git a/src/core/components/SidebarListItems.jsx b/src/core/components/SidebarListItems.jsx
index d300d7f..050d9a6 100644
--- a/src/core/components/SidebarListItems.jsx
+++ b/src/core/components/SidebarListItems.jsx
@@ -1,77 +1,53 @@
import SidebarSubitems from "@/core/components/SidebarSubitems";
import { ExpandLess, ExpandMore } from "@mui/icons-material";
-import {
- Collapse,
- List,
- ListItem,
- ListItemButton,
- ListItemIcon,
- ListItemText,
-} from "@mui/material";
+import { Collapse, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from "@mui/material";
import Link from "next/link";
const SidebarListItems = ({ menuItem, dispatch }) => {
- return (
- <>
-
- {
- dispatch({ type: "COLLAPSE_MENU", id: menuItem.id });
- }}
- >
-
- {menuItem.icon}
-
-
- {menuItem.hasSubitems ? (
- menuItem.showSubitems ? (
-
- ) : (
-
- )
- ) : null}
-
-
-
- {menuItem.hasSubitems ? (
-
- {menuItem.Subitems.map((subitem, index) => {
- return (
-
- );
- })}
-
- ) : null}
-
-
- );
+ return (
+ <>
+
+ {
+ dispatch({ type: "COLLAPSE_MENU", id: menuItem.id });
+ }}
+ >
+
+ {menuItem.icon}
+
+
+ {menuItem.hasSubitems ? menuItem.showSubitems ? : : null}
+
+
+
+ {menuItem.hasSubitems ? (
+
+ {menuItem.Subitems.map((subitem, index) => {
+ return ;
+ })}
+
+ ) : null}
+
+
+ );
};
export default SidebarListItems;
diff --git a/src/core/components/SidebarMenu.jsx b/src/core/components/SidebarMenu.jsx
index c9f6a73..0ad01dc 100644
--- a/src/core/components/SidebarMenu.jsx
+++ b/src/core/components/SidebarMenu.jsx
@@ -6,127 +6,119 @@ import { useEffect, useReducer, useState } from "react";
import { pageMenu } from "../utils/pageMenu";
function reducer(state, action) {
- switch (action.type) {
- case "COLLAPSE_MENU":
- return state.map((item) =>
- action.id == item.id
- ? {
- ...item,
- showSubitems: !item.showSubitems,
- }
- : item
- );
- case "COLLAPSE_SUB_ITEMS":
- return state.map((item) => {
- return item.hasSubitems
- ? {
- ...item,
- Subitems: item.Subitems.map((subitem) =>
- action.id === subitem.id
- ? {
- ...subitem,
- showSubitems: !subitem.showSubitems,
- }
- : subitem
- ),
- }
- : item;
- });
- case "COLLAPSE_SUB_SECOND_ITEMS":
- return state.map((item) => {
- return item.hasSubitems
- ? {
- ...item,
- Subitems: item.Subitems.map((subitem) => {
- return subitem.hasSubitems
- ? {
- ...subitem,
- Subitems: subitem.Subitems.map((secondSubitem) =>
- action.id === secondSubitem.id
- ? {
- ...secondSubitem,
- showSubitems: !secondSubitem.showSubitems,
- }
- : secondSubitem
- ),
- }
- : subitem;
- }),
- }
- : item;
- });
- case "SELECTED":
- return state.map((item) => {
- return item.type === "page"
- ? {
- ...item,
- selected: action.route === item.route,
- showSubitems: item.route === action.route,
- }
- : item.Subitems && Array.isArray(item.Subitems)
- ? {
- ...item,
- Subitems: item.Subitems.map((subitem) => {
- return subitem.type === "page"
- ? {
- ...subitem,
- selected: action.route === subitem.route,
- showSubitems: subitem.route === action.route,
- }
- : subitem.Subitems && Array.isArray(subitem.Subitems)
- ? {
- ...subitem,
- Subitems: subitem.Subitems.map((secondSubItem) => ({
- ...secondSubItem,
- selected: secondSubItem.route === action.route,
- })),
- showSubitems: subitem.Subitems.some(
- (secondSubItem) => secondSubItem.route === action.route
- ),
- }
- : subitem;
- }),
- showSubitems: item.Subitems.some(
- (subitem) => subitem.showSubitems
- ),
- }
- : item;
- });
+ switch (action.type) {
+ case "COLLAPSE_MENU":
+ return state.map((item) =>
+ action.id == item.id
+ ? {
+ ...item,
+ showSubitems: !item.showSubitems,
+ }
+ : item
+ );
+ case "COLLAPSE_SUB_ITEMS":
+ return state.map((item) => {
+ return item.hasSubitems
+ ? {
+ ...item,
+ Subitems: item.Subitems.map((subitem) =>
+ action.id === subitem.id
+ ? {
+ ...subitem,
+ showSubitems: !subitem.showSubitems,
+ }
+ : subitem
+ ),
+ }
+ : item;
+ });
+ case "COLLAPSE_SUB_SECOND_ITEMS":
+ return state.map((item) => {
+ return item.hasSubitems
+ ? {
+ ...item,
+ Subitems: item.Subitems.map((subitem) => {
+ return subitem.hasSubitems
+ ? {
+ ...subitem,
+ Subitems: subitem.Subitems.map((secondSubitem) =>
+ action.id === secondSubitem.id
+ ? {
+ ...secondSubitem,
+ showSubitems: !secondSubitem.showSubitems,
+ }
+ : secondSubitem
+ ),
+ }
+ : subitem;
+ }),
+ }
+ : item;
+ });
+ case "SELECTED":
+ return state.map((item) => {
+ return item.type === "page"
+ ? {
+ ...item,
+ selected: action.route === item.route,
+ showSubitems: item.route === action.route,
+ }
+ : item.Subitems && Array.isArray(item.Subitems)
+ ? {
+ ...item,
+ Subitems: item.Subitems.map((subitem) => {
+ return subitem.type === "page"
+ ? {
+ ...subitem,
+ selected: action.route === subitem.route,
+ showSubitems: subitem.route === action.route,
+ }
+ : subitem.Subitems && Array.isArray(subitem.Subitems)
+ ? {
+ ...subitem,
+ Subitems: subitem.Subitems.map((secondSubItem) => ({
+ ...secondSubItem,
+ selected: secondSubItem.route === action.route,
+ })),
+ showSubitems: subitem.Subitems.some(
+ (secondSubItem) => secondSubItem.route === action.route
+ ),
+ }
+ : subitem;
+ }),
+ showSubitems: item.Subitems.some((subitem) => subitem.showSubitems),
+ }
+ : item;
+ });
- default:
- throw new Error();
- }
+ default:
+ throw new Error();
+ }
}
const SidebarMenu = () => {
- const [menuItems, dispatch] = useReducer(reducer, pageMenu);
- const pathname = usePathname();
- const [selectedKey, setSelectedKey] = useState(null);
- useEffect(() => {
- dispatch({ type: "SELECTED", route: pathname });
- setSelectedKey(pathname);
- }, [pathname]);
+ const [menuItems, dispatch] = useReducer(reducer, pageMenu);
+ const pathname = usePathname();
+ const [selectedKey, setSelectedKey] = useState(null);
+ useEffect(() => {
+ dispatch({ type: "SELECTED", route: pathname });
+ setSelectedKey(pathname);
+ }, [pathname]);
- useEffect(() => {
- selectedKey &&
- document.querySelector(`[data-route="${selectedKey}"]`)?.scrollIntoView({
- behavior: "smooth",
- block: "center",
- });
- }, [selectedKey]);
+ useEffect(() => {
+ selectedKey &&
+ document.querySelector(`[data-route="${selectedKey}"]`)?.scrollIntoView({
+ behavior: "smooth",
+ block: "center",
+ });
+ }, [selectedKey]);
- return (
-
- {menuItems.map((menuItem) => {
- return (
-
- );
- })}
-
- );
+ return (
+
+ {menuItems.map((menuItem) => {
+ return ;
+ })}
+
+ );
};
export default SidebarMenu;
diff --git a/src/core/components/SidebarSubitems.jsx b/src/core/components/SidebarSubitems.jsx
index b54d3a9..69418ea 100644
--- a/src/core/components/SidebarSubitems.jsx
+++ b/src/core/components/SidebarSubitems.jsx
@@ -1,75 +1,51 @@
import { ExpandLess, ExpandMore } from "@mui/icons-material";
-import {
- Collapse,
- List,
- ListItem,
- ListItemButton,
- ListItemIcon,
- ListItemText,
-} from "@mui/material";
+import { Collapse, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from "@mui/material";
import Link from "next/link";
const SidebarSubitems = ({ subitem, dispatch }) => {
- return (
- <>
-
- {
- dispatch({ type: "COLLAPSE_SUB_ITEMS", id: subitem.id });
- }}
- >
-
- {subitem.icon}
-
-
- {subitem.hasSubitems ? (
- subitem.showSubitems ? (
-
- ) : (
-
- )
- ) : null}
-
-
-
- {subitem.hasSubitems ? (
-
- {subitem.Subitems.map((subSubitem, index) => {
- return (
-
- );
- })}
-
- ) : null}
-
-
- );
+ return (
+ <>
+
+ {
+ dispatch({ type: "COLLAPSE_SUB_ITEMS", id: subitem.id });
+ }}
+ >
+
+ {subitem.icon}
+
+
+ {subitem.hasSubitems ? subitem.showSubitems ? : : null}
+
+
+
+ {subitem.hasSubitems ? (
+
+ {subitem.Subitems.map((subSubitem, index) => {
+ return ;
+ })}
+
+ ) : null}
+
+
+ );
};
export default SidebarSubitems;
diff --git a/src/core/components/Toasts/error.jsx b/src/core/components/Toasts/error.jsx
index d0d9760..e93138b 100644
--- a/src/core/components/Toasts/error.jsx
+++ b/src/core/components/Toasts/error.jsx
@@ -3,189 +3,185 @@ import { Box, Typography } from "@mui/material";
import { Dangerous } from "@mui/icons-material";
export const errorServerToast = (toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {"The request failed due to an internal error."}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: 5000,
- hideProgressBar: true,
- pauseOnHover: true,
- closeOnClick: false,
- draggable: true,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+ {"The request failed due to an internal error."}
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: 5000,
+ hideProgressBar: true,
+ pauseOnHover: true,
+ closeOnClick: false,
+ draggable: true,
+ }
+ );
export const errorUnauthorizedToast = (toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {"The user is not authorized to make the request."}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: 3000,
- hideProgressBar: true,
- pauseOnHover: true,
- closeOnClick: false,
- draggable: true,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+ {"The user is not authorized to make the request."}
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: 3000,
+ hideProgressBar: true,
+ pauseOnHover: true,
+ closeOnClick: false,
+ draggable: true,
+ }
+ );
export const errorLogicToast = (message, toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {message ||
- "The request was well-formed but was unable to be followed due to semantic errors."}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: false,
- closeOnClick: false,
- draggable: false,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+
+ {message ||
+ "The request was well-formed but was unable to be followed due to semantic errors."}
+
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: false,
+ closeOnClick: false,
+ draggable: false,
+ }
+ );
export const errorValidationToast = (message, toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {message ||
- "The request was well-formed but was unable to be followed due to semantic errors."}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: false,
- closeOnClick: false,
- draggable: false,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+
+ {message ||
+ "The request was well-formed but was unable to be followed due to semantic errors."}
+
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: false,
+ closeOnClick: false,
+ draggable: false,
+ }
+ );
export const errorTooManyToast = (toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {"Too many requests have been sent within a given time span."}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: false,
- closeOnClick: false,
- draggable: false,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+
+ {"Too many requests have been sent within a given time span."}
+
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: false,
+ closeOnClick: false,
+ draggable: false,
+ }
+ );
export const errorClientToast = (toastContainer) =>
- toast.error(
- () => (
-
-
-
-
-
- {
- "The API request is invalid or improperly formed. Consequently, the API server could not understand the request."
- }
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: false,
- closeOnClick: false,
- draggable: false,
- }
- );
+ toast.error(
+ () => (
+
+
+
+
+
+ {
+ "The API request is invalid or improperly formed. Consequently, the API server could not understand the request."
+ }
+
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: false,
+ closeOnClick: false,
+ draggable: false,
+ }
+ );
diff --git a/src/core/components/Toasts/success.jsx b/src/core/components/Toasts/success.jsx
index b405a04..36023c6 100644
--- a/src/core/components/Toasts/success.jsx
+++ b/src/core/components/Toasts/success.jsx
@@ -3,33 +3,31 @@ import { Box, Typography } from "@mui/material";
import { Beenhere } from "@mui/icons-material";
export const successToast = (toastContainer) =>
- toast.success(
- () => (
-
-
-
-
-
- {"Your operation was successful"}
-
-
-
-
- ),
- {
- icon: false,
- containerId: toastContainer,
- autoClose: 3000,
- hideProgressBar: true,
- pauseOnHover: true,
- closeOnClick: false,
- draggable: true,
- }
- );
+ toast.success(
+ () => (
+
+
+
+
+ {"Your operation was successful"}
+
+
+
+ ),
+ {
+ icon: false,
+ containerId: toastContainer,
+ autoClose: 3000,
+ hideProgressBar: true,
+ pauseOnHover: true,
+ closeOnClick: false,
+ draggable: true,
+ }
+ );
diff --git a/src/core/middlewares/withAuth.js b/src/core/middlewares/withAuth.js
index 1b93025..216b55b 100644
--- a/src/core/middlewares/withAuth.js
+++ b/src/core/middlewares/withAuth.js
@@ -1,22 +1,22 @@
-'use client'
+"use client";
import { useAuth } from "@/lib/contexts/auth";
import { usePathname, useRouter } from "next/navigation";
import { useEffect } from "react";
function WithAuthMiddleware({ children }) {
- const router = useRouter()
- const pathName = usePathname()
+ const router = useRouter();
+ const pathName = usePathname();
const { isAuth, initAuthState } = useAuth();
useEffect(() => {
- if (!initAuthState) return
+ if (!initAuthState) return;
if (!isAuth) {
- router.replace(`${process.env.NEXT_PUBLIC_API_URL}/login?_back=${encodeURIComponent(pathName)}`)
+ router.replace(`${process.env.NEXT_PUBLIC_API_URL}/login?_back=${encodeURIComponent(pathName)}`);
}
- }, [isAuth, initAuthState])
+ }, [isAuth, initAuthState]);
if (!initAuthState || !isAuth) return null;
- return <>{children}
+ return <>{children};
}
-export default WithAuthMiddleware
\ No newline at end of file
+export default WithAuthMiddleware;
diff --git a/src/core/utils/cacheRtl.js b/src/core/utils/cacheRtl.js
index bf8c809..1393e2e 100644
--- a/src/core/utils/cacheRtl.js
+++ b/src/core/utils/cacheRtl.js
@@ -1,16 +1,16 @@
-'use client'
+"use client";
import createCache from "@emotion/cache";
-import {prefixer} from "stylis";
+import { prefixer } from "stylis";
import stylisRTLPlugin from "stylis-plugin-rtl";
-import {CacheProvider} from "@emotion/react";
+import { CacheProvider } from "@emotion/react";
const cache = createCache({
- key: 'mui-rtl',
+ key: "mui-rtl",
stylisPlugins: [prefixer, stylisRTLPlugin],
});
const cacheProviderRtl = (props) => {
return {props.children};
-}
+};
-export default cacheProviderRtl
\ No newline at end of file
+export default cacheProviderRtl;
diff --git a/src/core/utils/errorResponse.js b/src/core/utils/errorResponse.js
index 3accb8f..1802581 100644
--- a/src/core/utils/errorResponse.js
+++ b/src/core/utils/errorResponse.js
@@ -1,4 +1,4 @@
-'use client'
+"use client";
import { toast } from "react-toastify";
import {
errorClientToast,
@@ -6,56 +6,55 @@ import {
errorServerToast,
errorTooManyToast,
errorUnauthorizedToast,
- errorValidationToast
+ errorValidationToast,
} from "@/core/components/toasts/error";
-const isServerError = status => status >= 500 && status <= 599;
-const isClientError = status => status >= 400 && status <= 499;
+const isServerError = (status) => status >= 500 && status <= 599;
+const isClientError = (status) => status >= 400 && status <= 499;
const errorServer = (response, notification, toastContainer) => {
- if (notification) errorServerToast(toastContainer)
-}
+ if (notification) errorServerToast(toastContainer);
+};
const errorClient = (response, notification, toastContainer) => {
switch (response.status) {
case 401:
- if (notification) errorUnauthorizedToast(toastContainer)
+ if (notification) errorUnauthorizedToast(toastContainer);
break;
case 422:
- if ('type' in response.data) {
+ if ("type" in response.data) {
if (Array.isArray(response.data.message)) {
response.data.message.map((item) => {
- if (notification) errorLogicToast(item, toastContainer)
- })
+ if (notification) errorLogicToast(item, toastContainer);
+ });
} else {
- if (notification) errorLogicToast(response.data.message, toastContainer)
+ if (notification) errorLogicToast(response.data.message, toastContainer);
}
break;
}
if (notification) {
- const errorsMap = Object.keys(response.data.errors)
- const errorsArray = response.data.errors
+ const errorsMap = Object.keys(response.data.errors);
+ const errorsArray = response.data.errors;
errorsMap.map((item, index) => {
errorValidationToast(errorsArray[item][0], toastContainer);
- })
-
+ });
}
break;
case 429:
- if (notification) errorTooManyToast(toastContainer)
- break
+ if (notification) errorTooManyToast(toastContainer);
+ break;
default:
- if (notification) errorClientToast(toastContainer)
- break
+ if (notification) errorClientToast(toastContainer);
+ break;
}
-}
+};
export const errorResponse = (response, notification, toastContainer) => {
- if (notification) toast.dismiss({ container: toastContainer })
+ if (notification) toast.dismiss({ container: toastContainer });
if (isServerError(response.status)) {
- errorServer(response, notification, toastContainer)
+ errorServer(response, notification, toastContainer);
} else if (isClientError(response.status)) {
- errorClient(response, notification, toastContainer)
+ errorClient(response, notification, toastContainer);
}
-}
+};
diff --git a/src/core/utils/flattenArrayOfObjects.js b/src/core/utils/flattenArrayOfObjects.js
index 4dd4612..5b1564c 100644
--- a/src/core/utils/flattenArrayOfObjects.js
+++ b/src/core/utils/flattenArrayOfObjects.js
@@ -7,4 +7,4 @@ export const flattenArrayOfObjects = (array, key) => {
}
return acc;
}, []);
-};
\ No newline at end of file
+};
diff --git a/src/core/utils/pageMenu.js b/src/core/utils/pageMenu.js
index 81cb873..6145ffd 100644
--- a/src/core/utils/pageMenu.js
+++ b/src/core/utils/pageMenu.js
@@ -2,346 +2,346 @@ import { AirlineSeatReclineNormal, Assessment, Repartition, Security, SpaceDashb
export const pageMenu = [
{
- id: 'dashboard',
- label: 'پیشخوان',
+ id: "dashboard",
+ label: "پیشخوان",
type: "page",
route: "/dashboard",
- icon: ,
+ icon: ,
},
{
- id: 'userManagement',
- label: 'مدیریت کاربران',
+ id: "userManagement",
+ label: "مدیریت کاربران",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/user_management",
- icon: ,
+ icon: ,
},
{
- id: 'projectsManagment',
- label: 'پروژه های راهداری',
+ id: "projectsManagment",
+ label: "پروژه های راهداری",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'projectsManagmentFinance',
- label: 'ثبت قرارداد و پروژه',
+ id: "projectsManagmentFinance",
+ label: "ثبت قرارداد و پروژه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/rahdari_projects/finance",
- icon: ,
+ icon: ,
},
{
- id: 'projectsManagmentList',
- label: 'لیست پروژه ها',
+ id: "projectsManagmentList",
+ label: "لیست پروژه ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/rahdari_projects/projects_list",
- icon: ,
+ icon: ,
},
{
- id: 'projectsManagmentProposal',
- label: 'پروژه های پیشنهادی',
+ id: "projectsManagmentProposal",
+ label: "پروژه های پیشنهادی",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/rahdari_projects/proposal",
- icon: ,
+ icon: ,
},
{
- id: 'projectsManagmentLawmaker',
- label: 'درخواست نمایندگان',
+ id: "projectsManagmentLawmaker",
+ label: "درخواست نمایندگان",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/rahdari_projects/lawmakers",
- icon: ,
+ icon: ,
},
{
- id: 'projectsManagmentMap',
- label: 'پراکندگی بر روی نقشه',
+ id: "projectsManagmentMap",
+ label: "پراکندگی بر روی نقشه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=rahdari_projects",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'roadItemManagment',
- label: 'فعالیت های روزانه',
+ id: "roadItemManagment",
+ label: "فعالیت های روزانه",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadItemManagmentSupervisor',
- label: 'ارزیابی',
+ id: "roadItemManagmentSupervisor",
+ label: "ارزیابی",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadItemManagmentSupervisorCartable',
- label: 'کارتابل',
+ id: "roadItemManagmentSupervisorCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_items/supervisor/cartable",
},
- ]
+ ],
},
{
- id: 'roadItemManagmentOparation',
- label: 'عملیات',
+ id: "roadItemManagmentOparation",
+ label: "عملیات",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadItemManagmentOparationCreate',
- label: 'ثبت فعالیت',
+ id: "roadItemManagmentOparationCreate",
+ label: "ثبت فعالیت",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_items/operator/create",
},
{
- id: 'roadItemManagmentOparationCartable',
- label: 'کارتابل',
+ id: "roadItemManagmentOparationCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_items/operator/cartable",
},
- ]
+ ],
},
{
- id: 'roadItemManagmentMap',
- label: 'پراکندگی بر روی نقشه',
+ id: "roadItemManagmentMap",
+ label: "پراکندگی بر روی نقشه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=road_items",
- icon: ,
+ icon: ,
},
{
- id: 'roadItemManagmentReport',
- label: 'گزارش ها',
+ id: "roadItemManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_items/report",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'roadPatrolManagment',
- label: 'گشت راهداری و ترابری',
+ id: "roadPatrolManagment",
+ label: "گشت راهداری و ترابری",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadPatrolManagmentSupervisor',
- label: 'ارزیابی',
+ id: "roadPatrolManagmentSupervisor",
+ label: "ارزیابی",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadPatrolManagmentSupervisorCartable',
- label: 'کارتابل',
+ id: "roadPatrolManagmentSupervisorCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/road_patrols/supervisor/cartable",
},
- ]
+ ],
},
{
- id: 'roadPatrolManagmentOparation',
- label: 'عملیات',
+ id: "roadPatrolManagmentOparation",
+ label: "عملیات",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadPatrolManagmentOparationCreate',
- label: 'ثبت اقدام',
+ id: "roadPatrolManagmentOparationCreate",
+ label: "ثبت اقدام",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/operator/create",
},
{
- id: 'roadPatrolManagmentOparationCartable',
- label: 'کارتابل',
+ id: "roadPatrolManagmentOparationCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/operator/cartable",
},
- ]
+ ],
},
{
- id: 'roadPatrolManagmentMap',
- label: 'پراکندگی بر روی نقشه',
+ id: "roadPatrolManagmentMap",
+ label: "پراکندگی بر روی نقشه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=road_patrols",
- icon: ,
+ icon: ,
},
{
- id: 'roadPatrolManagmentReport',
- label: 'گزارش ها',
+ id: "roadPatrolManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_patrols/report",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'safetyAndPrivacyManagment',
- label: 'نگهداری حریم راه',
+ id: "safetyAndPrivacyManagment",
+ label: "نگهداری حریم راه",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'safetyAndPrivacyManagmentOparation',
- label: 'عملیات',
+ id: "safetyAndPrivacyManagmentOparation",
+ label: "عملیات",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'safetyAndPrivacyManagmentOparationCreate',
- label: 'ثبت فعالیت',
+ id: "safetyAndPrivacyManagmentOparationCreate",
+ label: "ثبت فعالیت",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/safety_and_privacy/operator/first_step",
},
{
- id: 'safetyAndPrivacyManagmentOparationCartable',
- label: 'کارتابل',
+ id: "safetyAndPrivacyManagmentOparationCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/safety_and_privacy/operator/cartable",
},
- ]
+ ],
},
{
- id: 'safetyAndPrivacyManagmentMap',
- label: 'پراکندگی بر روی نقشه',
+ id: "safetyAndPrivacyManagmentMap",
+ label: "پراکندگی بر روی نقشه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=safety_and_privacy",
- icon: ,
+ icon: ,
},
{
- id: 'safetyAndPrivacyManagmentReport',
- label: 'گزارش ها',
+ id: "safetyAndPrivacyManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/safety_and_privacy/report",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'roadObservationsManagment',
- label: 'واکنش سریع',
+ id: "roadObservationsManagment",
+ label: "واکنش سریع",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadObservationsManagmentSupervisor',
- label: 'ارزیابی',
+ id: "roadObservationsManagmentSupervisor",
+ label: "ارزیابی",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadObservationsManagmentSupervisorCartable',
- label: 'کارتابل',
+ id: "roadObservationsManagmentSupervisorCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_observations/supervisor/cartable",
},
- ]
+ ],
},
{
- id: 'roadObservationsManagmentList',
- label: 'رسیدگی به شکایات',
+ id: "roadObservationsManagmentList",
+ label: "رسیدگی به شکایات",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_observations",
- icon: ,
+ icon: ,
},
{
- id: 'roadObservationsManagmentOparation',
- label: 'عملیات',
+ id: "roadObservationsManagmentOparation",
+ label: "عملیات",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'roadObservationsManagmentOparationCartable',
- label: 'کارتابل',
+ id: "roadObservationsManagmentOparationCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_observations/operator/cartable",
},
- ]
+ ],
},
{
- id: 'roadObservationsManagmentMap',
- label: 'پراکندگی بر روی نقشه',
+ id: "roadObservationsManagmentMap",
+ label: "پراکندگی بر روی نقشه",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=road_observations",
- icon: ,
+ icon: ,
},
{
- id: 'roadObservationsManagmentReport',
- label: 'گزارش ها',
+ id: "roadObservationsManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/road_observations/report/index",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'winterCampManagment',
- label: 'قرارگاه زمستانی',
+ id: "winterCampManagment",
+ label: "قرارگاه زمستانی",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'winterCampManagmentBlocking',
- label: 'محور های انسدادی',
+ id: "winterCampManagmentBlocking",
+ label: "محور های انسدادی",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/winter_camp",
- icon: ,
+ icon: ,
},
{
- id: 'winterCampManagmentFirstRing',
- label: 'محور های حلقه اول',
+ id: "winterCampManagmentFirstRing",
+ label: "محور های حلقه اول",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=camp",
- icon: ,
+ icon: ,
},
{
- id: 'winterCampManagmentReport',
- label: 'گزارش ها',
+ id: "winterCampManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/map?type=campNew",
- icon: ,
+ icon: ,
},
- ]
+ ],
},
{
- id: 'receiptManagment',
- label: 'خسارات وارده بر ابنیه فنی و تاسیسات راه',
+ id: "receiptManagment",
+ label: "خسارات وارده بر ابنیه فنی و تاسیسات راه",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'receiptManagmentOparation',
- label: 'عملیات',
+ id: "receiptManagmentOparation",
+ label: "عملیات",
type: "menu",
- icon: ,
+ icon: ,
hasSubitems: true,
Subitems: [
{
- id: 'receiptManagmentOparationCartable',
- label: 'کارتابل',
+ id: "receiptManagmentOparationCartable",
+ label: "کارتابل",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/receipt",
},
- ]
+ ],
},
{
- id: 'receiptManagmentReport',
- label: 'گزارش ها',
+ id: "receiptManagmentReport",
+ label: "گزارش ها",
type: "page",
route: process.env.NEXT_PUBLIC_API_URL + "/v2/receipt/report",
- icon: ,
+ icon: ,
},
- ]
- }
+ ],
+ },
// {
// id: "hello",
// type: "menu",
@@ -383,4 +383,4 @@ export const pageMenu = [
// hasSubitems: true,
// showSubitems: false
// },
-]
\ No newline at end of file
+];
diff --git a/src/core/utils/routes.js b/src/core/utils/routes.js
index 39b6b09..8fae96f 100644
--- a/src/core/utils/routes.js
+++ b/src/core/utils/routes.js
@@ -1,4 +1,4 @@
-const api = process.env.NEXT_PUBLIC_API_URL
+const api = process.env.NEXT_PUBLIC_API_URL;
-export const GET_USER_ROUTE = api + '/webapi/user/get-permission'
-export const GET_LOGIN_ROUTE = api + '/test_login'
\ No newline at end of file
+export const GET_USER_ROUTE = api + "/webapi/user/get-permission";
+export const GET_LOGIN_ROUTE = api + "/login_dev";
diff --git a/src/core/utils/successRequest.js b/src/core/utils/successRequest.js
index 5138d7a..d23776a 100644
--- a/src/core/utils/successRequest.js
+++ b/src/core/utils/successRequest.js
@@ -1,10 +1,10 @@
-'use client'
+"use client";
import { toast } from "react-toastify";
import { successToast } from "@/core/components/toasts/success";
export const successRequest = (notification, toastContainer) => {
if (notification) {
- toast.dismiss({ container: toastContainer })
- successToast(toastContainer)
+ toast.dismiss({ container: toastContainer });
+ successToast(toastContainer);
}
-}
\ No newline at end of file
+};
diff --git a/src/core/utils/theme.js b/src/core/utils/theme.js
index 581e23e..f32031b 100644
--- a/src/core/utils/theme.js
+++ b/src/core/utils/theme.js
@@ -1,22 +1,22 @@
-'use client'
+"use client";
import { createTheme } from "@mui/material";
const theme = createTheme({
- direction: 'rtl',
+ direction: "rtl",
typography: {
fontFamily: `IRANSansFaNum, sans-serif`,
- fontSize: 12
+ fontSize: 12,
},
palette: {
primary: {
- main: '#2070af',
- contrastText: '#fff'
+ main: "#2070af",
+ contrastText: "#fff",
},
primary2: {
- main: '#015688',
- contrastText: '#fff'
+ main: "#015688",
+ contrastText: "#fff",
},
- }
+ },
});
-export default theme
\ No newline at end of file
+export default theme;
diff --git a/src/core/utils/utils.js b/src/core/utils/utils.js
index 98e0252..a0a320d 100644
--- a/src/core/utils/utils.js
+++ b/src/core/utils/utils.js
@@ -1,162 +1,120 @@
import { alpha, darken } from "@mui/material";
-export const parseCSSVarId = (id) => id.replace(/[^a-zA-Z0-9]/g, '_');
+export const parseCSSVarId = (id) => id.replace(/[^a-zA-Z0-9]/g, "_");
-export const parseFromValuesOrFunc = (
- fn,
- arg
-) => (fn instanceof Function ? fn(arg) : fn);
+export const parseFromValuesOrFunc = (fn, arg) => (fn instanceof Function ? fn(arg) : fn);
-export const getCommonToolbarStyles = ({
- table,
-}) => ({
- alignItems: 'flex-start',
- backgroundColor: table.options.mrtTheme.baseBackgroundColor,
- display: 'grid',
- flexWrap: 'wrap-reverse',
- minHeight: '3.5rem',
- overflow: 'hidden',
- position: 'relative',
- transition: 'all 150ms ease-in-out',
- zIndex: 1,
+export const getCommonToolbarStyles = ({ table }) => ({
+ alignItems: "flex-start",
+ backgroundColor: table.options.mrtTheme.baseBackgroundColor,
+ display: "grid",
+ flexWrap: "wrap-reverse",
+ minHeight: "3.5rem",
+ overflow: "hidden",
+ position: "relative",
+ transition: "all 150ms ease-in-out",
+ zIndex: 1,
});
-export const getCommonTooltipProps = (
- placement,
-) => ({
- disableInteractive: true,
- enterDelay: 500,
- enterNextDelay: 500,
- placement,
+export const getCommonTooltipProps = (placement) => ({
+ disableInteractive: true,
+ enterDelay: 500,
+ enterNextDelay: 500,
+ placement,
});
export const flipIconStyles = (theme) =>
- theme.direction === 'rtl'
- ? { style: { transform: 'scaleX(-1)' } }
- : undefined;
+ theme.direction === "rtl" ? { style: { transform: "scaleX(-1)" } } : undefined;
-export const getCommonPinnedCellStyles = ({
- column,
- table,
- theme,
-}) => {
- const { baseBackgroundColor } = table.options.mrtTheme;
- const isPinned = column?.getIsPinned();
+export const getCommonPinnedCellStyles = ({ column, table, theme }) => {
+ const { baseBackgroundColor } = table.options.mrtTheme;
+ const isPinned = column?.getIsPinned();
- return {
- '&[data-pinned="true"]': {
- '&:before': {
- backgroundColor: alpha(
- darken(
- baseBackgroundColor,
- theme.palette.mode === 'dark' ? 0.05 : 0.01,
- ),
- 0.97,
- ),
- boxShadow: column
- ? isPinned === 'left' && column.getIsLastColumn(isPinned)
- ? `-4px 0 4px -4px ${alpha(theme.palette.grey[700], 0.5)} inset`
- : isPinned === 'right' && column.getIsFirstColumn(isPinned)
- ? `4px 0 4px -4px ${alpha(theme.palette.grey[700], 0.5)} inset`
- : undefined
- : undefined,
- ...commonCellBeforeAfterStyles,
- },
- },
- };
+ return {
+ '&[data-pinned="true"]': {
+ "&:before": {
+ backgroundColor: alpha(darken(baseBackgroundColor, theme.palette.mode === "dark" ? 0.05 : 0.01), 0.97),
+ boxShadow: column
+ ? isPinned === "left" && column.getIsLastColumn(isPinned)
+ ? `-4px 0 4px -4px ${alpha(theme.palette.grey[700], 0.5)} inset`
+ : isPinned === "right" && column.getIsFirstColumn(isPinned)
+ ? `4px 0 4px -4px ${alpha(theme.palette.grey[700], 0.5)} inset`
+ : undefined
+ : undefined,
+ ...commonCellBeforeAfterStyles,
+ },
+ },
+ };
};
-export const getCommonMRTCellStyles = ({
- column,
- header,
- table,
- tableCellProps,
- theme,
-}) => {
- const {
- getState,
- options: { enableColumnVirtualization, layoutMode },
- } = table;
- const { draggingColumn } = getState();
- const { columnDef } = column;
- const { columnDefType } = columnDef;
+export const getCommonMRTCellStyles = ({ column, header, table, tableCellProps, theme }) => {
+ const {
+ getState,
+ options: { enableColumnVirtualization, layoutMode },
+ } = table;
+ const { draggingColumn } = getState();
+ const { columnDef } = column;
+ const { columnDefType } = columnDef;
- const isColumnPinned =
- columnDef.columnDefType !== 'group' && column.getIsPinned();
+ const isColumnPinned = columnDef.columnDefType !== "group" && column.getIsPinned();
- const widthStyles = {
- minWidth: `max(calc(var(--${header ? 'header' : 'col'}-${parseCSSVarId(
- header?.id ?? column.id,
- )}-size) * 1px), ${columnDef.minSize ?? 30}px)`,
- width: `calc(var(--${header ? 'header' : 'col'}-${parseCSSVarId(
- header?.id ?? column.id,
- )}-size) * 1px)`,
- };
+ const widthStyles = {
+ minWidth: `max(calc(var(--${header ? "header" : "col"}-${parseCSSVarId(
+ header?.id ?? column.id
+ )}-size) * 1px), ${columnDef.minSize ?? 30}px)`,
+ width: `calc(var(--${header ? "header" : "col"}-${parseCSSVarId(header?.id ?? column.id)}-size) * 1px)`,
+ };
- if (layoutMode === 'grid') {
- widthStyles.flex = `${[0, false].includes(columnDef.grow)
- ? 0
- : `var(--${header ? 'header' : 'col'}-${parseCSSVarId(
- header?.id ?? column.id,
- )}-size)`
- } 0 auto`;
- } else if (layoutMode === 'grid-no-grow') {
- widthStyles.flex = `${+(columnDef.grow || 0)} 0 auto`;
- }
-
- const pinnedStyles = isColumnPinned
- ? {
- ...getCommonPinnedCellStyles({ column, table, theme }),
- left:
- isColumnPinned === 'left'
- ? `${column.getStart('left')}px`
- : undefined,
- opacity: 0.97,
- position: 'sticky',
- right:
- isColumnPinned === 'right'
- ? `${column.getAfter('right')}px`
- : undefined,
+ if (layoutMode === "grid") {
+ widthStyles.flex = `${
+ [0, false].includes(columnDef.grow)
+ ? 0
+ : `var(--${header ? "header" : "col"}-${parseCSSVarId(header?.id ?? column.id)}-size)`
+ } 0 auto`;
+ } else if (layoutMode === "grid-no-grow") {
+ widthStyles.flex = `${+(columnDef.grow || 0)} 0 auto`;
}
- : {};
- return {
- backgroundColor: 'inherit',
- backgroundImage: 'inherit',
- display: layoutMode?.startsWith('grid') ? 'flex' : undefined,
- justifyContent:
- columnDefType === 'group'
- ? 'center'
- : layoutMode?.startsWith('grid')
- ? tableCellProps.align
- : undefined,
- opacity:
- table.getState().draggingColumn?.id === column.id ||
- table.getState().hoveredColumn?.id === column.id
- ? 0.5
- : 1,
- position: 'relative',
- transition: enableColumnVirtualization
- ? 'none'
- : `padding 150ms ease-in-out`,
- zIndex:
- column.getIsResizing() || draggingColumn?.id === column.id
- ? 2
- : columnDefType !== 'group' && isColumnPinned
- ? 1
- : 0,
- ...pinnedStyles,
- ...widthStyles,
- ...(parseFromValuesOrFunc(tableCellProps?.sx, theme)),
- };
+ const pinnedStyles = isColumnPinned
+ ? {
+ ...getCommonPinnedCellStyles({ column, table, theme }),
+ left: isColumnPinned === "left" ? `${column.getStart("left")}px` : undefined,
+ opacity: 0.97,
+ position: "sticky",
+ right: isColumnPinned === "right" ? `${column.getAfter("right")}px` : undefined,
+ }
+ : {};
+
+ return {
+ backgroundColor: "inherit",
+ backgroundImage: "inherit",
+ display: layoutMode?.startsWith("grid") ? "flex" : undefined,
+ justifyContent:
+ columnDefType === "group" ? "center" : layoutMode?.startsWith("grid") ? tableCellProps.align : undefined,
+ opacity:
+ table.getState().draggingColumn?.id === column.id || table.getState().hoveredColumn?.id === column.id
+ ? 0.5
+ : 1,
+ position: "relative",
+ transition: enableColumnVirtualization ? "none" : `padding 150ms ease-in-out`,
+ zIndex:
+ column.getIsResizing() || draggingColumn?.id === column.id
+ ? 2
+ : columnDefType !== "group" && isColumnPinned
+ ? 1
+ : 0,
+ ...pinnedStyles,
+ ...widthStyles,
+ ...parseFromValuesOrFunc(tableCellProps?.sx, theme),
+ };
};
export const commonCellBeforeAfterStyles = {
- content: '""',
- height: '100%',
- left: 0,
- position: 'absolute',
- top: 0,
- width: '100%',
- zIndex: -1,
-};
\ No newline at end of file
+ content: '""',
+ height: "100%",
+ left: 0,
+ position: "absolute",
+ top: 0,
+ width: "100%",
+ zIndex: -1,
+};
diff --git a/src/lib/contexts/DataTable.js b/src/lib/contexts/DataTable.js
index 975b859..fb03fd7 100644
--- a/src/lib/contexts/DataTable.js
+++ b/src/lib/contexts/DataTable.js
@@ -1,15 +1,11 @@
-import {createContext, useState} from "react";
+import { createContext, useState } from "react";
export const DataTableContext = createContext();
-const DataTableProvider = ({children}) => {
+const DataTableProvider = ({ children }) => {
const [filterData, setFilterData] = useState({});
- return (
-
- {children}
-
- );
+ return {children};
};
-export default DataTableProvider;
\ No newline at end of file
+export default DataTableProvider;
diff --git a/src/lib/contexts/auth.js b/src/lib/contexts/auth.js
index e60f413..f2df0e6 100644
--- a/src/lib/contexts/auth.js
+++ b/src/lib/contexts/auth.js
@@ -1,12 +1,12 @@
-'use client'
-import { createContext, useCallback, useContext, useEffect, useReducer } from 'react';
-import useRequest from '../hooks/useRequest';
-import { GET_USER_ROUTE } from '@/core/utils/routes';
+"use client";
+import { createContext, useCallback, useContext, useEffect, useReducer } from "react";
+import useRequest from "../hooks/useRequest";
+import { GET_USER_ROUTE } from "@/core/utils/routes";
const initAuth = {
initAuthState: false,
isAuth: false,
- user: {}
+ user: {},
};
const authReducer = (state, action) => {
@@ -28,7 +28,7 @@ const AuthContext = createContext();
export const AuthProvider = ({ children }) => {
const [state, dispatch] = useReducer(authReducer, initAuth);
- const request = useRequest()
+ const request = useRequest();
const clearUser = useCallback(() => {
dispatch({ type: "CLEAR_USER" });
@@ -48,7 +48,7 @@ export const AuthProvider = ({ children }) => {
const getUser = useCallback(async () => {
try {
- const { data } = await request(GET_USER_ROUTE, 'get')
+ const { data } = await request(GET_USER_ROUTE, "get");
changeUser(data);
changeAuthState(true);
changeInitAuth(true);
@@ -62,15 +62,21 @@ export const AuthProvider = ({ children }) => {
}, [clearUser, changeUser, changeAuthState, changeInitAuth]);
useEffect(() => {
- getUser()
- }, [])
+ getUser();
+ }, []);
- return {children};
+ return (
+
+ {children}
+
+ );
};
-export const useAuth = () => useContext(AuthContext);
\ No newline at end of file
+export const useAuth = () => useContext(AuthContext);
diff --git a/src/lib/contexts/tableSetting.js b/src/lib/contexts/tableSetting.js
index abc2ad7..3611df9 100644
--- a/src/lib/contexts/tableSetting.js
+++ b/src/lib/contexts/tableSetting.js
@@ -1,26 +1,26 @@
-'use client'
-import {createContext, useCallback, useEffect, useState} from "react";
+"use client";
+import { createContext, useCallback, useEffect, useState } from "react";
export const TableSettingContext = createContext();
-export const TableSettingProvider = ({children}) => {
+export const TableSettingProvider = ({ children }) => {
const [settingStore, setSettingStore] = useState({});
useEffect(() => {
- const _localStorage = localStorage.getItem("_setting-app")
+ const _localStorage = localStorage.getItem("_setting-app");
if (_localStorage) {
- setSettingStore(JSON.parse(_localStorage))
+ setSettingStore(JSON.parse(_localStorage));
}
}, []);
const hideAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
updateSettingStorage(user_id, page_name, table_name, "hides", settingValue, columns);
- }, [])
+ }, []);
const sortAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue, columns);
- }, [])
+ }, []);
const filterAction = (user_id, page_name, table_name, settingValue, columns) => {
updateSettingStorage(user_id, page_name, table_name, "filters", settingValue, columns);
- }
+ };
const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue, columns) => {
const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
const userSettings = prevLocalStorage[user_id] || {};
@@ -30,7 +30,7 @@ export const TableSettingProvider = ({children}) => {
if (settingType === "sorts" || settingType === "filters") {
newSettings = [...settingValue];
} else {
- newSettings = {...tableSettings[settingType] || {}, ...settingValue};
+ newSettings = { ...(tableSettings[settingType] || {}), ...settingValue };
}
const updatedLocalStorage = {
...prevLocalStorage,
@@ -40,18 +40,21 @@ export const TableSettingProvider = ({children}) => {
...pageSettings,
[table_name]: {
...tableSettings,
- [settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
- summary: SummaryTextMessage({
- ...tableSettings,
- [settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
- }, columns)
+ [settingType]: Array.isArray(settingValue) ? [...newSettings] : { ...newSettings },
+ summary: SummaryTextMessage(
+ {
+ ...tableSettings,
+ [settingType]: Array.isArray(settingValue) ? [...newSettings] : { ...newSettings },
+ },
+ columns
+ ),
},
},
},
};
localStorage.setItem("_setting-app", JSON.stringify(updatedLocalStorage));
setSettingStore(updatedLocalStorage);
- }
+ };
const refactorAction = (user_id, page_name, table_name) => {
const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
const userSettings = prevLocalStorage[user_id] || {};
@@ -68,7 +71,7 @@ export const TableSettingProvider = ({children}) => {
};
localStorage.setItem("_setting-app", JSON.stringify(refactorData));
setSettingStore(refactorData);
- }
+ };
const SummaryTextMessage = (values, columns) => {
let SummaryText = "";
let HideText = "";
@@ -76,38 +79,35 @@ export const TableSettingProvider = ({children}) => {
let SortText = "";
if (values.sorts && values.sorts.length > 0) {
- const _list = []
+ const _list = [];
for (const sort of values.sorts) {
- const _column = columns.find(column => column.id == sort.id)
- if (_column)
- _list.push(`${_column.header}` + `(${sort.desc ? "نزولی" : "صعودی"})`)
+ const _column = columns.find((column) => column.id == sort.id);
+ if (_column) _list.push(`${_column.header}` + `(${sort.desc ? "نزولی" : "صعودی"})`);
}
- if (_list.length > 0)
- SortText = " مرتب شده بر اساس : " + _list.join(", ")
+ if (_list.length > 0) SortText = " مرتب شده بر اساس : " + _list.join(", ");
}
if (values.filters && values.filters.length > 0) {
- const _list = []
+ const _list = [];
for (const filter of values.filters) {
- const _column = columns.find(column => column.id == filter.id)
- if (_column)
- _list.push(`${_column.header}`)
+ const _column = columns.find((column) => column.id == filter.id);
+ if (_column) _list.push(`${_column.header}`);
}
- if (_list.length > 0)
- FilterText = " فیلتر شده بر اساس : " + _list.join(", ")
+ if (_list.length > 0) FilterText = " فیلتر شده بر اساس : " + _list.join(", ");
}
if (values.hides) {
- const hidesArray = Object.entries(values.hides).map((e) => ({id: e[0], value: e[1]}))
+ const hidesArray = Object.entries(values.hides).map((e) => ({
+ id: e[0],
+ value: e[1],
+ }));
if (hidesArray.length > 0) {
- const _list = []
+ const _list = [];
for (const hide of hidesArray) {
- if (hide.value) continue
- const _column = columns.find(c => c.id == hide.id)
- if (_column)
- _list.push(_column.header)
+ if (hide.value) continue;
+ const _column = columns.find((c) => c.id == hide.id);
+ if (_column) _list.push(_column.header);
}
- if (_list.length > 0)
- HideText = "ستون های مخفی شده : " + _list.join(", ");
+ if (_list.length > 0) HideText = "ستون های مخفی شده : " + _list.join(", ");
}
}
@@ -128,7 +128,7 @@ export const TableSettingProvider = ({children}) => {
}
}
if (FilterText) {
- SummaryText += FilterText
+ SummaryText += FilterText;
}
}
@@ -137,8 +137,15 @@ export const TableSettingProvider = ({children}) => {
return (
+ value={{
+ settingStore,
+ hideAction,
+ sortAction,
+ filterAction,
+ refactorAction,
+ }}
+ >
{children}
);
-};
\ No newline at end of file
+};
diff --git a/src/lib/hooks/useDataTable.js b/src/lib/hooks/useDataTable.js
index ba7acb5..e396908 100644
--- a/src/lib/hooks/useDataTable.js
+++ b/src/lib/hooks/useDataTable.js
@@ -1,9 +1,9 @@
-import {useContext} from "react";
-import {DataTableContext} from "@/lib/contexts/DataTable";
+import { useContext } from "react";
+import { DataTableContext } from "@/lib/contexts/DataTable";
const useTableSetting = () => {
- const {filterData, setFilterData} = useContext(DataTableContext);
- return {filterData, setFilterData};
+ const { filterData, setFilterData } = useContext(DataTableContext);
+ return { filterData, setFilterData };
};
export default useTableSetting;
diff --git a/src/lib/hooks/useRequest.js b/src/lib/hooks/useRequest.js
index 8beee2e..2e35512 100644
--- a/src/lib/hooks/useRequest.js
+++ b/src/lib/hooks/useRequest.js
@@ -5,38 +5,42 @@ import axios from "axios";
const defaultOptions = {
data: {},
requestOptions: {
- headers: {}
+ headers: {},
},
notification: {
show: true,
success: false,
- failed: true
+ failed: true,
},
-}
+};
const useRequest = (initOptions) => {
const _options = Object.assign({}, defaultOptions, initOptions);
- return async (url = '', method = 'get', options) => {
+ return async (url = "", method = "get", options) => {
const mergedOptions = Object.assign({}, _options, options);
try {
const response = await axios({
url,
method,
- data: method === 'get' ? null : mergedOptions.data,
+ data: method === "get" ? null : mergedOptions.data,
withCredentials: true,
- ...mergedOptions.requestOptions
+ ...mergedOptions.requestOptions,
});
- successRequest(mergedOptions.notification.show && mergedOptions.notification.success, 'request_data');
+ successRequest(mergedOptions.notification.show && mergedOptions.notification.success, "request_data");
return response;
} catch (error) {
if (error.response) {
- errorResponse(error.response, mergedOptions.notification.show && mergedOptions.notification.failed, 'request_data');
+ errorResponse(
+ error.response,
+ mergedOptions.notification.show && mergedOptions.notification.failed,
+ "request_data"
+ );
}
throw error;
}
- }
-}
+ };
+};
-export default useRequest
\ No newline at end of file
+export default useRequest;
diff --git a/src/lib/hooks/useTableSetting.js b/src/lib/hooks/useTableSetting.js
index 7617655..6588446 100644
--- a/src/lib/hooks/useTableSetting.js
+++ b/src/lib/hooks/useTableSetting.js
@@ -1,10 +1,9 @@
-import {useContext} from "react";
-import {TableSettingContext} from "../contexts/tableSetting";
+import { useContext } from "react";
+import { TableSettingContext } from "../contexts/tableSetting";
const useTableSetting = () => {
- const {settingStore, hideAction, sortAction, filterAction, refactorAction} =
- useContext(TableSettingContext);
- return {settingStore, hideAction, sortAction, filterAction, refactorAction};
+ const { settingStore, hideAction, sortAction, filterAction, refactorAction } = useContext(TableSettingContext);
+ return { settingStore, hideAction, sortAction, filterAction, refactorAction };
};
export default useTableSetting;
|