[ARVADOS-WORKBENCH2] updated: 1.2.0-749-g49ad5cc
Git user
git at public.curoverse.com
Sun Oct 28 16:13:36 EDT 2018
Summary of changes:
.../sharing-dialog/permission-select.tsx | 28 ++-----------
.../sharing-dialog/select-item.tsx | 34 ++++++++++++++++
.../sharing-dialog/sharing-dialog-content.tsx | 19 +++++++++
.../sharing-dialog/sharing-dialog.tsx | 4 +-
...simple-form.tsx => sharing-invitation-form.tsx} | 2 +-
.../sharing-management-form-component.tsx | 46 ++++++++++++++++++++++
.../sharing-dialog/sharing-management-form.tsx | 20 ++++++++++
7 files changed, 125 insertions(+), 28 deletions(-)
create mode 100644 src/views-components/sharing-dialog/select-item.tsx
create mode 100644 src/views-components/sharing-dialog/sharing-dialog-content.tsx
rename src/views-components/sharing-dialog/{sharing-simple-form.tsx => sharing-invitation-form.tsx} (86%)
create mode 100644 src/views-components/sharing-dialog/sharing-management-form-component.tsx
create mode 100644 src/views-components/sharing-dialog/sharing-management-form.tsx
via 49ad5cc761e56b7d2fb204e872ad956c6fc1c60c (commit)
from 3e620538c5c0431bc587bb4c92da8c483f22a053 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit 49ad5cc761e56b7d2fb204e872ad956c6fc1c60c
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date: Sun Oct 28 21:13:17 2018 +0100
Create sharing management form
Feature #14365
Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
diff --git a/src/views-components/sharing-dialog/permission-select.tsx b/src/views-components/sharing-dialog/permission-select.tsx
index c16c483..0b839d5 100644
--- a/src/views-components/sharing-dialog/permission-select.tsx
+++ b/src/views-components/sharing-dialog/permission-select.tsx
@@ -3,12 +3,13 @@
// SPDX-License-Identifier: AGPL-3.0
import * as React from 'react';
-import { MenuItem, Grid, Select, withStyles, StyleRulesCallback } from '@material-ui/core';
+import { MenuItem, Select, withStyles, StyleRulesCallback } from '@material-ui/core';
import RemoveRedEye from '@material-ui/icons/RemoveRedEye';
import Edit from '@material-ui/icons/Edit';
import Computer from '@material-ui/icons/Computer';
import { WithStyles } from '@material-ui/core/styles';
import { SelectProps } from '@material-ui/core/Select';
+import { SelectItem } from './select-item';
export enum PermissionSelectValue {
READ = 'Read',
@@ -42,30 +43,7 @@ export const PermissionSelect = withStyles(PermissionSelectStyles)(
</Select>);
const renderPermissionItem = (value: string) =>
- <PermissionItem {...{ value }} />;
-
-type PermissionItemClasses = 'value' | 'icon';
-
-const permissionItemStyles: StyleRulesCallback<PermissionItemClasses> = theme => ({
- value: {
- marginLeft: theme.spacing.unit,
- },
- icon: {
- margin: `-${theme.spacing.unit / 2}px 0`
- }
-});
-
-const PermissionItem = withStyles(permissionItemStyles)(
- ({ value, classes }: { value: string } & WithStyles<PermissionItemClasses>) => {
- const Icon = getIcon(value);
- return (
- <Grid container alignItems='center'>
- <Icon className={classes.icon} />
- <span className={classes.value}>
- {value}
- </span>
- </Grid>);
- });
+ <SelectItem {...{ value, icon: getIcon(value) }} />;
const getIcon = (value: string) => {
switch (value) {
diff --git a/src/views-components/sharing-dialog/select-item.tsx b/src/views-components/sharing-dialog/select-item.tsx
new file mode 100644
index 0000000..9dcfd71
--- /dev/null
+++ b/src/views-components/sharing-dialog/select-item.tsx
@@ -0,0 +1,34 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { Grid, withStyles, StyleRulesCallback } from '@material-ui/core';
+import { WithStyles } from '@material-ui/core/styles';
+import { SvgIconProps } from '@material-ui/core/SvgIcon';
+
+type SelectItemClasses = 'value' | 'icon';
+
+const permissionItemStyles: StyleRulesCallback<SelectItemClasses> = theme => ({
+ value: {
+ marginLeft: theme.spacing.unit,
+ },
+ icon: {
+ margin: `-${theme.spacing.unit / 2}px 0`
+ }
+});
+
+/**
+ * This component should be used as a child of MenuItem component.
+ */
+export const SelectItem = withStyles(permissionItemStyles)(
+ ({ value, icon: Icon, classes }: { value: string, icon: React.ComponentType<SvgIconProps> } & WithStyles<SelectItemClasses>) => {
+ return (
+ <Grid container alignItems='center'>
+ <Icon className={classes.icon} />
+ <span className={classes.value}>
+ {value}
+ </span>
+ </Grid>);
+ });
+
diff --git a/src/views-components/sharing-dialog/sharing-dialog-content.tsx b/src/views-components/sharing-dialog/sharing-dialog-content.tsx
new file mode 100644
index 0000000..619f247
--- /dev/null
+++ b/src/views-components/sharing-dialog/sharing-dialog-content.tsx
@@ -0,0 +1,19 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+
+import { SharingInvitationForm } from './sharing-invitation-form';
+import { SharingManagementForm } from './sharing-management-form';
+import { Grid } from '@material-ui/core';
+
+export const SharingDialogContent = () =>
+ <Grid container direction='column' spacing={24}>
+ <Grid item>
+ <SharingManagementForm />
+ </Grid>
+ <Grid item>
+ <SharingInvitationForm />
+ </Grid>
+ </Grid>;
diff --git a/src/views-components/sharing-dialog/sharing-dialog.tsx b/src/views-components/sharing-dialog/sharing-dialog.tsx
index c43d94e..407db31 100644
--- a/src/views-components/sharing-dialog/sharing-dialog.tsx
+++ b/src/views-components/sharing-dialog/sharing-dialog.tsx
@@ -11,12 +11,12 @@ import { WithDialogProps } from '~/store/dialog/with-dialog';
import { RootState } from '~/store/store';
import SharingDialogComponent, { SharingDialogDataProps, SharingDialogActionProps } from './sharing-dialog-component';
-import { SharingSimpleForm } from './sharing-simple-form';
+import { SharingDialogContent } from './sharing-dialog-content';
const mapStateToProps = (_: RootState, props: WithDialogProps<string>): SharingDialogDataProps => ({
...props,
saveEnabled: false,
- children: <SharingSimpleForm />,
+ children: <SharingDialogContent />,
});
const mapDispatchToProps = (_: Dispatch, props: WithDialogProps<string>): SharingDialogActionProps => ({
diff --git a/src/views-components/sharing-dialog/sharing-simple-form.tsx b/src/views-components/sharing-dialog/sharing-invitation-form.tsx
similarity index 86%
rename from src/views-components/sharing-dialog/sharing-simple-form.tsx
rename to src/views-components/sharing-dialog/sharing-invitation-form.tsx
index eea8fa2..ca801ae 100644
--- a/src/views-components/sharing-dialog/sharing-simple-form.tsx
+++ b/src/views-components/sharing-dialog/sharing-invitation-form.tsx
@@ -8,7 +8,7 @@ import { compose } from 'redux';
import SharingInvitationFormComponent from './sharing-invitation-form-component';
import { PermissionSelectValue } from './permission-select';
-export const SharingSimpleForm = compose(
+export const SharingInvitationForm = compose(
connect(() => ({
initialValues: {
permission: PermissionSelectValue.READ
diff --git a/src/views-components/sharing-dialog/sharing-management-form-component.tsx b/src/views-components/sharing-dialog/sharing-management-form-component.tsx
new file mode 100644
index 0000000..688f416
--- /dev/null
+++ b/src/views-components/sharing-dialog/sharing-management-form-component.tsx
@@ -0,0 +1,46 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { Grid, StyleRulesCallback, Divider } from '@material-ui/core';
+import { Field, WrappedFieldProps, WrappedFieldArrayProps, FieldArray, FieldsProps } from 'redux-form';
+import { PermissionSelect } from './permission-select';
+import { WithStyles } from '@material-ui/core/styles';
+import withStyles from '@material-ui/core/styles/withStyles';
+
+
+export default () =>
+ <FieldArray name='permissions' component={SharingManagementFieldArray} />;
+
+const SharingManagementFieldArray = ({ fields }: WrappedFieldArrayProps<{ email: string }>) =>
+ <div>
+ {
+ fields.map((field, index, fields) =>
+ <PermissionManagementRow key={field} {...{ field, index, fields }} />)
+ }
+ <Divider />
+ </div>;
+
+const permissionManagementRowStyles: StyleRulesCallback<'root'> = theme => ({
+ root: {
+ padding: `${theme.spacing.unit}px 0`,
+ }
+});
+const PermissionManagementRow = withStyles(permissionManagementRowStyles)(
+ ({ field, index, fields, classes }: { field: string, index: number, fields: FieldsProps<{ email: string }> } & WithStyles<'root'>) =>
+ <>
+ <Divider />
+ <Grid container alignItems='center' spacing={8} className={classes.root}>
+ <Grid item xs={8}>
+ {fields.get(index).email}
+ </Grid>
+ <Grid item xs={4}>
+ <Field name={`${field}.permissions`} component={PermissionSelectComponent} />
+ </Grid>
+ </Grid>
+ </>
+);
+
+const PermissionSelectComponent = ({ input }: WrappedFieldProps) =>
+ <PermissionSelect fullWidth disableUnderline {...input} />;
diff --git a/src/views-components/sharing-dialog/sharing-management-form.tsx b/src/views-components/sharing-dialog/sharing-management-form.tsx
new file mode 100644
index 0000000..9c707be
--- /dev/null
+++ b/src/views-components/sharing-dialog/sharing-management-form.tsx
@@ -0,0 +1,20 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { reduxForm } from 'redux-form';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import SharingManagementFormComponent from './sharing-management-form-component';
+
+export const SharingManagementForm = compose(
+ connect(() => ({
+ initialValues: {
+ permissions: [
+ { email: 'chrystian.klingenberg at contractors.roche.com', permissions: 'Read' },
+ { email: 'artur.janicki at contractors.roche.com', permissions: 'Write' },
+ ],
+ }
+ })),
+ reduxForm({ form: 'SHARING_MANAGEMENT_FORM' })
+)(SharingManagementFormComponent);
\ No newline at end of file
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list