import { LoadingSpinner } from '@sourcegraph/react-loading-spinner';
import SettingsIcon from 'mdi-react/SettingsIcon';
import * as React from 'react';
import { Link } from 'react-router-dom';
import { Subscription } from 'rxjs';
import { map } from 'rxjs/operators';
import { dataOrThrowErrors, gql, queryGraphQL } from '../backend/graphql';
import { FilteredConnection } from '../components/FilteredConnection';
import { PageTitle } from '../components/PageTitle';
import { RepoLink } from '../repo/RepoLink';
import { fetchAllRepositoriesAndPollIfAnyCloning } from '../site-admin/backend';
import { eventLogger } from '../tracking/eventLogger';
import { numberWithCommas, pluralize } from '../util/strings';
const RepositoryNode = ({ node: repo }) => (React.createElement("li", { key: repo.id, className: "list-group-item py-2" },
    React.createElement(RepoLink, { repoPath: repo.name, to: repo.url, className: "explore-page__item-path" }),
    repo.mirrorInfo.cloneInProgress && (React.createElement("small", { className: "ml-2 text-success" },
        React.createElement(LoadingSpinner, { className: "icon-inline" }),
        " Cloning"))));
/**
 * A page for exploring the repositories on this site.
 */
export class ExplorePage extends React.PureComponent {
    constructor() {
        super(...arguments);
        this.state = {};
        this.subscriptions = new Subscription();
    }
    componentDidMount() {
        eventLogger.logViewEvent('Explore');
        this.subscriptions.add(fetchDisabledRepositoriesCount().subscribe(disabledRepositoriesCount => this.setState({ disabledRepositoriesCount })));
    }
    componentWillUnmount() {
        this.subscriptions.unsubscribe();
    }
    render() {
        return (React.createElement("div", { className: "explore-page area" },
            React.createElement("div", { className: "area__content" },
                React.createElement(PageTitle, { title: "Repositories" }),
                React.createElement("h2", null, "Explore repositories"),
                this.props.user &&
                    this.props.user.siteAdmin && (React.createElement("div", null,
                    React.createElement(Link, { to: "/site-admin/repositories", className: "btn btn-primary" },
                        React.createElement(SettingsIcon, { className: "icon-inline" }),
                        " Configure repositories"))),
                this.props.user &&
                    this.props.user.siteAdmin &&
                    typeof this.state.disabledRepositoriesCount === 'number' &&
                    this.state.disabledRepositoriesCount > 0 && (React.createElement("div", { className: "alert alert-info mt-3 mb-2" },
                    numberWithCommas(this.state.disabledRepositoriesCount),
                    ' ',
                    pluralize('disabled repository is', this.state.disabledRepositoriesCount, 'disabled repositories are'),
                    ' ',
                    "not shown here.",
                    ' ',
                    React.createElement(Link, { to: "/site-admin/repositories?filter=disabled" }, "Enable more repositories in site admin."))),
                React.createElement(FilteredConnection, { className: "mt-3", listClassName: "list-group list-group-flush", noun: "repository", pluralNoun: "repositories", queryConnection: fetchAllRepositoriesAndPollIfAnyCloning, nodeComponent: RepositoryNode, history: this.props.history, location: this.props.location }))));
    }
}
function fetchDisabledRepositoriesCount() {
    return queryGraphQL(gql `
        query Overview {
            repositories(enabled: false, disabled: true, first: 100) {
                totalCount(precise: true)
            }
        }
    `).pipe(map(dataOrThrowErrors), map(data => data.repositories.totalCount));
}
//# sourceMappingURL=ExplorePage.js.map