Arvados-DCO-1.1-Signed-off-by: Daniel Kutyła <daniel.kutyla@contractors.roche.com>
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+describe('Page not found tests', function() {
+ let adminUser;
+
+ before(function() {
+ cy.getUser('admin', 'Admin', 'User', true, true)
+ .as('adminUser').then(function() {
+ adminUser = this.adminUser;
+ }
+ );
+ });
+
+ beforeEach(function() {
+ cy.clearCookies()
+ cy.clearLocalStorage()
+ });
+
+ it('shows not found page', function() {
+ // given
+ const invalidUUID = '1212r12r12r12r12r12r21r'
+
+ // when
+ cy.loginAs(adminUser);
+ cy.visit(`/collections/${invalidUUID}`);
+
+ // then
+ cy.get('[data-cy=not-found-page]').should('exist');
+ cy.get('[data-cy=not-found-content]').should('exist');
+ });
+
+
+ it('shows not found popup', function() {
+ // given
+ const notExistingUUID = 'zzzzz-tpzed-5o5tg0l9a57gxxx';
+
+ // when
+ cy.loginAs(adminUser);
+ cy.visit(`/projects/${notExistingUUID}`);
+
+ // then
+ cy.get('[data-cy=not-found-page]').should('not.exist');
+ cy.get('[data-cy=not-found-content]').should('exist');
+ });
+})
\ No newline at end of file
# SPDX-License-Identifier: AGPL-3.0
FROM node:8-buster
-MAINTAINER Ward Vandewege <ward@curoverse.com>
+MAINTAINER MAINTAINER Arvados Package Maintainers <packaging@arvados.org>
+
+RUN echo deb http://deb.debian.org/debian buster-backports main >> /etc/apt/sources.list.d/backports.list
RUN apt-get update && \
apt-get -yq --no-install-recommends -o Acquire::Retries=6 install \
libsecret-1-0 libsecret-1-dev rpm ruby ruby-dev rubygems build-essential \
- golang libpam0g-dev && \
+ libpam0g-dev && \
+ apt-get clean
+RUN apt-get -yq --no-install-recommends -t buster-backports install golang-go && \
apt-get clean
RUN gem install --no-ri --no-rdoc fpm
RUN git clone https://git.arvados.org/arvados.git && cd arvados && \
"@types/react-copy-to-clipboard": "4.2.6",
"@types/react-dropzone": "4.2.2",
"@types/react-highlight-words": "0.12.0",
+ "@types/react-virtualized-auto-sizer": "1.0.0",
+ "@types/react-window": "1.8.2",
"@types/redux-form": "7.4.12",
"@types/shell-quote": "1.6.0",
"axios": "0.18.1",
"react-scripts-ts": "3.1.0",
"react-splitter-layout": "3.0.1",
"react-transition-group": "2.5.0",
+ "react-virtualized-auto-sizer": "1.0.2",
+ "react-window": "1.8.5",
"redux": "4.0.3",
"redux-form": "7.4.2",
"redux-thunk": "2.3.0",
Scheme: string
}
};
+ Mail?: {
+ SupportEmailAddress: string;
+ };
Services: {
Controller: {
ExternalURL: string
fontSize: '1.25rem'
}
},
+ MuiExpansionPanel: {
+ expanded: {
+ marginTop: '8px',
+ }
+ },
+ MuiExpansionPanelDetails: {
+ root: {
+ marginBottom: 0,
+ paddingBottom: '4px',
+ }
+ },
+ MuiExpansionPanelSummary: {
+ content: {
+ '&$expanded': {
+ margin: 0,
+ },
+ color: grey700,
+ fontSize: '1.25rem',
+ margin: 0,
+ },
+ expanded: {},
+ },
MuiMenuItem: {
root: {
padding: '8px 16px'
import { TreeItem, TreeItemStatus } from '~/components/tree/tree';
import { FileTreeData } from '~/components/file-tree/file-tree-data';
import { FileTree } from '~/components/file-tree/file-tree';
-import { IconButton, Grid, Typography, StyleRulesCallback, withStyles, WithStyles, CardHeader, Card, Button, Tooltip } from '@material-ui/core';
+import { IconButton, Grid, Typography, StyleRulesCallback, withStyles, WithStyles, CardHeader, Card, Button, Tooltip, CircularProgress } from '@material-ui/core';
import { CustomizeTableIcon } from '~/components/icon/icon';
import { DownloadIcon } from '~/components/icon/icon';
export interface CollectionPanelFilesProps {
items: Array<TreeItem<FileTreeData>>;
isWritable: boolean;
+ isLoading: boolean;
+ tooManyFiles: boolean;
onUploadDataClick: () => void;
onItemMenuOpen: (event: React.MouseEvent<HTMLElement>, item: TreeItem<FileTreeData>, isWritable: boolean) => void;
onOptionsMenuOpen: (event: React.MouseEvent<HTMLElement>, isWritable: boolean) => void;
onSelectionToggle: (event: React.MouseEvent<HTMLElement>, item: TreeItem<FileTreeData>) => void;
onCollapseToggle: (id: string, status: TreeItemStatus) => void;
onFileClick: (id: string) => void;
+ loadFilesFunc: () => void;
currentItemUuid?: string;
}
-type CssRules = 'root' | 'cardSubheader' | 'nameHeader' | 'fileSizeHeader' | 'uploadIcon' | 'button';
+type CssRules = 'root' | 'cardSubheader' | 'nameHeader' | 'fileSizeHeader' | 'uploadIcon' | 'button' | 'centeredLabel';
const styles: StyleRulesCallback<CssRules> = theme => ({
root: {
- paddingBottom: theme.spacing.unit
+ paddingBottom: theme.spacing.unit,
+ height: '100%'
},
cardSubheader: {
paddingTop: 0,
button: {
marginRight: -theme.spacing.unit,
marginTop: '0px'
- }
+ },
+ centeredLabel: {
+ fontSize: '0.875rem',
+ textAlign: 'center'
+ },
});
export const CollectionPanelFiles =
withStyles(styles)(
- ({ onItemMenuOpen, onOptionsMenuOpen, onUploadDataClick, classes, isWritable, ...treeProps }: CollectionPanelFilesProps & WithStyles<CssRules>) =>
+ ({ onItemMenuOpen, onOptionsMenuOpen, onUploadDataClick, classes,
+ isWritable, isLoading, tooManyFiles, loadFilesFunc, ...treeProps }: CollectionPanelFilesProps & WithStyles<CssRules>) =>
<Card data-cy='collection-files-panel' className={classes.root}>
<CardHeader
title="Files"
+ className={classes.cardSubheader}
classes={{ action: classes.button }}
- action={
- isWritable &&
+ action={<>
+ {isWritable &&
<Button
data-cy='upload-button'
onClick={onUploadDataClick}
size='small'>
<DownloadIcon className={classes.uploadIcon} />
Upload data
- </Button>
- } />
- <CardHeader
- className={classes.cardSubheader}
- action={
+ </Button>}
+ {!tooManyFiles &&
<Tooltip title="More options" disableFocusListener>
<IconButton
data-cy='collection-files-panel-options-btn'
onClick={(ev) => onOptionsMenuOpen(ev, isWritable)}>
<CustomizeTableIcon />
</IconButton>
- </Tooltip>
- } />
- <Grid container justify="space-between">
- <Typography variant="caption" className={classes.nameHeader}>
- Name
- </Typography>
- <Typography variant="caption" className={classes.fileSizeHeader}>
- File size
- </Typography>
- </Grid>
- <FileTree onMenuOpen={(ev, item) => onItemMenuOpen(ev, item, isWritable)} {...treeProps} />
+ </Tooltip>}
+ </>
+ } />
+ { tooManyFiles
+ ? <div className={classes.centeredLabel}>
+ File listing may take some time, please click to browse: <Button onClick={loadFilesFunc}><DownloadIcon/>Show files</Button>
+ </div>
+ : <>
+ <Grid container justify="space-between">
+ <Typography variant="caption" className={classes.nameHeader}>
+ Name
+ </Typography>
+ <Typography variant="caption" className={classes.fileSizeHeader}>
+ File size
+ </Typography>
+ </Grid>
+ { isLoading
+ ? <div className={classes.centeredLabel}><CircularProgress /></div>
+ : <div style={{height: 'calc(100% - 60px)'}}><FileTree onMenuOpen={(ev, item) => onItemMenuOpen(ev, item, isWritable)} {...treeProps} /></div> }
+ </>
+ }
</Card>);
// SPDX-License-Identifier: AGPL-3.0
import * as React from "react";
-import { Tree, TreeItem, TreeItemStatus } from "../tree/tree";
+import { TreeItem, TreeItemStatus } from "../tree/tree";
+import { VirtualTree as Tree } from "../tree/virtual-tree";
import { FileTreeData } from "./file-tree-data";
import { FileTreeItem } from "./file-tree-item";
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import * as classnames from "classnames";
+import { StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core/styles';
+import { ReactElement } from "react";
+import { FixedSizeList, ListChildComponentProps } from "react-window";
+import AutoSizer from "react-virtualized-auto-sizer";
+
+import { ArvadosTheme } from '~/common/custom-theme';
+import { TreeItem, TreeProps, TreeItemStatus } from './tree';
+import { ListItem, Radio, Checkbox, CircularProgress, ListItemIcon } from '@material-ui/core';
+import { SidePanelRightArrowIcon } from '../icon/icon';
+
+type CssRules = 'list'
+ | 'listItem'
+ | 'active'
+ | 'loader'
+ | 'toggableIconContainer'
+ | 'iconClose'
+ | 'renderContainer'
+ | 'iconOpen'
+ | 'toggableIcon'
+ | 'checkbox'
+ | 'virtualizedList';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ list: {
+ padding: '3px 0px',
+ },
+ virtualizedList: {
+ height: '200px',
+ },
+ listItem: {
+ padding: '3px 0px',
+ },
+ loader: {
+ position: 'absolute',
+ transform: 'translate(0px)',
+ top: '3px'
+ },
+ toggableIconContainer: {
+ color: theme.palette.grey["700"],
+ height: '14px',
+ width: '14px',
+ },
+ toggableIcon: {
+ fontSize: '14px'
+ },
+ renderContainer: {
+ flex: 1
+ },
+ active: {
+ color: theme.palette.primary.main,
+ },
+ iconClose: {
+ transition: 'all 0.1s ease',
+ },
+ iconOpen: {
+ transition: 'all 0.1s ease',
+ transform: 'rotate(90deg)',
+ },
+ checkbox: {
+ width: theme.spacing.unit * 3,
+ height: theme.spacing.unit * 3,
+ margin: `0 ${theme.spacing.unit}px`,
+ padding: 0,
+ color: theme.palette.grey["500"],
+ }
+});
+
+export interface VirtualTreeItem<T> extends TreeItem<T> {
+ itemCount?: number;
+ level?: number;
+}
+
+// For some reason, on TSX files it isn't accepted just one generic param, so
+// I'm using <T, _> as a workaround.
+export const Row = <T, _>(itemList: VirtualTreeItem<T>[], render: any, treeProps: TreeProps<T>) => withStyles(styles)(
+ (props: React.PropsWithChildren<ListChildComponentProps> & WithStyles<CssRules>) => {
+ const { index, style, classes } = props;
+ const it = itemList[index];
+ const level = it.level || 0;
+ const { toggleItemActive, disableRipple, currentItemUuid, useRadioButtons } = treeProps;
+ const { listItem, loader, toggableIconContainer, renderContainer } = classes;
+ const { levelIndentation = 20, itemRightPadding = 20 } = treeProps;
+
+ const showSelection = typeof treeProps.showSelection === 'function'
+ ? treeProps.showSelection
+ : () => treeProps.showSelection ? true : false;
+
+ const handleRowContextMenu = (item: VirtualTreeItem<T>) =>
+ (event: React.MouseEvent<HTMLElement>) => {
+ treeProps.onContextMenu(event, item);
+ };
+
+ const handleToggleItemOpen = (item: VirtualTreeItem<T>) =>
+ (event: React.MouseEvent<HTMLElement>) => {
+ event.stopPropagation();
+ treeProps.toggleItemOpen(event, item);
+ };
+
+ const getToggableIconClassNames = (isOpen?: boolean, isActive?: boolean) => {
+ const { iconOpen, iconClose, active, toggableIcon } = props.classes;
+ return classnames(toggableIcon, {
+ [iconOpen]: isOpen,
+ [iconClose]: !isOpen,
+ [active]: isActive
+ });
+ };
+
+ const isSidePanelIconNotNeeded = (status: string, itemCount: number) => {
+ return status === TreeItemStatus.PENDING ||
+ (status === TreeItemStatus.LOADED && itemCount === 0);
+ };
+
+ const getProperArrowAnimation = (status: string, itemCount: number) => {
+ return isSidePanelIconNotNeeded(status, itemCount) ? <span /> : <SidePanelRightArrowIcon style={{ fontSize: '14px' }} />;
+ };
+
+ const handleCheckboxChange = (item: VirtualTreeItem<T>) => {
+ const { toggleItemSelection } = treeProps;
+ return toggleItemSelection
+ ? (event: React.MouseEvent<HTMLElement>) => {
+ event.stopPropagation();
+ toggleItemSelection(event, item);
+ }
+ : undefined;
+ };
+
+ return <div style={style}>
+ <ListItem button className={listItem}
+ style={{
+ paddingLeft: (level + 1) * levelIndentation,
+ paddingRight: itemRightPadding,
+ }}
+ disableRipple={disableRipple}
+ onClick={event => toggleItemActive(event, it)}
+ selected={showSelection(it) && it.id === currentItemUuid}
+ onContextMenu={handleRowContextMenu(it)}>
+ {it.status === TreeItemStatus.PENDING ?
+ <CircularProgress size={10} className={loader} /> : null}
+ <i onClick={handleToggleItemOpen(it)}
+ className={toggableIconContainer}>
+ <ListItemIcon className={getToggableIconClassNames(it.open, it.active)}>
+ {getProperArrowAnimation(it.status, it.itemCount!)}
+ </ListItemIcon>
+ </i>
+ {showSelection(it) && !useRadioButtons &&
+ <Checkbox
+ checked={it.selected}
+ className={classes.checkbox}
+ color="primary"
+ onClick={handleCheckboxChange(it)} />}
+ {showSelection(it) && useRadioButtons &&
+ <Radio
+ checked={it.selected}
+ className={classes.checkbox}
+ color="primary" />}
+ <div className={renderContainer}>
+ {render(it, level)}
+ </div>
+ </ListItem>
+ </div>;
+ });
+
+const itemSize = 30;
+
+export const VirtualList = <T, _>(height: number, width: number, items: VirtualTreeItem<T>[], render: any, treeProps: TreeProps<T>) =>
+ <FixedSizeList
+ height={height}
+ itemCount={items.length}
+ itemSize={itemSize}
+ width={width}
+ >
+ {Row(items, render, treeProps)}
+ </FixedSizeList>;
+
+export const VirtualTree = withStyles(styles)(
+ class Component<T> extends React.Component<TreeProps<T> & WithStyles<CssRules>, {}> {
+ render(): ReactElement<any> {
+ const { items, render } = this.props;
+
+ return <AutoSizer>
+ {({ height, width }) => {
+ return VirtualList(height, width, items || [], render, this.props);
+ }}
+ </AutoSizer>;
+ }
+ }
+);
import { processResourceAdminActionSet } from '~/views-components/context-menu/action-sets/process-resource-admin-action-set';
import { projectAdminActionSet } from '~/views-components/context-menu/action-sets/project-admin-action-set';
import { snackbarActions, SnackbarKind } from "~/store/snackbar/snackbar-actions";
+import { openNotFoundDialog } from './store/not-found-panel/not-found-panel-action';
console.log(`Starting arvados [${getBuildInfo()}]`);
errorFn: (id, error, showSnackBar) => {
if (showSnackBar) {
console.error("Backend error:", error);
- store.dispatch(snackbarActions.OPEN_SNACKBAR({
- message: `${error.errors
- ? error.errors[0]
- : error.message}`,
- kind: SnackbarKind.ERROR,
- hideDuration: 8000})
- );
+
+ if (error.errors[0].indexOf("not found") > -1) {
+ store.dispatch(openNotFoundDialog());
+ } else {
+ store.dispatch(snackbarActions.OPEN_SNACKBAR({
+ message: `${error.errors
+ ? error.errors[0]
+ : error.message}`,
+ kind: SnackbarKind.ERROR,
+ hideDuration: 8000})
+ );
+ }
}
}
});
selected: false,
expanded: false,
status: TreeNodeStatus.INITIAL
-
})(tree), createTree<CollectionDirectory | CollectionFile>());
};
}
export const RESOURCE_UUID_PATTERN = '[a-z0-9]{5}-[a-z0-9]{5}-[a-z0-9]{15}';
+export const PORTABLE_DATA_HASH_PATTERN = '[a-f0-9]{32}\\+\\d+';
export const RESOURCE_UUID_REGEX = new RegExp("^" + RESOURCE_UUID_PATTERN + "$");
-export const COLLECTION_PDH_REGEX = /^[a-f0-9]{32}\+\d+$/;
+export const COLLECTION_PDH_REGEX = new RegExp("^" + PORTABLE_DATA_HASH_PATTERN + "$");
export const isResourceUuid = (uuid: string) =>
RESOURCE_UUID_REGEX.test(uuid);
)(subtree) as Tree<T>;
export const setNode = <T>(node: TreeNode<T>) => (tree: Tree<T>): Tree<T> => {
- return pipe(
- (tree: Tree<T>) => getNode(node.id)(tree) === node
- ? tree
- : { ...tree, [node.id]: node },
- addChild(node.parent, node.id)
- )(tree);
+ if (tree[node.id] && tree[node.id] === node) { return tree; }
+
+ tree[node.id] = node;
+ if (tree[node.parent]) {
+ tree[node.parent].children = Array.from(new Set([...tree[node.parent].children, node.id]));
+ }
+ return tree;
};
export const getNodeValue = (id: string) => <T>(tree: Tree<T>) => {
toggleAncestorsSelection(id),
toggleDescendantsSelection(id))(tree)
: tree;
-
};
export const selectNode = (id: string) => <T>(tree: Tree<T>) => {
Object
.keys(tree)
.filter(id => getNode(id)(tree)!.parent === TREE_ROOT_ID);
-
-
-const addChild = (parentId: string, childId: string) => <T>(tree: Tree<T>): Tree<T> => {
- if (childId === "") {
- return tree;
- }
- const node = getNode(parentId)(tree);
- if (node) {
- const children = node.children.some(id => id === childId)
- ? node.children
- : [...node.children, childId];
-
- const newNode = children === node.children
- ? node
- : { ...node, children };
-
- return setNode(newNode)(tree);
- }
- return tree;
-};
// SPDX-License-Identifier: AGPL-3.0
import { matchPath } from 'react-router';
-import { ResourceKind, RESOURCE_UUID_PATTERN, extractUuidKind, COLLECTION_PDH_REGEX } from '~/models/resource';
+import { ResourceKind, RESOURCE_UUID_PATTERN, extractUuidKind, COLLECTION_PDH_REGEX, PORTABLE_DATA_HASH_PATTERN } from '~/models/resource';
import { getProjectUrl } from '~/models/project';
import { getCollectionUrl } from '~/models/collection';
import { Config } from '~/common/config';
GROUP_DETAILS: `/group/:id(${RESOURCE_UUID_PATTERN})`,
LINKS: '/links',
PUBLIC_FAVORITES: '/public-favorites',
- COLLECTIONS_CONTENT_ADDRESS: '/collections/:id',
+ COLLECTIONS_CONTENT_ADDRESS: `/collections/:id(${PORTABLE_DATA_HASH_PATTERN})`,
ALL_PROCESSES: '/all_processes',
+ NO_MATCH: '*',
};
export const getResourceUrl = (uuid: string) => {
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { CollectionService } from "../collection-service/collection-service";
-import { parseKeepManifestText, stringifyKeepManifest } from "./collection-manifest-parser";
-import { mapManifestToCollectionFilesTree } from "./collection-manifest-mapper";
-
-export class CollectionFilesService {
-
- constructor(private collectionService: CollectionService) { }
-
- getFiles(collectionUuid: string) {
- return this.collectionService
- .get(collectionUuid)
- .then(collection =>
- mapManifestToCollectionFilesTree(
- parseKeepManifestText(
- collection.manifestText
- )
- )
- );
- }
-
- async renameFile(collectionUuid: string, file: { name: string, path: string }, newName: string) {
- const collection = await this.collectionService.get(collectionUuid);
- const manifest = parseKeepManifestText(collection.manifestText);
- const updatedManifest = manifest.map(
- stream => stream.name === file.path
- ? {
- ...stream,
- files: stream.files.map(
- f => f.name === file.name
- ? { ...f, name: newName }
- : f
- )
- }
- : stream
- );
- const manifestText = stringifyKeepManifest(updatedManifest);
- return this.collectionService.update(collectionUuid, { manifestText });
- }
-
- async deleteFile(collectionUuid: string, file: { name: string, path: string }) {
- const collection = await this.collectionService.get(collectionUuid);
- const manifest = parseKeepManifestText(collection.manifestText);
- const updatedManifest = manifest.map(stream =>
- stream.name === file.path
- ? {
- ...stream,
- files: stream.files.filter(f => f.name !== file.name)
- }
- : stream
- );
- const manifestText = stringifyKeepManifest(updatedManifest);
- return this.collectionService.update(collectionUuid, { manifestText });
- }
-}
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { parseKeepManifestText } from "./collection-manifest-parser";
-import { mapManifestToFiles, mapManifestToDirectories, mapManifestToCollectionFilesTree, mapCollectionFilesTreeToManifest } from "./collection-manifest-mapper";
-
-test('mapManifestToFiles', () => {
- const manifestText = `. 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n./c d41d8cd98f00b204e9800998ecf8427e+0 0:0:d`;
- const manifest = parseKeepManifestText(manifestText);
- const files = mapManifestToFiles(manifest);
- expect(files).toEqual([{
- path: '',
- id: '/a',
- name: 'a',
- size: 0,
- type: 'file',
- url: ''
- }, {
- path: '',
- id: '/b',
- name: 'b',
- size: 0,
- type: 'file',
- url: ''
- }, {
- path: '',
- id: '/output.txt',
- name: 'output.txt',
- size: 33,
- type: 'file',
- url: ''
- }, {
- path: '/c',
- id: '/c/d',
- name: 'd',
- size: 0,
- type: 'file',
- url: ''
- },]);
-});
-
-test('mapManifestToDirectories', () => {
- const manifestText = `./c/user/results 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n`;
- const manifest = parseKeepManifestText(manifestText);
- const directories = mapManifestToDirectories(manifest);
- expect(directories).toEqual([{
- path: "",
- id: '/c',
- name: 'c',
- type: 'directory',
- url: ''
- }, {
- path: '/c',
- id: '/c/user',
- name: 'user',
- type: 'directory',
- url: ''
- }, {
- path: '/c/user',
- id: '/c/user/results',
- name: 'results',
- type: 'directory',
- url: ''
- },]);
-});
-
-test('mapCollectionFilesTreeToManifest', () => {
- const manifestText = `. 930625b054ce894ac40596c3f5a0d947+33 0:22:test.txt\n./c/user/results 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n`;
- const tree = mapManifestToCollectionFilesTree(parseKeepManifestText(manifestText));
- const manifest = mapCollectionFilesTreeToManifest(tree);
- expect(manifest).toEqual([{
- name: '',
- locators: [],
- files: [{
- name: 'test.txt',
- position: '',
- size: 22
- },],
- }, {
- name: '/c/user/results',
- locators: [],
- files: [{
- name: 'a',
- position: '',
- size: 0
- }, {
- name: 'b',
- position: '',
- size: 0
- }, {
- name: 'output.txt',
- position: '',
- size: 33
- },],
- },]);
-
-});
\ No newline at end of file
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { uniqBy, groupBy } from 'lodash';
-import { KeepManifestStream, KeepManifestStreamFile, KeepManifest } from "~/models/keep-manifest";
-import { TreeNode, setNode, createTree, getNodeDescendantsIds, getNodeValue, TreeNodeStatus } from '~/models/tree';
-import { CollectionFilesTree, CollectionFile, CollectionDirectory, createCollectionDirectory, createCollectionFile, CollectionFileType } from '../../models/collection-file';
-
-export const mapCollectionFilesTreeToManifest = (tree: CollectionFilesTree): KeepManifest => {
- const values = getNodeDescendantsIds('')(tree).map(id => getNodeValue(id)(tree));
- const files = values.filter(value => value && value.type === CollectionFileType.FILE) as CollectionFile[];
- const fileGroups = groupBy(files, file => file.path);
- return Object
- .keys(fileGroups)
- .map(dirName => ({
- name: dirName,
- locators: [],
- files: fileGroups[dirName].map(mapCollectionFile)
- }));
-};
-
-export const mapManifestToCollectionFilesTree = (manifest: KeepManifest): CollectionFilesTree =>
- manifestToCollectionFiles(manifest)
- .map(mapCollectionFileToTreeNode)
- .reduce((tree, node) => setNode(node)(tree), createTree<CollectionFile>());
-
-
-export const mapCollectionFileToTreeNode = (file: CollectionFile): TreeNode<CollectionFile> => ({
- children: [],
- id: file.id,
- parent: file.path,
- value: file,
- active: false,
- selected: false,
- expanded: false,
- status: TreeNodeStatus.INITIAL,
-});
-
-export const manifestToCollectionFiles = (manifest: KeepManifest): Array<CollectionDirectory | CollectionFile> => ([
- ...mapManifestToDirectories(manifest),
- ...mapManifestToFiles(manifest)
-]);
-
-export const mapManifestToDirectories = (manifest: KeepManifest): CollectionDirectory[] =>
- uniqBy(
- manifest
- .map(mapStreamDirectory)
- .map(splitDirectory)
- .reduce((all, splitted) => ([...all, ...splitted]), []),
- directory => directory.id);
-
-export const mapManifestToFiles = (manifest: KeepManifest): CollectionFile[] =>
- manifest
- .map(stream => stream.files.map(mapStreamFile(stream)))
- .reduce((all, current) => ([...all, ...current]), []);
-
-const splitDirectory = (directory: CollectionDirectory): CollectionDirectory[] => {
- return directory.name
- .split('/')
- .slice(1)
- .map(mapPathComponentToDirectory);
-};
-
-const mapPathComponentToDirectory = (component: string, index: number, components: string[]): CollectionDirectory =>
- createCollectionDirectory({
- path: index === 0 ? '' : joinPathComponents(components, index),
- id: joinPathComponents(components, index + 1),
- name: component,
- });
-
-const joinPathComponents = (components: string[], index: number) =>
- `/${components.slice(0, index).join('/')}`;
-
-const mapCollectionFile = (file: CollectionFile): KeepManifestStreamFile => ({
- name: file.name,
- position: '',
- size: file.size
-});
-
-const mapStreamDirectory = (stream: KeepManifestStream): CollectionDirectory =>
- createCollectionDirectory({
- path: '',
- id: stream.name,
- name: stream.name,
- });
-
-const mapStreamFile = (stream: KeepManifestStream) =>
- (file: KeepManifestStreamFile): CollectionFile =>
- createCollectionFile({
- path: stream.name,
- id: `${stream.name}/${file.name}`,
- name: file.name,
- size: file.size,
- });
-
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { parseKeepManifestText, parseKeepManifestStream, stringifyKeepManifest } from "./collection-manifest-parser";
-
-describe('parseKeepManifestText', () => {
- it('should parse text into streams', () => {
- const manifestText = `. 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n./c d41d8cd98f00b204e9800998ecf8427e+0 0:0:d\n`;
- const manifest = parseKeepManifestText(manifestText);
- expect(manifest[0].name).toBe('');
- expect(manifest[1].name).toBe('/c');
- expect(manifest.length).toBe(2);
- });
-});
-
-describe('parseKeepManifestStream', () => {
- const streamText = './c 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt';
- const stream = parseKeepManifestStream(streamText);
-
- it('should parse stream name', () => {
- expect(stream.name).toBe('/c');
- });
- it('should parse stream locators', () => {
- expect(stream.locators).toEqual(['930625b054ce894ac40596c3f5a0d947+33']);
- });
- it('should parse stream files', () => {
- expect(stream.files).toEqual([
- { name: 'a', position: '0', size: 0 },
- { name: 'b', position: '0', size: 0 },
- { name: 'output.txt', position: '0', size: 33 },
- ]);
- });
-});
-
-test('stringifyKeepManifest', () => {
- const manifestText = `. 930625b054ce894ac40596c3f5a0d947+33 0:22:test.txt\n./c/user/results 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n`;
- const manifest = parseKeepManifestText(manifestText);
- expect(stringifyKeepManifest(manifest)).toEqual(`. 930625b054ce894ac40596c3f5a0d947+33 0:22:test.txt\n./c/user/results 930625b054ce894ac40596c3f5a0d947+33 0:0:a 0:0:b 0:33:output.txt\n`);
-});
\ No newline at end of file
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { KeepManifestStream, KeepManifestStreamFile, KeepManifest } from "~/models/keep-manifest";
-
-/**
- * Documentation [http://doc.arvados.org/api/storage.html](http://doc.arvados.org/api/storage.html)
- */
-export const parseKeepManifestText: (text: string) => KeepManifestStream[] = (text: string) =>
- text
- .split(/\n/)
- .filter(streamText => streamText.length > 0)
- .map(parseKeepManifestStream);
-
-/**
- * Documentation [http://doc.arvados.org/api/storage.html](http://doc.arvados.org/api/storage.html)
- */
-export const parseKeepManifestStream = (stream: string): KeepManifestStream => {
- const tokens = stream.split(' ');
- return {
- name: streamName(tokens),
- locators: locators(tokens),
- files: files(tokens)
- };
-};
-
-export const stringifyKeepManifest = (manifest: KeepManifest) =>
- manifest.map(stringifyKeepManifestStream).join('');
-
-export const stringifyKeepManifestStream = (stream: KeepManifestStream) =>
- `.${stream.name} ${stream.locators.join(' ')} ${stream.files.map(stringifyFile).join(' ')}\n`;
-
-const FILE_LOCATOR_REGEXP = /^([0-9a-f]{32})\+([0-9]+)(\+[A-Z][-A-Za-z0-9@_]*)*$/;
-
-const FILE_REGEXP = /([0-9]+):([0-9]+):(.*)/;
-
-const streamName = (tokens: string[]) => tokens[0].slice(1);
-
-const locators = (tokens: string[]) => tokens.filter(isFileLocator);
-
-const files = (tokens: string[]) => tokens.filter(isFile).map(parseFile);
-
-const isFileLocator = (token: string) => FILE_LOCATOR_REGEXP.test(token);
-
-const isFile = (token: string) => FILE_REGEXP.test(token);
-
-const parseFile = (token: string): KeepManifestStreamFile => {
- const match = FILE_REGEXP.exec(token);
- const [position, size, name] = match!.slice(1);
- return { name, position, size: parseInt(size, 10) };
-};
-
-const stringifyFile = (file: KeepManifestStreamFile) =>
- `${file.position}:${file.size}:${file.name}`;
return getTagValue(element, 'D:resourcetype', '')
? createCollectionDirectory(data)
: createCollectionFile({ ...data, size });
-
});
};
const splittedApiToken = apiToken ? apiToken.split('/') : [];
const userApiToken = `/t=${splittedApiToken[2]}/`;
const splittedPrevFileUrl = file.url.split('/');
- const url = `${baseUrl}/${splittedPrevFileUrl[1]}${userApiToken}${splittedPrevFileUrl[2]}`;
+ const url = `${baseUrl}/${splittedPrevFileUrl[1]}${userApiToken}${splittedPrevFileUrl.slice(2).join('/')}`;
return {
...file,
url
import { FavoriteService } from "./favorite-service/favorite-service";
import { CollectionService } from "./collection-service/collection-service";
import { TagService } from "./tag-service/tag-service";
-import { CollectionFilesService } from "./collection-files-service/collection-files-service";
import { KeepService } from "./keep-service/keep-service";
import { WebDAV } from "~/common/webdav";
import { Config } from "~/common/config";
const ancestorsService = new AncestorService(groupsService, userService);
const authService = new AuthService(apiClient, config.rootUrl, actions);
const collectionService = new CollectionService(apiClient, webdavClient, authService, actions);
- const collectionFilesService = new CollectionFilesService(collectionService);
const favoriteService = new FavoriteService(linkService, groupsService);
const tagService = new TagService(linkService);
const searchService = new SearchService();
apiClientAuthorizationService,
authService,
authorizedKeysService,
- collectionFilesService,
collectionService,
containerRequestService,
containerService,
// SPDX-License-Identifier: AGPL-3.0
import { Dispatch } from "redux";
-import { loadCollectionFiles } from "./collection-panel-files/collection-panel-files-actions";
+import { loadCollectionFiles, COLLECTION_PANEL_LOAD_FILES_THRESHOLD } from "./collection-panel-files/collection-panel-files-actions";
import { CollectionResource } from '~/models/collection';
-import { collectionPanelFilesAction } from "./collection-panel-files/collection-panel-files-actions";
-import { createTree } from "~/models/tree";
import { RootState } from "~/store/store";
import { ServiceRepository } from "~/services/services";
import { TagProperty } from "~/models/tag";
export const collectionPanelActions = unionize({
SET_COLLECTION: ofType<CollectionResource>(),
LOAD_COLLECTION: ofType<{ uuid: string }>(),
- LOAD_COLLECTION_SUCCESS: ofType<{ item: CollectionResource }>()
+ LOAD_COLLECTION_SUCCESS: ofType<{ item: CollectionResource }>(),
+ LOAD_BIG_COLLECTIONS: ofType<boolean>(),
});
export type CollectionPanelAction = UnionOf<typeof collectionPanelActions>;
export const loadCollectionPanel = (uuid: string) =>
async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
dispatch(collectionPanelActions.LOAD_COLLECTION({ uuid }));
- dispatch(collectionPanelFilesAction.SET_COLLECTION_FILES({ files: createTree() }));
const collection = await services.collectionService.get(uuid);
dispatch(loadDetailsPanel(collection.uuid));
dispatch(collectionPanelActions.LOAD_COLLECTION_SUCCESS({ item: collection }));
dispatch(resourcesActions.SET_RESOURCES([collection]));
- dispatch<any>(loadCollectionFiles(collection.uuid));
+ if (collection.fileCount <= COLLECTION_PANEL_LOAD_FILES_THRESHOLD &&
+ !getState().collectionPanel.loadBigCollections) {
+ dispatch<any>(loadCollectionFiles(collection.uuid));
+ }
return collection;
};
import { startSubmit, stopSubmit, initialize, FormErrors } from 'redux-form';
import { getDialog } from "~/store/dialog/dialog-reducer";
import { getFileFullPath, sortFilesTree } from "~/services/collection-service/collection-service-files-response";
+import { progressIndicatorActions } from "~/store/progress-indicator/progress-indicator-actions";
export const collectionPanelFilesAction = unionize({
SET_COLLECTION_FILES: ofType<CollectionFilesTree>(),
export type CollectionPanelFilesAction = UnionOf<typeof collectionPanelFilesAction>;
+export const COLLECTION_PANEL_LOAD_FILES = 'collectionPanelLoadFiles';
+export const COLLECTION_PANEL_LOAD_FILES_THRESHOLD = 40000;
+
export const loadCollectionFiles = (uuid: string) =>
async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch(progressIndicatorActions.START_WORKING(COLLECTION_PANEL_LOAD_FILES));
const files = await services.collectionService.files(uuid);
// Given the array of directories and files, create the appropriate tree nodes,
const sorted = sortFilesTree(tree);
const mapped = mapTreeValues(services.collectionService.extendFileURL)(sorted);
dispatch(collectionPanelFilesAction.SET_COLLECTION_FILES(mapped));
+ dispatch(progressIndicatorActions.STOP_WORKING(COLLECTION_PANEL_LOAD_FILES));
};
export const removeCollectionFiles = (filePaths: string[]) =>
import { CollectionFileType } from "~/models/collection-file";
export const collectionPanelFilesReducer = (state: CollectionPanelFilesState = createTree(), action: CollectionPanelFilesAction) => {
+ // Low-level tree handling setNode() func does in-place data modifications
+ // for performance reasons, so we pass a copy of 'state' to avoid side effects.
return collectionPanelFilesAction.match(action, {
SET_COLLECTION_FILES: files =>
- mergeCollectionPanelFilesStates(state, mapTree(mapCollectionFileToCollectionPanelFile)(files)),
+ mergeCollectionPanelFilesStates({...state}, mapTree(mapCollectionFileToCollectionPanelFile)(files)),
TOGGLE_COLLECTION_FILE_COLLAPSE: data =>
- toggleCollapse(data.id)(state),
+ toggleCollapse(data.id)({...state}),
- TOGGLE_COLLECTION_FILE_SELECTION: data => [state]
+ TOGGLE_COLLECTION_FILE_SELECTION: data => [{...state}]
.map(toggleSelected(data.id))
.map(toggleAncestors(data.id))
.map(toggleDescendants(data.id))[0],
SELECT_ALL_COLLECTION_FILES: () =>
- mapTreeValues(v => ({ ...v, selected: true }))(state),
+ mapTreeValues(v => ({ ...v, selected: true }))({...state}),
UNSELECT_ALL_COLLECTION_FILES: () =>
- mapTreeValues(v => ({ ...v, selected: false }))(state),
+ mapTreeValues(v => ({ ...v, selected: false }))({...state}),
default: () => state
}) as CollectionPanelFilesState;
export interface CollectionPanelState {
item: CollectionResource | null;
+ loadBigCollections: boolean;
}
const initialState = {
- item: null
+ item: null,
+ loadBigCollections: false,
};
export const collectionPanelReducer = (state: CollectionPanelState = initialState, action: CollectionPanelAction) =>
collectionPanelActions.match(action, {
default: () => state,
- SET_COLLECTION: (item) => ({ ...state, item }),
- LOAD_COLLECTION_SUCCESS: ({ item }) => ({ ...state, item })
+ SET_COLLECTION: (item) => ({
+ ...state,
+ item,
+ loadBigCollections: false,
+ }),
+ LOAD_COLLECTION_SUCCESS: ({ item }) => ({ ...state, item }),
+ LOAD_BIG_COLLECTIONS: (loadBigCollections) => ({ ...state, loadBigCollections}),
});
export const navigateTo = (uuid: string) =>
async (dispatch: Dispatch, getState: () => RootState) => {
const kind = extractUuidKind(uuid);
-
switch (kind) {
case ResourceKind.PROJECT:
case ResourceKind.USER:
}
};
+export const navigateToNotFound = push(Routes.NO_MATCH);
+
export const navigateToRoot = push(Routes.ROOT);
export const navigateToFavorites = push(Routes.FAVORITES);
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { Dispatch } from "redux";
+import { dialogActions } from '~/store/dialog/dialog-actions';
+
+export const NOT_FOUND_DIALOG_NAME = 'notFoundDialog';
+
+export const openNotFoundDialog = () =>
+ (dispatch: Dispatch) => {
+ dispatch(dialogActions.OPEN_DIALOG({
+ id: NOT_FOUND_DIALOG_NAME,
+ data: {},
+ }));
+ };
\ No newline at end of file
import { subprocessPanelColumns } from '~/views/subprocess-panel/subprocess-panel-root';
import { loadAllProcessesPanel, allProcessesPanelActions } from '../all-processes-panel/all-processes-panel-action';
import { allProcessesPanelColumns } from '~/views/all-processes-panel/all-processes-panel';
+import { collectionPanelFilesAction } from '../collection-panel/collection-panel-files/collection-panel-files-actions';
+import { createTree } from '~/models/tree';
export const WORKBENCH_LOADING_SCREEN = 'workbenchLoadingScreen';
async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
const userUuid = getUserUuid(getState());
if (userUuid) {
+ // Clear collection files panel
+ dispatch(collectionPanelFilesAction.SET_COLLECTION_FILES({ files: createTree() }));
const match = await loadGroupContentsResource({ uuid, userUuid, services });
match({
OWNED: async collection => {
CollectionPanelFilesProps
} from "~/components/collection-panel-files/collection-panel-files";
import { RootState } from "~/store/store";
-import { TreeItem, TreeItemStatus } from "~/components/tree/tree";
+import { TreeItemStatus } from "~/components/tree/tree";
+import { VirtualTreeItem as TreeItem } from "~/components/tree/virtual-tree";
import {
CollectionPanelDirectory,
CollectionPanelFile,
return (state: RootState): Pick<CollectionPanelFilesProps, "items" | "currentItemUuid"> => {
if (prevState !== state.collectionPanelFiles) {
prevState = state.collectionPanelFiles;
- prevTree = getNodeChildrenIds('')(state.collectionPanelFiles)
- .map(collectionItemToTreeItem(state.collectionPanelFiles));
+ prevTree = [].concat.apply(
+ [], getNodeChildrenIds('')(state.collectionPanelFiles)
+ .map(collectionItemToList(0)(state.collectionPanelFiles)));
}
return {
items: prevTree,
},
});
-
export const CollectionPanelFiles = connect(memoizedMapStateToProps(), mapDispatchToProps)(Component);
-const collectionItemToTreeItem = (tree: Tree<CollectionPanelDirectory | CollectionPanelFile>) =>
- (id: string): TreeItem<FileTreeData> => {
+const collectionItemToList = (level: number) => (tree: Tree<CollectionPanelDirectory | CollectionPanelFile>) =>
+ (id: string): TreeItem<FileTreeData>[] => {
const node: TreeNode<CollectionPanelDirectory | CollectionPanelFile> = getNode(id)(tree) || initTreeNode({
id: '',
parent: '',
collapsed: true
}
});
- return {
+
+ const treeItem = {
active: false,
data: {
name: node.value.name,
url: node.value.url,
},
id: node.id,
- items: getNodeChildrenIds(node.id)(tree)
- .map(collectionItemToTreeItem(tree)),
+ items: [], // Not used in this case as we're converting a tree to a list.
+ itemCount: node.children.length,
open: node.value.type === CollectionFileType.DIRECTORY ? !node.value.collapsed : false,
selected: node.value.selected,
- status: TreeItemStatus.LOADED
+ status: TreeItemStatus.LOADED,
+ level,
};
+
+ const treeItemChilds = treeItem.open
+ ? [].concat.apply([], node.children.map(collectionItemToList(level+1)(tree)))
+ : [];
+
+ return [
+ treeItem,
+ ...treeItemChilds,
+ ];
};
// SPDX-License-Identifier: AGPL-3.0
import { ContextMenuActionSet } from "../context-menu-action-set";
-import { RenameIcon, RemoveIcon } from "~/components/icon/icon";
+import { RemoveIcon } from "~/components/icon/icon";
import { DownloadCollectionFileAction } from "../actions/download-collection-file-action";
-import { openFileRemoveDialog, openRenameFileDialog } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions';
+import { openFileRemoveDialog } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions';
import { CollectionFileViewerAction } from '~/views-components/context-menu/actions/collection-file-viewer-action';
]];
export const collectionFilesItemActionSet: ContextMenuActionSet = readOnlyCollectionFilesItemActionSet.concat([[
- {
- name: "Rename",
- icon: RenameIcon,
- execute: (dispatch, resource) => {
- dispatch<any>(openRenameFileDialog({ name: resource.name, id: resource.uuid }));
- }
- },
+ // FIXME: This isn't working. Maybe something related to WebDAV?
+ // {
+ // name: "Rename",
+ // icon: RenameIcon,
+ // execute: (dispatch, resource) => {
+ // dispatch<any>(openRenameFileDialog({ name: resource.name, id: resource.uuid }));
+ // }
+ // },
{
name: "Remove",
icon: RemoveIcon,
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from "react";
+import { Dispatch } from "redux";
+import { connect } from "react-redux";
+import { RootState } from '~/store/store';
+import { withDialog, WithDialogProps } from "~/store/dialog/with-dialog";
+import { NOT_FOUND_DIALOG_NAME } from '~/store/not-found-panel/not-found-panel-action';
+import { Dialog, DialogContent, DialogActions, Button, withStyles, StyleRulesCallback, WithStyles } from '@material-ui/core';
+import { ArvadosTheme } from '~/common/custom-theme';
+import { NotFoundPanel } from "~/views/not-found-panel/not-found-panel";
+
+type CssRules = 'tag';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ tag: {
+ marginRight: theme.spacing.unit,
+ marginBottom: theme.spacing.unit
+ }
+});
+
+interface NotFoundDialogDataProps {
+
+}
+
+interface NotFoundDialogActionProps {
+
+}
+
+const mapStateToProps = (state: RootState): NotFoundDialogDataProps => ({
+
+});
+
+const mapDispatchToProps = (dispatch: Dispatch): NotFoundDialogActionProps => ({
+
+});
+
+type NotFoundDialogProps = NotFoundDialogDataProps & NotFoundDialogActionProps & WithDialogProps<{}> & WithStyles<CssRules>;
+
+export const NotFoundDialog = connect(mapStateToProps, mapDispatchToProps)(
+ withStyles(styles)(
+ withDialog(NOT_FOUND_DIALOG_NAME)(
+ ({ open, closeDialog }: NotFoundDialogProps) =>
+ <Dialog open={open}
+ onClose={closeDialog}
+ fullWidth
+ maxWidth='md'
+ disableBackdropClick
+ disableEscapeKeyDown>
+ <DialogContent>
+ <NotFoundPanel notWrapped />
+ </DialogContent>
+ <DialogActions>
+ <Button
+ variant='text'
+ color='primary'
+ onClick={closeDialog}>
+ Close
+ </Button>
+ </DialogActions>
+ </Dialog>
+ )
+));
\ No newline at end of file
showSelection?: boolean;
relatedTreePickers?: string[];
disableActivation?: string[];
- loadRootItem: (item: TreeItem<ProjectsTreePickerRootItem>, pickerId: string, includeCollections?: boolean, inlcudeFiles?: boolean) => void;
+ loadRootItem: (item: TreeItem<ProjectsTreePickerRootItem>, pickerId: string, includeCollections?: boolean, includeFiles?: boolean) => void;
}
export type ProjectsTreePickerProps = ProjectsTreePickerDataProps & Partial<PickedTreePickerProps>;
import * as React from 'react';
import {
- StyleRulesCallback, WithStyles, withStyles, Card,
- CardHeader, IconButton, CardContent, Grid, Tooltip
+ StyleRulesCallback, WithStyles, withStyles,
+ IconButton, Grid, Tooltip, Typography, ExpansionPanel,
+ ExpansionPanelSummary, ExpansionPanelDetails
} from '@material-ui/core';
import { connect, DispatchProp } from "react-redux";
import { RouteComponentProps } from 'react-router';
import { ArvadosTheme } from '~/common/custom-theme';
import { RootState } from '~/store/store';
-import { MoreOptionsIcon, CollectionIcon, ReadOnlyIcon } from '~/components/icon/icon';
+import { MoreOptionsIcon, CollectionIcon, ReadOnlyIcon, ExpandIcon } from '~/components/icon/icon';
import { DetailsAttribute } from '~/components/details-attribute/details-attribute';
import { CollectionResource } from '~/models/collection';
import { CollectionPanelFiles } from '~/views-components/collection-panel-files/collection-panel-files';
import { CollectionTagForm } from './collection-tag-form';
-import { deleteCollectionTag, navigateToProcess } from '~/store/collection-panel/collection-panel-action';
+import { deleteCollectionTag, navigateToProcess, collectionPanelActions } from '~/store/collection-panel/collection-panel-action';
import { getResource } from '~/store/resources/resources';
import { openContextMenu } from '~/store/context-menu/context-menu-actions';
import { ContextMenuKind } from '~/views-components/context-menu/context-menu';
import { GroupResource } from '~/models/group';
import { UserResource } from '~/models/user';
import { getUserUuid } from '~/common/getuser';
+import { getProgressIndicator } from '~/store/progress-indicator/progress-indicator-reducer';
+import { COLLECTION_PANEL_LOAD_FILES, loadCollectionFiles, COLLECTION_PANEL_LOAD_FILES_THRESHOLD } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions';
-type CssRules = 'card' | 'iconHeader' | 'tag' | 'label' | 'value' | 'link' | 'centeredLabel' | 'readOnlyIcon';
+type CssRules = 'root'
+ | 'filesCard'
+ | 'iconHeader'
+ | 'tag'
+ | 'label'
+ | 'value'
+ | 'link'
+ | 'centeredLabel'
+ | 'readOnlyIcon';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
- card: {
- marginBottom: theme.spacing.unit * 2
+ root: {
+ display: 'flex',
+ flexFlow: 'column',
+ height: 'calc(100vh - 130px)', // (100% viewport height) - (top bar + breadcrumbs)
+ },
+ filesCard: {
+ marginBottom: theme.spacing.unit * 2,
+ flex: 1,
},
iconHeader: {
fontSize: '1.875rem',
interface CollectionPanelDataProps {
item: CollectionResource;
isWritable: boolean;
+ isLoadingFiles: boolean;
+ tooManyFiles: boolean;
}
type CollectionPanelProps = CollectionPanelDataProps & DispatchProp
isWritable = itemOwner.writableBy.indexOf(currentUserUUID || '') >= 0;
}
}
- return { item, isWritable };
+ const loadingFilesIndicator = getProgressIndicator(COLLECTION_PANEL_LOAD_FILES)(state.progressIndicator);
+ const isLoadingFiles = loadingFilesIndicator && loadingFilesIndicator!.working || false;
+ const tooManyFiles = !state.collectionPanel.loadBigCollections && item && item.fileCount > COLLECTION_PANEL_LOAD_FILES_THRESHOLD || false;
+ return { item, isWritable, isLoadingFiles, tooManyFiles };
})(
class extends React.Component<CollectionPanelProps> {
render() {
- const { classes, item, dispatch, isWritable } = this.props;
+ const { classes, item, dispatch, isWritable, isLoadingFiles, tooManyFiles } = this.props;
return item
- ? <>
- <Card data-cy='collection-info-panel' className={classes.card}>
- <CardHeader
- avatar={
+ ? <div className={classes.root}>
+ <ExpansionPanel data-cy='collection-info-panel' defaultExpanded>
+ <ExpansionPanelSummary expandIcon={<ExpandIcon />}>
+ <span>
<IconButton onClick={this.openCollectionDetails}>
<CollectionIcon className={classes.iconHeader} />
</IconButton>
- }
- action={
- <Tooltip title="More options" disableFocusListener>
- <IconButton
- data-cy='collection-panel-options-btn'
- aria-label="More options"
- onClick={this.handleContextMenu}>
- <MoreOptionsIcon />
- </IconButton>
+ <IllegalNamingWarning name={item.name}/>
+ {item.name}
+ {isWritable ||
+ <Tooltip title="Read-only">
+ <ReadOnlyIcon data-cy="read-only-icon" className={classes.readOnlyIcon} />
</Tooltip>
- }
- title={
- <span>
- <IllegalNamingWarning name={item.name}/>
- {item.name}
- {isWritable ||
- <Tooltip title="Read-only">
- <ReadOnlyIcon data-cy="read-only-icon" className={classes.readOnlyIcon} />
- </Tooltip>
- }
- </span>
- }
- titleTypographyProps={this.titleProps}
- subheader={item.description}
- subheaderTypographyProps={this.titleProps} />
- <CardContent>
- <Grid container direction="column">
- <Grid item xs={10}>
+ }
+ </span>
+ </ExpansionPanelSummary>
+ <ExpansionPanelDetails>
+ <Grid container justify="space-between">
+ <Grid item xs={11}>
+ <Typography variant="caption">
+ {item.description}
+ </Typography>
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
label='Collection UUID'
linkToUuid={item.uuid} />
</span>
}
</Grid>
+ <Grid item xs={1} style={{textAlign: "right"}}>
+ <Tooltip title="More options" disableFocusListener>
+ <IconButton
+ data-cy='collection-panel-options-btn'
+ aria-label="More options"
+ onClick={this.handleContextMenu}>
+ <MoreOptionsIcon />
+ </IconButton>
+ </Tooltip>
+ </Grid>
</Grid>
- </CardContent>
- </Card>
+ </ExpansionPanelDetails>
+ </ExpansionPanel>
- <Card data-cy='collection-properties-panel' className={classes.card}>
- <CardHeader title="Properties" />
- <CardContent>
- <Grid container direction="column">
+ <ExpansionPanel data-cy='collection-properties-panel' defaultExpanded>
+ <ExpansionPanelSummary expandIcon={<ExpandIcon />}>
+ {"Properties"}
+ </ExpansionPanelSummary>
+ <ExpansionPanelDetails>
+ <Grid container>
{isWritable && <Grid item xs={12}>
<CollectionTagForm />
</Grid>}
}
</Grid>
</Grid>
- </CardContent>
- </Card>
- <div className={classes.card}>
- <CollectionPanelFiles isWritable={isWritable} />
+ </ExpansionPanelDetails>
+ </ExpansionPanel>
+ <div className={classes.filesCard}>
+ <CollectionPanelFiles
+ isWritable={isWritable}
+ isLoading={isLoadingFiles}
+ tooManyFiles={tooManyFiles}
+ loadFilesFunc={() => {
+ dispatch(collectionPanelActions.LOAD_BIG_COLLECTIONS(true));
+ dispatch<any>(loadCollectionFiles(this.props.item.uuid));
+ }
+ } />
</div>
- </>
+ </div>
: null;
}
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { mount, configure } from 'enzyme';
+import * as Adapter from "enzyme-adapter-react-16";
+import { StyledComponentProps, MuiThemeProvider } from '@material-ui/core';
+import { ClusterConfigJSON } from '~/common/config';
+import { CustomTheme } from '~/common/custom-theme';
+import { NotFoundPanelRoot, NotFoundPanelRootDataProps, CssRules } from './not-found-panel-root';
+
+configure({ adapter: new Adapter() });
+
+describe('NotFoundPanelRoot', () => {
+ let props: NotFoundPanelRootDataProps & StyledComponentProps<CssRules>;
+
+ beforeEach(() => {
+ props = {
+ classes: {
+ root: 'root',
+ title: 'title',
+ active: 'active',
+ },
+ clusterConfig: {
+ Mail: {
+ SupportEmailAddress: 'support@example.com'
+ }
+ } as ClusterConfigJSON,
+ location: null,
+ };
+ });
+
+ it('should render component', () => {
+ // given
+ const expectedMessage = "The page you requested was not found";
+
+ // when
+ const wrapper = mount(
+ <MuiThemeProvider theme={CustomTheme}>
+ <NotFoundPanelRoot {...props} />
+ </MuiThemeProvider>
+ );
+
+ // then
+ expect(wrapper.find('p').text()).toContain(expectedMessage);
+ });
+
+ it('should render component without email url when no email', () => {
+ // setup
+ props.clusterConfig.Mail.SupportEmailAddress = '';
+
+ // when
+ const wrapper = mount(
+ <MuiThemeProvider theme={CustomTheme}>
+ <NotFoundPanelRoot {...props} />
+ </MuiThemeProvider>
+ );
+
+ // then
+ expect(wrapper.find('a').length).toBe(0);
+ });
+
+ it('should render component with additional message and email url', () => {
+ // given
+ const hash = '123hash123';
+ const pathname = `/collections/${hash}`;
+
+ // setup
+ props.location = {
+ pathname,
+ } as any;
+
+ // when
+ const wrapper = mount(
+ <MuiThemeProvider theme={CustomTheme}>
+ <NotFoundPanelRoot {...props} />
+ </MuiThemeProvider>
+ );
+
+ // then
+ expect(wrapper.find('p').first().text()).toContain(hash);
+
+ // and
+ expect(wrapper.find('a').length).toBe(1);
+ });
+});
\ No newline at end of file
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { Location } from 'history';
+import { StyleRulesCallback, WithStyles, withStyles, Paper, Grid } from '@material-ui/core';
+import { ArvadosTheme } from '~/common/custom-theme';
+import { ClusterConfigJSON } from '~/common/config';
+
+export type CssRules = 'root' | 'title' | 'active';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ root: {
+ overflow: 'hidden',
+ width: '100vw',
+ height: '100vh'
+ },
+ title: {
+ paddingLeft: theme.spacing.unit * 3,
+ paddingTop: theme.spacing.unit * 3,
+ paddingBottom: theme.spacing.unit * 3,
+ fontSize: '18px'
+ },
+ active: {
+ color: theme.customs.colors.green700,
+ textDecoration: 'none',
+ }
+});
+
+export interface NotFoundPanelOwnProps {
+ notWrapped?: boolean;
+}
+
+export interface NotFoundPanelRootDataProps {
+ location: Location<any> | null;
+ clusterConfig: ClusterConfigJSON;
+}
+
+type NotFoundPanelRootProps = NotFoundPanelRootDataProps & NotFoundPanelOwnProps & WithStyles<CssRules>;
+
+const getAdditionalMessage = (location: Location | null) => {
+ if (!location) {
+ return null;
+ }
+
+ const { pathname } = location;
+
+ if (pathname.indexOf('collections') > -1) {
+ const uuidHash = pathname.replace('/collections/', '');
+
+ return (
+ <p>
+ Please make sure that provided UUID/ObjectHash '{uuidHash}' is valid.
+ </p>
+ );
+ }
+
+ return null;
+};
+
+const getEmailLink = (email: string, classes: Record<CssRules, string>) => {
+ const { location: { href: windowHref } } = window;
+ const href = `mailto:${email}?body=${encodeURIComponent('Problem while viewing page ')}${encodeURIComponent(windowHref)}&subject=${encodeURIComponent('Workbench problem report')}`;
+
+ return (<a
+ className={classes.active}
+ href={href}>
+ email us
+ </a>);
+};
+
+
+export const NotFoundPanelRoot = withStyles(styles)(
+ ({ classes, clusterConfig, location, notWrapped }: NotFoundPanelRootProps) => {
+
+ const content = <Grid container justify="space-between" wrap="nowrap" alignItems="center">
+ <div data-cy="not-found-content" className={classes.title}>
+ <h2>Not Found</h2>
+ {getAdditionalMessage(location)}
+ <p>
+ The page you requested was not found,
+ {
+ !!clusterConfig.Mail && clusterConfig.Mail.SupportEmailAddress ?
+ getEmailLink(clusterConfig.Mail.SupportEmailAddress, classes) :
+ 'email us'
+ }
+ if you suspect this is a bug.
+ </p>
+ </div>
+ </Grid>;
+
+ return !notWrapped ? <Paper data-cy="not-found-page"> {content}</Paper> : content;
+ }
+);
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { RootState } from '~/store/store';
+import { connect } from 'react-redux';
+import { NotFoundPanelRoot, NotFoundPanelRootDataProps, NotFoundPanelOwnProps } from '~/views/not-found-panel/not-found-panel-root';
+
+const mapStateToProps = (state: RootState): NotFoundPanelRootDataProps => {
+ return {
+ location: state.router.location,
+ clusterConfig: state.auth.config.clusterConfig,
+ };
+};
+
+const mapDispatchToProps = null;
+
+export const NotFoundPanel = connect<NotFoundPanelRootDataProps, null, NotFoundPanelOwnProps>(mapStateToProps, mapDispatchToProps)
+ (NotFoundPanelRoot);
import { SiteManagerPanel } from "~/views/site-manager-panel/site-manager-panel";
import { MyAccountPanel } from '~/views/my-account-panel/my-account-panel';
import { SharingDialog } from '~/views-components/sharing-dialog/sharing-dialog';
+import { NotFoundDialog } from '~/views-components/not-found-dialog/not-found-dialog';
import { AdvancedTabDialog } from '~/views-components/advanced-tab-dialog/advanced-tab-dialog';
import { ProcessInputDialog } from '~/views-components/process-input-dialog/process-input-dialog';
import { VirtualMachineUserPanel } from '~/views/virtual-machine-panel/virtual-machine-user-panel';
import { FedLogin } from './fed-login';
import { CollectionsContentAddressPanel } from '~/views/collection-content-address-panel/collection-content-address-panel';
import { AllProcessesPanel } from '../all-processes-panel/all-processes-panel';
+import { NotFoundPanel } from '../not-found-panel/not-found-panel';
type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content';
<Route path={Routes.PUBLIC_FAVORITES} component={PublicFavoritePanel} />
<Route path={Routes.LINK_ACCOUNT} component={LinkAccountPanel} />
<Route path={Routes.COLLECTIONS_CONTENT_ADDRESS} component={CollectionsContentAddressPanel} />
+ <Route path={Routes.NO_MATCH} component={NotFoundPanel} />
</Switch>
</Grid>
</Grid>
<RichTextEditorDialog />
<SetupShellAccountDialog />
<SharingDialog />
+ <NotFoundDialog />
<Snackbar />
<UpdateCollectionDialog />
<UpdateProcessDialog />
dependencies:
"@types/react" "*"
+"@types/react-virtualized-auto-sizer@1.0.0":
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/@types/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.0.tgz#fc32f30a8dab527b5816f3a757e1e1d040c8f272"
+ integrity sha512-NMErdIdSnm2j/7IqMteRiRvRulpjoELnXWUwdbucYCz84xG9PHcoOrr7QfXwB/ku7wd6egiKFrzt/+QK4Imeeg==
+ dependencies:
+ "@types/react" "*"
+
+"@types/react-window@1.8.2":
+ version "1.8.2"
+ resolved "https://registry.yarnpkg.com/@types/react-window/-/react-window-1.8.2.tgz#a5a6b2762ce73ffaab7911ee1397cf645f2459fe"
+ integrity sha512-gP1xam68Wc4ZTAee++zx6pTdDAH08rAkQrWm4B4F/y6hhmlT9Mgx2q8lTCXnrPHXsr15XjRN9+K2DLKcz44qEQ==
+ dependencies:
+ "@types/react" "*"
+
"@types/react@*":
version "16.9.11"
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.11.tgz#70e0b7ad79058a7842f25ccf2999807076ada120"
mimic-fn "^2.0.0"
p-is-promise "^2.0.0"
+"memoize-one@>=3.1.1 <6":
+ version "5.1.1"
+ resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.1.1.tgz#047b6e3199b508eaec03504de71229b8eb1d75c0"
+ integrity sha512-HKeeBpWvqiVJD57ZUAsJNm71eHTykffzcLZVYWiVfQeI1rJtuEaS7hQiEpWfVVk18donPwJEcFKIkCmPJNOhHA==
+
memoize-one@^4.0.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-4.1.0.tgz#a2387c58c03fff27ca390c31b764a79addf3f906"
prop-types "^15.6.2"
react-lifecycles-compat "^3.0.4"
+react-virtualized-auto-sizer@1.0.2:
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/react-virtualized-auto-sizer/-/react-virtualized-auto-sizer-1.0.2.tgz#a61dd4f756458bbf63bd895a92379f9b70f803bd"
+ integrity sha512-MYXhTY1BZpdJFjUovvYHVBmkq79szK/k7V3MO+36gJkWGkrXKtyr4vCPtpphaTLRAdDNoYEYFZWE8LjN+PIHNg==
+
+react-window@1.8.5:
+ version "1.8.5"
+ resolved "https://registry.yarnpkg.com/react-window/-/react-window-1.8.5.tgz#a56b39307e79979721021f5d06a67742ecca52d1"
+ integrity sha512-HeTwlNa37AFa8MDZFZOKcNEkuF2YflA0hpGPiTT9vR7OawEt+GZbfM6wqkBahD3D3pUjIabQYzsnY/BSJbgq6Q==
+ dependencies:
+ "@babel/runtime" "^7.0.0"
+ memoize-one ">=3.1.1 <6"
+
react@16.8.6:
version "16.8.6"
resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"
projects / arvados-workbench2.git / commitdiff