// SPDX-License-Identifier: AGPL-3.0
import * as React from 'react';
-import { Field, InjectedFormProps } from "redux-form";
+import { Field, InjectedFormProps, WrappedFieldProps } from "redux-form";
import { TextField } from "~/components/text-field/text-field";
import { NativeSelectField } from "~/components/select-field/select-field";
import {
} from '@material-ui/core';
import { ArvadosTheme } from '~/common/custom-theme';
import { User } from "~/models/user";
-import { require } from "~/validators/require";
+import { MY_ACCOUNT_VALIDATION } from "~/validators/validators";
type CssRules = 'root' | 'gridItem' | 'label' | 'title' | 'actions';
}
});
-export interface MyAccountPanelRootActionProps {}
+export interface MyAccountPanelRootActionProps { }
export interface MyAccountPanelRootDataProps {
isPristine: boolean;
isValid: boolean;
initialValues?: User;
+ localCluster: string;
}
-export const MY_ACCOUNT_FORM = 'myAccountForm';
-
-const FILES_FIELD_VALIDATION = [require];
+const RoleTypes = [
+ { key: 'Bio-informatician', value: 'Bio-informatician' },
+ { key: 'Data Scientist', value: 'Data Scientist' },
+ { key: 'Analyst', value: 'Analyst' },
+ { key: 'Researcher', value: 'Researcher' },
+ { key: 'Software Developer', value: 'Software Developer' },
+ { key: 'System Administrator', value: 'System Administrator' },
+ { key: 'Other', value: 'Other' }
+];
type MyAccountPanelRootProps = InjectedFormProps<MyAccountPanelRootActionProps> & MyAccountPanelRootDataProps & WithStyles<CssRules>;
+type LocalClusterProp = { localCluster: string };
+const renderField: React.ComponentType<WrappedFieldProps & LocalClusterProp> = ({ input, localCluster }) => (
+ <span>{localCluster === input.value.substr(0, 5) ? "" : "federated"} user {input.value}</span>
+);
+
export const MyAccountPanelRoot = withStyles(styles)(
- ({ classes, isValid, handleSubmit, reset, isPristine, invalid, submitting }: MyAccountPanelRootProps) => {
+ ({ classes, isValid, handleSubmit, reset, isPristine, invalid, submitting, localCluster }: MyAccountPanelRootProps) => {
return <Card className={classes.root}>
<CardContent>
- <Typography variant="title" className={classes.title}>User profile</Typography>
+ <Typography variant="title" className={classes.title}>
+ Logged in as <Field name="uuid" component={renderField} localCluster={localCluster} />
+ </Typography>
<form onSubmit={handleSubmit}>
- <Grid container direction="row" spacing={24}>
- <Grid item xs={6}>
- <Grid item className={classes.gridItem}>
- <Field
- label="E-mail"
- name="email"
- component={TextField}
- disabled
- />
- </Grid>
- <Grid item className={classes.gridItem}>
- <Field
- label="First name"
- name="firstName"
- component={TextField}
- disabled
- />
- </Grid>
- <Grid item className={classes.gridItem}>
- <Field
- label="Identity URL"
- name="identityUrl"
- component={TextField}
- disabled
- />
- </Grid>
- <Grid item className={classes.gridItem}>
- <Field
- label="*Organization"
- name="prefs.profile.organization"
- component={TextField}
- validate={FILES_FIELD_VALIDATION}
- />
- </Grid>
- <Grid item className={classes.gridItem}>
- <Field
- label="Website"
- name="prefs.profile.website_url"
- component={TextField}
- />
- </Grid>
- <Grid item className={classes.gridItem}>
- <InputLabel className={classes.label} htmlFor="prefs.profile.role">Organization</InputLabel>
- <Field
- id="prefs.profile.role"
- name="prefs.profile.role"
- component={NativeSelectField}
- items={[
- {key: 'Bio-informatician', value: 'Bio-informatician'},
- {key: 'Data Scientist', value: 'Data Scientist'},
- {key: 'Analyst', value: 'Analyst'},
- {key: 'Researcher', value: 'Researcher'},
- {key: 'Software Developer', value: 'Software Developer'},
- {key: 'System Administrator', value: 'System Administrator'},
- {key: 'Other', value: 'Other'}
- ]}
- />
- </Grid>
+ <Grid container spacing={24}>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="First name"
+ name="firstName"
+ component={TextField}
+ disabled
+ />
+ </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="Last name"
+ name="lastName"
+ component={TextField}
+ disabled
+ />
+ </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="E-mail"
+ name="email"
+ component={TextField}
+ disabled
+ />
+ </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="Username"
+ name="username"
+ component={TextField}
+ disabled
+ />
</Grid>
- <Grid item xs={6}>
- <Grid item className={classes.gridItem} />
- <Grid item className={classes.gridItem}>
- <Field
- label="Last name"
- name="lastName"
- component={TextField}
- disabled
- />
- </Grid>
- <Grid item className={classes.gridItem} />
- <Grid item className={classes.gridItem}>
- <Field
- label="*E-mail at Organization"
- name="prefs.profile.organization_email"
- component={TextField}
- validate={FILES_FIELD_VALIDATION}
- />
- </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="Organization"
+ name="prefs.profile.organization"
+ component={TextField}
+ validate={MY_ACCOUNT_VALIDATION}
+ required
+ />
</Grid>
- <Grid item xs={12} className={classes.actions}>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="E-mail at Organization"
+ name="prefs.profile.organization_email"
+ component={TextField}
+ validate={MY_ACCOUNT_VALIDATION}
+ required
+ />
+ </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <InputLabel className={classes.label} htmlFor="prefs.profile.role">Role</InputLabel>
+ <Field
+ id="prefs.profile.role"
+ name="prefs.profile.role"
+ component={NativeSelectField}
+ items={RoleTypes}
+ />
+ </Grid>
+ <Grid item className={classes.gridItem} sm={6} xs={12}>
+ <Field
+ label="Website"
+ name="prefs.profile.website_url"
+ component={TextField}
+ />
+ </Grid>
+ <Grid container direction="row" justify="flex-end" >
<Button color="primary" onClick={reset} disabled={isPristine}>Discard changes</Button>
- <Button color="primary" variant="contained" type="submit" disabled={isPristine || invalid || submitting}>Save changes</Button>
+ <Button
+ color="primary"
+ variant="contained"
+ type="submit"
+ disabled={isPristine || invalid || submitting}>
+ Save changes
+ </Button>
</Grid>
</Grid>
- </form>
- </CardContent>
- </Card>;}
-);
\ No newline at end of file
+ </form >
+ </CardContent >
+ </Card >;
+ }
+);
projects / arvados-workbench2.git / blobdiff