15672: Removes filter panel & makes pagination choices bigger.
authorLucas Di Pentima <lucas@di-pentima.com.ar>
Fri, 20 Dec 2019 00:35:34 +0000 (21:35 -0300)
committerLucas Di Pentima <lucas@di-pentima.com.ar>
Fri, 20 Dec 2019 00:35:34 +0000 (21:35 -0300)
Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas@di-pentima.com.ar>

src/store/data-explorer/data-explorer-reducer.ts
src/views/process-panel/process-panel-root.tsx
src/views/process-panel/process-panel.tsx
src/views/process-panel/subprocesses-card.tsx [deleted file]

index 0fa329054435609745630311ffc95201716e229b..fc7438a577a0a7e936128fdfcf39b523ef59b48d 100644 (file)
@@ -30,8 +30,8 @@ export const initialDataExplorer: DataExplorer = {
     items: [],
     itemsAvailable: 0,
     page: 0,
-    rowsPerPage: 10,
-    rowsPerPageOptions: [5, 10, 25, 50],
+    rowsPerPage: 50,
+    rowsPerPageOptions: [50, 100, 200, 500],
     searchValue: ""
 };
 
index d3ceef264255973ed503e31a1a7ee5f48e0523e2..35842c7b12045200291e9a51243518be6b776693 100644 (file)
@@ -8,7 +8,6 @@ import { ProcessInformationCard } from './process-information-card';
 import { DefaultView } from '~/components/default-view/default-view';
 import { ProcessIcon } from '~/components/icon/icon';
 import { Process } from '~/store/processes/process';
-import { SubprocessesCard } from './subprocesses-card';
 import { SubprocessPanel } from '~/views/subprocess-panel/subprocess-panel';
 import { SubprocessFilterDataProps } from '~/components/subprocess-filter/subprocess-filter';
 
@@ -16,7 +15,6 @@ export interface ProcessPanelRootDataProps {
     process?: Process;
     subprocesses: Array<Process>;
     filters: Array<SubprocessFilterDataProps>;
-    totalSubprocessesLength: number;
 }
 
 export interface ProcessPanelRootActionProps {
@@ -33,7 +31,7 @@ export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRoot
 export const ProcessPanelRoot = ({ process, ...props }: ProcessPanelRootProps) =>
     process
         ? <Grid container spacing={16} alignItems="stretch">
-            <Grid item sm={12} md={7}>
+            <Grid item sm={12} md={12}>
                 <ProcessInformationCard
                     process={process}
                     onContextMenu={event => props.onContextMenu(event, process)}
@@ -43,13 +41,6 @@ export const ProcessPanelRoot = ({ process, ...props }: ProcessPanelRootProps) =
                     cancelProcess={props.cancelProcess}
                 />
             </Grid>
-            <Grid item sm={12} md={5}>
-                <SubprocessesCard
-                    subprocessesAmount={props.totalSubprocessesLength}
-                    filters={props.filters}
-                    onToggle={props.onToggle}
-                />
-            </Grid>
             <Grid item sm={12} md={12}>
                 <SubprocessPanel />
             </Grid>
index 34215f88c917bfcdbe1ddbbbb4dda362e9a06dcf..9e8c15b9816f0a6d1f5110fa246dc50772bf31bb 100644 (file)
@@ -24,7 +24,6 @@ const mapStateToProps = ({ router, resources, processPanel }: RootState): Proces
         process: getProcess(uuid)(resources),
         subprocesses: subprocesses.filter(subprocess => processPanel.filters[getProcessStatus(subprocess)]),
         filters: getFilters(processPanel, subprocesses),
-        totalSubprocessesLength: subprocesses.length,
     };
 };
 
diff --git a/src/views/process-panel/subprocesses-card.tsx b/src/views/process-panel/subprocesses-card.tsx
deleted file mode 100644 (file)
index 0314a54..0000000
+++ /dev/null
@@ -1,64 +0,0 @@
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import * as React from 'react';
-import { ArvadosTheme } from '~/common/custom-theme';
-import { StyleRulesCallback, withStyles, WithStyles, Card, CardHeader, CardContent, Grid, Typography } from '@material-ui/core';
-import { SubprocessFilter } from '~/components/subprocess-filter/subprocess-filter';
-import { SubprocessFilterDataProps } from '~/components/subprocess-filter/subprocess-filter';
-
-type CssRules = 'root' | 'title' | 'gridFilter';
-
-const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
-    root: {
-        fontSize: '0.875rem',
-        height: '100%'
-    },
-    title: {
-        color: theme.palette.grey["700"]
-    },
-    gridFilter: {
-        height: '20px',
-        marginBottom: theme.spacing.unit,
-        paddingTop: '0px!important',
-        paddingBottom: '0px!important',
-    }
-});
-
-interface SubprocessesDataProps {
-    subprocessesAmount: number;
-    filters: SubprocessFilterDataProps[];
-    onToggle: (status: string) => void;
-}
-
-type SubprocessesProps = SubprocessesDataProps & WithStyles<CssRules>;
-
-export const SubprocessesCard = withStyles(styles)(
-    ({ classes, filters, subprocessesAmount, onToggle }: SubprocessesProps) =>
-        <Card className={classes.root}>
-            <CardHeader
-                className={classes.title}
-                title={
-                    <Typography noWrap variant='h6' color='inherit'>
-                        Subprocess and filters
-                </Typography>} />
-            <CardContent>
-                <Grid container direction="column" spacing={16}>
-                    <Grid item xs={12} container spacing={16}>
-                        <Grid item md={12} lg={6}>
-                            <SubprocessFilter label='Subprocesses' value={subprocessesAmount} />
-                        </Grid>
-                        <Grid item md={12} lg={6}/>
-                        {
-                            filters.map(filter =>
-                                <Grid item md={12} lg={6} key={filter.key} className={classes.gridFilter}>
-                                    <SubprocessFilter {...filter} onToggle={() => onToggle(filter.label)} />
-                                </Grid>
-                            )
-                        }
-                    </Grid>
-                </Grid>
-            </CardContent>
-        </Card>
-);
\ No newline at end of file