X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/ae691a976c8e505afba7cec6f8f316d1c5b175a7..c952afae1af2fb31b68be04f70bd7ae6f9d52aba:/src/views-components/details-panel/empty-details.tsx?ds=sidebyside

diff --git a/src/views-components/details-panel/empty-details.tsx b/src/views-components/details-panel/empty-details.tsx
index f1ef2740..d5430f24 100644
--- a/src/views-components/details-panel/empty-details.tsx
+++ b/src/views-components/details-panel/empty-details.tsx
@@ -2,45 +2,11 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
-import { DefaultIcon, IconType, ProjectsIcon } from '../../components/icon/icon';
-import { EmptyResource } from '../../models/empty';
+import React from 'react';
+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 }: 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.']} />;
     }
 }