forked from github/plane
1e152c666c
* chore: moved app & space from apps to root * chore: modified workspace configuration * chore: modified dockerfiles for space and web * chore: modified icons for space * feat: updated files for new svg icons supported by next-images * chore: added /spaces base path for next * chore: added compose config for space * chore: updated husky configuration * chore: updated workflows for new configuration * chore: changed app name to web * fix: resolved build errors with web * chore: reset file tracing root for both projects * chore: added nginx config for deploy * fix: eslint and tsconfig settings for space app * husky setup fixes based on new dir * eslint fixes * prettier formatting --------- Co-authored-by: Henit Chobisa <chobisa.henit@gmail.com>
106 lines
3.3 KiB
TypeScript
106 lines
3.3 KiB
TypeScript
import { FC, useEffect } from "react";
|
|
|
|
import { useRouter } from "next/router";
|
|
|
|
import useSWR from "swr";
|
|
|
|
// react-hook-form
|
|
import { UseFormSetValue } from "react-hook-form";
|
|
// services
|
|
import GithubIntegrationService from "services/integration/github.service";
|
|
// ui
|
|
import { Loader, PrimaryButton, SecondaryButton } from "components/ui";
|
|
// types
|
|
import { IUserDetails, TFormValues, TIntegrationSteps } from "components/integration";
|
|
// fetch-keys
|
|
import { GITHUB_REPOSITORY_INFO } from "constants/fetch-keys";
|
|
|
|
type Props = {
|
|
selectedRepo: any;
|
|
handleStepChange: (value: TIntegrationSteps) => void;
|
|
setUsers: React.Dispatch<React.SetStateAction<IUserDetails[]>>;
|
|
setValue: UseFormSetValue<TFormValues>;
|
|
};
|
|
|
|
export const GithubRepoDetails: FC<Props> = ({
|
|
selectedRepo,
|
|
handleStepChange,
|
|
setUsers,
|
|
setValue,
|
|
}) => {
|
|
const router = useRouter();
|
|
const { workspaceSlug } = router.query;
|
|
|
|
const { data: repoInfo } = useSWR(
|
|
workspaceSlug && selectedRepo
|
|
? GITHUB_REPOSITORY_INFO(workspaceSlug as string, selectedRepo.name)
|
|
: null,
|
|
workspaceSlug && selectedRepo
|
|
? () =>
|
|
GithubIntegrationService.getGithubRepoInfo(workspaceSlug as string, {
|
|
owner: selectedRepo.owner.login,
|
|
repo: selectedRepo.name,
|
|
})
|
|
: null
|
|
);
|
|
|
|
useEffect(() => {
|
|
if (!repoInfo) return;
|
|
|
|
setValue("collaborators", repoInfo.collaborators);
|
|
|
|
const fetchedUsers = repoInfo.collaborators.map((collaborator) => ({
|
|
username: collaborator.login,
|
|
import: "map",
|
|
email: "",
|
|
}));
|
|
setUsers(fetchedUsers);
|
|
}, [repoInfo, setUsers, setValue]);
|
|
|
|
return (
|
|
<div className="mt-6">
|
|
{repoInfo ? (
|
|
repoInfo.issue_count > 0 ? (
|
|
<div className="flex items-center justify-between gap-4">
|
|
<div>
|
|
<div className="font-medium">Repository Details</div>
|
|
<div className="text-sm text-custom-text-200">Import completed. We have found:</div>
|
|
</div>
|
|
<div className="mt-4 flex gap-16">
|
|
<div className="flex-shrink-0 text-center">
|
|
<p className="text-3xl font-bold">{repoInfo.issue_count}</p>
|
|
<h6 className="text-sm text-custom-text-200">Issues</h6>
|
|
</div>
|
|
<div className="flex-shrink-0 text-center">
|
|
<p className="text-3xl font-bold">{repoInfo.labels}</p>
|
|
<h6 className="text-sm text-custom-text-200">Labels</h6>
|
|
</div>
|
|
<div className="flex-shrink-0 text-center">
|
|
<p className="text-3xl font-bold">{repoInfo.collaborators.length}</p>
|
|
<h6 className="text-sm text-custom-text-200">Users</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
) : (
|
|
<div>
|
|
<h5>We didn{"'"}t find any issue in this repository.</h5>
|
|
</div>
|
|
)
|
|
) : (
|
|
<Loader>
|
|
<Loader.Item height="70px" />
|
|
</Loader>
|
|
)}
|
|
<div className="mt-6 flex items-center justify-end gap-2">
|
|
<SecondaryButton onClick={() => handleStepChange("import-data")}>Back</SecondaryButton>
|
|
<PrimaryButton
|
|
onClick={() => handleStepChange("import-users")}
|
|
disabled={!repoInfo || repoInfo.issue_count === 0}
|
|
>
|
|
Next
|
|
</PrimaryButton>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|