Merge branch 'master' into 14565-admin-managing-user
authorPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Tue, 18 Dec 2018 14:46:01 +0000 (15:46 +0100)
committerPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Tue, 18 Dec 2018 14:46:01 +0000 (15:46 +0100)
refs #14565

Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>

48 files changed:
package.json
src/common/config.ts
src/common/formatters.ts
src/components/autocomplete/autocomplete.tsx
src/components/details-attribute/details-attribute.tsx
src/components/text-field/text-field.tsx
src/index.tsx
src/models/client-authorization.ts [new file with mode: 0644]
src/models/session.ts [new file with mode: 0644]
src/routes/route-change-handlers.ts
src/routes/routes.ts
src/services/auth-service/auth-service.ts
src/store/auth/auth-action-session.ts [new file with mode: 0644]
src/store/auth/auth-action-ssh.ts [new file with mode: 0644]
src/store/auth/auth-action.test.ts [moved from src/store/auth/auth-actions.test.ts with 77% similarity]
src/store/auth/auth-action.ts
src/store/auth/auth-reducer.test.ts
src/store/auth/auth-reducer.ts
src/store/navigation/navigation-action.ts
src/store/process-panel/process-panel-actions.ts
src/store/workbench/workbench-actions.ts
src/validators/is-remote-host.tsx [new file with mode: 0644]
src/validators/validators.tsx
src/views-components/api-token/api-token.tsx
src/views-components/context-menu/action-sets/ssh-key-action-set.ts
src/views-components/dialog-create/dialog-ssh-key-create.tsx
src/views-components/dialog-forms/create-ssh-key-dialog.ts
src/views-components/form-fields/search-bar-form-fields.tsx
src/views-components/main-app-bar/account-menu.tsx
src/views-components/main-content-bar/main-content-bar.tsx
src/views-components/rename-file-dialog/rename-file-dialog.tsx
src/views-components/resource-properties-form/property-key-field.tsx
src/views-components/resource-properties-form/property-value-field.tsx
src/views-components/search-bar/search-bar-advanced-view.tsx
src/views-components/search-bar/search-bar-view.tsx
src/views-components/ssh-keys-dialog/attributes-dialog.tsx
src/views-components/ssh-keys-dialog/public-key-dialog.tsx
src/views-components/ssh-keys-dialog/remove-dialog.tsx
src/views/process-panel/process-information-card.tsx
src/views/process-panel/process-panel-root.tsx
src/views/process-panel/process-panel.tsx
src/views/site-manager-panel/site-manager-panel-root.tsx [new file with mode: 0644]
src/views/site-manager-panel/site-manager-panel.tsx [new file with mode: 0644]
src/views/ssh-key-panel/ssh-key-panel.tsx
src/views/virtual-machine-panel/virtual-machine-admin-panel.tsx
src/views/virtual-machine-panel/virtual-machine-user-panel.tsx
src/views/workbench/workbench.tsx
yarn.lock

index 1332630471dccf4c6baf093905c74cd525880bfc..46b3ee4f46d34bdc8bf84d16b4e206249a2f7090 100644 (file)
@@ -7,6 +7,7 @@
     "@material-ui/icons": "3.0.1",
     "@types/debounce": "3.0.0",
     "@types/js-yaml": "3.11.2",
+    "@types/jssha": "0.0.29",
     "@types/lodash": "4.14.116",
     "@types/react-copy-to-clipboard": "4.2.6",
     "@types/react-dnd": "3.0.2",
@@ -21,6 +22,7 @@
     "debounce": "1.2.0",
     "is-image": "2.0.0",
     "js-yaml": "3.12.0",
+    "jssha": "2.3.1",
     "lodash": "4.17.11",
     "react": "16.5.2",
     "react-copy-to-clipboard": "5.0.1",
