refs # Merge branch 'origin/progress-and-focus-cr-fixes'
authorDaniel Kos <daniel.kos@contractors.roche.com>
Wed, 26 Sep 2018 07:04:46 +0000 (09:04 +0200)
committerDaniel Kos <daniel.kos@contractors.roche.com>
Wed, 26 Sep 2018 07:05:03 +0000 (09:05 +0200)
Arvados-DCO-1.1-Signed-off-by: Daniel Kos <daniel.kos@contractors.roche.com>

package.json
public/favicon.ico
public/index.html
src/store/collection-panel/collection-panel-action.ts
src/store/collection-panel/collection-panel-reducer.ts
src/store/processes/process-command-actions.ts
src/views-components/process-command-dialog/process-command-dialog.tsx
src/views/collection-panel/collection-panel.tsx
yarn.lock

index 620ff5a6d03a6d7d616ab9d32b0ec2f47c0530ac..811e4a07ae5dc53eeb56ed4105e03cbae6f05649 100644 (file)
@@ -9,6 +9,7 @@
     "@types/react-copy-to-clipboard": "4.2.6",
     "@types/react-dropzone": "4.2.2",
     "@types/redux-form": "7.4.5",
+    "@types/shell-quote": "1.6.0",
     "axios": "0.18.0",
     "classnames": "2.2.6",
     "lodash": "4.17.10",
@@ -25,6 +26,7 @@
     "react-transition-group": "2.4.0",
     "redux": "4.0.0",
     "redux-thunk": "2.3.0",
+    "shell-quote": "1.6.1",
     "unionize": "2.1.2",
     "uuid": "3.3.2"
   },
index a11777cc471a4344702741ab1c8a588998b1311a..4c763b6b72ac2c4cadc2c449805cc4ef2e848f18 100644 (file)
Binary files a/public/favicon.ico and b/public/favicon.ico differ
index a8d655e5872080571e26bf3f5a830046b3ffcffe..84b92829b2faf384ea117189cdc4129782b0b9e3 100644 (file)
@@ -9,7 +9,7 @@
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
     -->
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico?v=1">
     <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
index 97b6d49c7d25d154bd51471c94ef992fcb2d27f8..5e991619e77e3a405722ae3b30115b555c3e62af 100644 (file)
@@ -9,20 +9,14 @@ import { collectionPanelFilesAction } from "./collection-panel-files/collection-
 import { createTree } from "~/models/tree";
 import { RootState } from "../store";
 import { ServiceRepository } from "~/services/services";
-import { TagResource, TagProperty } from "~/models/tag";
+import { TagProperty } from "~/models/tag";
 import { snackbarActions } from "../snackbar/snackbar-actions";
 import { resourcesActions } from "~/store/resources/resources-actions";
 import { unionize, ofType, UnionOf } from '~/common/unionize';
 
 export const collectionPanelActions = unionize({
     LOAD_COLLECTION: ofType<{ uuid: string }>(),
-    LOAD_COLLECTION_SUCCESS: ofType<{ item: CollectionResource }>(),
-    LOAD_COLLECTION_TAGS: ofType<{ uuid: string }>(),
-    LOAD_COLLECTION_TAGS_SUCCESS: ofType<{ tags: TagResource[] }>(),
-    CREATE_COLLECTION_TAG: ofType<{ data: any }>(),
-    CREATE_COLLECTION_TAG_SUCCESS: ofType<{ tag: TagResource }>(),
-    DELETE_COLLECTION_TAG: ofType<{ uuid: string }>(),
-    DELETE_COLLECTION_TAG_SUCCESS: ofType<{ uuid: string }>()
+    LOAD_COLLECTION_SUCCESS: ofType<{ item: CollectionResource }>()
 });
 
 export type CollectionPanelAction = UnionOf<typeof collectionPanelActions>;
@@ -37,46 +31,41 @@ export const loadCollectionPanel = (uuid: string) =>
         dispatch(collectionPanelActions.LOAD_COLLECTION_SUCCESS({ item: collection }));
         dispatch(resourcesActions.SET_RESOURCES([collection]));
         dispatch<any>(loadCollectionFiles(collection.uuid));
-        dispatch<any>(loadCollectionTags(collection.uuid));
         return collection;
     };
 
-export const loadCollectionTags = (uuid: string) =>
-    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        dispatch(collectionPanelActions.LOAD_COLLECTION_TAGS({ uuid }));
-        return services.tagService
-            .list(uuid)
-            .then(tags => {
-                dispatch(collectionPanelActions.LOAD_COLLECTION_TAGS_SUCCESS({ tags }));
-            });
-    };
-
-export const createCollectionTag = (data: TagProperty) =>
-    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        dispatch(collectionPanelActions.CREATE_COLLECTION_TAG({ data }));
+export const createCollectionTag = (data: TagProperty) => 
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
         const item = getState().collectionPanel.item;
         const uuid = item ? item.uuid : '';
