Merge branch '21128-toolbar-context-menu'
[arvados-workbench2.git] / src / views / main-panel / main-panel.tsx
index 297a6214505a53628c3d6ec20d4f79cb455c27fa..fac3da67150f37cacfaf7a6a711c94361dea326e 100644 (file)
@@ -2,83 +2,37 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
-import { connect, DispatchProp } from 'react-redux';
-import { push } from 'react-router-redux';
-import { LinearProgress, Grid } from '@material-ui/core';
-import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
-import { ArvadosTheme } from '~/common/custom-theme';
-import { RootState } from '~/store/store';
-import { User } from '~/models/user';
-import { WorkbenchPanel } from '~/views/workbench/workbench';
-import { LoginPanel } from '~/views/login-panel/login-panel';
-import { MainAppBar } from '~/views-components/main-app-bar/main-app-bar';
-import { isSystemWorking } from '~/store/progress-indicator/progress-indicator-reducer';
-import { isWorkbenchLoading } from '../../store/workbench/workbench-actions';
-import { WorkbenchLoadingScreen } from '~/views/workbench/workbench-loading-screen';
-
-type CssRules = 'root';
-
-const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
-    root: {
-        overflow: 'hidden',
-        width: '100vw',
-        height: '100vh'
+import { RootState } from 'store/store';
+import { connect } from 'react-redux';
+import parse from 'parse-duration';
+import { MainPanelRoot, MainPanelRootDataProps } from 'views/main-panel/main-panel-root';
+import { isSystemWorking } from 'store/progress-indicator/progress-indicator-reducer';
+import { isWorkbenchLoading } from 'store/workbench/workbench-actions';
+import { LinkAccountPanelStatus } from 'store/link-account-panel/link-account-panel-reducer';
+import { matchLinkAccountRoute } from 'routes/routes';
+import { toggleSidePanel } from "store/side-panel/side-panel-action";
+
+const mapStateToProps = (state: RootState): MainPanelRootDataProps => {
+    return {
+        user: state.auth.user,
+        working: isSystemWorking(state.progressIndicator),
+        loading: isWorkbenchLoading(state),
+        buildInfo: state.appInfo.buildInfo,
+        uuidPrefix: state.auth.localCluster,
+        isNotLinking: state.linkAccountPanel.status === LinkAccountPanelStatus.NONE || state.linkAccountPanel.status === LinkAccountPanelStatus.INITIAL,
+        isLinkingPath: state.router.location ? matchLinkAccountRoute(state.router.location.pathname) !== null : false,
+        siteBanner: state.auth.config.clusterConfig.Workbench.SiteName,
+        sessionIdleTimeout: parse(state.auth.config.clusterConfig.Workbench.IdleTimeout, 's') || 0,
+        sidePanelIsCollapsed: state.sidePanel.collapsedState,
+    };
+};
+
+const mapDispatchToProps = (dispatch) => {
+    return {
+        toggleSidePanel: (collapsedState)=>{
+            return dispatch(toggleSidePanel(collapsedState))
+        }
     }
-});
-
-interface MainPanelDataProps {
-    user?: User;
-    working: boolean;
-    loading: boolean;
-}
-
-interface MainPanelGeneralProps {
-    buildInfo: string;
-}
+};
 
-interface MainPanelState {
-    searchText: string;
-}
-
-type MainPanelProps = MainPanelDataProps & MainPanelGeneralProps & DispatchProp<any> & WithStyles<CssRules>;
-
-export const MainPanel = withStyles(styles)(
-    connect<MainPanelDataProps>(
-        (state: RootState) => ({
-            user: state.auth.user,
-            working: isSystemWorking(state.progressIndicator),
-            loading: isWorkbenchLoading(state)
-        })
-    )(
-        class extends React.Component<MainPanelProps, MainPanelState> {
-            state = {
-                searchText: "",
-            };
-
-            render() {
-                const { classes, user, buildInfo, working, loading } = this.props;
-                const { searchText } = this.state;
-                return loading
-                    ? <WorkbenchLoadingScreen />
-                    : <>
-                        <MainAppBar
-                            searchText={searchText}
-                            user={user}
-                            onSearch={this.onSearch}
-                            buildInfo={buildInfo}>
-                            {working ? <LinearProgress color="secondary" /> : null}
-                        </MainAppBar>
-                        <Grid container direction="column" className={classes.root}>
-                            {user ? <WorkbenchPanel /> : <LoginPanel />}
-                        </Grid>
-                    </>;
-            }
-
-            onSearch = (searchText: string) => {
-                this.setState({ searchText });
-                this.props.dispatch(push(`/search?q=${searchText}`));
-            }
-        }
-    )
-);
\ No newline at end of file
+export const MainPanel = connect(mapStateToProps, mapDispatchToProps)(MainPanelRoot);