argo-cd

1
import * as PropTypes from 'prop-types';
2
import * as React from 'react';
3
import {BehaviorSubject, Observable} from 'rxjs';
4
import {map} from 'rxjs/operators';
5

6
import {AppContext, Consumer} from '../context';
7

8
export const Query = (props: {children: (params: URLSearchParams) => React.ReactNode}) => (
9
    <Consumer>{ctx => props.children(new URLSearchParams(ctx.history.location.search))}</Consumer>
10
);
11

12
export interface ObservableQueryProps {
13
    children: (params: Observable<URLSearchParams>) => React.ReactNode;
14
}
15

16
export class ObservableQuery extends React.Component<ObservableQueryProps> {
17
    public static contextTypes = {
18
        router: PropTypes.object
19
    };
20

21
    private search: BehaviorSubject<string>;
22
    private stopListen: () => void;
23

24
    constructor(props: ObservableQueryProps) {
25
        super(props);
26
    }
27

28
    public componentWillMount() {
29
        this.search = new BehaviorSubject(this.appContext.router.history.location.search);
30
        this.stopListen = this.appContext.router.history.listen(location => {
31
            this.search.next(location.search);
32
        });
33
    }
34

35
    public componentWillUnmount() {
36
        if (this.stopListen) {
37
            this.stopListen();
38
            this.stopListen = null;
39
        }
40
    }
41

42
    public render() {
43
        return this.props.children(this.search.pipe(map(search => new URLSearchParams(search))));
44
    }
45

46
    private get appContext(): AppContext {
47
        return this.context as AppContext;
48
    }
49
}
50