-        return services.tagService
-            .create(uuid, data)
-            .then(tag => {
-                dispatch(collectionPanelActions.CREATE_COLLECTION_TAG_SUCCESS({ tag }));
-                dispatch(snackbarActions.OPEN_SNACKBAR({
-                    message: "Tag has been successfully added.",
-                    hideDuration: 2000
-                }));
-            });
+        try {
+            if (item) {
+                item.properties[data.key] = data.value;
+                const updatedCollection = await services.collectionService.update(uuid, item);
+                dispatch(resourcesActions.SET_RESOURCES([updatedCollection]));
+                dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Tag has been successfully added.", hideDuration: 2000 }));
+                return updatedCollection;
+            }
+            return;
+        } catch (e) {
+            return;
+        }
     };
 
-export const deleteCollectionTag = (uuid: string) =>
-    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        dispatch(collectionPanelActions.DELETE_COLLECTION_TAG({ uuid }));
-        return services.linkService
-            .delete(uuid)
-            .then(tag => {
-                dispatch(collectionPanelActions.DELETE_COLLECTION_TAG_SUCCESS({ uuid: tag.uuid }));
-                dispatch(snackbarActions.OPEN_SNACKBAR({
-                    message: "Tag has been successfully deleted.",
-                    hideDuration: 2000
-                }));
-            });
+export const deleteCollectionTag = (key: string) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const item = getState().collectionPanel.item;
+        const uuid = item ? item.uuid : '';
+        try {
+            if (item) {
+                delete item.properties[key];
+                const updatedCollection = await services.collectionService.update(uuid, item);
+                dispatch(resourcesActions.SET_RESOURCES([updatedCollection]));
+                dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Tag has been successfully deleted.", hideDuration: 2000 }));
+                return updatedCollection;
+            }
+            return;
+        } catch (e) {
+            return;
+        }
     };
index 2c3edf1a5afce13ec9059f523f042df3eef9751a..b4951b81826b14426b72e813eda7e93d14c2f8f6 100644 (file)
@@ -4,23 +4,17 @@
 
 import { collectionPanelActions, CollectionPanelAction } from "./collection-panel-action";
 import { CollectionResource } from "~/models/collection";
-import { TagResource } from "~/models/tag";
 
 export interface CollectionPanelState {
     item: CollectionResource | null;
-    tags: TagResource[];
 }
 
 const initialState = {
-    item: null,
-    tags: []
+    item: null
 };
 
 export const collectionPanelReducer = (state: CollectionPanelState = initialState, action: CollectionPanelAction) =>
     collectionPanelActions.match(action, {
         default: () => state,
         LOAD_COLLECTION_SUCCESS: ({ item }) => ({ ...state, item }),
-        LOAD_COLLECTION_TAGS_SUCCESS: ({ tags }) => ({...state, tags }),
-        CREATE_COLLECTION_TAG_SUCCESS: ({ tag }) => ({...state, tags: [...state.tags, tag] }),
-        DELETE_COLLECTION_TAG_SUCCESS: ({ uuid }) => ({...state, tags: state.tags.filter(tag => tag.uuid !== uuid) })
     });
index de55a2cb50be1796d444470654e76eaa03535059..6c765568aaf9ddd707ee283ffa4add5571199c24 100644 (file)
@@ -6,6 +6,7 @@ import { dialogActions } from '~/store/dialog/dialog-actions';
 import { RootState } from '../store';
 import { Dispatch } from 'redux';
 import { getProcess } from '~/store/processes/process';
+import { quote } from 'shell-quote';
 
 export const PROCESS_COMMAND_DIALOG_NAME = 'processCommandDialog';
 
