* Removes properties form subpanel from the main collection panel.
* Adds property chips to collection's info & details panel.
* Allows property editing from the details panel.
* Replaces resource-specific property form components with a generic one.
Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima <lucas.dipentima@curii.com>
import { CollectionResource } from 'models/collection';
import { RootState } from "store/store";
import { ServiceRepository } from "services/services";
-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';
import { SnackbarKind } from 'store/snackbar/snackbar-actions';
import { navigateTo } from 'store/navigation/navigation-action';
import { loadDetailsPanel } from 'store/details-panel/details-panel-action';
-import { addProperty, deleteProperty } from "lib/resource-properties";
-import { getResource } from "store/resources/resources";
export const collectionPanelActions = unionize({
SET_COLLECTION: ofType<CollectionResource>(),
export type CollectionPanelAction = UnionOf<typeof collectionPanelActions>;
-export const COLLECTION_TAG_FORM_NAME = 'collectionTagForm';
-
export const loadCollectionPanel = (uuid: string, forceReload = false) =>
async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
const { collectionPanel: { item } } = getState();
return collection;
};
-export const createCollectionTag = (data: TagProperty) =>
- (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
- const item = getState().collectionPanel.item;
- if (!item) { return; }
-
- const properties = Object.assign({}, item.properties);
- const key = data.keyID || data.key;
- const value = data.valueID || data.value;
- const cachedCollection = getResource<CollectionResource>(item.uuid)(getState().resources);
- services.collectionService.update(
- item.uuid, {
- properties: addProperty(properties, key, value)
- }
- ).then(updatedCollection => {
- updatedCollection = {...cachedCollection, ...updatedCollection};
- dispatch(collectionPanelActions.SET_COLLECTION(updatedCollection));
- dispatch(resourcesActions.SET_RESOURCES([updatedCollection]));
- dispatch(snackbarActions.OPEN_SNACKBAR({
- message: "Property has been successfully added.",
- hideDuration: 2000,
- kind: SnackbarKind.SUCCESS }));
- dispatch<any>(loadDetailsPanel(updatedCollection.uuid));
- return updatedCollection;
- }).catch (e =>
- dispatch(snackbarActions.OPEN_SNACKBAR({
- message: e.errors[0],
- hideDuration: 2000,
- kind: SnackbarKind.ERROR }))
- );
- };
-
export const navigateToProcess = (uuid: string) =>
async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
try {
dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'This process does not exist!', hideDuration: 2000, kind: SnackbarKind.ERROR }));
}
};
-
-export const deleteCollectionTag = (key: string, value: string) =>
- (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
- const item = getState().collectionPanel.item;
- if (!item) { return; }
-
- const properties = Object.assign({}, item.properties);
- const cachedCollection = getResource<CollectionResource>(item.uuid)(getState().resources);
- services.collectionService.update(
- item.uuid, {
- properties: deleteProperty(properties, key, value)
- }
- ).then(updatedCollection => {
- updatedCollection = {...cachedCollection, ...updatedCollection};
- dispatch(collectionPanelActions.SET_COLLECTION(updatedCollection));
- dispatch(resourcesActions.SET_RESOURCES([updatedCollection]));
- dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Tag has been successfully deleted.", hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
- dispatch<any>(loadDetailsPanel(updatedCollection.uuid));
- return updatedCollection;
- }).catch (e => {
- dispatch(snackbarActions.OPEN_SNACKBAR({
- message: e.errors[0],
- hideDuration: 2000,
- kind: SnackbarKind.ERROR }));
- });
- };
import { Dispatch } from 'redux';
import { dialogActions } from 'store/dialog/dialog-actions';
import { getResource } from 'store/resources/resources';
-import { ProjectResource } from "models/project";
import { ServiceRepository } from 'services/services';
-import { TagProperty } from 'models/tag';
-import { startSubmit, stopSubmit } from 'redux-form';
import { resourcesActions } from 'store/resources/resources-actions';
import {snackbarActions, SnackbarKind} from 'store/snackbar/snackbar-actions';
-import { addProperty, deleteProperty } from 'lib/resource-properties';
import { FilterBuilder } from 'services/api/filter-builder';
import { OrderBuilder } from 'services/api/order-builder';
import { CollectionResource } from 'models/collection';
export type DetailsPanelAction = UnionOf<typeof detailsPanelActions>;
-export const PROJECT_PROPERTIES_FORM_NAME = 'projectPropertiesFormName';
-export const PROJECT_PROPERTIES_DIALOG_NAME = 'projectPropertiesDialogName';
+export const RESOURCE_PROPERTIES_FORM_NAME = 'resourcePropertiesFormName';
+export const RESOURCE_PROPERTIES_DIALOG_NAME = 'resourcePropertiesDialogName';
export const loadDetailsPanel = (uuid: string) =>
(dispatch: Dispatch, getState: () => RootState) => {
}
};
-export const openProjectPropertiesDialog = () =>
+export const openResourcePropertiesDialog = () =>
(dispatch: Dispatch) => {
- dispatch<any>(dialogActions.OPEN_DIALOG({ id: PROJECT_PROPERTIES_DIALOG_NAME, data: { } }));
+ dispatch<any>(dialogActions.OPEN_DIALOG({ id: RESOURCE_PROPERTIES_DIALOG_NAME, data: { } }));
};
export const refreshCollectionVersionsList = (uuid: string) =>
);
};
-export const deleteProjectProperty = (key: string, value: string) =>
- async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
- const { detailsPanel, resources } = getState();
- const project = getResource(detailsPanel.resourceUuid)(resources) as ProjectResource;
- if (!project) { return; }
-
- const properties = Object.assign({}, project.properties);
-
- try {
- const updatedProject = await services.projectService.update(
- project.uuid, {
- properties: deleteProperty(properties, key, value),
- });
- dispatch(resourcesActions.SET_RESOURCES([updatedProject]));
- dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Property has been successfully deleted.", hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
- } catch (e) {
- dispatch(snackbarActions.OPEN_SNACKBAR({ message: e.errors[0], hideDuration: 2000, kind: SnackbarKind.ERROR }));
- }
- };
-
-export const createProjectProperty = (data: TagProperty) =>
- async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
- const { detailsPanel, resources } = getState();
- const project = getResource(detailsPanel.resourceUuid)(resources) as ProjectResource;
- if (!project) { return; }
-
- dispatch(startSubmit(PROJECT_PROPERTIES_FORM_NAME));
- try {
- const key = data.keyID || data.key;
- const value = data.valueID || data.value;
- const properties = Object.assign({}, project.properties);
- const updatedProject = await services.projectService.update(
- project.uuid, {
- properties: addProperty(properties, key, value),
- }
- );
- dispatch(resourcesActions.SET_RESOURCES([updatedProject]));
- dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Property has been successfully added.", hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
- dispatch(stopSubmit(PROJECT_PROPERTIES_FORM_NAME));
- } catch (e) {
- dispatch(snackbarActions.OPEN_SNACKBAR({ message: e.errors[0], hideDuration: 2000, kind: SnackbarKind.ERROR }));
- }
- };
export const toggleDetailsPanel = () => (dispatch: Dispatch, getState: () => RootState) => {
// because of material-ui issue resizing details panel breaks tabs.
// triggering window resize event fixes that.
// SPDX-License-Identifier: AGPL-3.0
import { unionize, ofType, UnionOf } from 'common/unionize';
-import { extractUuidKind, Resource } from 'models/resource';
+import { extractUuidKind, Resource, ResourceWithProperties } from 'models/resource';
import { Dispatch } from 'redux';
import { RootState } from 'store/store';
import { ServiceRepository } from 'services/services';
import { getResourceService } from 'services/services';
+import { addProperty, deleteProperty } from 'lib/resource-properties';
+import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
+import { getResource } from './resources';
+import { TagProperty } from 'models/tag';
export const resourcesActions = unionize({
SET_RESOURCES: ofType<Resource[]>(),
} catch {}
return undefined;
};
+
+export const deleteResourceProperty = (uuid: string, key: string, value: string) =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ const { resources } = getState();
+
+ const rsc = getResource(uuid)(resources) as ResourceWithProperties;
+ if (!rsc) { return; }
+
+ const kind = extractUuidKind(uuid);
+ const service = getResourceService(kind)(services);
+ if (!service) { return; }
+
+ const properties = Object.assign({}, rsc.properties);
+
+ try {
+ let updatedRsc = await service.update(
+ uuid, {
+ properties: deleteProperty(properties, key, value),
+ });
+ updatedRsc = {...rsc, ...updatedRsc};
+ dispatch<any>(updateResources([updatedRsc]));
+ dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Property has been successfully deleted.", hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
+ } catch (e) {
+ dispatch(snackbarActions.OPEN_SNACKBAR({ message: e.errors[0], hideDuration: 2000, kind: SnackbarKind.ERROR }));
+ }
+ };
+
+export const createResourceProperty = (data: TagProperty) =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ const { uuid } = data;
+ const { resources } = getState();
+
+ const rsc = getResource(uuid)(resources) as ResourceWithProperties;
+ if (!rsc) { return; }
+
+ const kind = extractUuidKind(uuid);
+ const service = getResourceService(kind)(services);
+ if (!service) { return; }
+
+ try {
+ const key = data.keyID || data.key;
+ const value = data.valueID || data.value;
+ const properties = Object.assign({}, rsc.properties);
+ let updatedRsc = await service.update(
+ rsc.uuid, {
+ properties: addProperty(properties, key, value),
+ }
+ );
+ updatedRsc = {...rsc, ...updatedRsc};
+ dispatch<any>(updateResources([updatedRsc]));
+ dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Property has been successfully added.", hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
+ } catch (e) {
+ const errorMsg = e.errors && e.errors.length > 0 ? e.errors[0] : "Error while adding property";
+ dispatch(snackbarActions.OPEN_SNACKBAR({ message: errorMsg, hideDuration: 2000, kind: SnackbarKind.ERROR }));
+ }
+ };
import React from 'react';
import { connect } from 'react-redux';
-import { openProjectPropertiesDialog } from 'store/details-panel/details-panel-action';
+import { openResourcePropertiesDialog } from 'store/details-panel/details-panel-action';
import { ProjectIcon, RenameIcon, FilterGroupIcon } from 'components/icon/icon';
import { ProjectResource } from 'models/project';
import { formatDate } from 'common/formatters';
}
const mapDispatchToProps = (dispatch: Dispatch) => ({
- onClick: () => dispatch<any>(openProjectPropertiesDialog()),
+ onClick: () => dispatch<any>(openResourcePropertiesDialog()),
});
type ProjectDetailsComponentProps = ProjectDetailsComponentDataProps & ProjectDetailsComponentActionProps & WithStyles<CssRules>;
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import 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 { ProjectResource } from 'models/project';
-import { PROJECT_PROPERTIES_DIALOG_NAME, deleteProjectProperty } from 'store/details-panel/details-panel-action';
-import { Dialog, DialogTitle, DialogContent, DialogActions, Button, withStyles, StyleRulesCallback, WithStyles } from '@material-ui/core';
-import { ArvadosTheme } from 'common/custom-theme';
-import { ProjectPropertiesForm } from 'views-components/project-properties-dialog/project-properties-form';
-import { getResource } from 'store/resources/resources';
-import { getPropertyChip } from "../resource-properties-form/property-chip";
-
-type CssRules = 'tag';
-
-const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
- tag: {
- marginRight: theme.spacing.unit,
- marginBottom: theme.spacing.unit
- }
-});
-
-interface ProjectPropertiesDialogDataProps {
- project: ProjectResource;
-}
-
-interface ProjectPropertiesDialogActionProps {
- handleDelete: (key: string, value: string) => void;
-}
-
-const mapStateToProps = ({ detailsPanel, resources, properties }: RootState): ProjectPropertiesDialogDataProps => ({
- project: getResource(detailsPanel.resourceUuid)(resources) as ProjectResource,
-});
-
-const mapDispatchToProps = (dispatch: Dispatch): ProjectPropertiesDialogActionProps => ({
- handleDelete: (key: string, value: string) => () => dispatch<any>(deleteProjectProperty(key, value)),
-});
-
-type ProjectPropertiesDialogProps = ProjectPropertiesDialogDataProps & ProjectPropertiesDialogActionProps & WithDialogProps<{}> & WithStyles<CssRules>;
-
-export const ProjectPropertiesDialog = connect(mapStateToProps, mapDispatchToProps)(
- withStyles(styles)(
- withDialog(PROJECT_PROPERTIES_DIALOG_NAME)(
- ({ classes, open, closeDialog, handleDelete, project }: ProjectPropertiesDialogProps) =>
- <Dialog open={open}
- onClose={closeDialog}
- fullWidth
- maxWidth='sm'>
- <DialogTitle>Properties</DialogTitle>
- <DialogContent>
- <ProjectPropertiesForm />
- {project && project.properties &&
- Object.keys(project.properties).map(k =>
- Array.isArray(project.properties[k])
- ? project.properties[k].map((v: string) =>
- getPropertyChip(
- k, v,
- handleDelete(k, v),
- classes.tag))
- : getPropertyChip(
- k, project.properties[k],
- handleDelete(k, project.properties[k]),
- classes.tag)
- )
- }
- </DialogContent>
- <DialogActions>
- <Button
- variant='text'
- color='primary'
- onClick={closeDialog}>
- Close
- </Button>
- </DialogActions>
- </Dialog>
- )
- ));
// SPDX-License-Identifier: AGPL-3.0
import { reduxForm, reset } from 'redux-form';
-import { PROJECT_PROPERTIES_FORM_NAME, createProjectProperty } from 'store/details-panel/details-panel-action';
+import { RESOURCE_PROPERTIES_FORM_NAME } from 'store/details-panel/details-panel-action';
import { ResourcePropertiesForm, ResourcePropertiesFormData } from 'views-components/resource-properties-form/resource-properties-form';
import { withStyles } from '@material-ui/core';
import { Dispatch } from 'redux';
+import { createResourceProperty } from 'store/resources/resources-actions';
const Form = withStyles(({ spacing }) => ({ container: { marginBottom: spacing.unit * 2 } }))(ResourcePropertiesForm);
-export const ProjectPropertiesForm = reduxForm<ResourcePropertiesFormData>({
- form: PROJECT_PROPERTIES_FORM_NAME,
+export const ResourcePropertiesDialogForm = reduxForm<ResourcePropertiesFormData, {uuid: string}>({
+ form: RESOURCE_PROPERTIES_FORM_NAME,
onSubmit: (data, dispatch: Dispatch) => {
- dispatch<any>(createProjectProperty(data));
- dispatch(reset(PROJECT_PROPERTIES_FORM_NAME));
+ dispatch<any>(createResourceProperty(data));
+ dispatch(reset(RESOURCE_PROPERTIES_FORM_NAME));
}
})(Form);
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import 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 { RESOURCE_PROPERTIES_DIALOG_NAME } from 'store/details-panel/details-panel-action';
+import {
+ Dialog,
+ DialogTitle,
+ DialogContent,
+ DialogActions,
+ Button,
+ withStyles,
+ StyleRulesCallback,
+ WithStyles
+} from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { ResourcePropertiesDialogForm } from 'views-components/resource-properties-dialog/resource-properties-dialog-form';
+import { getResource } from 'store/resources/resources';
+import { getPropertyChip } from "../resource-properties-form/property-chip";
+import { deleteResourceProperty } from "store/resources/resources-actions";
+import { ResourceWithProperties } from "models/resource";
+
+type CssRules = 'tag';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ tag: {
+ marginRight: theme.spacing.unit,
+ marginBottom: theme.spacing.unit
+ }
+});
+
+interface ResourcePropertiesDialogDataProps {
+ resource: ResourceWithProperties;
+}
+
+interface ResourcePropertiesDialogActionProps {
+ handleDelete: (uuid: string, key: string, value: string) => void;
+}
+
+const mapStateToProps = ({ detailsPanel, resources, properties }: RootState): ResourcePropertiesDialogDataProps => ({
+ resource: getResource(detailsPanel.resourceUuid)(resources) as ResourceWithProperties,
+});
+
+const mapDispatchToProps = (dispatch: Dispatch): ResourcePropertiesDialogActionProps => ({
+ handleDelete: (uuid: string, key: string, value: string) => () => dispatch<any>(deleteResourceProperty(uuid, key, value)),
+});
+
+type ResourcePropertiesDialogProps = ResourcePropertiesDialogDataProps & ResourcePropertiesDialogActionProps & WithDialogProps<{}> & WithStyles<CssRules>;
+
+export const ResourcePropertiesDialog = connect(mapStateToProps, mapDispatchToProps)(
+ withStyles(styles)(
+ withDialog(RESOURCE_PROPERTIES_DIALOG_NAME)(
+ ({ classes, open, closeDialog, handleDelete, resource }: ResourcePropertiesDialogProps) =>
+ <Dialog open={open}
+ onClose={closeDialog}
+ fullWidth
+ maxWidth='sm'>
+ <DialogTitle>Edit properties</DialogTitle>
+ <DialogContent>
+ <ResourcePropertiesDialogForm uuid={resource ? resource.uuid : ''} />
+ {resource && resource.properties &&
+ Object.keys(resource.properties).map(k =>
+ Array.isArray(resource.properties[k])
+ ? resource.properties[k].map((v: string) =>
+ getPropertyChip(
+ k, v,
+ handleDelete(resource.uuid, k, v),
+ classes.tag))
+ : getPropertyChip(
+ k, resource.properties[k],
+ handleDelete(resource.uuid, k, resource.properties[k]),
+ classes.tag)
+ )
+ }
+ </DialogContent>
+ <DialogActions>
+ <Button
+ variant='text'
+ color='primary'
+ onClick={closeDialog}>
+ Close
+ </Button>
+ </DialogActions>
+ </Dialog>
+ )
+ ));
import { GridClassKey } from '@material-ui/core/Grid';
export interface ResourcePropertiesFormData {
+ uuid: string;
[PROPERTY_KEY_FIELD_NAME]: string;
[PROPERTY_KEY_FIELD_ID]: string;
[PROPERTY_VALUE_FIELD_NAME]: string;
[PROPERTY_VALUE_FIELD_ID]: string;
}
-export type ResourcePropertiesFormProps = InjectedFormProps<ResourcePropertiesFormData> & WithStyles<GridClassKey>;
+export type ResourcePropertiesFormProps = {uuid: string; } & InjectedFormProps<ResourcePropertiesFormData, {uuid: string; }> & WithStyles<GridClassKey>;
-export const ResourcePropertiesForm = ({ handleSubmit, submitting, invalid, classes }: ResourcePropertiesFormProps ) =>
- <form data-cy='resource-properties-form' onSubmit={handleSubmit}>
+export const ResourcePropertiesForm = ({ handleSubmit, change, submitting, invalid, classes, uuid }: ResourcePropertiesFormProps ) => {
+ change('uuid', uuid); // Sets the uuid field to the uuid of the resource.
+ return <form data-cy='resource-properties-form' onSubmit={handleSubmit}>
<Grid container spacing={16} classes={classes}>
<Grid item xs>
<PropertyKeyField />
</Button>
</Grid>
</Grid>
- </form>;
+ </form>};
export const Button = withStyles(theme => ({
root: { marginTop: theme.spacing.unit }
// SPDX-License-Identifier: AGPL-3.0
import React from 'react';
+import { Dispatch } from 'redux';
import {
StyleRulesCallback,
WithStyles,
Grid,
Tooltip,
Typography,
- Card, CardHeader, CardContent,
+ Card
} 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, CollectionOldVersionIcon } from 'components/icon/icon';
+import { MoreOptionsIcon, CollectionIcon, ReadOnlyIcon, CollectionOldVersionIcon, RenameIcon } from 'components/icon/icon';
import { DetailsAttribute } from 'components/details-attribute/details-attribute';
import { CollectionResource, getCollectionUrl } from 'models/collection';
import { CollectionPanelFiles } from 'views-components/collection-panel-files/collection-panel-files';
-import { CollectionTagForm } from './collection-tag-form';
-import { deleteCollectionTag, navigateToProcess, collectionPanelActions } from 'store/collection-panel/collection-panel-action';
+import { navigateToProcess, collectionPanelActions } from 'store/collection-panel/collection-panel-action';
import { getResource } from 'store/resources/resources';
import { openContextMenu, resourceUuidToContextMenuKind } from 'store/context-menu/context-menu-actions';
import { formatDate, formatFileSize } from "common/formatters";
-import { openDetailsPanel } from 'store/details-panel/details-panel-action';
+import { openDetailsPanel, openResourcePropertiesDialog } from 'store/details-panel/details-panel-action';
import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
import { getPropertyChip } from 'views-components/resource-properties-form/property-chip';
import { IllegalNamingWarning } from 'components/warning/warning';
const { classes, item, dispatch, isWritable, isOldVersion, isLoadingFiles, tooManyFiles } = this.props;
const panelsData: MPVPanelState[] = [
{name: "Details"},
- {name: "Properties"},
{name: "Files"},
];
return item
</Grid>
</Card>
</MPVPanelContent>
- <MPVPanelContent xs="auto" data-cy='collection-properties-panel'>
- <Card className={classes.propertiesCard}>
- <CardHeader title="Properties" />
- <CardContent><Grid container>
- {isWritable && <Grid item xs={12}>
- <CollectionTagForm />
- </Grid>}
- <Grid item xs={12}>
- {Object.keys(item.properties).length > 0
- ? Object.keys(item.properties).map(k =>
- Array.isArray(item.properties[k])
- ? item.properties[k].map((v: string) =>
- getPropertyChip(
- k, v,
- isWritable
- ? this.handleDelete(k, v)
- : undefined,
- classes.tag))
- : getPropertyChip(
- k, item.properties[k],
- isWritable
- ? this.handleDelete(k, item.properties[k])
- : undefined,
- classes.tag)
- )
- : <div className={classes.centeredLabel}>No properties set on this collection.</div>
- }
- </Grid>
- </Grid></CardContent>
- </Card>
- </MPVPanelContent>
<MPVPanelContent xs>
<Card className={classes.filesCard}>
<CollectionPanelFiles
kind: SnackbarKind.SUCCESS
}))
- handleDelete = (key: string, value: string) => () => {
- this.props.dispatch<any>(deleteCollectionTag(key, value));
- }
-
openCollectionDetails = (e: React.MouseEvent<HTMLElement>) => {
const { item } = this.props;
if (item) {
)
);
-export const CollectionDetailsAttributes = (props: { item: CollectionResource, twoCol: boolean, classes?: Record<CssRules, string>, showVersionBrowser?: () => void }) => {
+interface CollectionDetailsActionProps {
+ onClick: () => void;
+}
+
+interface CollectionDetailsProps {
+ item: CollectionResource;
+ classes?: any;
+ twoCol?: boolean;
+ showVersionBrowser?: () => void;
+}
+
+const mapDispatchToProps = (dispatch: Dispatch) => ({
+ onClick: () => dispatch<any>(openResourcePropertiesDialog()),
+});
+
+export const CollectionDetailsAttributes = connect(null, mapDispatchToProps)(
+(props: CollectionDetailsProps & CollectionDetailsActionProps) => {
const item = props.item;
- const classes = props.classes || { label: '', value: '', button: '' };
+ const classes = props.classes || { label: '', value: '', button: '', tag: '' };
const isOldVersion = item && item.currentVersionUuid !== item.uuid;
const mdSize = props.twoCol ? 6 : 12;
const showVersionBrowser = props.showVersionBrowser;
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
label='Storage classes' value={item.storageClassesDesired.join(', ')} />
</Grid>
+ <Grid item xs={12} md={mdSize}>
+ <DetailsAttribute classLabel={classes.label} classValue={classes.value}
+ label='Properties'>
+ { !props.twoCol
+ ? <div onClick={props.onClick}>
+ <RenameIcon className={classes.editIcon} />
+ </div>
+ : '' }
+ </DetailsAttribute>
+ { Object.keys(item.properties).length > 0
+ ? Object.keys(item.properties).map(k =>
+ Array.isArray(item.properties[k])
+ ? item.properties[k].map((v: string) =>
+ getPropertyChip(k, v, undefined, classes.tag))
+ : getPropertyChip(k, item.properties[k], undefined, classes.tag))
+ : <div className={classes.value}>No properties</div> }
+ </Grid>
</Grid>;
-};
+});
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { reduxForm, reset } from 'redux-form';
-import { createCollectionTag, COLLECTION_TAG_FORM_NAME } from 'store/collection-panel/collection-panel-action';
-import { ResourcePropertiesForm, ResourcePropertiesFormData } from 'views-components/resource-properties-form/resource-properties-form';
-import { withStyles } from '@material-ui/core';
-import { Dispatch } from 'redux';
-
-const Form = withStyles(({ spacing }) => ({ container: { marginBottom: spacing.unit * 2 } }))(ResourcePropertiesForm);
-
-export const CollectionTagForm = reduxForm<ResourcePropertiesFormData>({
- form: COLLECTION_TAG_FORM_NAME,
- onSubmit: (data, dispatch: Dispatch) => {
- dispatch<any>(createCollectionTag(data));
- dispatch(reset(COLLECTION_TAG_FORM_NAME));
- }
-})(Form);
import { ProcessInputDialog } from 'views-components/process-input-dialog/process-input-dialog';
import { VirtualMachineUserPanel } from 'views/virtual-machine-panel/virtual-machine-user-panel';
import { VirtualMachineAdminPanel } from 'views/virtual-machine-panel/virtual-machine-admin-panel';
-import { ProjectPropertiesDialog } from 'views-components/project-properties-dialog/project-properties-dialog';
+import { ResourcePropertiesDialog } from 'views-components/resource-properties-dialog/resource-properties-dialog';
import { RepositoriesPanel } from 'views/repositories-panel/repositories-panel';
import { KeepServicePanel } from 'views/keep-service-panel/keep-service-panel';
import { ApiClientAuthorizationPanel } from 'views/api-client-authorization-panel/api-client-authorization-panel';
<PartialCopyToCollectionDialog />
<ProcessCommandDialog />
<ProcessInputDialog />
- <ProjectPropertiesDialog />
+ <ResourcePropertiesDialog />
<RestoreCollectionVersionDialog />
<RemoveApiClientAuthorizationDialog />
<RemoveGroupDialog />