index db67ed8dceec9fc06837945cba4a820682a642af..3961d5aa2496fec7fbba912a96738f1bc15b8b5d 100644 (file)
@@ -35,7 +35,9 @@ export interface Config {
     packageVersion: string;
     parameters: {};
     protocol: string;
-    remoteHosts: string;
+    remoteHosts: {
+        [key: string]: string
+    };
     remoteHostsViaDNS: boolean;
     resources: {};
     revision: string;
@@ -102,7 +104,7 @@ export const mockConfig = (config: Partial<Config>): Config => ({
     packageVersion: '',
     parameters: {},
     protocol: '',
-    remoteHosts: '',
+    remoteHosts: {},
     remoteHostsViaDNS: false,
     resources: {},
     revision: '',
@@ -133,4 +135,5 @@ const getDefaultConfig = (): ConfigJSON => ({
     FILE_VIEWERS_CONFIG_URL: "",
 });
 
-const getDiscoveryURL = (apiHost: string) => `${window.location.protocol}//${apiHost}/discovery/v1/apis/arvados/v1/rest`;
+export const DISCOVERY_URL = 'discovery/v1/apis/arvados/v1/rest';
+const getDiscoveryURL = (apiHost: string) => `${window.location.protocol}//${apiHost}/${DISCOVERY_URL}`;
index ae50ee8adda3ace82a380b0714961e3ea4fb4394..60e6cd59c53e284a929cd6143c618020537ffd3a 100644 (file)
@@ -4,7 +4,7 @@
 
 import { PropertyValue } from "~/models/search-bar";
 
-export const formatDate = (isoDate?: string) => {
+export const formatDate = (isoDate?: string | null) => {
     if (isoDate) {
         const date = new Date(isoDate);
         const text = date.toLocaleString();
index b250c7b8ecd43bfc89171e4a9de373bf0cd22ffa..4b19b77115b388e3613c6004013ef6501aded2b6 100644 (file)
@@ -152,6 +152,16 @@ export class Autocomplete<Value, Suggestion> extends React.Component<Autocomplet
 
     renderChips() {
         const { items, onDelete } = this.props;
+
+        /**
+         * If input startAdornment prop is not undefined, input's label will stay above the input.
+         * If there is not items, we want the label to go back to placeholder position.
+         * That why we return without a value instead of returning a result of a _map_ which is an empty array.
+         */
+        if (items.length === 0) {
+            return;
+        }
+
         return items.map(
             (item, index) =>
                 <Chip
index 78b4341d173046972385cad95e584cb735138085..d255d14b1b7538f9bcce620ed705c827d8caef8e 100644 (file)
@@ -48,17 +48,22 @@ interface DetailsAttributeDataProps {
     lowercaseValue?: boolean;
     link?: string;
     children?: React.ReactNode;
+    onValueClick?: () => void;
 }
 
 type DetailsAttributeProps = DetailsAttributeDataProps & WithStyles<CssRules>;
 
 export const DetailsAttribute = withStyles(styles)(
-    ({ label, link, value, children, classes, classLabel, classValue, lowercaseValue }: DetailsAttributeProps) =>
+    ({ label, link, value, children, classes, classLabel, classValue, lowercaseValue, onValueClick }: DetailsAttributeProps) =>
         <Typography component="div" className={classes.attribute}>
             <Typography component="span" className={classnames([classes.label, classLabel])}>{label}</Typography>
             { link
                 ? <a href={link} className={classes.link} target='_blank'>{value}</a>
-                : <Typography component="span" className={classnames([classes.value, classValue, { [classes.lowercaseValue]: lowercaseValue }])}>
+                : <Typography
+                    onClick={onValueClick}
+                    component="span"
+                    className={classnames([classes.value, classValue, { [classes.lowercaseValue]: lowercaseValue }])}
+                >
                     {value}
                     {children}
                 </Typography> }
index 627e004d8b5bc607f6b92c673df92cbdb226fd57..93c4080f0fead0c7330f0a65a6824bdb628da8e1 100644 (file)
@@ -5,8 +5,15 @@
 import * as React from 'react';
 import { WrappedFieldProps } from 'redux-form';
 import { ArvadosTheme } from '~/common/custom-theme';
-import { TextField as MaterialTextField, StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core';
+import {
+    TextField as MaterialTextField,
+    StyleRulesCallback,
+    WithStyles,
+    withStyles,
+    PropTypes
+} from '@material-ui/core';
 import RichTextEditor from 'react-rte';
+import Margin = PropTypes.Margin;
 
 type CssRules = 'textField';
 
@@ -18,8 +25,8 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 
 type TextFieldProps = WrappedFieldProps & WithStyles<CssRules>;
 
-export const TextField = withStyles(styles)((props: TextFieldProps & { 
-    label?: string, autoFocus?: boolean, required?: boolean, select?: boolean, disabled?: boolean, children: React.ReactNode
+export const TextField = withStyles(styles)((props: TextFieldProps & {
+    label?: string, autoFocus?: boolean, required?: boolean, select?: boolean, disabled?: boolean, children: React.ReactNode, margin?: Margin, placeholder?: string
 }) =>
     <MaterialTextField
         helperText={props.meta.touched && props.meta.error}
@@ -33,6 +40,8 @@ export const TextField = withStyles(styles)((props: TextFieldProps & {
         required={props.required}
         select={props.select}
         children={props.children}
+        margin={props.margin}
+        placeholder={props.placeholder}
         {...props.input}
     />);
 
@@ -78,4 +87,4 @@ export const DateTextField = withStyles(styles)
             onChange={props.input.onChange}
             value={props.input.value}
         />
-    );
\ No newline at end of file
+    );
index 7cd4ae9ab45dfc37e8b8bdc9690318ba393fc530..1561c3ff1d4b6a1b2af0edc968df003def00c84d 100644 (file)
@@ -102,14 +102,14 @@ fetchConfig()
         const store = configureStore(history, services);
 
         store.subscribe(initListener(history, store, services, config));
-        store.dispatch(initAuth());
+        store.dispatch(initAuth(config));
         store.dispatch(setBuildInfo());
         store.dispatch(setCurrentTokenDialogApiHost(apiHost));
         store.dispatch(setUuidPrefix(config.uuidPrefix));
         store.dispatch(loadVocabulary);
         store.dispatch(loadFileViewersConfig);
 
-        const TokenComponent = (props: any) => <ApiToken authService={services.authService} {...props} />;
+        const TokenComponent = (props: any) => <ApiToken authService={services.authService} config={config} {...props} />;
         const MainPanelComponent = (props: any) => <MainPanel {...props} />;
 
         const App = () =>
diff --git a/src/models/client-authorization.ts b/src/models/client-authorization.ts
new file mode 100644 (file)
index 0000000..767916e
--- /dev/null
@@ -0,0 +1,12 @@
+export interface ClientAuthorizationResource {
+    uuid: string;
+    apiToken: string;
+    apiClientId: number;
+    userId: number;
+    createdByIpAddress: string;
+    lastUsedByIpAddress: string;
+    lastUsedAt: string;
+    expiresAt: string;
+    ownerUuid: string;
+    scopes: string[];
+}
diff --git a/src/models/session.ts b/src/models/session.ts
new file mode 100644 (file)
index 0000000..9a94296
--- /dev/null
@@ -0,0 +1,21 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+export enum SessionStatus {
+    INVALIDATED,
+    BEING_VALIDATED,
+    VALIDATED
+}
+
+export interface Session {
+    clusterId: string;
+    remoteHost: string;
+    baseUrl: string;
+    username: string;
+    email: string;
+    token: string;
+    loggedIn: boolean;
+    status: SessionStatus;
+    active: boolean;
+}
index 03e2a38aee5deb3de1a0e0663bae503d2bfe64aa..bb88f4a1aff5c33173d9526a9d74753f25a53abf 100644 (file)
@@ -34,6 +34,7 @@ const handleLocationChange = (store: RootStore) => ({ pathname }: Location) => {
     const workflowMatch = Routes.matchWorkflowRoute(pathname);
     const sshKeysUserMatch = Routes.matchSshKeysUserRoute(pathname);
     const sshKeysAdminMatch = Routes.matchSshKeysAdminRoute(pathname);
+    const siteManagerMatch = Routes.matchSiteManagerRoute(pathname);
     const keepServicesMatch = Routes.matchKeepServicesRoute(pathname);
     const computeNodesMatch = Routes.matchComputeNodesRoute(pathname);
     const apiClientAuthorizationsMatch = Routes.matchApiClientAuthorizationsRoute(pathname);
@@ -79,6 +80,8 @@ const handleLocationChange = (store: RootStore) => ({ pathname }: Location) => {
         store.dispatch(WorkbenchActions.loadSshKeys);
     } else if (sshKeysAdminMatch) {
         store.dispatch(WorkbenchActions.loadSshKeys);
+    } else if (siteManagerMatch) {
+        store.dispatch(WorkbenchActions.loadSiteManager);
     } else if (keepServicesMatch) {
         store.dispatch(WorkbenchActions.loadKeepServices);
     } else if (computeNodesMatch) {
index 661a065eb35848bbfaef168d58af2781960f92ad..b1da949652e60d0046e5487de5aa8f6279243bb2 100644 (file)
@@ -25,6 +25,7 @@ export const Routes = {
     SEARCH_RESULTS: '/search-results',
     SSH_KEYS_ADMIN: `/ssh-keys-admin`,
     SSH_KEYS_USER: `/ssh-keys-user`,
+    SITE_MANAGER: `/site-manager`,
     MY_ACCOUNT: '/my-account',
     KEEP_SERVICES: `/keep-services`,
     COMPUTE_NODES: `/nodes`,
@@ -107,6 +108,9 @@ export const matchSshKeysUserRoute = (route: string) =>
 export const matchSshKeysAdminRoute = (route: string) =>
     matchPath(route, { path: Routes.SSH_KEYS_ADMIN });
 
+export const matchSiteManagerRoute = (route: string) =>
+    matchPath(route, { path: Routes.SITE_MANAGER });
+
 export const matchMyAccountRoute = (route: string) =>
     matchPath(route, { path: Routes.MY_ACCOUNT });
 
index 22c9dcd6ae3e36e495f25a9e152f9a489506efdc..8601e2084def92f70cc82794ae19ad3b24353c5c 100644 (file)
@@ -2,10 +2,13 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import { User, UserPrefs } from "~/models/user";
+import { getUserFullname, User, UserPrefs } from "~/models/user";
 import { AxiosInstance } from "axios";
 import { ApiActions } from "~/services/api/api-actions";
 import * as uuid from "uuid/v4";
+import { Session, SessionStatus } from "~/models/session";
+import { Config } from "~/common/config";
+import { uniqBy } from "lodash";
 
 export const API_TOKEN_KEY = 'apiToken';
 export const USER_EMAIL_KEY = 'userEmail';
@@ -137,4 +140,53 @@ export class AuthService {
         const uuidParts = uuid ? uuid.split('-') : [];
         return uuidParts.length > 1 ? `${uuidParts[0]}-${uuidParts[1]}` : undefined;
     }
+
+    public getSessions(): Session[] {
+        try {
+            const sessions = JSON.parse(localStorage.getItem("sessions") || '');
+            return sessions;
+        } catch {
+            return [];
+        }
+    }
+
+    public saveSessions(sessions: Session[]) {
+        localStorage.setItem("sessions", JSON.stringify(sessions));
+    }
+
+    public buildSessions(cfg: Config, user?: User) {
+        const currentSession = {
+            clusterId: cfg.uuidPrefix,
+            remoteHost: cfg.rootUrl,
+            baseUrl: cfg.baseUrl,
+            username: getUserFullname(user),
+            email: user ? user.email : '',
+            token: this.getApiToken(),
+            loggedIn: true,
+            active: true,
+            status: SessionStatus.VALIDATED
+        } as Session;
+        const localSessions = this.getSessions();
+        const cfgSessions = Object.keys(cfg.remoteHosts).map(clusterId => {
+            const remoteHost = cfg.remoteHosts[clusterId];
+            return {
+                clusterId,
+                remoteHost,
+                baseUrl: '',
+                username: '',
+                email: '',
+                token: '',
+                loggedIn: false,
+                active: false,
+                status: SessionStatus.INVALIDATED
+            } as Session;
+        });
+        const sessions = [currentSession]
+            .concat(localSessions)
+            .concat(cfgSessions);
+
+        const uniqSessions = uniqBy(sessions, 'clusterId');
+
+        return uniqSessions;
+    }
 }
diff --git a/src/store/auth/auth-action-session.ts b/src/store/auth/auth-action-session.ts
new file mode 100644 (file)
index 0000000..e5e2e57
--- /dev/null
@@ -0,0 +1,215 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { Dispatch } from "redux";
+import { setBreadcrumbs } from "~/store/breadcrumbs/breadcrumbs-actions";
+import { RootState } from "~/store/store";
+import { ServiceRepository } from "~/services/services";
+import Axios from "axios";
+import { getUserFullname, User } from "~/models/user";
+import { authActions } from "~/store/auth/auth-action";
+import { Config, DISCOVERY_URL } from "~/common/config";
+import { Session, SessionStatus } from "~/models/session";
+import { progressIndicatorActions } from "~/store/progress-indicator/progress-indicator-actions";
+import { AuthService, UserDetailsResponse } from "~/services/auth-service/auth-service";
+import * as jsSHA from "jssha";
+
+const getRemoteHostBaseUrl = async (remoteHost: string): Promise<string | null> => {
+    let url = remoteHost;
+    if (url.indexOf('://') < 0) {
+        url = 'https://' + url;
+    }
+    const origin = new URL(url).origin;
+    let baseUrl: string | null = null;
+
+    try {
+        const resp = await Axios.get<Config>(`${origin}/${DISCOVERY_URL}`);
+        baseUrl = resp.data.baseUrl;
+    } catch (err) {
+        try {
+            const resp = await Axios.get<any>(`${origin}/status.json`);
+            baseUrl = resp.data.apiBaseURL;
+        } catch (err) {
+        }
+    }
+
+    if (baseUrl && baseUrl[baseUrl.length - 1] === '/') {
+        baseUrl = baseUrl.substr(0, baseUrl.length - 1);
+    }
+
+    return baseUrl;
+};
+
+const getUserDetails = async (baseUrl: string, token: string): Promise<UserDetailsResponse> => {
+    const resp = await Axios.get<UserDetailsResponse>(`${baseUrl}/users/current`, {
+        headers: {
+            Authorization: `OAuth2 ${token}`
+        }
+    });
+    return resp.data;
+};
+
+const getTokenUuid = async (baseUrl: string, token: string): Promise<string> => {
+    if (token.startsWith("v2/")) {
+        const uuid = token.split("/")[1];
+        return Promise.resolve(uuid);
+    }
+
+    const resp = await Axios.get(`${baseUrl}/api_client_authorizations`, {
+        headers: {
+            Authorization: `OAuth2 ${token}`
+        },
+        data: {
+            filters: JSON.stringify([['api_token', '=', token]])
+        }
+    });
+
+    return resp.data.items[0].uuid;
+};
+
+const getSaltedToken = (clusterId: string, tokenUuid: string, token: string) => {
+    const shaObj = new jsSHA("SHA-1", "TEXT");
+    let secret = token;
+    if (token.startsWith("v2/")) {
+        secret = token.split("/")[2];
+    }
+    shaObj.setHMACKey(secret, "TEXT");
+    shaObj.update(clusterId);
+    const hmac = shaObj.getHMAC("HEX");
+    return `v2/${tokenUuid}/${hmac}`;
+};
+
+const clusterLogin = async (clusterId: string, baseUrl: string, activeSession: Session): Promise<{user: User, token: string}> => {
+    const tokenUuid = await getTokenUuid(activeSession.baseUrl, activeSession.token);
+    const saltedToken = getSaltedToken(clusterId, tokenUuid, activeSession.token);
+    const user = await getUserDetails(baseUrl, saltedToken);
+    return {
+        user: {
+            firstName: user.first_name,
+            lastName: user.last_name,
+            uuid: user.uuid,
+            ownerUuid: user.owner_uuid,
+            email: user.email,
+            isAdmin: user.is_admin,
+            identityUrl: user.identity_url,
+            prefs: user.prefs
+        },
+        token: saltedToken
+    };
+};
+
+const getActiveSession = (sessions: Session[]): Session | undefined => sessions.find(s => s.active);
+
+export const validateCluster = async (remoteHost: string, clusterId: string, activeSession: Session): Promise<{ user: User; token: string, baseUrl: string }> => {
+    const baseUrl = await getRemoteHostBaseUrl(remoteHost);
+    if (!baseUrl) {
+        return Promise.reject(`Could not find base url for ${remoteHost}`);
+    }
+    const { user, token } = await clusterLogin(clusterId, baseUrl, activeSession);
+    return { baseUrl, user, token };
+};
+
+export const validateSession = (session: Session, activeSession: Session) =>
+    async (dispatch: Dispatch): Promise<Session> => {
+        dispatch(authActions.UPDATE_SESSION({ ...session, status: SessionStatus.BEING_VALIDATED }));
+        session.loggedIn = false;
+        try {
+            const { baseUrl, user, token } = await validateCluster(session.remoteHost, session.clusterId, activeSession);
+            session.baseUrl = baseUrl;
+            session.token = token;
+            session.email = user.email;
+            session.username = getUserFullname(user);
+            session.loggedIn = true;
+        } catch {
+            session.loggedIn = false;
+        } finally {
+            session.status = SessionStatus.VALIDATED;
+            dispatch(authActions.UPDATE_SESSION(session));
+        }
+        return session;
+    };
+
+export const validateSessions = () =>
+    async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
+        const sessions = getState().auth.sessions;
+        const activeSession = getActiveSession(sessions);
+        if (activeSession) {
+            dispatch(progressIndicatorActions.START_WORKING("sessionsValidation"));
+            for (const session of sessions) {
+                if (session.status === SessionStatus.INVALIDATED) {
+                    await dispatch(validateSession(session, activeSession));
+                }
+            }
+            services.authService.saveSessions(sessions);
+            dispatch(progressIndicatorActions.STOP_WORKING("sessionsValidation"));
+        }
+    };
+
+export const addSession = (remoteHost: string) =>
+    async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
+        const sessions = getState().auth.sessions;
+        const activeSession = getActiveSession(sessions);
+        if (activeSession) {
+            const clusterId = remoteHost.match(/^(\w+)\./)![1];
+            if (sessions.find(s => s.clusterId === clusterId)) {
+                return Promise.reject("Cluster already exists");
+            }
+            try {
+                const { baseUrl, user, token } = await validateCluster(remoteHost, clusterId, activeSession);
+                const session = {
+                    loggedIn: true,
+                    status: SessionStatus.VALIDATED,
+                    active: false,
+                    email: user.email,
+                    username: getUserFullname(user),
+                    remoteHost,
+                    baseUrl,
+                    clusterId,
+                    token
+                };
+
+                dispatch(authActions.ADD_SESSION(session));
+                services.authService.saveSessions(getState().auth.sessions);
+
+                return session;
+            } catch (e) {
+            }
+        }
+        return Promise.reject("Could not validate cluster");
+    };
+
+export const toggleSession = (session: Session) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        let s = { ...session };
+
+        if (session.loggedIn) {
+            s.loggedIn = false;
+        } else {
+            const sessions = getState().auth.sessions;
+            const activeSession = getActiveSession(sessions);
+            if (activeSession) {
+                s = await dispatch<any>(validateSession(s, activeSession)) as Session;
+            }
+        }
+
+        dispatch(authActions.UPDATE_SESSION(s));
+        services.authService.saveSessions(getState().auth.sessions);
+    };
+
+export const initSessions = (authService: AuthService, config: Config, user: User) =>
+    (dispatch: Dispatch<any>) => {
+        const sessions = authService.buildSessions(config, user);
+        authService.saveSessions(sessions);
+        dispatch(authActions.SET_SESSIONS(sessions));
+    };
+
+export const loadSiteManagerPanel = () =>
+    async (dispatch: Dispatch<any>) => {
+        try {
+            dispatch(setBreadcrumbs([{ label: 'Site Manager'}]));
+            dispatch(validateSessions());
+        } catch (e) {
+            return;
+        }
+    };
diff --git a/src/store/auth/auth-action-ssh.ts b/src/store/auth/auth-action-ssh.ts
new file mode 100644 (file)
index 0000000..2c3a272
--- /dev/null
@@ -0,0 +1,102 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { dialogActions } from "~/store/dialog/dialog-actions";
+import { Dispatch } from "redux";
+import { RootState } from "~/store/store";
+import { ServiceRepository } from "~/services/services";
+import { snackbarActions } from "~/store/snackbar/snackbar-actions";
+import { FormErrors, reset, startSubmit, stopSubmit } from "redux-form";
+import { KeyType } from "~/models/ssh-key";
+import {
+    AuthorizedKeysServiceError,
+    getAuthorizedKeysServiceError
+} from "~/services/authorized-keys-service/authorized-keys-service";
+import { setBreadcrumbs } from "~/store/breadcrumbs/breadcrumbs-actions";
+import {
+    authActions,
+} from "~/store/auth/auth-action";
+
+export const SSH_KEY_CREATE_FORM_NAME = 'sshKeyCreateFormName';
+export const SSH_KEY_PUBLIC_KEY_DIALOG = 'sshKeyPublicKeyDialog';
+export const SSH_KEY_REMOVE_DIALOG = 'sshKeyRemoveDialog';
+export const SSH_KEY_ATTRIBUTES_DIALOG = 'sshKeyAttributesDialog';
+
+export interface SshKeyCreateFormDialogData {
+    publicKey: string;
+    name: string;
+}
+
+export const openSshKeyCreateDialog = () => dialogActions.OPEN_DIALOG({ id: SSH_KEY_CREATE_FORM_NAME, data: {} });
+
+export const openPublicKeyDialog = (name: string, publicKey: string) =>
+    dialogActions.OPEN_DIALOG({ id: SSH_KEY_PUBLIC_KEY_DIALOG, data: { name, publicKey } });
+
+export const openSshKeyAttributesDialog = (uuid: string) =>
+    (dispatch: Dispatch, getState: () => RootState) => {
+        const sshKey = getState().auth.sshKeys.find(it => it.uuid === uuid);
+        dispatch(dialogActions.OPEN_DIALOG({ id: SSH_KEY_ATTRIBUTES_DIALOG, data: { sshKey } }));
+    };
+
+export const openSshKeyRemoveDialog = (uuid: string) =>
+    (dispatch: Dispatch, getState: () => RootState) => {
+        dispatch(dialogActions.OPEN_DIALOG({
+            id: SSH_KEY_REMOVE_DIALOG,
+            data: {
+                title: 'Remove public key',
+                text: 'Are you sure you want to remove this public key?',
+                confirmButtonLabel: 'Remove',
+                uuid
+            }
+        }));
+    };
+
+export const removeSshKey = (uuid: string) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Removing ...' }));
+        await services.authorizedKeysService.delete(uuid);
+        dispatch(authActions.REMOVE_SSH_KEY(uuid));
+        dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Public Key has been successfully removed.', hideDuration: 2000 }));
+    };
+
+export const createSshKey = (data: SshKeyCreateFormDialogData) =>
+    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        const userUuid = getState().auth.user!.uuid;
+        const { name, publicKey } = data;
+        dispatch(startSubmit(SSH_KEY_CREATE_FORM_NAME));
+        try {
+            const newSshKey = await services.authorizedKeysService.create({
+                name,
+                publicKey,
+                keyType: KeyType.SSH,
+                authorizedUserUuid: userUuid
+            });
+            dispatch(authActions.ADD_SSH_KEY(newSshKey));
+            dispatch(dialogActions.CLOSE_DIALOG({ id: SSH_KEY_CREATE_FORM_NAME }));
+            dispatch(reset(SSH_KEY_CREATE_FORM_NAME));
+            dispatch(snackbarActions.OPEN_SNACKBAR({
+                message: "Public key has been successfully created.",
+                hideDuration: 2000
+            }));
+        } catch (e) {
+            const error = getAuthorizedKeysServiceError(e);
+            if (error === AuthorizedKeysServiceError.UNIQUE_PUBLIC_KEY) {
+                dispatch(stopSubmit(SSH_KEY_CREATE_FORM_NAME, { publicKey: 'Public key already exists.' } as FormErrors));
+            } else if (error === AuthorizedKeysServiceError.INVALID_PUBLIC_KEY) {
+                dispatch(stopSubmit(SSH_KEY_CREATE_FORM_NAME, { publicKey: 'Public key is invalid' } as FormErrors));
+            }
+        }
+    };
+
+export const loadSshKeysPanel = () =>
+    async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
+        try {
+            dispatch(setBreadcrumbs([{ label: 'SSH Keys'}]));
+            const response = await services.authorizedKeysService.list();
+            dispatch(authActions.SET_SSH_KEYS(response.items));
+        } catch (e) {
+            return;
+        }
+    };
+
similarity index 77%
rename from src/store/auth/auth-actions.test.ts
rename to src/store/auth/auth-action.test.ts
index ed2237953932570d27921c21c0c774e0f0932b89..e5775a493d07f38623c22141744d9b949f0fef96 100644 (file)
@@ -18,7 +18,7 @@ import 'jest-localstorage-mock';
 import { createServices } from "~/services/services";
 import { configureStore, RootStore } from "../store";
 import createBrowserHistory from "history/createBrowserHistory";
-import { mockConfig } from '~/common/config';
+import { Config, mockConfig } from '~/common/config';
 import { ApiActions } from "~/services/api/api-actions";
 
 describe('auth-actions', () => {
@@ -47,11 +47,36 @@ describe('auth-actions', () => {
         localStorage.setItem(USER_OWNER_UUID_KEY, "ownerUuid");
         localStorage.setItem(USER_IS_ADMIN, JSON.stringify("false"));
 
-        store.dispatch(initAuth());
+        const config: any = {
+            remoteHosts: { "xc59": "xc59.api.arvados.com" }
+        };
+
+        store.dispatch(initAuth(config));
 
         expect(store.getState().auth).toEqual({
             apiToken: "token",
             sshKeys: [],
+            sessions: [{
+                "active": true,
+                "baseUrl": undefined,
+                "clusterId": undefined,
+                "email": "test@test.com",
+                "loggedIn": true,
+                "remoteHost": undefined,
+                "status": 2,
+                "token": "token",
+                "username": "John Doe"
+            }, {
+                "active": false,
+                "baseUrl": "",
+                "clusterId": "xc59",
+                "email": "",
+                "loggedIn": false,
+                "remoteHost": "xc59.api.arvados.com",
+                "status": 0,
+                "token": "",
+                "username": ""
+            }],
             user: {
                 email: "test@test.com",
                 firstName: "John",
index d72a3ece7a829270e902b6c9790b59feda51a22d..6c54a5c9cf86ad0530188785546f19965b37b281 100644 (file)
@@ -4,17 +4,14 @@
 
 import { ofType, unionize, UnionOf } from '~/common/unionize';
 import { Dispatch } from "redux";
-import { reset, stopSubmit, startSubmit, FormErrors } from 'redux-form';
 import { AxiosInstance } from "axios";
 import { RootState } from "../store";
-import { snackbarActions } from '~/store/snackbar/snackbar-actions';
-import { dialogActions } from '~/store/dialog/dialog-actions';
-import { setBreadcrumbs } from '~/store/breadcrumbs/breadcrumbs-actions';
 import { ServiceRepository } from "~/services/services";
-import { getAuthorizedKeysServiceError, AuthorizedKeysServiceError } from '~/services/authorized-keys-service/authorized-keys-service';
-import { KeyType, SshKeyResource } from '~/models/ssh-key';
+import { SshKeyResource } from '~/models/ssh-key';
 import { User } from "~/models/user";
-import * as Routes from '~/routes/routes';
+import { Session } from "~/models/session";
+import { Config } from '~/common/config';
+import { initSessions } from "~/store/auth/auth-action-session";
 
 export const authActions = unionize({
     SAVE_API_TOKEN: ofType<string>(),
@@ -25,19 +22,13 @@ export const authActions = unionize({
     USER_DETAILS_SUCCESS: ofType<User>(),
     SET_SSH_KEYS: ofType<SshKeyResource[]>(),
     ADD_SSH_KEY: ofType<SshKeyResource>(),
-    REMOVE_SSH_KEY: ofType<string>()
+    REMOVE_SSH_KEY: ofType<string>(),
+    SET_SESSIONS: ofType<Session[]>(),
+    ADD_SESSION: ofType<Session>(),
+    REMOVE_SESSION: ofType<string>(),
+    UPDATE_SESSION: ofType<Session>()
 });
 
-export const SSH_KEY_CREATE_FORM_NAME = 'sshKeyCreateFormName';
-export const SSH_KEY_PUBLIC_KEY_DIALOG = 'sshKeyPublicKeyDialog';
-export const SSH_KEY_REMOVE_DIALOG = 'sshKeyRemoveDialog';
-export const SSH_KEY_ATTRIBUTES_DIALOG = 'sshKeyAttributesDialog';
-
-export interface SshKeyCreateFormDialogData {
-    publicKey: string;
-    name: string;
-}
-
 function setAuthorizationHeader(services: ServiceRepository, token: string) {
     services.apiClient.defaults.headers.common = {
         Authorization: `OAuth2 ${token}`
@@ -51,7 +42,7 @@ function removeAuthorizationHeader(client: AxiosInstance) {
     delete client.defaults.headers.common.Authorization;
 }
 
-export const initAuth = () => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+export const initAuth = (config: Config) => (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
     const user = services.authService.getUser();
     const token = services.authService.getApiToken();
     if (token) {
@@ -59,6 +50,7 @@ export const initAuth = () => (dispatch: Dispatch, getState: () => RootState, se
     }
     if (token && user) {
         dispatch(authActions.INIT({ user, token }));
+        dispatch<any>(initSessions(services.authService, config, user));
     }
 };
 
@@ -90,80 +82,4 @@ export const getUserDetails = () => (dispatch: Dispatch, getState: () => RootSta
     });
 };
 
-export const openSshKeyCreateDialog = () => dialogActions.OPEN_DIALOG({ id: SSH_KEY_CREATE_FORM_NAME, data: {} });
-
-export const openPublicKeyDialog = (name: string, publicKey: string) =>
-    dialogActions.OPEN_DIALOG({ id: SSH_KEY_PUBLIC_KEY_DIALOG, data: { name, publicKey } });
-
-export const openSshKeyAttributesDialog = (uuid: string) =>
-    (dispatch: Dispatch, getState: () => RootState) => {
-        const sshKey = getState().auth.sshKeys.find(it => it.uuid === uuid);
-        dispatch(dialogActions.OPEN_DIALOG({ id: SSH_KEY_ATTRIBUTES_DIALOG, data: { sshKey } }));
-    };
-
-export const openSshKeyRemoveDialog = (uuid: string) =>
-    (dispatch: Dispatch, getState: () => RootState) => {
-        dispatch(dialogActions.OPEN_DIALOG({
-            id: SSH_KEY_REMOVE_DIALOG,
-            data: {
-                title: 'Remove public key',
-                text: 'Are you sure you want to remove this public key?',
-                confirmButtonLabel: 'Remove',
-                uuid
-            }
-        }));
-    };
-
-export const removeSshKey = (uuid: string) =>
-    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Removing ...' }));
-        await services.authorizedKeysService.delete(uuid);
-        dispatch(authActions.REMOVE_SSH_KEY(uuid));
-        dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Public Key has been successfully removed.', hideDuration: 2000 }));
-    };
-
-export const createSshKey = (data: SshKeyCreateFormDialogData) =>
-    async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
-        const userUuid = getState().auth.user!.uuid;
-        const { name, publicKey } = data;
-        dispatch(startSubmit(SSH_KEY_CREATE_FORM_NAME));
-        try {
-            const newSshKey = await services.authorizedKeysService.create({
-                name,
-                publicKey,
-                keyType: KeyType.SSH,
-                authorizedUserUuid: userUuid
-            });
-            dispatch(authActions.ADD_SSH_KEY(newSshKey));
-            dispatch(dialogActions.CLOSE_DIALOG({ id: SSH_KEY_CREATE_FORM_NAME }));
-            dispatch(reset(SSH_KEY_CREATE_FORM_NAME));
-            dispatch(snackbarActions.OPEN_SNACKBAR({
-                message: "Public key has been successfully created.",
-                hideDuration: 2000
-            }));
-        } catch (e) {
-            const error = getAuthorizedKeysServiceError(e);
-            if (error === AuthorizedKeysServiceError.UNIQUE_PUBLIC_KEY) {
-                dispatch(stopSubmit(SSH_KEY_CREATE_FORM_NAME, { publicKey: 'Public key already exists.' } as FormErrors));
-            } else if (error === AuthorizedKeysServiceError.INVALID_PUBLIC_KEY) {
-                dispatch(stopSubmit(SSH_KEY_CREATE_FORM_NAME, { publicKey: 'Public key is invalid' } as FormErrors));
-            }
-        }
-    };
-
-export const loadSshKeysPanel = () =>
-    async (dispatch: Dispatch<any>, getState: () => RootState, services: ServiceRepository) => {
-        try {
-            const userUuid = getState().auth.user!.uuid;
-            const { router } = getState();
-            const pathname = router.location ? router.location.pathname : '';
-            dispatch(setBreadcrumbs([{ label: 'SSH Keys' }]));
-            const response = await services.authorizedKeysService.list();
-            const userSshKeys = response.items.find(it => it.ownerUuid === userUuid);
-            return Routes.matchSshKeysAdminRoute(pathname) ? dispatch(authActions.SET_SSH_KEYS(response.items)) : dispatch(authActions.SET_SSH_KEYS([userSshKeys!]));
-        } catch (e) {
-            return;
-        }
-    };
-
 export type AuthAction = UnionOf<typeof authActions>;
index eb7e0c0dac541501782d1929a9a882ae09c98072..773f9f82dbd737b2e7f0d3fa843b5be4779d6d57 100644 (file)
@@ -38,7 +38,8 @@ describe('auth-reducer', () => {
         expect(state).toEqual({
             apiToken: "token",
             user,
-            sshKeys: []
+            sshKeys: [],
+            sessions: []
         });
     });
 
@@ -49,7 +50,8 @@ describe('auth-reducer', () => {
         expect(state).toEqual({
             apiToken: "token",
             user: undefined,
-            sshKeys: []
+            sshKeys: [],
+            sessions: []
         });
     });
 
@@ -71,6 +73,7 @@ describe('auth-reducer', () => {
         expect(state).toEqual({
             apiToken: undefined,
             sshKeys: [],
+            sessions: [],
             user: {
                 email: "test@test.com",
                 firstName: "John",
index a8e4340af52ac35142d9db3c73dce1c78de5fa7a..a2822f100c37b6421b465f3b7a2312d2c5b00362 100644 (file)
@@ -6,17 +6,20 @@ import { authActions, AuthAction } from "./auth-action";
 import { User } from "~/models/user";
 import { ServiceRepository } from "~/services/services";
 import { SshKeyResource } from '~/models/ssh-key';
+import { Session } from "~/models/session";
 
 export interface AuthState {
     user?: User;
     apiToken?: string;
     sshKeys: SshKeyResource[];
+    sessions: Session[];
 }
 
 const initialState: AuthState = {
     user: undefined,
     apiToken: undefined,
-    sshKeys: []
+    sshKeys: [],
+    sessions: []
 };
 
 export const authReducer = (services: ServiceRepository) => (state = initialState, action: AuthAction) => {
@@ -45,6 +48,26 @@ export const authReducer = (services: ServiceRepository) => (state = initialStat
         REMOVE_SSH_KEY: (uuid: string) => {
             return { ...state, sshKeys: state.sshKeys.filter((sshKey) => sshKey.uuid !== uuid )};
         },
+        SET_SESSIONS: (sessions: Session[]) => {
+            return { ...state, sessions };
+        },
+        ADD_SESSION: (session: Session) => {
+            return { ...state, sessions: state.sessions.concat(session) };
+        },
+        REMOVE_SESSION: (clusterId: string) => {
+            return {
+                ...state,
+                sessions: state.sessions.filter(
+                    session => session.clusterId !== clusterId
+                )};
+        },
+        UPDATE_SESSION: (session: Session) => {
+            return {
+                ...state,
+                sessions: state.sessions.map(
+                    s => s.clusterId === session.clusterId ? session : s
+                )};
+        },
         default: () => state
     });
 };
index c53c55e89287212f91715481a8998fe429fddaf2..f610eb5e99fd6786f8fe975888256c3e544d27d1 100644 (file)
@@ -77,6 +77,8 @@ export const navigateToSshKeysAdmin= push(Routes.SSH_KEYS_ADMIN);
 
 export const navigateToSshKeysUser= push(Routes.SSH_KEYS_USER);
 
+export const navigateToSiteManager= push(Routes.SITE_MANAGER);
+
 export const navigateToMyAccount = push(Routes.MY_ACCOUNT);
 
 export const navigateToKeepServices = push(Routes.KEEP_SERVICES);
index 2aa914af2ae505c8faaf08ff75b54c50fe17224c..42a718bd69a9b4a4fde1f9217c36812d08a44829 100644 (file)
@@ -8,9 +8,10 @@ import { Dispatch } from 'redux';
 import { ProcessStatus } from '~/store/processes/process';
 import { RootState } from '~/store/store';
 import { ServiceRepository } from "~/services/services";
-import { navigateToCollection } from '~/store/navigation/navigation-action';
+import { navigateToCollection, navigateToWorkflows } from '~/store/navigation/navigation-action';
 import { snackbarActions } from '~/store/snackbar/snackbar-actions';
 import { SnackbarKind } from '../snackbar/snackbar-actions';
+import { showWorkflowDetails } from '~/store/workflow-panel/workflow-panel-actions';
 
 export const procesPanelActions = unionize({
     SET_PROCESS_PANEL_FILTERS: ofType<string[]>(),
@@ -37,6 +38,12 @@ export const navigateToOutput = (uuid: string) =>
         }
     };
 
+export const openWorkflow = (uuid: string) =>
+    (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+        dispatch<any>(navigateToWorkflows);
+        dispatch<any>(showWorkflowDetails(uuid));
+    };
+
 export const initProcessPanelFilters = procesPanelActions.SET_PROCESS_PANEL_FILTERS([
     ProcessStatus.QUEUED,
     ProcessStatus.COMPLETED,
index 5e9dc285ef2050f98794b4b5cfc632070ce32d4b..46ab1f59e9825bf712fc9425c27b78b7369d80a3 100644 (file)
@@ -39,8 +39,9 @@ import { sharedWithMePanelActions } from '~/store/shared-with-me-panel/shared-wi
 import { loadSharedWithMePanel } from '~/store/shared-with-me-panel/shared-with-me-panel-actions';
 import { CopyFormDialogData } from '~/store/copy-dialog/copy-dialog';
 import { loadWorkflowPanel, workflowPanelActions } from '~/store/workflow-panel/workflow-panel-actions';
-import { loadSshKeysPanel } from '~/store/auth/auth-action';
+import { loadSshKeysPanel } from '~/store/auth/auth-action-ssh';
 import { loadMyAccountPanel } from '~/store/my-account/my-account-panel-actions';
+import { loadSiteManagerPanel } from '~/store/auth/auth-action-session';
 import { workflowPanelColumns } from '~/views/workflow-panel/workflow-panel-view';
 import { progressIndicatorActions } from '~/store/progress-indicator/progress-indicator-actions';
 import { getProgressIndicator } from '~/store/progress-indicator/progress-indicator-reducer';
@@ -435,6 +436,11 @@ export const loadSshKeys = handleFirstTimeLoad(
         await dispatch(loadSshKeysPanel());
     });
 
+export const loadSiteManager = handleFirstTimeLoad(
+async (dispatch: Dispatch<any>) => {
+    await dispatch(loadSiteManagerPanel());
+});
+
 export const loadMyAccount = handleFirstTimeLoad(
     (dispatch: Dispatch<any>) => {
         dispatch(loadMyAccountPanel());
diff --git a/src/validators/is-remote-host.tsx b/src/validators/is-remote-host.tsx
new file mode 100644 (file)
index 0000000..b5e2231
--- /dev/null
@@ -0,0 +1,10 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+
+const ERROR_MESSAGE = 'Remote host is invalid';
+
+export const isRemoteHost = (value: string) => {
+    return value.match(/\w+\.\w+\.\w+/i) ? undefined : ERROR_MESSAGE;
+};
index 9bc76419ff03fd713311a25c60b7dc0a4d0822ba..acef9744311ccd82a5d43dcc482eb0250c47cb60 100644 (file)
@@ -5,6 +5,7 @@
 import { require } from './require';
 import { maxLength } from './max-length';
 import { isRsaKey } from './is-rsa-key';
+import { isRemoteHost } from "./is-remote-host";
 
 export const TAG_KEY_VALIDATION = [require, maxLength(255)];
 export const TAG_VALUE_VALIDATION = [require, maxLength(255)];
@@ -31,4 +32,6 @@ export const USER_LENGTH_VALIDATION = [maxLength(255)];
 export const SSH_KEY_PUBLIC_VALIDATION = [require, isRsaKey, maxLength(1024)];
 export const SSH_KEY_NAME_VALIDATION = [require, maxLength(255)];
 
+export const SITE_MANAGER_REMOTE_HOST_VALIDATION = [require, isRemoteHost, maxLength(255)];
+
 export const MY_ACCOUNT_VALIDATION = [require];
index 718d35891e1cee22735c523821a8725313abb86c..43c55a92c9addbd8031fd537b5c59528b620e7ca 100644 (file)
@@ -5,13 +5,17 @@
 import { RouteProps } from "react-router";
 import * as React from "react";
 import { connect, DispatchProp } from "react-redux";
-import { getUserDetails, saveApiToken } from "~/store/auth/auth-action";
+import { authActions, getUserDetails, saveApiToken } from "~/store/auth/auth-action";
 import { getUrlParameter } from "~/common/url";
 import { AuthService } from "~/services/auth-service/auth-service";
 import { navigateToRootProject } from "~/store/navigation/navigation-action";
+import { User } from "~/models/user";
+import { Config } from "~/common/config";
+import { initSessions } from "~/store/auth/auth-action-session";
 
 interface ApiTokenProps {
     authService: AuthService;
+    config: Config;
 }
 
 export const ApiToken = connect()(
@@ -20,7 +24,9 @@ export const ApiToken = connect()(
             const search = this.props.location ? this.props.location.search : "";
             const apiToken = getUrlParameter(search, 'api_token');
             this.props.dispatch(saveApiToken(apiToken));
-            this.props.dispatch<any>(getUserDetails()).finally(() => {
+            this.props.dispatch<any>(getUserDetails()).then((user: User) => {
+                this.props.dispatch(initSessions(this.props.authService, this.props.config, user));
+            }).finally(() => {
                 this.props.dispatch(navigateToRootProject);
             });
         }
index 0ce0c43118549b9107a17f8e9c3bf515b53f50a3..c2885185eabac9432c357c0d50a021d569179059 100644 (file)
@@ -4,7 +4,7 @@
 
 import { ContextMenuActionSet } from "~/views-components/context-menu/context-menu-action-set";
 import { AdvancedIcon, RemoveIcon, AttributesIcon } from "~/components/icon/icon";
-import { openSshKeyRemoveDialog, openSshKeyAttributesDialog } from '~/store/auth/auth-action';
+import { openSshKeyRemoveDialog, openSshKeyAttributesDialog } from '~/store/auth/auth-action-ssh';
 import { openAdvancedTabDialog } from '~/store/advanced-tab/advanced-tab';
 
 export const sshKeyActionSet: ContextMenuActionSet = [[{
index b7c9b1fbe6e19bba50db582618c1455c75813cf0..aed1cd245dd26b0f3a5ad647758c196e34238271 100644 (file)
@@ -7,7 +7,7 @@ import { InjectedFormProps } from 'redux-form';
 import { WithDialogProps } from '~/store/dialog/with-dialog';
 import { FormDialog } from '~/components/form-dialog/form-dialog';
 import { SshKeyPublicField, SshKeyNameField } from '~/views-components/form-fields/ssh-key-form-fields';
-import { SshKeyCreateFormDialogData } from '~/store/auth/auth-action';
+import { SshKeyCreateFormDialogData } from '~/store/auth/auth-action-ssh';
 
 type DialogSshKeyProps = WithDialogProps<{}> & InjectedFormProps<SshKeyCreateFormDialogData>;
 
index e96524338dd626bd333b3f3d6afd93dc91e85335..6472c3ae57a5c8743db8c7bbc7da2dc466d6fe9d 100644 (file)
@@ -5,7 +5,11 @@
 import { compose } from "redux";
 import { reduxForm } from 'redux-form';
 import { withDialog } from "~/store/dialog/with-dialog";
-import { SSH_KEY_CREATE_FORM_NAME, createSshKey, SshKeyCreateFormDialogData } from '~/store/auth/auth-action';
+import {
+    SSH_KEY_CREATE_FORM_NAME,
+    createSshKey,
+    SshKeyCreateFormDialogData
+} from '~/store/auth/auth-action-ssh';
 import { DialogSshKeyCreate } from '~/views-components/dialog-create/dialog-ssh-key-create';
 
 export const CreateSshKeyDialog = compose(
@@ -16,4 +20,4 @@ export const CreateSshKeyDialog = compose(
             dispatch(createSshKey(data));
         }
     })
-)(DialogSshKeyCreate);
\ No newline at end of file
+)(DialogSshKeyCreate);
index da0b12b55311fc045819c8f5d4b7641f0c6df045..85abbe19f3f266769bb70b9f1da0e03d847399f1 100644 (file)
@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from "react";
-import { Field, WrappedFieldProps, FieldArray } from 'redux-form';
+import { Field, WrappedFieldProps, FieldArray, formValues } from 'redux-form';
 import { TextField, DateTextField } from "~/components/text-field/text-field";
 import { CheckboxField } from '~/components/checkbox-field/checkbox-field';
 import { NativeSelectField } from '~/components/select-field/select-field';
@@ -14,6 +14,10 @@ import { SEARCH_BAR_ADVANCE_FORM_PICKER_ID } from '~/store/search-bar/search-bar
 import { SearchBarAdvancedPropertiesView } from '~/views-components/search-bar/search-bar-advanced-properties-view';
 import { TreeItem } from "~/components/tree/tree";
 import { ProjectsTreePickerItem } from "~/views-components/projects-tree-picker/generic-projects-tree-picker";
+import { PropertyKeyInput } from '~/views-components/resource-properties-form/property-key-field';
+import { PropertyValueInput, PropertyValueFieldProps } from '~/views-components/resource-properties-form/property-value-field';
+import { VocabularyProp, connectVocabulary } from '~/views-components/resource-properties-form/property-field-common';
+import { compose } from 'redux';
 
 export const SearchBarTypeField = () =>
     <Field
@@ -50,7 +54,7 @@ const ProjectsPicker = (props: WrappedFieldProps) =>
                 (_: any, { id }: TreeItem<ProjectsTreePickerItem>) => {
                     props.input.onChange(id);
                 }
-            }/>
+            } />
     </div>;
 
 export const SearchBarTrashField = () =>
@@ -74,17 +78,22 @@ export const SearchBarPropertiesField = () =>
         name="properties"
         component={SearchBarAdvancedPropertiesView} />;
 
-export const SearchBarKeyField = () =>
-    <Field
-        name='key'
-        component={TextField}
-        label="Key" />;
+export const SearchBarKeyField = connectVocabulary(
+    ({ vocabulary }: VocabularyProp) =>
+        <Field
+            name='key'
+            component={PropertyKeyInput}
+            vocabulary={vocabulary} />);
 
-export const SearchBarValueField = () =>
-    <Field
-        name='value'
-        component={TextField}
-        label="Value" />;
+export const SearchBarValueField = compose(
+    connectVocabulary,
+    formValues({ propertyKey: 'key' })
+)(
+    (props: PropertyValueFieldProps) =>
+        <Field
+            name='value'
+            component={PropertyValueInput}
+            {...props} />);
 
 export const SearchBarSaveSearchField = () =>
     <Field
index 53a5753d0c2130380ce900efa2c1f6f73b33698d..6c1e46c52a37ae819491cf043e6b8c4986ca98fe 100644 (file)
@@ -11,9 +11,13 @@ import { DispatchProp, connect } from 'react-redux';
 import { logout } from '~/store/auth/auth-action';
 import { RootState } from "~/store/store";
 import { openCurrentTokenDialog } from '~/store/current-token-dialog/current-token-dialog-actions';
-import { navigateToSshKeysUser, navigateToMyAccount } from '~/store/navigation/navigation-action';
+import { openRepositoriesPanel } from "~/store/repositories/repositories-actions";
+import {
+    navigateToSiteManager,
+    navigateToSshKeysUser,
+    navigateToMyAccount
+} from '~/store/navigation/navigation-action';
 import { openUserVirtualMachines } from "~/store/virtual-machines/virtual-machines-actions";
-import { openRepositoriesPanel } from '~/store/repositories/repositories-actions';
 
 interface AccountMenuProps {
     user?: User;
@@ -40,6 +44,7 @@ export const AccountMenu = connect(mapStateToProps)(
                 {!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 onClick={() => dispatch(logout())}>Logout</MenuItem>
             </DropdownMenu>
index 3806b5245a75b0e58acfe4d6c4aba4247acdb434..c0014d005134bc52a706dc4c770baf00ae4907dc 100644 (file)
@@ -21,6 +21,7 @@ const isButtonVisible = ({ router }: RootState) => {
     return !Routes.matchWorkflowRoute(pathname) && !Routes.matchUserVirtualMachineRoute(pathname) &&
         !Routes.matchAdminVirtualMachineRoute(pathname) && !Routes.matchRepositoriesRoute(pathname) &&
         !Routes.matchSshKeysAdminRoute(pathname) && !Routes.matchSshKeysUserRoute(pathname) &&
+        !Routes.matchSiteManagerRoute(pathname) &&
         !Routes.matchKeepServicesRoute(pathname) && !Routes.matchComputeNodesRoute(pathname) &&
         !Routes.matchApiClientAuthorizationsRoute(pathname) && !Routes.matchUsersRoute(pathname) &&
         !Routes.matchMyAccountRoute(pathname) && !Routes.matchLinksRoute(pathname);
index 9e276ade09e71e6b9e42c485b8b6e89be73c8d57..1a806511523b6e0bc3fabeb1322a72ba615e3fcf 100644 (file)
@@ -37,5 +37,5 @@ const RenameDialogFormFields = (props: WithDialogProps<RenameFileDialogData>) =>
         component={TextField}
         autoFocus={true}
     />
-    <WarningCollection text="Renaming a file will change content adress." />
+    <WarningCollection text="Renaming a file will change content address." />
 </>;
index e6708a394fd91445a7afbe6aba972b722c4638b2..3fb2d377aeff56574a06a919f2f33e3aea5f142e 100644 (file)
@@ -20,7 +20,7 @@ export const PropertyKeyField = connectVocabulary(
             vocabulary={vocabulary}
             validate={getValidation(vocabulary)} />);
 
-const PropertyKeyInput = ({ vocabulary, ...props }: WrappedFieldProps & VocabularyProp) =>
+export const PropertyKeyInput = ({ vocabulary, ...props }: WrappedFieldProps & VocabularyProp) =>
     <Autocomplete
         label='Key'
         suggestions={getSuggestions(props.input.value, vocabulary)}
index db2db3f7ece5e63ed7656f2f3a417996b3238dad..13dcfeb544278acf62db0b41aca9c113333043d3 100644 (file)
@@ -15,7 +15,7 @@ interface PropertyKeyProp {
     propertyKey: string;
 }
 
-type PropertyValueFieldProps = VocabularyProp & PropertyKeyProp;
+export type PropertyValueFieldProps = VocabularyProp & PropertyKeyProp;
 
 export const PROPERTY_VALUE_FIELD_NAME = 'value';
 
@@ -30,7 +30,7 @@ export const PropertyValueField = compose(
             validate={getValidation(props)}
             {...props} />);
 
-const PropertyValueInput = ({ vocabulary, propertyKey, ...props }: WrappedFieldProps & PropertyValueFieldProps) =>
+export const PropertyValueInput = ({ vocabulary, propertyKey, ...props }: WrappedFieldProps & PropertyValueFieldProps) =>
     <Autocomplete
         label='Value'
         suggestions={getSuggestions(props.input.value, propertyKey, vocabulary)}
index 05bdb9706301daa2f7f2f94c95fa80cdb7db73d1..b001cb3eb1f1920e0b08ec1f50ff95e4e9aea1fb 100644 (file)
@@ -27,7 +27,8 @@ type CssRules = 'container' | 'closeIcon' | 'label' | 'buttonWrapper'
 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     container: {
         padding: theme.spacing.unit * 2,
-        borderBottom: `1px solid ${theme.palette.grey["200"]}`
+        borderBottom: `1px solid ${theme.palette.grey["200"]}`,
+        position: 'relative',
     },
     closeIcon: {
         position: 'absolute',
index 51ea3fa14793fe9ff3fe19b939b867c3db52a497..8d767b2b6affc816fcd57f2fcc94df7f2ca4c266 100644 (file)
@@ -11,7 +11,7 @@ import {
     WithStyles,
     Tooltip,
     InputAdornment, Input,
-    ClickAwayListener
+    Popover,
 } from '@material-ui/core';
 import SearchIcon from '@material-ui/icons/Search';
 import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown';
@@ -144,49 +144,99 @@ const handleDropdownClick = (e: React.MouseEvent, props: SearchBarViewProps) =>
 };
 
 export const SearchBarView = withStyles(styles)(
-    (props : SearchBarViewProps) => {
-        const { classes, isPopoverOpen } = props;
-        return (
-            <ClickAwayListener onClickAway={props.closeView}>
-                <Paper className={isPopoverOpen ? classes.containerSearchViewOpened : classes.container} >
-                    <form onSubmit={props.onSubmit}>
-                        <Input
-                            className={classes.input}
-                            onChange={props.onChange}
-                            placeholder="Search"
-                            value={props.searchValue}
-                            fullWidth={true}
-                            disableUnderline={true}
-                            onClick={e => handleInputClick(e, props)}
-                            onKeyDown={e => handleKeyDown(e, props)}
-                            startAdornment={
-                                <InputAdornment position="start">
-                                    <Tooltip title='Search'>
-                                        <IconButton type="submit">
-                                            <SearchIcon />
-                                        </IconButton>
-                                    </Tooltip>
-                                </InputAdornment>
-                            }
-                            endAdornment={
-                                <InputAdornment position="end">
-                                    <Tooltip title='Advanced search'>
-                                        <IconButton onClick={e => handleDropdownClick(e, props)}>
-                                            <ArrowDropDownIcon />
-                                        </IconButton>
-                                    </Tooltip>
-                                </InputAdornment>
-                            } />
-                    </form>
-                    <div className={classes.view}>
-                        {isPopoverOpen && getView({...props})}
+    class SearchBarView extends React.Component<SearchBarViewProps> {
+
+        viewAnchorRef = React.createRef<HTMLDivElement>();
+
+        render() {
+            const { children, ...props } = this.props;
+            const { classes } = props;
+            return (
+                <Paper className={classes.container}>
+                    <div ref={this.viewAnchorRef}>
+                        <form onSubmit={props.onSubmit}>
+                            <SearchInput {...props} />
+                        </form>
                     </div>
+                    <SearchViewContainer
+                        {...props}
+                        width={this.getViewWidth()}
+                        anchorEl={this.viewAnchorRef.current}>
+                        <form onSubmit={props.onSubmit}>
+                            <SearchInput
+                                {...props}
+                                autoFocus
+                                disableClickHandler />
+                        </form>
+                        {getView({ ...props })}
+                    </SearchViewContainer>
                 </Paper >
-            </ClickAwayListener>
-        );
+            );
+        }
+
+        getViewWidth() {
+            const { current } = this.viewAnchorRef;
+            return current ? current.offsetWidth : 0;
+        }
     }
+
 );
 
+const SearchInput = (props: SearchBarViewProps & { disableClickHandler?: boolean; autoFocus?: boolean }) => {
+    const { classes } = props;
+    return <Input
+        autoFocus={props.autoFocus}
+        className={classes.input}
+        onChange={props.onChange}
+        placeholder="Search"
+        value={props.searchValue}
+        fullWidth={true}
+        disableUnderline={true}
+        onClick={e => !props.disableClickHandler && handleInputClick(e, props)}
+        onKeyDown={e => handleKeyDown(e, props)}
+        startAdornment={
+            <InputAdornment position="start">
+                <Tooltip title='Search'>
+                    <IconButton type="submit">
+                        <SearchIcon />
+                    </IconButton>
+                </Tooltip>
+            </InputAdornment>
+        }
+        endAdornment={
+            <InputAdornment position="end">
+                <Tooltip title='Advanced search'>
+                    <IconButton onClick={e => handleDropdownClick(e, props)}>
+                        <ArrowDropDownIcon />
+                    </IconButton>
+                </Tooltip>
+            </InputAdornment>
+        } />;
+};
+
+const SearchViewContainer = (props: SearchBarViewProps & { width: number, anchorEl: HTMLElement | null, children: React.ReactNode }) =>
+    <Popover
+        PaperProps={{
+            style: { width: props.width }
+        }}
+        anchorEl={props.anchorEl}
+        anchorOrigin={{
+            vertical: 'top',
+            horizontal: 'center',
+        }}
+        transformOrigin={{
+            vertical: 'top',
+            horizontal: 'center',
+        }}
+        disableAutoFocus
+        open={props.isPopoverOpen}
+        onClose={props.closeView}>
+        {
+            props.children
+        }
+    </Popover>;
+
+
 const getView = (props: SearchBarViewProps) => {
     switch (props.currentView) {
         case SearchView.AUTOCOMPLETE:
index ce896dcc767091eb022f352889f3eb84a2d2b47f..0c164dbd26061e26c81aed12342ab97a1f2120bf 100644 (file)
@@ -4,9 +4,9 @@
 
 import * as React from "react";
 import { compose } from 'redux';
-import { withStyles, Dialog, DialogTitle, DialogContent, DialogActions, Button, StyleRulesCallback, WithStyles, Typography, Grid } from '@material-ui/core';
+import { withStyles, Dialog, DialogTitle, DialogContent, DialogActions, Button, StyleRulesCallback, WithStyles, Grid } from '@material-ui/core';
 import { WithDialogProps, withDialog } from "~/store/dialog/with-dialog";
-import { SSH_KEY_ATTRIBUTES_DIALOG } from '~/store/auth/auth-action';
+import { SSH_KEY_ATTRIBUTES_DIALOG } from '~/store/auth/auth-action-ssh';
 import { ArvadosTheme } from '~/common/custom-theme';
 import { SshKeyResource } from "~/models/ssh-key";
 
@@ -66,4 +66,4 @@ export const AttributesSshKeyDialog = compose(
                     </Button>
                 </DialogActions>
             </Dialog>
-    );
\ No newline at end of file
+    );
index 77c6cfdea9574bfdb66c2e47962f0ebed3c685e7..11ec159501a41f85928e97c6bfafde2993b6df3d 100644 (file)
@@ -6,7 +6,7 @@ import * as React from "react";
 import { compose } from 'redux';
 import { withStyles, Dialog, DialogTitle, DialogContent, DialogActions, Button, StyleRulesCallback, WithStyles } from '@material-ui/core';
 import { WithDialogProps, withDialog } from "~/store/dialog/with-dialog";
-import { SSH_KEY_PUBLIC_KEY_DIALOG } from '~/store/auth/auth-action';
+import { SSH_KEY_PUBLIC_KEY_DIALOG } from '~/store/auth/auth-action-ssh';
 import { ArvadosTheme } from '~/common/custom-theme';
 import { DefaultCodeSnippet } from '~/components/default-code-snippet/default-code-snippet';
 
@@ -52,4 +52,4 @@ export const PublicKeyDialog = compose(
                     </Button>
                 </DialogActions>
             </Dialog>
-    );
\ No newline at end of file
+    );
index 8077f21b0c7a156bdea265f4bf4f39b5c066f930..916e918c36a2475824d78a7663d40ed37e041cd5 100644 (file)
@@ -5,7 +5,7 @@ import { Dispatch, compose } from 'redux';
 import { connect } from "react-redux";
 import { ConfirmationDialog } from "~/components/confirmation-dialog/confirmation-dialog";
 import { withDialog, WithDialogProps } from "~/store/dialog/with-dialog";
-import { SSH_KEY_REMOVE_DIALOG, removeSshKey } from '~/store/auth/auth-action';
+import { SSH_KEY_REMOVE_DIALOG, removeSshKey } from '~/store/auth/auth-action-ssh';
 
 const mapDispatchToProps = (dispatch: Dispatch, props: WithDialogProps<any>) => ({
     onConfirm: () => {
@@ -17,4 +17,4 @@ const mapDispatchToProps = (dispatch: Dispatch, props: WithDialogProps<any>) =>
 export const RemoveSshKeyDialog = compose(
     withDialog(SSH_KEY_REMOVE_DIALOG),
     connect(null, mapDispatchToProps)
-)(ConfirmationDialog);
\ No newline at end of file
+)(ConfirmationDialog);
index 7f3e025f8dc7e97a7f1b7616a09d9013949260b1..52f13987d9fdf214853ec58e292d413dc6a228c7 100644 (file)
@@ -13,7 +13,7 @@ import { DetailsAttribute } from '~/components/details-attribute/details-attribu
 import { Process } from '~/store/processes/process';
 import { getProcessStatus, getProcessStatusColor } from '~/store/processes/process';
 import { formatDate } from '~/common/formatters';
-
+import { openWorkflow } from "~/store/process-panel/process-panel-actions";
 
 type CssRules = 'card' | 'iconHeader' | 'label' | 'value' | 'chip' | 'link' | 'content' | 'title' | 'avatar';
 
@@ -70,29 +70,33 @@ export interface ProcessInformationCardDataProps {
     onContextMenu: (event: React.MouseEvent<HTMLElement>) => void;
     openProcessInputDialog: (uuid: string) => void;
     navigateToOutput: (uuid: string) => void;
+    navigateToWorkflow: (uuid: string) => void;
 }
 
 type ProcessInformationCardProps = ProcessInformationCardDataProps & WithStyles<CssRules, true>;
 
 export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
-    ({ classes, process, onContextMenu, theme, openProcessInputDialog, navigateToOutput }: ProcessInformationCardProps) =>
-        <Card className={classes.card}>
+    ({ classes, process, onContextMenu, theme, openProcessInputDialog, navigateToOutput, navigateToWorkflow }: ProcessInformationCardProps) => {
+        const { container } = process;
+        const startedAt = container ? formatDate(container.startedAt) : 'N/A';
+        const finishedAt = container ? formatDate(container.finishedAt) : 'N/A';
+        return <Card className={classes.card}>
             <CardHeader
                 classes={{
                     content: classes.title,
                     avatar: classes.avatar
                 }}
-                avatar={<ProcessIcon className={classes.iconHeader} />}
+                avatar={<ProcessIcon className={classes.iconHeader}/>}
                 action={
                     <div>
                         <Chip label={getProcessStatus(process)}
-                            className={classes.chip}
-                            style={{ backgroundColor: getProcessStatusColor(getProcessStatus(process), theme as ArvadosTheme) }} />
+                              className={classes.chip}
+                              style={{backgroundColor: getProcessStatusColor(getProcessStatus(process), theme as ArvadosTheme)}}/>
                         <Tooltip title="More options" disableFocusListener>
                             <IconButton
                                 aria-label="More options"
                                 onClick={event => onContextMenu(event)}>
-                                <MoreOptionsIcon />
+                                <MoreOptionsIcon/>
                             </IconButton>
                         </Tooltip>
                     </div>
@@ -109,28 +113,34 @@ export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
                         <Typography noWrap variant="body2" color='inherit'>
                             {getDescription(process)}
                         </Typography>
-                    </Tooltip>} />
+                    </Tooltip>}/>
             <CardContent className={classes.content}>
                 <Grid container>
                     <Grid item xs={6}>
                         <DetailsAttribute classLabel={classes.label} classValue={classes.value}
-                            label='From' value={process.container ? formatDate(process.container.startedAt!) : 'N/A'} />
+                                          label='From'
+                                          value={process.container ? formatDate(startedAt) : 'N/A'}/>
                         <DetailsAttribute classLabel={classes.label} classValue={classes.value}
-                            label='To' value={process.container ? formatDate(process.container.finishedAt!) : 'N/A'} />
-                        <DetailsAttribute classLabel={classes.label} classValue={classes.link}
-                            label='Workflow' value='???' />
+                                          label='To'
+                                          value={process.container ? formatDate(finishedAt) : 'N/A'}/>
+                        {process.containerRequest.properties.templateUuid &&
+                        <DetailsAttribute label='Workflow' classLabel={classes.label} classValue={classes.link}
+                                          value={process.containerRequest.properties.templateUuid}
+                                          onValueClick={() => navigateToWorkflow(process.containerRequest.properties.templateUuid)}
+                        />}
                     </Grid>
                     <Grid item xs={6}>
                         <span onClick={() => navigateToOutput(process.containerRequest.outputUuid!)}>
-                            <DetailsAttribute classLabel={classes.link} label='Outputs' />
+                            <DetailsAttribute classLabel={classes.link} label='Outputs'/>
                         </span>
                         <span onClick={() => openProcessInputDialog(process.containerRequest.uuid)}>
-                            <DetailsAttribute classLabel={classes.link} label='Inputs' />
+                            <DetailsAttribute classLabel={classes.link} label='Inputs'/>
                         </span>
                     </Grid>
                 </Grid>
             </CardContent>
-        </Card>
+        </Card>;
+    }
 );
 
 const getDescription = (process: Process) =>
index 73f71e5e0a139b0fbbe007213b0f1d6705070868..5fb6390c3a9737e4f27830299a8dd1835a4c650f 100644 (file)
@@ -24,6 +24,7 @@ export interface ProcessPanelRootActionProps {
     onToggle: (status: string) => void;
     openProcessInputDialog: (uuid: string) => void;
     navigateToOutput: (uuid: string) => void;
+    navigateToWorkflow: (uuid: string) => void;
 }
 
 export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRootActionProps;
@@ -36,7 +37,9 @@ export const ProcessPanelRoot = ({ process, ...props }: ProcessPanelRootProps) =
                     process={process}
                     onContextMenu={event => props.onContextMenu(event, process)}
                     openProcessInputDialog={props.openProcessInputDialog}
-                    navigateToOutput={props.navigateToOutput} />
+                    navigateToOutput={props.navigateToOutput}
+                    navigateToWorkflow={props.navigateToWorkflow}
+            />
             </Grid>
             <Grid item sm={12} md={5}>
                 <SubprocessesCard
index 5672469677a3d29c5150a39f955ae71078d8c022..b389528033d89dfd282995610592bc76724a57ee 100644 (file)
@@ -11,7 +11,7 @@ import { matchProcessRoute } from '~/routes/routes';
 import { ProcessPanelRootDataProps, ProcessPanelRootActionProps, ProcessPanelRoot } from './process-panel-root';
 import { ProcessPanel as ProcessPanelState} from '~/store/process-panel/process-panel';
 import { groupBy } from 'lodash';
-import { toggleProcessPanelFilter, navigateToOutput } from '~/store/process-panel/process-panel-actions';
+import { toggleProcessPanelFilter, navigateToOutput, openWorkflow } from '~/store/process-panel/process-panel-actions';
 import { openProcessInputDialog } from '~/store/processes/process-input-actions';
 
 const mapStateToProps = ({ router, resources, processPanel }: RootState): ProcessPanelRootDataProps => {
@@ -35,7 +35,8 @@ const mapDispatchToProps = (dispatch: Dispatch): ProcessPanelRootActionProps =>
         dispatch<any>(toggleProcessPanelFilter(status));
     },
     openProcessInputDialog: (uuid) => dispatch<any>(openProcessInputDialog(uuid)),
-    navigateToOutput: (uuid) => dispatch<any>(navigateToOutput(uuid))
+    navigateToOutput: (uuid) => dispatch<any>(navigateToOutput(uuid)),
+    navigateToWorkflow: (uuid) => dispatch<any>(openWorkflow(uuid))
 });
 
 export const ProcessPanel = connect(mapStateToProps, mapDispatchToProps)(ProcessPanelRoot);
diff --git a/src/views/site-manager-panel/site-manager-panel-root.tsx b/src/views/site-manager-panel/site-manager-panel-root.tsx
new file mode 100644 (file)
index 0000000..2b6d3c9
--- /dev/null
@@ -0,0 +1,183 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import {
+    Card,
+    CardContent,
+    CircularProgress,
+    Grid,
+    StyleRulesCallback,
+    Table,
+    TableBody,
+    TableCell,
+    TableHead,
+    TableRow,
+    Typography,
+    WithStyles,
+    withStyles
+} from '@material-ui/core';
+import { ArvadosTheme } from '~/common/custom-theme';
+import { Session, SessionStatus } from "~/models/session";
+import Button from "@material-ui/core/Button";
+import { compose, Dispatch } from "redux";
+import { Field, FormErrors, InjectedFormProps, reduxForm, reset, stopSubmit } from "redux-form";
+import { TextField } from "~/components/text-field/text-field";
+import { addSession } from "~/store/auth/auth-action-session";
+import { SITE_MANAGER_REMOTE_HOST_VALIDATION } from "~/validators/validators";
+
+type CssRules = 'root' | 'link' | 'buttonContainer' | 'table' | 'tableRow' |
+    'remoteSiteInfo' | 'buttonAdd' | 'buttonLoggedIn' | 'buttonLoggedOut' |
+    'statusCell';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+    root: {
+       width: '100%',
+       overflow: 'auto'
+    },
+    link: {
+        color: theme.palette.primary.main,
+        textDecoration: 'none',
+        margin: '0px 4px'
+    },
+    buttonContainer: {
+        textAlign: 'right'
+    },
+    table: {
+        marginTop: theme.spacing.unit
+    },
+    tableRow: {
+        '& td, th': {
+            whiteSpace: 'nowrap'
+        }
+    },
+    statusCell: {
+        minWidth: 160
+    },
+    remoteSiteInfo: {
+        marginTop: 20
+    },
+    buttonAdd: {
+        marginLeft: 10,
+        marginTop: theme.spacing.unit * 3
+    },
+    buttonLoggedIn: {
+        minHeight: theme.spacing.unit,
+        padding: 5,
+        color: '#fff',
+        backgroundColor: '#009966',
+        '&:hover': {
+            backgroundColor: '#008450',
+        }
+    },
+    buttonLoggedOut: {
+        minHeight: theme.spacing.unit,
+        padding: 5,
+        color: '#000',
+        backgroundColor: '#FFC414',
+        '&:hover': {
+            backgroundColor: '#eaaf14',
+        }
+    }
+});
+
+export interface SiteManagerPanelRootActionProps {
+    toggleSession: (session: Session) => void;
+}
+
+export interface SiteManagerPanelRootDataProps {
+    sessions: Session[];
+}
+
+type SiteManagerPanelRootProps = SiteManagerPanelRootDataProps & SiteManagerPanelRootActionProps & WithStyles<CssRules> & InjectedFormProps;
+const SITE_MANAGER_FORM_NAME = 'siteManagerForm';
+
+const submitSession = (remoteHost: string) =>
+    (dispatch: Dispatch) => {
+        dispatch<any>(addSession(remoteHost)).then(() => {
+            dispatch(reset(SITE_MANAGER_FORM_NAME));
+        }).catch((e: any) => {
+            const errors = {
+                remoteHost: e
+            } as FormErrors;
+            dispatch(stopSubmit(SITE_MANAGER_FORM_NAME, errors));
+        });
+    };
+
+export const SiteManagerPanelRoot = compose(
+    reduxForm<{remoteHost: string}>({
+        form: SITE_MANAGER_FORM_NAME,
+        touchOnBlur: false,
+        onSubmit: (data, dispatch) => {
+            dispatch(submitSession(data.remoteHost));
+        }
+    }),
+    withStyles(styles))
+    (({ classes, sessions, handleSubmit, toggleSession }: SiteManagerPanelRootProps) =>
+        <Card className={classes.root}>
+            <CardContent>
+                <Grid container direction="row">
+                    <Grid item xs={12}>
+                        <Typography variant='body1' paragraph={true} >
+                            You can log in to multiple Arvados sites here, then use the multi-site search page to search collections and projects on all sites at once.
+                        </Typography>
+                    </Grid>
+                </Grid>
+                <Grid item xs={12}>
+                    {sessions.length > 0 && <Table className={classes.table}>
+                        <TableHead>
+                            <TableRow className={classes.tableRow}>
+                                <TableCell>Cluster ID</TableCell>
+                                <TableCell>Username</TableCell>
+                                <TableCell>Email</TableCell>
+                                <TableCell>Status</TableCell>
+                            </TableRow>
+                        </TableHead>
+                        <TableBody>
+                            {sessions.map((session, index) => {
+                                const validating = session.status === SessionStatus.BEING_VALIDATED;
+                                return <TableRow key={index} className={classes.tableRow}>
+                                    <TableCell>{session.clusterId}</TableCell>
+                                    <TableCell>{validating ? <CircularProgress size={20}/> : session.username}</TableCell>
+                                    <TableCell>{validating ? <CircularProgress size={20}/> : session.email}</TableCell>
+                                    <TableCell className={classes.statusCell}>
+                                        <Button fullWidth
+                                            disabled={validating || session.status === SessionStatus.INVALIDATED || session.active}
+                                            className={session.loggedIn ? classes.buttonLoggedIn : classes.buttonLoggedOut}
+                                            onClick={() => toggleSession(session)}>
+                                            {validating ? "Validating" : (session.loggedIn ? "Logged in" : "Logged out")}
+                                        </Button>
+                                    </TableCell>
+                                </TableRow>;
+                            })}
+                        </TableBody>
+                    </Table>}
+                </Grid>
+                <form onSubmit={handleSubmit}>
+                    <Grid container direction="row">
+                        <Grid item xs={12}>
+                            <Typography variant='body1' paragraph={true} className={classes.remoteSiteInfo}>
+                                To add a remote Arvados site, paste the remote site's host here (see "ARVADOS_API_HOST" on the "current token" page).
+                            </Typography>
+                        </Grid>
+                        <Grid item xs={8}>
+                            <Field
+                                name='remoteHost'
+                                validate={SITE_MANAGER_REMOTE_HOST_VALIDATION}
+                                component={TextField}
+                                placeholder="zzzz.arvadosapi.com"
+                                margin="normal"
+                                label="New cluster"
+                                autoFocus/>
+                        </Grid>
+                        <Grid item xs={3}>
+                            <Button type="submit" variant="contained" color="primary"
+                                className={classes.buttonAdd}>
+                                {"ADD"}</Button>
+                        </Grid>
+                    </Grid>
+                </form>
+            </CardContent>
+        </Card>
+    );
diff --git a/src/views/site-manager-panel/site-manager-panel.tsx b/src/views/site-manager-panel/site-manager-panel.tsx
new file mode 100644 (file)
index 0000000..4532e85
--- /dev/null
@@ -0,0 +1,27 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { RootState } from '~/store/store';
+import { Dispatch } from 'redux';
+import { connect } from 'react-redux';
+import {
+    SiteManagerPanelRoot, SiteManagerPanelRootActionProps,
+    SiteManagerPanelRootDataProps
+} from "~/views/site-manager-panel/site-manager-panel-root";
+import { Session } from "~/models/session";
+import { toggleSession } from "~/store/auth/auth-action-session";
+
+const mapStateToProps = (state: RootState): SiteManagerPanelRootDataProps => {
+    return {
+        sessions: state.auth.sessions
+    };
+};
+
+const mapDispatchToProps = (dispatch: Dispatch): SiteManagerPanelRootActionProps => ({
+    toggleSession: (session: Session) => {
+        dispatch<any>(toggleSession(session));
+    }
+});
+
+export const SiteManagerPanel = connect(mapStateToProps, mapDispatchToProps)(SiteManagerPanelRoot);
index 4e800296d076fb3f368ac9d98959d3d00520a18b..6575a9cc179aad9c8318303dfcc5faade6766379 100644 (file)
@@ -5,7 +5,7 @@
 import { RootState } from '~/store/store';
 import { Dispatch } from 'redux';
 import { connect } from 'react-redux';
-import { openSshKeyCreateDialog, openPublicKeyDialog } from '~/store/auth/auth-action';
+import { openSshKeyCreateDialog, openPublicKeyDialog } from '~/store/auth/auth-action-ssh';
 import { openSshKeyContextMenu } from '~/store/context-menu/context-menu-actions';
 import { SshKeyPanelRoot, SshKeyPanelRootDataProps, SshKeyPanelRootActionProps } from '~/views/ssh-key-panel/ssh-key-panel-root';
 
@@ -28,4 +28,4 @@ const mapDispatchToProps = (dispatch: Dispatch): SshKeyPanelRootActionProps => (
     }
 });
 
-export const SshKeyPanel = connect(mapStateToProps, mapDispatchToProps)(SshKeyPanelRoot);
\ No newline at end of file
+export const SshKeyPanel = connect(mapStateToProps, mapDispatchToProps)(SshKeyPanelRoot);
index dda2889febd72d0f2e1ce53bdae5077ebce1daef..85a204e3ffff1683f13e0d731bfc20053c687d75 100644 (file)
@@ -29,10 +29,11 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     },
 });
 
-const mapStateToProps = ({ virtualMachines }: RootState) => {
+const mapStateToProps = (state: RootState) => {
     return {
-        logins: virtualMachines.logins,
-        ...virtualMachines
+        logins: state.virtualMachines.logins,
+        userUuid: state.auth.user!.uuid,
+        ...state.virtualMachines
     };
 };
 
@@ -46,6 +47,7 @@ const mapDispatchToProps = (dispatch: Dispatch): Pick<VirtualMachinesPanelAction
 interface VirtualMachinesPanelDataProps {
     virtualMachines: ListResults<any>;
     logins: VirtualMachineLogins;
+    userUuid: string;
 }
 
 interface VirtualMachinesPanelActionProps {
@@ -98,7 +100,7 @@ const virtualMachinesTable = (props: VirtualMachineProps) =>
                 <TableRow key={index}>
                     <TableCell>{it.uuid}</TableCell>
                     <TableCell>{it.hostname}</TableCell>
-                    <TableCell>["{props.logins.items[0].username}"]</TableCell>
+                    <TableCell>["{props.logins.items.map(it => it.userUuid === props.userUuid ? it.username : '')}"]</TableCell>
                     <TableCell className={props.classes.moreOptions}>
                         <Tooltip title="More options" disableFocusListener>
                             <IconButton onClick={event => props.onOptionsMenuOpen(event, it)} className={props.classes.moreOptionsButton}>
index fbb1f23f51cb33069167cb763ea76833eed6e4bf..5cb4565ee3af3c4f24909e24bfe884bfe2809a5c 100644 (file)
@@ -57,10 +57,11 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     }
 });
 
-const mapStateToProps = ({ virtualMachines }: RootState) => {
+const mapStateToProps = (state: RootState) => {
     return {
-        requestedDate: virtualMachines.date,
-        ...virtualMachines
+        requestedDate: state.virtualMachines.date,
+        userUuid: state.auth.user!.uuid,
+        ...state.virtualMachines
     };
 };
 
@@ -72,6 +73,7 @@ const mapDispatchToProps = (dispatch: Dispatch): Pick<VirtualMachinesPanelAction
 interface VirtualMachinesPanelDataProps {
     requestedDate: string;
     virtualMachines: ListResults<any>;
+    userUuid: string;
     links: ListResults<any>;
 }
 
@@ -166,11 +168,11 @@ const virtualMachinesTable = (props: VirtualMachineProps) =>
             {props.virtualMachines.items.map((it, index) =>
                 <TableRow key={index}>
                     <TableCell>{it.hostname}</TableCell>
-                    <TableCell>{getUsername(props.links)}</TableCell>
-                    <TableCell>ssh {getUsername(props.links)}@{it.hostname}.arvados</TableCell>
+                    <TableCell>{getUsername(props.links, props.userUuid)}</TableCell>
+                    <TableCell>ssh {getUsername(props.links, props.userUuid)}@{it.hostname}.arvados</TableCell>
                     <TableCell>
-                        <a href={`https://workbench.c97qk.arvadosapi.com${it.href}/webshell/${getUsername(props.links)}`} target="_blank" className={props.classes.link}>
-                            Log in as {getUsername(props.links)}
+                        <a href={`https://workbench.c97qk.arvadosapi.com${it.href}/webshell/${getUsername(props.links, props.userUuid)}`} target="_blank" className={props.classes.link}>
+                            Log in as {getUsername(props.links, props.userUuid)}
                         </a>
                     </TableCell>
                 </TableRow>
@@ -178,8 +180,8 @@ const virtualMachinesTable = (props: VirtualMachineProps) =>
         </TableBody>
     </Table>;
 
-const getUsername = (links: ListResults<any>) => {
-    return links.items[0].properties.username;
+const getUsername = (links: ListResults<any>, userUuid: string) => {
+    return links.items.map(it => it.tailUuid === userUuid ? it.properties.username : '');
 };
 
 const CardSSHSection = (props: VirtualMachineProps) =>
index 6c7c24386205310611b65b3df22029911c8602c0..cca374d6738e9645f5183871252a20d66311a979 100644 (file)
@@ -45,6 +45,7 @@ import SplitterLayout from 'react-splitter-layout';
 import { WorkflowPanel } from '~/views/workflow-panel/workflow-panel';
 import { SearchResultsPanel } from '~/views/search-results-panel/search-results-panel';
 import { SshKeyPanel } from '~/views/ssh-key-panel/ssh-key-panel';
+import { SiteManagerPanel } from "~/views/site-manager-panel/site-manager-panel";
 import { MyAccountPanel } from '~/views/my-account-panel/my-account-panel';
 import { SharingDialog } from '~/views-components/sharing-dialog/sharing-dialog';
 import { AdvancedTabDialog } from '~/views-components/advanced-tab-dialog/advanced-tab-dialog';
@@ -163,6 +164,7 @@ export const WorkbenchPanel =
                                 <Route path={Routes.REPOSITORIES} component={RepositoriesPanel} />
                                 <Route path={Routes.SSH_KEYS_USER} component={SshKeyPanel} />
                                 <Route path={Routes.SSH_KEYS_ADMIN} component={SshKeyPanel} />
+                                <Route path={Routes.SITE_MANAGER} component={SiteManagerPanel} />
                                 <Route path={Routes.KEEP_SERVICES} component={KeepServicePanel} />
                                 <Route path={Routes.USERS} component={UserPanel} />
                                 <Route path={Routes.COMPUTE_NODES} component={ComputeNodePanel} />
@@ -235,4 +237,4 @@ export const WorkbenchPanel =
             <UserManageDialog />
             <VirtualMachineAttributesDialog />
         </Grid>
-    );
\ No newline at end of file
+    );
index d3d6396d479953c17c56aa7ebbfca727d5cc2661..b642d71aed7c27c2110ba48c69f88c85f0811210 100644 (file)
--- a/yarn.lock
+++ b/yarn.lock
     csstype "^2.0.0"
     indefinite-observable "^1.0.1"
 
+"@types/jssha@0.0.29":
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/@types/jssha/-/jssha-0.0.29.tgz#95e83dba98787ff796d2d5f37a1925abf41bc9cb"
+  integrity sha1-leg9uph4f/eW0tXzehklq/Qbycs=
+
 "@types/lodash@4.14.116":
   version "4.14.116"
   resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.116.tgz#5ccf215653e3e8c786a58390751033a9adca0eb9"
@@ -5540,6 +5545,11 @@ jss@^9.3.3:
     symbol-observable "^1.1.0"
     warning "^3.0.0"
 
+jssha@2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/jssha/-/jssha-2.3.1.tgz#147b2125369035ca4b2f7d210dc539f009b3de9a"
+  integrity sha1-FHshJTaQNcpLL30hDcU58Amz3po=
+
 keycode@^2.1.9:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/keycode/-/keycode-2.2.0.tgz#3d0af56dc7b8b8e5cba8d0a97f107204eec22b04"