github.com/argoproj/argo-cd/v3@v3.2.1/ui/src/app/shared/components/page/page.tsx (about) 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 };