import {Fragment} from 'react'; import {RouteComponentProps} from 'react-router'; import {Location} from 'history'; import {CommitRow} from 'sentry/components/commitRow'; import {Body, Main} from 'sentry/components/layouts/thirds'; import LoadingIndicator from 'sentry/components/loadingIndicator'; import Pagination from 'sentry/components/pagination'; import {Panel, PanelBody, PanelHeader} from 'sentry/components/panels'; import {t} from 'sentry/locale'; import {Commit, Organization, Project, Repository} from 'sentry/types'; import {formatVersion} from 'sentry/utils/formatters'; import routeTitleGen from 'sentry/utils/routeTitle'; import AsyncView from 'sentry/views/asyncView'; import {getCommitsByRepository, getQuery, getReposToRender} from '../utils'; import EmptyState from './emptyState'; import RepositorySwitcher from './repositorySwitcher'; import withReleaseRepos from './withReleaseRepos'; type Props = RouteComponentProps<{orgId: string; release: string}, {}> & { location: Location; orgSlug: Organization['slug']; projectSlug: Project['slug']; release: string; releaseRepos: Repository[]; activeReleaseRepo?: Repository; } & AsyncView['props']; type State = { commits: Commit[]; } & AsyncView['state']; class Commits extends AsyncView { getTitle() { const {params, projectSlug} = this.props; const {orgId} = params; return routeTitleGen( t('Commits - Release %s', formatVersion(params.release)), orgId, false, projectSlug ); } getDefaultState(): State { return { ...super.getDefaultState(), commits: [], }; } componentDidUpdate(prevProps: Props, prevState: State) { if (prevProps.activeReleaseRepo?.name !== this.props.activeReleaseRepo?.name) { this.remountComponent(); return; } super.componentDidUpdate(prevProps, prevState); } getEndpoints(): ReturnType { const { projectSlug, activeReleaseRepo: activeRepository, location, orgSlug, release, } = this.props; const query = getQuery({location, activeRepository}); return [ [ 'commits', `/projects/${orgSlug}/${projectSlug}/releases/${encodeURIComponent( release )}/commits/`, {query}, ], ]; } renderLoading() { return this.renderBody(); } renderContent() { const {commits, commitsPageLinks, loading} = this.state; const {activeReleaseRepo} = this.props; if (loading) { return ; } if (!commits.length) { return ( {!activeReleaseRepo ? t('There are no commits associated with this release.') : t( 'There are no commits associated with this release in the %s repository.', activeReleaseRepo.name )} ); } const commitsByRepository = getCommitsByRepository(commits); const reposToRender = getReposToRender(Object.keys(commitsByRepository)); return ( {reposToRender.map(repoName => ( {repoName} {commitsByRepository[repoName]?.map(commit => ( ))} ))} ); } renderBody() { const {location, router, activeReleaseRepo, releaseRepos} = this.props; return ( {releaseRepos.length > 1 && ( )} {this.renderContent()} ); } renderComponent() { return (

{super.renderComponent()}

); } } export default withReleaseRepos(Commits);