twhelp
/
version.tribalwarshelp.com
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

cleanup in .babelrc, fix selection in the table component

This commit is contained in:
Dawid Wysokiński 2021-03-21 08:29:57 +01:00
parent 8f70ddcbac
commit cb5ca20799
7 changed files with 30 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
.babelrc
View File

@ -1,20 +1,5 @@
{
"plugins": [
[
"module-resolver",
{
"@": ["./src"],
"alias": {
"@": "./src",
"@common": "./src/common",
"@config": "./src/config",
"@features": "./src/features",
"@libs": "./src/libs",
"@theme": "./src/theme",
"@utils": "./src/utils"
}
}
],
[
"babel-plugin-transform-imports",
{

1
package.json
View File

@ -70,7 +70,6 @@
"@types/react-color": "^3.0.4",
"@types/react-router-dom": "^5.1.6",
"@types/uuid": "^8.3.0",
"babel-plugin-module-resolver": "^4.0.0",
"babel-plugin-transform-imports": "^2.0.0",
"customize-cra": "^1.0.0",
"prettier": "^2.1.2",

26
src/common/Table/Table.tsx
View File

@ -31,7 +31,7 @@ export interface Props<T> {
orderBy: string,
orderDirection: OrderDirection
) => void | Promise<void>;
onSelect?: (rows: T[]) => void;
onSelect?: (checked: boolean, rows: T[]) => void;
loading?: boolean;
tableProps?: TableProps;
tableBodyProps?: TableBodyProps;
@ -61,10 +61,6 @@ function Table<T extends object>({
getRowKey,
}: Props<T>) {
const { t } = useTranslation(TABLE);
const headColumns =
actions.length > 0
? [...columns, { field: 'action', label: t('actions') }]
: columns;
const preparedFooterProps = {
page: 0,
rowsPerPage: validateRowsPerPage(
@ -92,23 +88,29 @@ function Table<T extends object>({
<TableContainer>
<MUITable size={size} {...tableProps}>
<TableHead
columns={headColumns}
t={t}
columns={columns}
hasActions={actions.length > 0}
selection={selection}
orderBy={orderBy}
orderDirection={orderDirection}
onRequestSort={onRequestSort}
size={size}
onSelectAll={() => {
onSelectAll={checked => {
if (onSelect) {
onSelect(data);
onSelect(
checked,
data.filter(item =>
checked ? !isSelected(item) : isSelected(item)
)
);
}
}}
allSelected={selected?.length === data.length}
allSelected={selected?.length === data.length && data.length > 0}
/>
<TableBody {...tableBodyProps}>
{loading ? (
<TableLoading
columns={headColumns}
size={size}
rowsPerPage={preparedFooterProps.rowsPerPage}
/>
@ -130,9 +132,9 @@ function Table<T extends object>({
selection={selection}
columns={columns}
size={size}
onSelect={row => {
onSelect={(checked, row) => {
if (onSelect) {
onSelect([row]);
onSelect(checked, [row]);
}
}}
/>

10
src/common/Table/TableHead.tsx
View File

@ -9,11 +9,12 @@ import {
Checkbox,
SortDirection,
} from '@material-ui/core';
import { TFunction } from 'i18next';
export interface Props {
columns: Column[];
selection: boolean;
onSelectAll?: () => void;
onSelectAll?: (checked: boolean) => void;
allSelected: boolean;
orderDirection: OrderDirection;
orderBy: string;
@ -22,6 +23,8 @@ export interface Props {
property: string,
orderDirection: OrderDirection
) => void | Promise<void>;
hasActions: boolean;
t: TFunction;
}
function TableHead({
@ -33,6 +36,8 @@ function TableHead({
allSelected = false,
onRequestSort,
size = 'medium',
hasActions = false,
t,
}: Props) {
const createSortHandler = (property: string) => () => {
if (onRequestSort) {
@ -46,7 +51,7 @@ function TableHead({
const handleSelectAll = () => {
if (onSelectAll) {
onSelectAll();
onSelectAll(!allSelected);
}
};
@ -85,6 +90,7 @@ function TableHead({
</TableCell>
);
})}
{hasActions && <TableCell size={size}>{t('actions')}</TableCell>}
</TableRow>
</MUITableHead>
);

12
src/common/Table/TableLoading.tsx
View File

@ -1,26 +1,22 @@
import React, { Fragment } from 'react';
import { Column } from './types';
import { TableRow, TableCell } from '@material-ui/core';
import { Skeleton } from '@material-ui/lab';
export interface Props {
rowsPerPage: number;
columns: Column[];
size?: 'small' | 'medium';
}
function TableLoading({ rowsPerPage, columns, size = 'medium' }: Props) {
function TableLoading({ rowsPerPage, size = 'medium' }: Props) {
return (
<Fragment>
{new Array(rowsPerPage).fill(0).map((_, index) => {
return (
<TableRow key={index}>
{columns.map(col => (
<TableCell size={size} key={col.field}>
<Skeleton variant="text" />
</TableCell>
))}
<TableCell size={size} colSpan={100}>
<Skeleton variant="text" />
</TableCell>
</TableRow>
);
})}

4
src/common/Table/TableRow.tsx
View File

@ -15,7 +15,7 @@ export interface Props<T> {
selected: boolean;
size?: 'small' | 'medium';
index: number;
onSelect?: (row: T) => void;
onSelect?: (checked: boolean, row: T) => void;
}
function EnhancedTableRow<T extends object>({
@ -32,7 +32,7 @@ function EnhancedTableRow<T extends object>({
const handleSelect = () => {
if (onSelect) {
onSelect(row);
onSelect(!selected, row);
}
};

33
yarn.lock
View File

@ -2812,17 +2812,6 @@ babel-plugin-macros@2.8.0:
cosmiconfig "^6.0.0"
resolve "^1.12.0"
babel-plugin-module-resolver@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/babel-plugin-module-resolver/-/babel-plugin-module-resolver-4.0.0.tgz#8f3a3d9d48287dc1d3b0d5595113adabd36a847f"
integrity sha512-3pdEq3PXALilSJ6dnC4wMWr0AZixHRM4utpdpBR9g5QG7B7JwWyukQv7a9hVxkbGFl+nQbrHDqqQOIBtTXTP/Q==
dependencies:
find-babel-config "^1.2.0"
glob "^7.1.6"
pkg-up "^3.1.0"
reselect "^4.0.0"
resolve "^1.13.1"
babel-plugin-named-asset-import@^0.3.7:
version "0.3.7"
resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.7.tgz#156cd55d3f1228a5765774340937afc8398067dd"
@ -5004,7 +4993,7 @@ eslint-visitor-keys@^2.0.0:
resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz#21fdc8fbcd9c795cc0321f0563702095751511a8"
integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ==
eslint-webpack-plugin@2.4.1, eslint-webpack-plugin@^2.1.0:
eslint-webpack-plugin@^2.1.0:
version "2.4.1"
resolved "https://registry.yarnpkg.com/eslint-webpack-plugin/-/eslint-webpack-plugin-2.4.1.tgz#9353ec46a31d29558734a38a05eb14c5760a7144"
integrity sha512-cj8iPWZKuAiVD8MMgTSunyMCAvxQxp5mxoPHZl1UMGkApFXaXJHdCFcCR+oZEJbBNhReNa5SjESIn34uqUbBtg==
@ -5435,14 +5424,6 @@ finalhandler@~1.1.2:
statuses "~1.5.0"
unpipe "~1.0.0"
find-babel-config@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/find-babel-config/-/find-babel-config-1.2.0.tgz#a9b7b317eb5b9860cda9d54740a8c8337a2283a2"
integrity sha512-jB2CHJeqy6a820ssiqwrKMeyC6nNdmrcgkKWJWmpoxpE8RKciYJXCcXRq1h2AzCo5I5BJeN2tkGEO3hLTuePRA==
dependencies:
json5 "^0.5.1"
path-exists "^3.0.0"
find-cache-dir@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-2.1.0.tgz#8d0f94cd13fe43c6c7c261a0d86115ca918c05f7"
@ -7321,11 +7302,6 @@ json3@^3.3.2:
resolved "https://registry.yarnpkg.com/json3/-/json3-3.3.3.tgz#7fc10e375fc5ae42c4705a5cc0aa6f62be305b81"
integrity sha512-c7/8mbUsKigAbLkD5B010BK4D9LZm7A1pNItkEwiUZRpIN66exu/e7YQWysGun+TRKaJp8MhemM+VkfWv42aCA==
json5@^0.5.1:
version "0.5.1"
resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
integrity sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE=
json5@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"
@ -8801,7 +8777,7 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0:
dependencies:
find-up "^4.0.0"
pkg-up@3.1.0, pkg-up@^3.1.0:
pkg-up@3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-3.1.0.tgz#100ec235cc150e4fd42519412596a28512a0def5"
integrity sha512-nDywThFk1i4BQK4twPQ6TA4RT8bDY96yeuCVBWL3ePARCiEKDRSrNGbFIgUJpLp+XeIR65v8ra7WuJOFUBtkMA==
@ -10262,11 +10238,6 @@ requires-port@^1.0.0:
resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
integrity sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=
reselect@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/reselect/-/reselect-4.0.0.tgz#f2529830e5d3d0e021408b246a206ef4ea4437f7"
integrity sha512-qUgANli03jjAyGlnbYVAV5vvnOmJnODyABz51RdBN7M4WaVu8mecZWgyQNkG8Yqe3KRGRt0l4K4B3XVEULC4CA==
resize-observer-polyfill@^1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"