@@ -19,7 +20,7 @@ export const openProcessCommandDialog = (processUuid: string) =>
         const process = getProcess(processUuid)(getState().resources);
         if (process) {
             const data: ProcessCommandDialogData = {
-                command: process.containerRequest.command.join(' '),
+                command: quote(process.containerRequest.command),
                 processName: process.containerRequest.name,
             };
             dispatch(dialogActions.OPEN_DIALOG({ id: PROCESS_COMMAND_DIALOG_NAME, data }));
index 4bde68d8be42776c5a2ca891d73db6ce712c9458..81022ea56fe982297d44be5d92ab9f20fbaa47bd 100644 (file)
@@ -3,20 +3,25 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from "react";
-import { Dialog, DialogTitle, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core';
+import { Dialog, DialogTitle, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, Tooltip, IconButton, Grid, CardHeader } from '@material-ui/core';
 import { withDialog } from "~/store/dialog/with-dialog";
 import { PROCESS_COMMAND_DIALOG_NAME } from '~/store/processes/process-command-actions';
 import { WithDialogProps } from '~/store/dialog/with-dialog';
 import { ProcessCommandDialogData } from '~/store/processes/process-command-actions';
 import { DefaultCodeSnippet } from "~/components/default-code-snippet/default-code-snippet";
 import { compose } from 'redux';
+import * as CopyToClipboard from "react-copy-to-clipboard";
+import { CopyIcon } from '~/components/icon/icon';
 
-type CssRules = 'codeSnippet';
+type CssRules = 'codeSnippet' | 'copyToClipboard';
 
 const styles: StyleRulesCallback<CssRules> = theme => ({
     codeSnippet: {
         marginLeft: theme.spacing.unit * 3,
         marginRight: theme.spacing.unit * 3,
+    },
+    copyToClipboard: {
+        marginRight: theme.spacing.unit,
     }
 });
 
@@ -30,7 +35,17 @@ export const ProcessCommandDialog = compose(
             maxWidth="md"
             onClose={props.closeDialog}
             style={{ alignSelf: 'stretch' }}>
-            <DialogTitle>{`Command - ${props.data.processName}`}</DialogTitle>
+            <CardHeader
+                title={`Command - ${props.data.processName}`}
+                action={
+                    <Tooltip title="Copy to clipboard">
+                        <CopyToClipboard text={props.data.command}>
+                            <IconButton className={props.classes.copyToClipboard}>
+                                <CopyIcon />
+                            </IconButton>
+                        </CopyToClipboard>
+                    </Tooltip>
+                } />
             <DefaultCodeSnippet
                 className={props.classes.codeSnippet}
                 lines={[props.data.command]} />
index 8e46385cc9cfa694c938c6b1ce5183e32d7f858c..0b264b6bab4593a454b5e9220c51274c9c44c392 100644 (file)
@@ -16,7 +16,6 @@ import { DetailsAttribute } from '~/components/details-attribute/details-attribu
 import { CollectionResource } from '~/models/collection';
 import { CollectionPanelFiles } from '~/views-components/collection-panel-files/collection-panel-files';
 import * as CopyToClipboard from 'react-copy-to-clipboard';
-import { TagResource } from '~/models/tag';
 import { CollectionTagForm } from './collection-tag-form';
 import { deleteCollectionTag } from '~/store/collection-panel/collection-panel-action';
 import { snackbarActions } from '~/store/snackbar/snackbar-actions';
@@ -55,7 +54,6 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 
 interface CollectionPanelDataProps {
     item: CollectionResource;
-    tags: TagResource[];
 }
 
 type CollectionPanelProps = CollectionPanelDataProps & DispatchProp
@@ -66,13 +64,12 @@ export const CollectionPanel = withStyles(styles)(
     connect((state: RootState, props: RouteComponentProps<{ id: string }>) => {
         const collection = getResource(props.match.params.id)(state.resources);
         return {
-            item: collection,
-            tags: state.collectionPanel.tags
+            item: collection
         };
     })(
         class extends React.Component<CollectionPanelProps> {
             render() {
-                const { classes, item, tags } = this.props;
+                const { classes, item } = this.props;
                 return <div>
                     <Card className={classes.card}>
                         <CardHeader
@@ -118,10 +115,10 @@ export const CollectionPanel = withStyles(styles)(
                                 <Grid item xs={12}><CollectionTagForm /></Grid>
                                 <Grid item xs={12}>
                                     {
-                                        tags.map(tag => {
-                                            return <Chip key={tag.etag} className={classes.tag}
-                                                onDelete={this.handleDelete(tag.uuid)}
-                                                label={renderTagLabel(tag)} />;
+                                        Object.keys(item.properties).map( key => {
+                                            return <Chip key={key} className={classes.tag}
+                                                onDelete={this.handleDelete(key)}
+                                                label={`${key}: ${item.properties[key]}`} />;
                                         })
                                     }
                                 </Grid>
@@ -147,8 +144,8 @@ export const CollectionPanel = withStyles(styles)(
                 this.props.dispatch<any>(openContextMenu(event, resource));
             }
 
-            handleDelete = (uuid: string) => () => {
-                this.props.dispatch<any>(deleteCollectionTag(uuid));
+            handleDelete = (key: string) => () => {
+                this.props.dispatch<any>(deleteCollectionTag(key));
             }
 
             onCopy = () => {
@@ -160,8 +157,3 @@ export const CollectionPanel = withStyles(styles)(
         }
     )
 );
-
-const renderTagLabel = (tag: TagResource) => {
-    const { properties } = tag;
-    return `${properties.key}: ${properties.value}`;
-};
index 30e94bdefb4c9be9d37fc394908c15653130d55f..c8148433ef7250b47fb7b54896da373b806b40aa 100644 (file)
--- a/yarn.lock
+++ b/yarn.lock
     "@types/react" "*"
     redux "^3.6.0 || ^4.0.0"
 
+"@types/shell-quote@1.6.0":
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/@types/shell-quote/-/shell-quote-1.6.0.tgz#537b2949a2ebdcb0d353e448fee45b081021963f"
+
 "@types/uuid@3.4.4":
   version "3.4.4"
   resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-3.4.4.tgz#7af69360fa65ef0decb41fd150bf4ca5c0cefdf5"