add Table
This commit is contained in:
parent
4b4546c380
commit
88eb65ff65
|
@ -56,6 +56,7 @@
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@types/lodash": "^4.14.165",
|
||||||
"@types/react-router-dom": "^5.1.6",
|
"@types/react-router-dom": "^5.1.6",
|
||||||
"babel-plugin-module-resolver": "^4.0.0",
|
"babel-plugin-module-resolver": "^4.0.0",
|
||||||
"babel-plugin-transform-imports": "^2.0.0",
|
"babel-plugin-transform-imports": "^2.0.0",
|
||||||
|
|
94
src/common/Table/Table.tsx
Normal file
94
src/common/Table/Table.tsx
Normal file
|
@ -0,0 +1,94 @@
|
||||||
|
import React from 'react';
|
||||||
|
import isObjKey from '@utils/isObjKey';
|
||||||
|
import { Action, Column, OrderDirection } from './types';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Table as MUITable,
|
||||||
|
TableBody,
|
||||||
|
TableProps,
|
||||||
|
TableBodyProps,
|
||||||
|
} from '@material-ui/core';
|
||||||
|
import TableHead from './TableHead';
|
||||||
|
import TableRow from './TableRow';
|
||||||
|
import TableLoading from './TableLoading';
|
||||||
|
import TableEmpty from './TableEmpty';
|
||||||
|
import TableFooter, { Props as TableFooterProps } from './TableFooter';
|
||||||
|
|
||||||
|
export interface Props<T> {
|
||||||
|
columns: Column[];
|
||||||
|
actions?: Action[];
|
||||||
|
data: T[];
|
||||||
|
orderBy?: string;
|
||||||
|
orderDirection?: OrderDirection;
|
||||||
|
selection?: boolean;
|
||||||
|
idFieldName?: string;
|
||||||
|
onRequestSort?: (
|
||||||
|
property: string,
|
||||||
|
orderDirection: OrderDirection
|
||||||
|
) => void | Promise<void>;
|
||||||
|
onSelect?: (rows: T[]) => void;
|
||||||
|
loading?: boolean;
|
||||||
|
tableProps?: TableProps;
|
||||||
|
tableBodyProps?: TableBodyProps;
|
||||||
|
footerProps?: TableFooterProps;
|
||||||
|
hideFooter?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
function Table<T extends object>({
|
||||||
|
columns,
|
||||||
|
data,
|
||||||
|
orderBy = '',
|
||||||
|
orderDirection = 'asc',
|
||||||
|
onRequestSort,
|
||||||
|
idFieldName = 'id',
|
||||||
|
selection = false,
|
||||||
|
loading = false,
|
||||||
|
actions = [],
|
||||||
|
tableBodyProps = {},
|
||||||
|
tableProps = {},
|
||||||
|
hideFooter = false,
|
||||||
|
footerProps,
|
||||||
|
}: Props<T>) {
|
||||||
|
return (
|
||||||
|
<MUITable {...tableProps}>
|
||||||
|
<TableHead
|
||||||
|
columns={columns}
|
||||||
|
selection={selection}
|
||||||
|
orderBy={orderBy}
|
||||||
|
orderDirection={orderDirection}
|
||||||
|
onRequestSort={onRequestSort}
|
||||||
|
allSelected={false}
|
||||||
|
/>
|
||||||
|
<TableBody {...tableBodyProps}>
|
||||||
|
{loading ? (
|
||||||
|
<TableLoading />
|
||||||
|
) : data.length > 0 ? (
|
||||||
|
data.map((item, index) => {
|
||||||
|
return (
|
||||||
|
<TableRow
|
||||||
|
key={
|
||||||
|
isObjKey(item, idFieldName) ? item[idFieldName] + '' : index
|
||||||
|
}
|
||||||
|
row={item}
|
||||||
|
actions={actions}
|
||||||
|
selected={false}
|
||||||
|
selection={selection}
|
||||||
|
columns={columns}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})
|
||||||
|
) : (
|
||||||
|
<TableEmpty />
|
||||||
|
)}
|
||||||
|
</TableBody>
|
||||||
|
{!hideFooter && (
|
||||||
|
<TableFooter
|
||||||
|
count={footerProps?.count ?? data.length}
|
||||||
|
{...footerProps}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</MUITable>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Table;
|
15
src/common/Table/TableEmpty.tsx
Normal file
15
src/common/Table/TableEmpty.tsx
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import { TableRow, TableCell, Typography } from '@material-ui/core';
|
||||||
|
|
||||||
|
function TableEmpty() {
|
||||||
|
return (
|
||||||
|
<TableRow>
|
||||||
|
<TableCell colSpan={100}>
|
||||||
|
<Typography align="center">No records to display</Typography>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default TableEmpty;
|
62
src/common/Table/TableFooter.tsx
Normal file
62
src/common/Table/TableFooter.tsx
Normal file
|
@ -0,0 +1,62 @@
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import {
|
||||||
|
TablePagination,
|
||||||
|
TableRow,
|
||||||
|
TableFooter as MUITableFooter,
|
||||||
|
} from '@material-ui/core';
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
page?: number;
|
||||||
|
count?: number;
|
||||||
|
onChangePage?: (page: number) => void;
|
||||||
|
rowsPerPage?: number;
|
||||||
|
onChangeRowsPerPage?: (limit: number) => void;
|
||||||
|
rowsPerPageOptions?: Array<number | { value: number; label: string }>;
|
||||||
|
size?: 'small' | 'medium';
|
||||||
|
}
|
||||||
|
|
||||||
|
function TableFooter({
|
||||||
|
onChangePage,
|
||||||
|
page = 0,
|
||||||
|
count = 0,
|
||||||
|
onChangeRowsPerPage,
|
||||||
|
rowsPerPageOptions = [25, 50, 100],
|
||||||
|
rowsPerPage = 50,
|
||||||
|
size = 'small',
|
||||||
|
}: Props) {
|
||||||
|
const handlePageChange = (
|
||||||
|
event: React.MouseEvent<HTMLButtonElement> | null,
|
||||||
|
page: number
|
||||||
|
) => {
|
||||||
|
if (onChangePage) {
|
||||||
|
onChangePage(page);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const handleRowsPerPageChange = (
|
||||||
|
e: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>
|
||||||
|
) => {
|
||||||
|
if (onChangeRowsPerPage) {
|
||||||
|
onChangeRowsPerPage(parseInt(e.target.value));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<MUITableFooter>
|
||||||
|
<TableRow>
|
||||||
|
<TablePagination
|
||||||
|
count={count}
|
||||||
|
page={page}
|
||||||
|
onChangePage={handlePageChange}
|
||||||
|
onChangeRowsPerPage={handleRowsPerPageChange}
|
||||||
|
rowsPerPage={rowsPerPage}
|
||||||
|
rowsPerPageOptions={rowsPerPageOptions}
|
||||||
|
size={size}
|
||||||
|
colSpan={100}
|
||||||
|
/>
|
||||||
|
</TableRow>
|
||||||
|
</MUITableFooter>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default TableFooter;
|
90
src/common/Table/TableHead.tsx
Normal file
90
src/common/Table/TableHead.tsx
Normal file
|
@ -0,0 +1,90 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { Column, OrderDirection } from './types';
|
||||||
|
|
||||||
|
import {
|
||||||
|
TableHead as MUITableHead,
|
||||||
|
TableRow,
|
||||||
|
TableCell,
|
||||||
|
TableSortLabel,
|
||||||
|
Checkbox,
|
||||||
|
SortDirection,
|
||||||
|
} from '@material-ui/core';
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
columns: Column[];
|
||||||
|
selection: boolean;
|
||||||
|
onSelectAll?: () => void;
|
||||||
|
allSelected: boolean;
|
||||||
|
orderDirection: OrderDirection;
|
||||||
|
orderBy: string;
|
||||||
|
onRequestSort?: (
|
||||||
|
property: string,
|
||||||
|
orderDirection: OrderDirection
|
||||||
|
) => void | Promise<void>;
|
||||||
|
}
|
||||||
|
|
||||||
|
function TableHead({
|
||||||
|
columns,
|
||||||
|
onSelectAll,
|
||||||
|
orderBy = '',
|
||||||
|
orderDirection = 'asc',
|
||||||
|
selection = false,
|
||||||
|
allSelected = false,
|
||||||
|
onRequestSort,
|
||||||
|
}: Props) {
|
||||||
|
const createSortHandler = (property: string) => () => {
|
||||||
|
if (onRequestSort) {
|
||||||
|
if (property === orderBy) {
|
||||||
|
onRequestSort(property, orderDirection === 'asc' ? 'desc' : 'asc');
|
||||||
|
} else {
|
||||||
|
onRequestSort(property, 'asc');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSelectAll = () => {
|
||||||
|
if (onSelectAll) {
|
||||||
|
onSelectAll();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<MUITableHead>
|
||||||
|
<TableRow>
|
||||||
|
{selection && (
|
||||||
|
<TableCell padding="checkbox">
|
||||||
|
<Checkbox checked={allSelected} onClick={handleSelectAll} />
|
||||||
|
</TableCell>
|
||||||
|
)}
|
||||||
|
{columns.map(col => {
|
||||||
|
return (
|
||||||
|
<TableCell
|
||||||
|
key={col.field}
|
||||||
|
padding={col.disablePadding ? 'none' : 'default'}
|
||||||
|
align={col.align ? col.align : 'left'}
|
||||||
|
sortDirection={
|
||||||
|
(orderBy === col.field
|
||||||
|
? orderDirection
|
||||||
|
: false) as SortDirection
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{col.sortable ? (
|
||||||
|
<TableSortLabel
|
||||||
|
active={orderBy === col.field}
|
||||||
|
onClick={createSortHandler(col.field)}
|
||||||
|
direction={orderBy === col.field ? orderDirection : 'asc'}
|
||||||
|
>
|
||||||
|
{col.label ?? col.field}
|
||||||
|
</TableSortLabel>
|
||||||
|
) : (
|
||||||
|
col.label ?? col.field
|
||||||
|
)}
|
||||||
|
</TableCell>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</TableRow>
|
||||||
|
</MUITableHead>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default TableHead;
|
22
src/common/Table/TableLoading.tsx
Normal file
22
src/common/Table/TableLoading.tsx
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import { TableRow, CircularProgress, Box, TableCell } from '@material-ui/core';
|
||||||
|
|
||||||
|
function TableLoading() {
|
||||||
|
return (
|
||||||
|
<TableRow>
|
||||||
|
<TableCell colSpan={100}>
|
||||||
|
<Box
|
||||||
|
paddingY={2}
|
||||||
|
display="flex"
|
||||||
|
alignItems="center"
|
||||||
|
justifyContent="center"
|
||||||
|
>
|
||||||
|
<CircularProgress size={200} />
|
||||||
|
</Box>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default TableLoading;
|
84
src/common/Table/TableRow.tsx
Normal file
84
src/common/Table/TableRow.tsx
Normal file
|
@ -0,0 +1,84 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { get, isString, isNumber } from 'lodash';
|
||||||
|
import { format } from 'date-fns';
|
||||||
|
import { Action, Column } from './types';
|
||||||
|
|
||||||
|
import { TableRow, TableCell, Checkbox, Tooltip } from '@material-ui/core';
|
||||||
|
|
||||||
|
export type Props<T> = {
|
||||||
|
actions: Action[];
|
||||||
|
columns: Column[];
|
||||||
|
row: T;
|
||||||
|
selection: boolean;
|
||||||
|
selected: boolean;
|
||||||
|
onSelect?: (row: T) => void;
|
||||||
|
};
|
||||||
|
|
||||||
|
function EnhancedTableRow<T extends object>({
|
||||||
|
actions,
|
||||||
|
columns,
|
||||||
|
row,
|
||||||
|
selection = false,
|
||||||
|
selected = false,
|
||||||
|
onSelect,
|
||||||
|
}: Props<T>) {
|
||||||
|
const handleSelect = () => {
|
||||||
|
if (onSelect) {
|
||||||
|
onSelect(row);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const formatValue = (
|
||||||
|
v: string | number,
|
||||||
|
type: 'datetime' | 'date' | 'normal'
|
||||||
|
) => {
|
||||||
|
if ((isString(v) || isNumber(v)) && type === 'date') {
|
||||||
|
return format(new Date(v), 'yyyy-MM-dd');
|
||||||
|
}
|
||||||
|
if ((isString(v) || isNumber(v)) && type === 'datetime') {
|
||||||
|
return format(new Date(v), 'yyyy-MM-dd HH:mm:ss');
|
||||||
|
}
|
||||||
|
return v;
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<TableRow>
|
||||||
|
{selection && (
|
||||||
|
<TableCell padding="checkbox">
|
||||||
|
<Checkbox checked={selected} onClick={handleSelect} />
|
||||||
|
</TableCell>
|
||||||
|
)}
|
||||||
|
{columns.map(col => {
|
||||||
|
const val = get(row, col.field, '');
|
||||||
|
return (
|
||||||
|
<TableCell
|
||||||
|
key={col.field}
|
||||||
|
padding={col.disablePadding ? 'none' : 'default'}
|
||||||
|
align={col.align ? col.align : 'left'}
|
||||||
|
>
|
||||||
|
{col.valueFormatter
|
||||||
|
? col.valueFormatter(val)
|
||||||
|
: col.type
|
||||||
|
? formatValue(val, col.type)
|
||||||
|
: val}
|
||||||
|
</TableCell>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
{actions.length > 0 && (
|
||||||
|
<TableCell>
|
||||||
|
{actions.map((action, index) =>
|
||||||
|
action.tooltip ? (
|
||||||
|
<Tooltip key={index} title={action.tooltip}>
|
||||||
|
<div>{action.icon}</div>
|
||||||
|
</Tooltip>
|
||||||
|
) : (
|
||||||
|
<div key={index}>{action.icon}</div>
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
</TableCell>
|
||||||
|
)}
|
||||||
|
</TableRow>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default EnhancedTableRow;
|
16
src/common/Table/types.ts
Normal file
16
src/common/Table/types.ts
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
export type Action = {
|
||||||
|
icon: React.ReactNode;
|
||||||
|
tooltip?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type Column = {
|
||||||
|
field: string;
|
||||||
|
label?: string;
|
||||||
|
sortable?: boolean;
|
||||||
|
valueFormatter?: (v: boolean | string | number) => boolean | string | number;
|
||||||
|
disablePadding?: boolean;
|
||||||
|
type?: 'normal' | 'datetime' | 'date';
|
||||||
|
align?: 'left' | 'right' | 'center';
|
||||||
|
};
|
||||||
|
|
||||||
|
export type OrderDirection = 'asc' | 'desc';
|
|
@ -3,8 +3,9 @@ import { useQuery } from '@apollo/client';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { COMMON } from '@config/namespaces';
|
import { COMMON } from '@config/namespaces';
|
||||||
import { VERSIONS } from './queries';
|
import { VERSIONS } from './queries';
|
||||||
import { VersionList } from './types';
|
|
||||||
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
||||||
|
import { VersionsQueryVariables } from '@libs/graphql/types';
|
||||||
|
import { VersionList } from './types';
|
||||||
|
|
||||||
import { Button, Menu, MenuItem, Link, Tooltip } from '@material-ui/core';
|
import { Button, Menu, MenuItem, Link, Tooltip } from '@material-ui/core';
|
||||||
import { Language as LanguageIcon } from '@material-ui/icons';
|
import { Language as LanguageIcon } from '@material-ui/icons';
|
||||||
|
@ -13,7 +14,9 @@ function VersionSelector() {
|
||||||
const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);
|
const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);
|
||||||
const { t } = useTranslation(COMMON);
|
const { t } = useTranslation(COMMON);
|
||||||
const versionCode = extractVersionCodeFromHostname(window.location.hostname);
|
const versionCode = extractVersionCodeFromHostname(window.location.hostname);
|
||||||
const { data, loading } = useQuery<VersionList>(VERSIONS, {
|
const { data, loading } = useQuery<VersionList, VersionsQueryVariables>(
|
||||||
|
VERSIONS,
|
||||||
|
{
|
||||||
fetchPolicy: 'cache-first',
|
fetchPolicy: 'cache-first',
|
||||||
variables: {
|
variables: {
|
||||||
filter: {
|
filter: {
|
||||||
|
@ -21,7 +24,8 @@ function VersionSelector() {
|
||||||
codeNEQ: [versionCode],
|
codeNEQ: [versionCode],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
}
|
||||||
|
);
|
||||||
const versions = data?.versions?.items ?? [];
|
const versions = data?.versions?.items ?? [];
|
||||||
|
|
||||||
const handleClick = (
|
const handleClick = (
|
||||||
|
|
|
@ -11,6 +11,7 @@ import { generatePath } from 'react-router';
|
||||||
import * as ROUTES from '@config/routes';
|
import * as ROUTES from '@config/routes';
|
||||||
import * as NAMESPACES from '@config/namespaces';
|
import * as NAMESPACES from '@config/namespaces';
|
||||||
import { SERVER_STATUS } from '@config/app';
|
import { SERVER_STATUS } from '@config/app';
|
||||||
|
import { ServersQueryVariables } from '@libs/graphql/types';
|
||||||
import { ServerList } from './types';
|
import { ServerList } from './types';
|
||||||
import { SERVERS } from './queries';
|
import { SERVERS } from './queries';
|
||||||
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
||||||
|
@ -39,7 +40,10 @@ export default function ServerSelection() {
|
||||||
q: withDefault(StringParam, ''),
|
q: withDefault(StringParam, ''),
|
||||||
});
|
});
|
||||||
const { t } = useTranslation(NAMESPACES.INDEX_PAGE);
|
const { t } = useTranslation(NAMESPACES.INDEX_PAGE);
|
||||||
const { data, loading: loadingServers } = useQuery<ServerList>(SERVERS, {
|
const { data, loading: loadingServers } = useQuery<
|
||||||
|
ServerList,
|
||||||
|
ServersQueryVariables
|
||||||
|
>(SERVERS, {
|
||||||
fetchPolicy: 'cache-and-network',
|
fetchPolicy: 'cache-and-network',
|
||||||
variables: {
|
variables: {
|
||||||
filter: {
|
filter: {
|
||||||
|
|
|
@ -1,16 +1,25 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { SERVER_PAGE } from '@config/routes';
|
import { SERVER_PAGE } from '@config/routes';
|
||||||
|
|
||||||
import { Switch, Route } from 'react-router-dom';
|
import { Switch, Route, RouteProps } from 'react-router-dom';
|
||||||
|
import ServerProvider from '@features/ServerPage/libs/ServerContext/Provider';
|
||||||
import IndexPage from './features/IndexPage/IndexPage';
|
import IndexPage from './features/IndexPage/IndexPage';
|
||||||
import NotFoundPage from '../NotFoundPage/NotFoundPage';
|
import NotFoundPage from '../NotFoundPage/NotFoundPage';
|
||||||
|
|
||||||
|
const EnhancedRoute = ({ children, ...rest }: RouteProps) => {
|
||||||
|
return (
|
||||||
|
<Route {...rest}>
|
||||||
|
<ServerProvider>{children}</ServerProvider>
|
||||||
|
</Route>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
function ServerPage() {
|
function ServerPage() {
|
||||||
return (
|
return (
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route path={SERVER_PAGE.INDEX_PAGE}>
|
<EnhancedRoute path={SERVER_PAGE.INDEX_PAGE}>
|
||||||
<IndexPage />
|
<IndexPage />
|
||||||
</Route>
|
</EnhancedRoute>
|
||||||
<Route path="*">
|
<Route path="*">
|
||||||
<NotFoundPage />
|
<NotFoundPage />
|
||||||
</Route>
|
</Route>
|
||||||
|
|
|
@ -7,7 +7,6 @@ import { DRAWER_WIDTH } from './components/Sidebar/contants';
|
||||||
import { makeStyles, useTheme } from '@material-ui/core/styles';
|
import { makeStyles, useTheme } from '@material-ui/core/styles';
|
||||||
import { useMediaQuery, Toolbar } from '@material-ui/core';
|
import { useMediaQuery, Toolbar } from '@material-ui/core';
|
||||||
|
|
||||||
import ServerProvider from '@features/ServerPage/libs/ServerContext/Provider';
|
|
||||||
import Sidebar from './components/Sidebar/Sidebar';
|
import Sidebar from './components/Sidebar/Sidebar';
|
||||||
import TopBar from './components/TopBar/TopBar';
|
import TopBar from './components/TopBar/TopBar';
|
||||||
|
|
||||||
|
@ -51,7 +50,6 @@ function PageLayout({ children }: Props) {
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ServerProvider>
|
|
||||||
<div
|
<div
|
||||||
className={clsx({
|
className={clsx({
|
||||||
[classes.shiftContent]: isDesktop,
|
[classes.shiftContent]: isDesktop,
|
||||||
|
@ -68,7 +66,6 @@ function PageLayout({ children }: Props) {
|
||||||
/>
|
/>
|
||||||
<main className={classes.content}>{children}</main>
|
<main className={classes.content}>{children}</main>
|
||||||
</div>
|
</div>
|
||||||
</ServerProvider>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,578 +1,17 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import useServer from '../../libs/ServerContext/useServer';
|
||||||
|
|
||||||
|
import { Container } from '@material-ui/core';
|
||||||
import PageLayout from '@features/ServerPage/common/PageLayout/PageLayout';
|
import PageLayout from '@features/ServerPage/common/PageLayout/PageLayout';
|
||||||
|
import RecentlyDeletedPlayers from './components/RecentlyDeletedPlayers/RecentlyDeletedPlayers';
|
||||||
|
|
||||||
function IndexPage() {
|
function IndexPage() {
|
||||||
|
const { key } = useServer();
|
||||||
return (
|
return (
|
||||||
<PageLayout>
|
<PageLayout>
|
||||||
<p>
|
<Container>
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Doloremque vel,
|
<RecentlyDeletedPlayers server={key} />
|
||||||
sequi laborum fugit et libero facilis officiis, fuga dolorem iste ea in
|
</Container>
|
||||||
iusto at, repellendus facere. Facilis voluptatibus error illum? Lorem
|
|
||||||
ipsum dolor sit amet consectetur, adipisicing elit. Officiis eveniet,
|
|
||||||
facilis aut neque, aliquam ullam amet consequuntur numquam asperiores
|
|
||||||
ducimus ab, explicabo iure? Aliquid numquam ab excepturi facere dolores
|
|
||||||
illum. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Fugit,
|
|
||||||
quae consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi. Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Doloremque vel, sequi laborum fugit et
|
|
||||||
libero facilis officiis, fuga dolorem iste ea in iusto at, repellendus
|
|
||||||
facere. Facilis voluptatibus error illum? Lorem ipsum dolor sit amet
|
|
||||||
consectetur, adipisicing elit. Officiis eveniet, facilis aut neque,
|
|
||||||
aliquam ullam amet consequuntur numquam asperiores ducimus ab, explicabo
|
|
||||||
iure? Aliquid numquam ab excepturi facere dolores illum. Lorem ipsum
|
|
||||||
dolor sit, amet consectetur adipisicing elit. Fugit, quae consequuntur?
|
|
||||||
Unde dicta, non inventore magni at rem, debitis et molestiae officia
|
|
||||||
obcaecati expedita suscipit est fugiat deserunt, beatae hic? Lorem ipsum
|
|
||||||
dolor sit amet consectetur adipisicing elit. Molestiae recusandae
|
|
||||||
facilis iure, ipsum excepturi voluptates amet libero explicabo! Mollitia
|
|
||||||
magni consequuntur perspiciatis consectetur officiis cum. Illum
|
|
||||||
exercitationem eveniet dolorum maiores. Lorem ipsum dolor sit amet,
|
|
||||||
consectetur adipisicing elit. Amet commodi molestiae veritatis ad
|
|
||||||
suscipit at, eos sapiente illum laborum ipsum, unde reiciendis,
|
|
||||||
praesentium temporibus officia optio nemo dolorum magni tempora. Lorem
|
|
||||||
ipsum dolor sit amet consectetur adipisicing elit. Fuga, consectetur
|
|
||||||
laborum? Impedit deserunt dolor qui eligendi aspernatur magnam ratione
|
|
||||||
at inventore, placeat est. Commodi nobis tenetur suscipit cupiditate
|
|
||||||
ipsum excepturi. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
||||||
elit. Vitae illum, explicabo maxime placeat aliquam quos, harum aliquid
|
|
||||||
aspernatur officia ullam voluptatum beatae? Fugit laborum in recusandae
|
|
||||||
eius tempore ab quasi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Doloremque vel, sequi laborum fugit et libero facilis
|
|
||||||
officiis, fuga dolorem iste ea in iusto at, repellendus facere. Facilis
|
|
||||||
voluptatibus error illum? Lorem ipsum dolor sit amet consectetur,
|
|
||||||
adipisicing elit. Officiis eveniet, facilis aut neque, aliquam ullam
|
|
||||||
amet consequuntur numquam asperiores ducimus ab, explicabo iure? Aliquid
|
|
||||||
numquam ab excepturi facere dolores illum. Lorem ipsum dolor sit, amet
|
|
||||||
consectetur adipisicing elit. Fugit, quae consequuntur? Unde dicta, non
|
|
||||||
inventore magni at rem, debitis et molestiae officia obcaecati expedita
|
|
||||||
suscipit est fugiat deserunt, beatae hic? Lorem ipsum dolor sit amet
|
|
||||||
consectetur adipisicing elit. Molestiae recusandae facilis iure, ipsum
|
|
||||||
excepturi voluptates amet libero explicabo! Mollitia magni consequuntur
|
|
||||||
perspiciatis consectetur officiis cum. Illum exercitationem eveniet
|
|
||||||
dolorum maiores. Lorem ipsum dolor sit amet, consectetur adipisicing
|
|
||||||
elit. Amet commodi molestiae veritatis ad suscipit at, eos sapiente
|
|
||||||
illum laborum ipsum, unde reiciendis, praesentium temporibus officia
|
|
||||||
optio nemo dolorum magni tempora. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Fuga, consectetur laborum? Impedit deserunt dolor qui
|
|
||||||
eligendi aspernatur magnam ratione at inventore, placeat est. Commodi
|
|
||||||
nobis tenetur suscipit cupiditate ipsum excepturi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Vitae illum, explicabo maxime placeat
|
|
||||||
aliquam quos, harum aliquid aspernatur officia ullam voluptatum beatae?
|
|
||||||
Fugit laborum in recusandae eius tempore ab quasi. Lorem ipsum dolor sit
|
|
||||||
amet consectetur adipisicing elit. Doloremque vel, sequi laborum fugit
|
|
||||||
et libero facilis officiis, fuga dolorem iste ea in iusto at,
|
|
||||||
repellendus facere. Facilis voluptatibus error illum? Lorem ipsum dolor
|
|
||||||
sit amet consectetur, adipisicing elit. Officiis eveniet, facilis aut
|
|
||||||
neque, aliquam ullam amet consequuntur numquam asperiores ducimus ab,
|
|
||||||
explicabo iure? Aliquid numquam ab excepturi facere dolores illum. Lorem
|
|
||||||
ipsum dolor sit, amet consectetur adipisicing elit. Fugit, quae
|
|
||||||
consequuntur? Unde dicta, non inventore magni at rem, debitis et
|
|
||||||
molestiae officia obcaecati expedita suscipit est fugiat deserunt,
|
|
||||||
beatae hic? Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
||||||
Molestiae recusandae facilis iure, ipsum excepturi voluptates amet
|
|
||||||
libero explicabo! Mollitia magni consequuntur perspiciatis consectetur
|
|
||||||
officiis cum. Illum exercitationem eveniet dolorum maiores. Lorem ipsum
|
|
||||||
dolor sit amet, consectetur adipisicing elit. Amet commodi molestiae
|
|
||||||
veritatis ad suscipit at, eos sapiente illum laborum ipsum, unde
|
|
||||||
reiciendis, praesentium temporibus officia optio nemo dolorum magni
|
|
||||||
tempora. Lorem ipsum dolor sit amet consectetur adipisicing elit. Fuga,
|
|
||||||
consectetur laborum? Impedit deserunt dolor qui eligendi aspernatur
|
|
||||||
magnam ratione at inventore, placeat est. Commodi nobis tenetur suscipit
|
|
||||||
cupiditate ipsum excepturi. Lorem ipsum dolor sit amet consectetur
|
|
||||||
adipisicing elit. Vitae illum, explicabo maxime placeat aliquam quos,
|
|
||||||
harum aliquid aspernatur officia ullam voluptatum beatae? Fugit laborum
|
|
||||||
in recusandae eius tempore ab quasi.
|
|
||||||
</p>
|
|
||||||
</PageLayout>
|
</PageLayout>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,49 @@
|
||||||
|
import React from 'react';
|
||||||
|
import { useQuery } from '@apollo/client';
|
||||||
|
import { RECENTLY_DELETED_PLAYERS } from './queries';
|
||||||
|
import { COLUMNS, LIMIT } from './constants';
|
||||||
|
import { PlayersQueryVariables } from '@libs/graphql/types';
|
||||||
|
import { PlayerList } from './types';
|
||||||
|
|
||||||
|
import { Paper, Toolbar, Typography } from '@material-ui/core';
|
||||||
|
import Table from '@common/Table/Table';
|
||||||
|
|
||||||
|
export interface Props {
|
||||||
|
server: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
function RecentlyDeletedPlayers({ server }: Props) {
|
||||||
|
const { loading: loadingPlayers, data } = useQuery<
|
||||||
|
PlayerList,
|
||||||
|
PlayersQueryVariables
|
||||||
|
>(RECENTLY_DELETED_PLAYERS, {
|
||||||
|
fetchPolicy: 'cache-and-network',
|
||||||
|
variables: {
|
||||||
|
filter: {
|
||||||
|
limit: LIMIT,
|
||||||
|
sort: 'deletedAt DESC',
|
||||||
|
deletedAtGT: new Date(0),
|
||||||
|
},
|
||||||
|
server,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const players = data?.players?.items ?? [];
|
||||||
|
const loading = loadingPlayers && players.length === 0;
|
||||||
|
|
||||||
|
console.log(players, loading);
|
||||||
|
return (
|
||||||
|
<Paper>
|
||||||
|
<Toolbar>
|
||||||
|
<Typography variant="h4">Test?</Typography>
|
||||||
|
</Toolbar>
|
||||||
|
<Table
|
||||||
|
columns={COLUMNS}
|
||||||
|
loading={loading}
|
||||||
|
data={players}
|
||||||
|
footerProps={{ rowsPerPage: LIMIT }}
|
||||||
|
/>
|
||||||
|
</Paper>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default RecentlyDeletedPlayers;
|
|
@ -0,0 +1,24 @@
|
||||||
|
import { Column } from '@common/Table/types';
|
||||||
|
|
||||||
|
export const COLUMNS: Column[] = [
|
||||||
|
{
|
||||||
|
field: 'name',
|
||||||
|
label: 'recentlyDeletedPlayers.columns.name',
|
||||||
|
sortable: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'mostPoints',
|
||||||
|
label: 'recentlyDeletedPlayers.columns.mostPoints',
|
||||||
|
sortable: false,
|
||||||
|
valueFormatter: (param: string | number | boolean) =>
|
||||||
|
(param as number).toLocaleString(),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'deletedAt',
|
||||||
|
label: 'recentlyDeletedPlayers.columns.deletedAt',
|
||||||
|
sortable: false,
|
||||||
|
type: 'datetime',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const LIMIT = 5;
|
|
@ -0,0 +1,14 @@
|
||||||
|
import { gql } from '@apollo/client';
|
||||||
|
|
||||||
|
export const RECENTLY_DELETED_PLAYERS = gql`
|
||||||
|
query players($server: String!, $filter: PlayerFilter) {
|
||||||
|
players(server: $server, filter: $filter) {
|
||||||
|
items {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
mostPoints
|
||||||
|
deletedAt
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
|
@ -0,0 +1,12 @@
|
||||||
|
import { List } from '@libs/graphql/types';
|
||||||
|
|
||||||
|
export type Player = {
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
mostPoints: number;
|
||||||
|
deletedAt: string | Date;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type PlayerList = {
|
||||||
|
players?: List<Player[]>;
|
||||||
|
};
|
|
@ -4,6 +4,7 @@ import { useQuery } from '@apollo/client';
|
||||||
import { SERVERS } from './queries';
|
import { SERVERS } from './queries';
|
||||||
import Context from './context';
|
import Context from './context';
|
||||||
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
import extractVersionCodeFromHostname from '@utils/extractVersionCodeFromHostname';
|
||||||
|
import { ServersQueryVariables } from '@libs/graphql/types';
|
||||||
import { Params, ServerList } from './types';
|
import { Params, ServerList } from './types';
|
||||||
|
|
||||||
import NotFoundPage from '@features/NotFoundPage/NotFoundPage';
|
import NotFoundPage from '@features/NotFoundPage/NotFoundPage';
|
||||||
|
@ -15,7 +16,10 @@ export interface Props {
|
||||||
|
|
||||||
function Provider({ children }: Props) {
|
function Provider({ children }: Props) {
|
||||||
const { key } = useParams<Params>();
|
const { key } = useParams<Params>();
|
||||||
const { loading: loadingServers, data } = useQuery<ServerList>(SERVERS, {
|
const { loading: loadingServers, data } = useQuery<
|
||||||
|
ServerList,
|
||||||
|
ServersQueryVariables
|
||||||
|
>(SERVERS, {
|
||||||
fetchPolicy: 'cache-first',
|
fetchPolicy: 'cache-first',
|
||||||
variables: {
|
variables: {
|
||||||
filter: {
|
filter: {
|
||||||
|
|
|
@ -2,3 +2,41 @@ export type List<T> = {
|
||||||
total: number;
|
total: number;
|
||||||
items: T;
|
items: T;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export type PlayerFilter = {
|
||||||
|
limit?: number;
|
||||||
|
offset?: number;
|
||||||
|
sort?: string;
|
||||||
|
id?: number[];
|
||||||
|
deletedAtGT?: Date | string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type PlayersQueryVariables = {
|
||||||
|
server: string;
|
||||||
|
filter?: PlayerFilter;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ServerFilter = {
|
||||||
|
limit?: number;
|
||||||
|
offset?: number;
|
||||||
|
sort?: string;
|
||||||
|
key?: string[];
|
||||||
|
keyIEQ?: string;
|
||||||
|
versionCode?: string[];
|
||||||
|
};
|
||||||
|
|
||||||
|
export type ServersQueryVariables = {
|
||||||
|
filter?: ServerFilter;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type VersionFilter = {
|
||||||
|
limit?: number;
|
||||||
|
offset?: number;
|
||||||
|
sort?: string;
|
||||||
|
code?: string[];
|
||||||
|
codeNEQ?: string[];
|
||||||
|
};
|
||||||
|
|
||||||
|
export type VersionsQueryVariables = {
|
||||||
|
filter?: VersionFilter;
|
||||||
|
};
|
||||||
|
|
11
src/libs/i18n/en/table.ts
Normal file
11
src/libs/i18n/en/table.ts
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
const translations = {
|
||||||
|
emptyDataSourceMessage: 'No records to display',
|
||||||
|
labelDisplayedRows: '{from}-{to} of {count}',
|
||||||
|
labelRowsPerPage: 'Rows per page:',
|
||||||
|
firstTooltip: 'First Page',
|
||||||
|
previousTooltip: 'Previous Page',
|
||||||
|
nextTooltip: 'Next Page',
|
||||||
|
lastTooltip: 'Last Page',
|
||||||
|
};
|
||||||
|
|
||||||
|
export default translations;
|
|
@ -29,4 +29,4 @@ function useTitle(
|
||||||
|
|
||||||
export default typeof document !== 'undefined'
|
export default typeof document !== 'undefined'
|
||||||
? useTitle
|
? useTitle
|
||||||
: (_title: string) => {};
|
: (_title: string) => _title;
|
||||||
|
|
3
src/utils/isObjKey.ts
Normal file
3
src/utils/isObjKey.ts
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
export default function isObjKey<T>(obj: T, key: any): key is keyof T {
|
||||||
|
return key in obj;
|
||||||
|
}
|
|
@ -1731,6 +1731,11 @@
|
||||||
resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
|
resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
|
||||||
integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
|
integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
|
||||||
|
|
||||||
|
"@types/lodash@^4.14.165":
|
||||||
|
version "4.14.165"
|
||||||
|
resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.165.tgz#74d55d947452e2de0742bad65270433b63a8c30f"
|
||||||
|
integrity sha512-tjSSOTHhI5mCHTy/OOXYIhi2Wt1qcbHmuXD1Ha7q70CgI/I71afO4XtLb/cVexki1oVYchpul/TOuu3Arcdxrg==
|
||||||
|
|
||||||
"@types/minimatch@*":
|
"@types/minimatch@*":
|
||||||
version "3.0.3"
|
version "3.0.3"
|
||||||
resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
|
resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
|
||||||
|
|
Reference in New Issue
Block a user