[ARVADOS-WORKBENCH2] created: 1.2.0-284-ga0a42fd
Git user
git at public.curoverse.com
Wed Sep 5 08:54:00 EDT 2018
at a0a42fd73533f2f17844cd9343519c34043fda71 (commit)
commit a0a42fd73533f2f17844cd9343519c34043fda71
Author: Janicki Artur <artur.janicki at contractors.roche.com>
Date: Wed Sep 5 14:53:40 2018 +0200
remove width attr from DataColumn, move styles to data-explorer
Feature #14093
Arvados-DCO-1.1-Signed-off-by: Janicki Artur <artur.janicki at contractors.roche.com>
diff --git a/src/components/data-explorer/data-explorer.tsx b/src/components/data-explorer/data-explorer.tsx
index ea400b1..5faaabc 100644
--- a/src/components/data-explorer/data-explorer.tsx
+++ b/src/components/data-explorer/data-explorer.tsx
@@ -150,8 +150,7 @@ export const DataExplorer = withStyles(styles)(
sortDirection: SortDirection.NONE,
filters: [],
key: "context-actions",
- render: this.renderContextMenuTrigger,
- width: "auto"
+ render: this.renderContextMenuTrigger
};
}
);
diff --git a/src/components/data-table/data-column.ts b/src/components/data-table/data-column.ts
index 8dbdf0c..a5f9550 100644
--- a/src/components/data-table/data-column.ts
+++ b/src/components/data-table/data-column.ts
@@ -14,7 +14,6 @@ export interface DataColumn<T, F extends DataTableFilterItem = DataTableFilterIt
filters: F[];
render: (item: T) => React.ReactElement<any>;
renderHeader?: () => React.ReactElement<any>;
- width?: string;
}
export enum SortDirection {
diff --git a/src/components/data-table/data-table.tsx b/src/components/data-table/data-table.tsx
index 5a6f9e5..1d208d7 100644
--- a/src/components/data-table/data-table.tsx
+++ b/src/components/data-table/data-table.tsx
@@ -20,7 +20,7 @@ export interface DataTableDataProps<T> {
extractKey?: (item: T) => React.Key;
}
-type CssRules = "tableBody" | "tableContainer" | "noItemsInfo";
+type CssRules = "tableBody" | "tableContainer" | "noItemsInfo" | 'tableCell';
const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
tableContainer: {
@@ -33,6 +33,9 @@ const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
noItemsInfo: {
textAlign: "center",
padding: theme.spacing.unit
+ },
+ tableCell: {
+ wordWrap: 'break-word'
}
});
@@ -60,7 +63,7 @@ export const DataTable = withStyles(styles)(
renderHeadCell = (column: DataColumn<T>, index: number) => {
const { name, key, renderHeader, filters, sortDirection } = column;
const { onSortToggle, onFiltersChange } = this.props;
- return <TableCell key={key || index} style={{ width: column.width, minWidth: column.width }}>
+ return <TableCell key={key || index}>
{renderHeader ?
renderHeader() :
filters.length > 0
@@ -88,7 +91,7 @@ export const DataTable = withStyles(styles)(
}
renderBodyRow = (item: T, index: number) => {
- const { onRowClick, onRowDoubleClick, extractKey } = this.props;
+ const { onRowClick, onRowDoubleClick, extractKey, classes } = this.props;
return <TableRow
hover
key={extractKey ? extractKey(item) : index}
@@ -96,7 +99,7 @@ export const DataTable = withStyles(styles)(
onContextMenu={this.handleRowContextMenu(item)}
onDoubleClick={event => onRowDoubleClick && onRowDoubleClick(event, item) }>
{this.mapVisibleColumns((column, index) => (
- <TableCell key={column.key || index}>
+ <TableCell key={column.key || index} className={classes.tableCell}>
{column.render(item)}
</TableCell>
))}
diff --git a/src/views-components/data-explorer/renderers.tsx b/src/views-components/data-explorer/renderers.tsx
index 72644f9..b9cc63c 100644
--- a/src/views-components/data-explorer/renderers.tsx
+++ b/src/views-components/data-explorer/renderers.tsx
@@ -23,7 +23,7 @@ export const renderName = (item: { name: string; uuid: string, kind: string }) =
{renderIcon(item)}
</Grid>
<Grid item>
- <Typography color="primary">
+ <Typography color="primary" style={{ width: '450px' }}>
{item.name}
</Typography>
</Grid>
@@ -54,7 +54,7 @@ export const renderIcon = (item: { kind: string }) => {
};
export const renderDate = (date?: string) => {
- return <Typography noWrap>{formatDate(date)}</Typography>;
+ return <Typography noWrap style={{ minWidth: '100px' }}>{formatDate(date)}</Typography>;
};
export const ResourceLastModifiedDate = connect(
@@ -76,7 +76,7 @@ export const ResourceDeleteDate = connect(
})((props: { date: string }) => renderDate(props.date));
export const renderFileSize = (fileSize?: number) =>
- <Typography noWrap>
+ <Typography noWrap style={{ minWidth: '45px' }}>
{formatFileSize(fileSize)}
</Typography>;
diff --git a/src/views/favorite-panel/favorite-panel.tsx b/src/views/favorite-panel/favorite-panel.tsx
index 803d800..8115461 100644
--- a/src/views/favorite-panel/favorite-panel.tsx
+++ b/src/views/favorite-panel/favorite-panel.tsx
@@ -61,16 +61,14 @@ export const favoritePanelColumns: DataColumns<string, FavoritePanelFilter> = [
configurable: true,
sortDirection: SortDirection.ASC,
filters: [],
- render: uuid => <ResourceName uuid={uuid} />,
- width: "450px"
+ render: uuid => <ResourceName uuid={uuid} />
},
{
name: "Status",
selected: true,
configurable: true,
filters: [],
- render: uuid => <ProcessStatus uuid={uuid} />,
- width: "75px"
+ render: uuid => <ProcessStatus uuid={uuid} />
},
{
name: FavoritePanelColumnNames.TYPE,
@@ -93,24 +91,21 @@ export const favoritePanelColumns: DataColumns<string, FavoritePanelFilter> = [
type: ResourceKind.PROJECT
}
],
- render: uuid => <ResourceType uuid={uuid} />,
- width: "125px"
+ render: uuid => <ResourceType uuid={uuid} />
},
{
name: FavoritePanelColumnNames.OWNER,
selected: true,
configurable: true,
filters: [],
- render: uuid => <ResourceOwner uuid={uuid} />,
- width: "200px"
+ render: uuid => <ResourceOwner uuid={uuid} />
},
{
name: FavoritePanelColumnNames.FILE_SIZE,
selected: true,
configurable: true,
filters: [],
- render: uuid => <ResourceFileSize uuid={uuid} />,
- width: "50px"
+ render: uuid => <ResourceFileSize uuid={uuid} />
},
{
name: FavoritePanelColumnNames.LAST_MODIFIED,
@@ -118,8 +113,7 @@ export const favoritePanelColumns: DataColumns<string, FavoritePanelFilter> = [
configurable: true,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceLastModifiedDate uuid={uuid} />,
- width: "150px"
+ render: uuid => <ResourceLastModifiedDate uuid={uuid} />
}
];
diff --git a/src/views/project-panel/project-panel.tsx b/src/views/project-panel/project-panel.tsx
index 2573f81..787dc67 100644
--- a/src/views/project-panel/project-panel.tsx
+++ b/src/views/project-panel/project-panel.tsx
@@ -65,8 +65,7 @@ export const projectPanelColumns: DataColumns<string, ProjectPanelFilter> = [
configurable: true,
sortDirection: SortDirection.ASC,
filters: [],
- render: uuid => <ResourceName uuid={uuid} />,
- width: "450px"
+ render: uuid => <ResourceName uuid={uuid} />
},
{
name: "Status",
@@ -74,7 +73,6 @@ export const projectPanelColumns: DataColumns<string, ProjectPanelFilter> = [
configurable: true,
filters: [],
render: uuid => <ProcessStatus uuid={uuid} />,
- width: "75px"
},
{
name: ProjectPanelColumnNames.TYPE,
@@ -97,24 +95,21 @@ export const projectPanelColumns: DataColumns<string, ProjectPanelFilter> = [
type: ResourceKind.PROJECT
}
],
- render: uuid => <ResourceType uuid={uuid} />,
- width: "125px"
+ render: uuid => <ResourceType uuid={uuid} />
},
{
name: ProjectPanelColumnNames.OWNER,
selected: true,
configurable: true,
filters: [],
- render: uuid => <ResourceOwner uuid={uuid} />,
- width: "200px"
+ render: uuid => <ResourceOwner uuid={uuid} />
},
{
name: ProjectPanelColumnNames.FILE_SIZE,
selected: true,
configurable: true,
filters: [],
- render: uuid => <ResourceFileSize uuid={uuid} />,
- width: "50px"
+ render: uuid => <ResourceFileSize uuid={uuid} />
},
{
name: ProjectPanelColumnNames.LAST_MODIFIED,
@@ -122,8 +117,7 @@ export const projectPanelColumns: DataColumns<string, ProjectPanelFilter> = [
configurable: true,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceLastModifiedDate uuid={uuid} />,
- width: "150px"
+ render: uuid => <ResourceLastModifiedDate uuid={uuid} />
}
];
diff --git a/src/views/trash-panel/trash-panel.tsx b/src/views/trash-panel/trash-panel.tsx
index 08df05c..7237ffc 100644
--- a/src/views/trash-panel/trash-panel.tsx
+++ b/src/views/trash-panel/trash-panel.tsx
@@ -82,8 +82,7 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
configurable: true,
sortDirection: SortDirection.ASC,
filters: [],
- render: uuid => <ResourceName uuid={uuid}/>,
- width: "450px"
+ render: uuid => <ResourceName uuid={uuid}/>
},
{
name: TrashPanelColumnNames.TYPE,
@@ -108,7 +107,6 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
}
],
render: uuid => <ResourceType uuid={uuid}/>,
- width: "125px"
},
{
name: TrashPanelColumnNames.FILE_SIZE,
@@ -116,8 +114,7 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
configurable: true,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceFileSize uuid={uuid} />,
- width: "50px"
+ render: uuid => <ResourceFileSize uuid={uuid} />
},
{
name: TrashPanelColumnNames.TRASHED_DATE,
@@ -125,8 +122,7 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
configurable: true,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceTrashDate uuid={uuid} />,
- width: "50px"
+ render: uuid => <ResourceTrashDate uuid={uuid} />
},
{
name: TrashPanelColumnNames.TO_BE_DELETED,
@@ -134,8 +130,7 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
configurable: true,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceDeleteDate uuid={uuid} />,
- width: "50px"
+ render: uuid => <ResourceDeleteDate uuid={uuid} />
},
{
name: '',
@@ -143,8 +138,7 @@ export const trashPanelColumns: DataColumns<string, TrashPanelFilter> = [
configurable: false,
sortDirection: SortDirection.NONE,
filters: [],
- render: uuid => <ResourceRestore uuid={uuid}/>,
- width: "50px"
+ render: uuid => <ResourceRestore uuid={uuid}/>
}
];
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list