argo-cd

1
import {DataLoader, Page as ArgoPage, Toolbar, Utils} from 'argo-ui';
2
import * as React from 'react';
3
import {BehaviorSubject, Observable} from 'rxjs';
4
import {map} from 'rxjs/operators';
5

6
import {Context, ContextApis} from '../../context';
7
import {services} from '../../services';
8
import requests from '../../services/requests';
9

10
const mostRecentLoggedIn = new BehaviorSubject<boolean>(false);
11

12
import './page.scss';
13

14
function isLoggedIn(): Observable<boolean> {
15
    services.users.get().then(info => mostRecentLoggedIn.next(info.loggedIn));
16
    return mostRecentLoggedIn;
17
}
18

19
export const AddAuthToToolbar = (init: Toolbar | Observable<Toolbar>, ctx: ContextApis): Observable<Toolbar> => {
20
    return Utils.toObservable(init).pipe(
21
        map(toolbar => {
22
            toolbar = toolbar || {};
23
            toolbar.tools = [
24
                toolbar.tools,
25
                <DataLoader key='loginPanel' load={() => isLoggedIn()}>
26
                    {loggedIn =>
27
                        loggedIn ? (
28
                            <button className='login-logout-button' key='logout' onClick={() => (window.location.href = requests.toAbsURL('/auth/logout'))}>
29
                                Log out
30
                            </button>
31
                        ) : (
32
                            <button className='login-logout-button' key='login' onClick={() => ctx.navigation.goto(`/login?return_url=${encodeURIComponent(location.href)}`)}>
33
                                Log in
34
                            </button>
35
                        )
36
                    }
37
                </DataLoader>
38
            ];
39
            return toolbar;
40
        })
41
    );
42
};
43

44
interface PageProps extends React.Props<any> {
45
    title: string;
46
    hideAuth?: boolean;
47
    toolbar?: Toolbar | Observable<Toolbar>;
48
    topBarTitle?: string;
49
    useTitleOnly?: boolean;
50
}
51

52
export const Page = (props: PageProps) => {
53
    const ctx = React.useContext(Context);
54
    return (
55
        <DataLoader load={() => services.viewPreferences.getPreferences()}>
56
            {pref => (
57
                <div className={`${props.hideAuth ? 'page-wrapper' : ''} ${!!pref.hideSidebar ? 'sb-page-wrapper__sidebar-collapsed' : 'sb-page-wrapper'}`}>
58
                    <ArgoPage
59
                        title={props.title}
60
                        children={props.children}
61
                        topBarTitle={props.topBarTitle}
62
                        useTitleOnly={props.useTitleOnly}
63
                        toolbar={!props.hideAuth ? AddAuthToToolbar(props.toolbar, ctx) : props.toolbar}
64
                    />
65
                </div>
66
            )}
67
        </DataLoader>
68
    );
69
};
70