import React from 'react';
import createReactClass from 'create-react-class';
import Reflux from 'reflux';
import {getRepositories} from 'app/actionCreators/repositories';
import RepositoryActions from 'app/actions/repositoryActions';
import {Client} from 'app/api';
import RepositoryStore from 'app/stores/repositoryStore';
import {Organization, Repository} from 'app/types';
import getDisplayName from 'app/utils/getDisplayName';
type DependentProps = {
api: Client;
organization: Organization;
};
type InjectedProps = {
repositories?: Repository[];
repositoriesLoading?: boolean;
repositoriesError?: Error;
};
const INITIAL_STATE: InjectedProps = {
repositories: undefined,
repositoriesLoading: undefined,
repositoriesError: undefined,
};
const withRepositories =
(
WrappedComponent: React.ComponentType
) =>
createReactClass<
Omit
& Partial & DependentProps,
InjectedProps
>({
displayName: `withRepositories(${getDisplayName(WrappedComponent)})`,
mixins: [Reflux.listenTo(RepositoryStore, 'onStoreUpdate') as any],
getInitialState() {
const {organization} = this.props as P & DependentProps;
const orgSlug = organization.slug;
const repoData = RepositoryStore.get();
if (repoData.orgSlug !== orgSlug) {
RepositoryActions.resetRepositories();
}
return repoData.orgSlug === orgSlug
? {...INITIAL_STATE, ...repoData}
: {...INITIAL_STATE};
},
componentDidMount() {
// XXX(leedongwei): Do not move this function call unless you modify the
// unit test named "prevents repeated calls"
this.fetchRepositories();
},
fetchRepositories() {
const {api, organization} = this.props as P & DependentProps;
const orgSlug = organization.slug;
const repoData = RepositoryStore.get();
// XXX(leedongwei): Do not check the orgSlug here. It would have been
// verified at `getInitialState`. The short-circuit hack in actionCreator
// does not update the orgSlug in the store.
if (
(!repoData.repositories && !repoData.repositoriesLoading) ||
repoData.repositoriesError
) {
getRepositories(api, {orgSlug});
}
},
onStoreUpdate() {
const repoData = RepositoryStore.get();
this.setState({...repoData});
},
render() {
return ;
},
});
export default withRepositories;