14841: Add link to workbench v1

* Add a reducer that holds discovery document config, to read
  workbenchURL & for future things that need cluster config.

* Projects, collections and "processes" are routed to equivalent page
  on wb1, rest are sent to entry page.

Arvados-DCO-1.1-Signed-off-by: Peter Amstutz <pamstutz@veritasgenetics.com>

diff --git a/src/index.tsx b/src/index.tsx
index d0eb7d3b5c472ab66bd7e6287d4b3b5fbe174b38..cfaff70a9da33378c112e80a47d00531d046bc7f 100644 (file)
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -14,6 +14,7 @@ import { configureStore, RootStore } from '~/store/store';
 import { ConnectedRouter } from "react-router-redux";
 import { ApiToken } from "~/views-components/api-token/api-token";
 import { initAuth } from "~/store/auth/auth-action";
+import { configActions } from "~/store/config/config-action";
 import { createServices } from "~/services/services";
 import { MuiThemeProvider } from '@material-ui/core/styles';
 import { CustomTheme } from '~/common/custom-theme';

diff --git a/src/store/auth/auth-action.ts b/src/store/auth/auth-action.ts
index cc1a5a0a4b4da99eda49d727fa0284211c7d9e54..fdaa2e1a0803dad217986c8a6390a09eea052c98 100644 (file)
--- a/src/store/auth/auth-action.ts
+++ b/src/store/auth/auth-action.ts
@@ -17,7 +17,7 @@ export const authActions = unionize({
     SAVE_API_TOKEN: ofType<string>(),
     LOGIN: {},
     LOGOUT: {},
-    CONFIG: ofType<{ uuidPrefix: string, remoteHosts: { [key: string]: string } }>(),
+    CONFIG: ofType<{ config: Config }>(),
     INIT: ofType<{ user: User, token: string }>(),
     USER_DETAILS_REQUEST: {},
     USER_DETAILS_SUCCESS: ofType<User>(),
@@ -50,7 +50,7 @@ export const initAuth = (config: Config) => (dispatch: Dispatch, getState: () =>
     if (token) {
         setAuthorizationHeader(services, token);
     }
-    dispatch(authActions.CONFIG({ uuidPrefix: config.uuidPrefix, remoteHosts: config.remoteHosts }));
+    dispatch(authActions.CONFIG({ config }));
     if (token && user) {
         dispatch(authActions.INIT({ user, token }));
         dispatch<any>(initSessions(services.authService, config, user));

diff --git a/src/store/auth/auth-reducer.ts b/src/store/auth/auth-reducer.ts
index 0504dd480086dde66b56ca606070686f6583948a..e7087b58a8c69984f607effae376c44270ab1394 100644 (file)
--- a/src/store/auth/auth-reducer.ts
+++ b/src/store/auth/auth-reducer.ts
@@ -33,9 +33,12 @@ export const authReducer = (services: ServiceRepository) => (state = initialStat
         SAVE_API_TOKEN: (token: string) => {
             return { ...state, apiToken: token };
         },
-        CONFIG: ({ uuidPrefix, remoteHosts }) => {
+        CONFIG: ({ config }) => {
             return {
-                ...state, localCluster: uuidPrefix, remoteHosts, homeCluster: uuidPrefix
+                ...state,
+                localCluster: config.uuidPrefix,
+                remoteHosts: config.remoteHosts,
+                homeCluster: config.uuidPrefix
             };
         },
         INIT: ({ user, token }) => {

diff --git a/src/store/config/config-action.ts b/src/store/config/config-action.ts
new file mode 100644 (file)
index 0000000..fd79294
--- /dev/null
+++ b/src/store/config/config-action.ts
@@ -0,0 +1,12 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { ofType, unionize, UnionOf } from '~/common/unionize';
+import { Config } from '~/common/config';
+
+export const configActions = unionize({
+    CONFIG: ofType<{ config: Config }>(),
+});
+
+export type ConfigAction = UnionOf<typeof configActions>;

diff --git a/src/store/config/config-reducer.ts b/src/store/config/config-reducer.ts
new file mode 100644 (file)
index 0000000..070bae1
--- /dev/null
+++ b/src/store/config/config-reducer.ts
@@ -0,0 +1,25 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { configActions, ConfigAction } from "./config-action";
+import { Config, mockConfig } from '~/common/config';
+
+export interface ConfigState {
+    config: Config;
+}
+
+const initialState: ConfigState = {
+    config: mockConfig({}),
+};
+
+export const configReducer = (state = initialState, action: ConfigAction) => {
+    return configActions.match(action, {
+        CONFIG: ({ config }) => {
+            return {
+                ...state, config
+            };
+        },
+        default: () => state
+    });
+};

diff --git a/src/store/store.ts b/src/store/store.ts
index 0be577c45a159a450749ef37d664e7717fefd600..04813b1cf35bbc8194449493cc542dccbf5d78ce 100644 (file)
--- a/src/store/store.ts
+++ b/src/store/store.ts
@@ -8,6 +8,7 @@ import thunkMiddleware from 'redux-thunk';
 import { History } from "history";
 
 import { authReducer } from "./auth/auth-reducer";
+import { configReducer } from "./config/config-reducer";
 import { dataExplorerReducer } from './data-explorer/data-explorer-reducer';
 import { detailsPanelReducer } from './details-panel/details-panel-reducer';
 import { contextMenuReducer } from './context-menu/context-menu-reducer';
@@ -61,8 +62,8 @@ import { ApiClientAuthorizationMiddlewareService } from '~/store/api-client-auth
 
 const composeEnhancers =
     (process.env.NODE_ENV === 'development' &&
-     window && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
-     window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({trace: true, traceLimit: 25})) ||
+        window && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
+        window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ trace: true, traceLimit: 25 })) ||
     compose;
 
 export type RootState = ReturnType<ReturnType<typeof createRootReducer>>;
@@ -130,6 +131,7 @@ export function configureStore(history: History, services: ServiceRepository): R
 
 const createRootReducer = (services: ServiceRepository) => combineReducers({
     auth: authReducer(services),
+    config: configReducer,
     collectionPanel: collectionPanelReducer,
     collectionPanelFiles: collectionPanelFilesReducer,
     contextMenu: contextMenuReducer,

diff --git a/src/views-components/main-app-bar/account-menu.tsx b/src/views-components/main-app-bar/account-menu.tsx
index 2aec77e2b5389760c95d7413818104eead91773b..c4f7e36f169028bce53d1774da47afd80920e6b1 100644 (file)
--- a/src/views-components/main-app-bar/account-menu.tsx
+++ b/src/views-components/main-app-bar/account-menu.tsx
@@ -4,8 +4,10 @@
 
 import * as React from "react";
 import { MenuItem, Divider } from "@material-ui/core";
+import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles';
 import { User, getUserFullname } from "~/models/user";
 import { DropdownMenu } from "~/components/dropdown-menu/dropdown-menu";
+import { Link } from "react-router-dom";
 import { UserPanelIcon } from "~/components/icon/icon";
 import { DispatchProp, connect } from 'react-redux';
 import { logout } from '~/store/auth/auth-action';
@@ -22,31 +24,57 @@ import { openUserVirtualMachines } from "~/store/virtual-machines/virtual-machin
 interface AccountMenuProps {
     user?: User;
     currentRoute: string;
+    workbenchURL: string;
 }
 
 const mapStateToProps = (state: RootState): AccountMenuProps => ({
     user: state.auth.user,
-    currentRoute: state.router.location ? state.router.location.pathname : ''
+    currentRoute: state.router.location ? state.router.location.pathname : '',
+    workbenchURL: state.config.config.workbenchUrl,
 });
 
-export const AccountMenu = connect(mapStateToProps)(
-    ({ user, dispatch, currentRoute }: AccountMenuProps & DispatchProp<any>) =>
-        user
-            ? <DropdownMenu
-                icon={<UserPanelIcon />}
-                id="account-menu"
-                title="Account Management"
-                key={currentRoute}>
-                <MenuItem disabled>
-                    {getUserFullname(user)}
-                </MenuItem>
-                <MenuItem onClick={() => dispatch(openUserVirtualMachines())}>Virtual Machines</MenuItem>
-                {!user.isAdmin && <MenuItem onClick={() => dispatch(openRepositoriesPanel())}>Repositories</MenuItem>}
-                <MenuItem onClick={() => dispatch(openCurrentTokenDialog)}>Current token</MenuItem>
-                <MenuItem onClick={() => dispatch(navigateToSshKeysUser)}>Ssh Keys</MenuItem>
-                <MenuItem onClick={() => dispatch(navigateToSiteManager)}>Site Manager</MenuItem>
-                <MenuItem onClick={() => dispatch(navigateToMyAccount)}>My account</MenuItem>
-                <Divider />
-                <MenuItem onClick={() => dispatch(logout())}>Logout</MenuItem>
-            </DropdownMenu>
-            : null);
+const wb1URL = (route: string) => {
+    const r = route.replace(/^\//, "");
+    if (r.match(/^(projects|collections)\//)) {
+        return r;
+    } else if (r.match(/^processes\//)) {
+        return r.replace(/^processes/, "container_requests");
+    }
+    return "";
+};
+
+type CssRules = 'link';
+
+const styles: StyleRulesCallback<CssRules> = () => ({
+    link: {
+        textDecoration: 'none',
+        color: 'inherit'
+    }
+});
+
+export const AccountMenu = withStyles(styles)(
+    connect(mapStateToProps)(
+        ({ user, dispatch, currentRoute, workbenchURL, classes }: AccountMenuProps & DispatchProp<any> & WithStyles<CssRules>) =>
+            user
+                ? <DropdownMenu
+                    icon={<UserPanelIcon />}
+                    id="account-menu"
+                    title="Account Management"
+                    key={currentRoute}>
+                    <MenuItem disabled>
+                        {getUserFullname(user)}
+                    </MenuItem>
+                    <MenuItem onClick={() => dispatch(openUserVirtualMachines())}>Virtual Machines</MenuItem>
+                    {!user.isAdmin && <MenuItem onClick={() => dispatch(openRepositoriesPanel())}>Repositories</MenuItem>}
+                    <MenuItem onClick={() => dispatch(openCurrentTokenDialog)}>Current token</MenuItem>
+                    <MenuItem onClick={() => dispatch(navigateToSshKeysUser)}>Ssh Keys</MenuItem>
+                    <MenuItem onClick={() => dispatch(navigateToSiteManager)}>Site Manager</MenuItem>
+                    <MenuItem onClick={() => dispatch(navigateToMyAccount)}>My account</MenuItem>
+                    <MenuItem>
+                        <a href={`${workbenchURL.replace(/\/$/, "")}/${wb1URL(currentRoute)}`}
+                            className={classes.link}>
+                            Switch to Workbench v1</a></MenuItem>
+                    <Divider />
+                    <MenuItem onClick={() => dispatch(logout())}>Logout</MenuItem>
+                </DropdownMenu>
+                : null));