import * as tslib_1 from "tslib";
import MapSearchIcon from 'mdi-react/MapSearchIcon';
import * as React from 'react';
import { Route, Switch } from 'react-router';
import { Redirect } from 'react-router-dom';
import { Subscription } from 'rxjs';
import { map } from 'rxjs/operators';
import { HeroPage } from '../../components/HeroPage';
import { siteFlags } from '../../site/backend';
import { UserAccountSidebar } from './UserAccountSidebar';
const NotFoundPage = () => React.createElement(HeroPage, { icon: MapSearchIcon, title: "404: Not Found" });
/**
 * Renders a layout of a sidebar and a content area to display user settings.
 */
export class UserAccountArea extends React.Component {
    constructor() {
        super(...arguments);
        this.state = { externalAuthEnabled: false };
        this.subscriptions = new Subscription();
        this.setNewToken = (value) => {
            this.setState({ newlyCreatedAccessToken: value });
        };
    }
    componentDidMount() {
        this.subscriptions.add(siteFlags.pipe(map(({ externalAuthEnabled }) => externalAuthEnabled)).subscribe(externalAuthEnabled => {
            this.setState({ externalAuthEnabled });
        }));
    }
    componentWillUnmount() {
        this.subscriptions.unsubscribe();
    }
    render() {
        if (!this.props.user) {
            return null;
        }
        // If not logged in, redirect to sign in
        if (!this.props.authenticatedUser) {
            const newUrl = new URL(window.location.href);
            newUrl.pathname = '/sign-in';
            // Return to the current page after sign up/in.
            newUrl.searchParams.set('returnTo', window.location.href);
            return React.createElement(Redirect, { to: newUrl.pathname + newUrl.search });
        }
        if (this.props.authenticatedUser.id !== this.props.user.id && !this.props.user.viewerCanAdminister) {
            return (React.createElement(HeroPage, { icon: MapSearchIcon, title: "403: Forbidden", subtitle: "You are not authorized to view or edit this user's settings." }));
        }
        if (this.props.match.isExact) {
            return React.createElement(Redirect, { to: `${this.props.match.path}/profile` });
        }
        const _a = this.props, { children } = _a, props = tslib_1.__rest(_a, ["children"]);
        const context = Object.assign({}, props, { newToken: this.state.newlyCreatedAccessToken, user: this.props.user, onDidCreateAccessToken: this.setNewToken, onDidPresentNewToken: this.setNewToken, externalAuthEnabled: this.state.externalAuthEnabled });
        return (React.createElement("div", { className: "user-settings-area area" },
            React.createElement(UserAccountSidebar, Object.assign({ externalAuthEnabled: this.state.externalAuthEnabled, items: this.props.sideBarItems }, this.props, { className: "area__sidebar" })),
            React.createElement("div", { className: "area__content" },
                React.createElement(Switch, null,
                    this.props.routes.map(({ path, exact, render, condition = () => true }) => condition(context) && (React.createElement(Route, { path: this.props.match.url + path, key: "hardcoded-key" // see https://github.com/ReactTraining/react-router/issues/4578#issuecomment-334489490
                        , exact: exact, 
                        // tslint:disable-next-line:jsx-no-lambda
                        render: routeComponentProps => render(Object.assign({}, context, routeComponentProps)) }))),
                    React.createElement(Route, { component: NotFoundPage, key: "hardcoded-key" })))));
    }
}
//# sourceMappingURL=UserAccountArea.js.map