import { CollectionResource } from 'models/collection';
import { resourceIsFrozen } from 'common/frozen-resources';
import { ProjectResource } from 'models/project';
+import { deselectAllOthers, toggleOne } from 'store/multiselect/multiselect-actions';
+import { DetailsCardRoot } from 'views-components/details-card/details-card-root';
+import { MPVContainer, MPVPanelContent, MPVPanelState } from 'components/multi-panel-view/multi-panel-view';
+import { PROJECT_PANEL_ID } from 'store/project-panel/project-panel-action-bind';
-type CssRules = 'root' | 'button';
+type CssRules = 'root' | 'button' | 'mpvRoot' | 'dataExplorer';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
root: {
width: '100%',
+ display: 'flex',
+ flexDirection: 'column',
},
button: {
marginLeft: theme.spacing.unit,
},
+ mpvRoot: {
+ flexGrow: 1,
+ },
+ dataExplorer: {
+ height: "100%",
+ },
});
export enum ProjectPanelColumnNames {
},
];
-export const PROJECT_PANEL_ID = 'projectPanel';
-
const DEFAULT_VIEW_MESSAGES = ['Your project is empty.', 'Please create a project or create a collection and upload a data.'];
+const panelsData: MPVPanelState[] = [
+ { name: "Subprojects", visible: true },
+];
+
interface ProjectPanelDataProps {
currentItemId: string;
resources: ResourcesState;
+ project: GroupResource;
isAdmin: boolean;
userUuid: string;
dataExplorerItems: any;
+ working: boolean;
}
type ProjectPanelProps = ProjectPanelDataProps & DispatchProp & WithStyles<CssRules> & RouteComponentProps<{ id: string }>;
-export const ProjectPanel = withStyles(styles)(
- connect((state: RootState) => ({
- currentItemId: getProperty(PROJECT_PANEL_CURRENT_UUID)(state.properties),
+const mapStateToProps = (state: RootState) => {
+ const currentItemId = getProperty<string>(PROJECT_PANEL_CURRENT_UUID)(state.properties);
+ const project = getResource<GroupResource>(currentItemId || "")(state.resources);
+ return {
+ currentItemId,
+ project,
resources: state.resources,
userUuid: state.auth.user!.uuid,
- }))(
+ };
+}
+
+export const ProjectPanel = withStyles(styles)(
+ connect(mapStateToProps)(
class extends React.Component<ProjectPanelProps> {
+
render() {
const { classes } = this.props;
-
- return (
- <div data-cy='project-panel' className={classes.root}>
- <DataExplorer
- id={PROJECT_PANEL_ID}
- onRowClick={this.handleRowClick}
- onRowDoubleClick={this.handleRowDoubleClick}
- onContextMenu={this.handleContextMenu}
- contextMenuColumn={true}
- defaultViewIcon={ProjectIcon}
- defaultViewMessages={DEFAULT_VIEW_MESSAGES}
- />
- </div>
- );
+ return <div data-cy='project-panel' className={classes.root}>
+ <DetailsCardRoot />
+ <MPVContainer
+ className={classes.mpvRoot}
+ spacing={8}
+ panelStates={panelsData}
+ mutuallyExclusive
+ justify-content="flex-start"
+ direction="column"
+ wrap="nowrap">
+ <MPVPanelContent
+ forwardProps
+ xs="auto"
+ data-cy="process-details"
+ className={classes.dataExplorer}>
+ <DataExplorer
+ id={PROJECT_PANEL_ID}
+ onRowClick={this.handleRowClick}
+ onRowDoubleClick={this.handleRowDoubleClick}
+ onContextMenu={this.handleContextMenu}
+ contextMenuColumn={true}
+ defaultViewIcon={ProjectIcon}
+ defaultViewMessages={DEFAULT_VIEW_MESSAGES}
+ />
+ </MPVPanelContent>
+ </MPVContainer>
+ </div>
}
isCurrentItemChild = (resource: Resource) => {
};
handleRowClick = (uuid: string) => {
+ this.props.dispatch<any>(toggleOne(uuid))
+ this.props.dispatch<any>(deselectAllOthers(uuid))
this.props.dispatch<any>(loadDetailsPanel(uuid));
};
}