refs #master Merge branch 'origin/master' into 14007-ts-paths

[arvados-workbench2.git] / src / views-components / details-panel / empty-details.tsx

diff --git a/src/views-components/details-panel/empty-details.tsx b/src/views-components/details-panel/empty-details.tsx
index ccaa561f9fa19310a25e5c6c775d398e0d633277..76778d72b45583b3c374b1bf3416e3528eef5e87 100644 (file)
--- a/src/views-components/details-panel/empty-details.tsx
+++ b/src/views-components/details-panel/empty-details.tsx
@@ -3,44 +3,10 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from 'react';
-import { DefaultIcon, IconType, ProjectsIcon } from '~/components/icon/icon';
+import { DefaultIcon, ProjectsIcon } from '~/components/icon/icon';
 import { EmptyResource } from '~/models/empty';
 import { DetailsData } from "./details-data";
-import Typography from "@material-ui/core/Typography";
-import { StyleRulesCallback, WithStyles, withStyles } from "@material-ui/core/styles";
-import { ArvadosTheme } from "~/common/custom-theme";
-import Icon from "@material-ui/core/Icon/Icon";
-
-type CssRules = 'container' | 'icon';
-
-const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
-    container: {
-        textAlign: 'center'
-    },
-    icon: {
-        color: theme.palette.grey["500"],
-        fontSize: '72px'
-    }
-});
-
-export interface EmptyStateDataProps {
-    message: string;
-    icon: IconType;
-    details?: string;
-    children?: React.ReactNode;
-}
-
-type EmptyStateProps = EmptyStateDataProps & WithStyles<CssRules>;
-
-const EmptyState = withStyles(styles)(
-    ({ classes, details, message, children, icon: Icon }: EmptyStateProps) =>
-        <Typography className={classes.container} component="div">
-            <Icon className={classes.icon}/>
-            <Typography variant="body1" gutterBottom>{message}</Typography>
-            {details && <Typography gutterBottom>{details}</Typography>}
-            {children && <Typography gutterBottom>{children}</Typography>}
-        </Typography>
-);
+import { DefaultView } from '~/components/default-view/default-view';
 
 export class EmptyDetails extends DetailsData<EmptyResource> {
     getIcon(className?: string) {
@@ -48,6 +14,6 @@ export class EmptyDetails extends DetailsData<EmptyResource> {
     }
 
     getDetails() {
-       return <EmptyState icon={DefaultIcon} message='Select a file or folder to view its details.'/>;
+        return <DefaultView icon={DefaultIcon} messages={['Select a file or folder to view its details.']} />;
     }
 }