//
// SPDX-License-Identifier: AGPL-3.0
-import * as React from 'react';
-import { LINK_PANEL_ID } from '~/store/link-panel/link-panel-actions';
-import { DataExplorer } from '~/views-components/data-explorer/data-explorer';
-import { SortDirection } from '~/components/data-table/data-column';
-import { DataColumns } from '~/components/data-table/data-table';
-import { DataTableDefaultView } from '~/components/data-table-default-view/data-table-default-view';
-import { ResourcesState } from '~/store/resources/resources';
-import { ShareMeIcon } from '~/components/icon/icon';
-import { createTree } from '~/models/tree';
-import {
- ResourceLinkUuid, ResourceLinkHead, ResourceLinkTail,
- ResourceLinkClass, ResourceLinkName }
-from '~/views-components/data-explorer/renderers';
+import React from 'react';
+import { LINK_PANEL_ID } from 'store/link-panel/link-panel-actions';
+import { DataExplorer } from 'views-components/data-explorer/data-explorer';
+import { SortDirection } from 'components/data-table/data-column';
+import { DataColumns } from 'components/data-table/data-table';
+import { ResourcesState } from 'store/resources/resources';
+import { ShareMeIcon } from 'components/icon/icon';
+import { createTree } from 'models/tree';
+import {
+ ResourceLinkUuid, ResourceLinkHead, ResourceLinkTail,
+ ResourceLinkClass, ResourceLinkName }
+from 'views-components/data-explorer/renderers';
+import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { LinkResource } from 'models/link';
+
+type CssRules = "root";
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ root: {
+ width: '100%',
+ }
+});
export enum LinkPanelColumnNames {
NAME = "Name",
UUID = "UUID"
}
-export const linkPanelColumns: DataColumns<string> = [
+export const linkPanelColumns: DataColumns<string, LinkResource> = [
{
name: LinkPanelColumnNames.NAME,
selected: true,
configurable: true,
- sortDirection: SortDirection.NONE,
+ sort: {direction: SortDirection.NONE, field: "name"},
filters: createTree(),
render: uuid => <ResourceLinkName uuid={uuid} />
},
onItemDoubleClick: (item: string) => void;
}
-export type LinkPanelRootProps = LinkPanelRootDataProps & LinkPanelRootActionProps;
+export type LinkPanelRootProps = LinkPanelRootDataProps & LinkPanelRootActionProps & WithStyles<CssRules>;
-export const LinkPanelRoot = (props: LinkPanelRootProps) => {
- return <DataExplorer
+export const LinkPanelRoot = withStyles(styles)((props: LinkPanelRootProps) => {
+ return <div className={props.classes.root}><DataExplorer
id={LINK_PANEL_ID}
onRowClick={props.onItemClick}
onRowDoubleClick={props.onItemDoubleClick}
onContextMenu={props.onContextMenu}
- contextMenuColumn={true}
+ contextMenuColumn={true}
hideColumnSelector
hideSearchInput
- dataTableDefaultView={
- <DataTableDefaultView
- icon={ShareMeIcon}
- messages={['Your link list is empty.']} />
- }/>;
-};
\ No newline at end of file
+ defaultViewIcon={ShareMeIcon}
+ defaultViewMessages={['Your link list is empty.']} />
+ </div>;
+});