--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from "react";
+import { WarningIcon } from "~/components/icon/icon";
+import { StyleRulesCallback, DialogContentText, WithStyles, withStyles } from "@material-ui/core";
+import { ArvadosTheme } from '~/common/custom-theme';
+
+type CssRules = 'container' | 'text';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ container: {
+ display: 'flex',
+ alignItems: 'center',
+ },
+ text: {
+ paddingLeft: '8px'
+ }
+});
+
+interface WarningCollectionProps {
+ text: string;
+}
+
+export const WarningCollection = withStyles(styles)(({ classes, text }: WarningCollectionProps & WithStyles<CssRules>) =>
+ <span className={classes.container}>
+ <WarningIcon />
+ <DialogContentText className={classes.text}>{text}</DialogContentText>
+ </span>);
\ No newline at end of file
import { FormDialog } from '~/components/form-dialog/form-dialog';
import { require } from '~/validators/require';
import { FileUploaderField } from '~/views-components/file-uploader/file-uploader';
-import { WarningIcon } from '~/components/icon/icon';
-import { DialogContentText } from '@material-ui/core';
-
+import { WarningCollection } from '~/components/warning-collection/warning-collection';
type DialogCollectionFilesUploadProps = WithDialogProps<{}> & InjectedFormProps<CollectionCreateFormDialogData>;
name='files'
validate={FILES_FIELD_VALIDATION}
component={FileUploaderField} />
- <span style={{ display: 'flex', alignItems: 'center', marginTop: '8px' }}>
- <WarningIcon />
- <DialogContentText style={{ paddingLeft: '8px' }}>Uploading new files will change content address.</DialogContentText>
- </span>
+ <WarningCollection text="Uploading new files will change content address." />
</>;
-
const FILES_FIELD_VALIDATION = [require];
import { DialogContentText } from '@material-ui/core';
import { TextField } from '~/components/text-field/text-field';
import { RENAME_FILE_DIALOG, RenameFileDialogData, renameFile } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions';
-import { WarningIcon } from "~/components/icon/icon";
+import { WarningCollection } from '~/components/warning-collection/warning-collection';
export const RenameFileDialog = compose(
withDialog(RENAME_FILE_DIALOG),
name='name'
component={TextField}
/>
- <span style={{ display: 'flex', alignItems: 'center' }}>
- <WarningIcon />
- <DialogContentText style={{ paddingLeft: '8px' }}>Renaming a file will change content adress.</DialogContentText>
- </span>
-
+ <WarningCollection text="Renaming a file will change content adress." />
</>;