diff options
| -rw-r--r-- | src/SignUpConfirm.tsx | 4 | ||||
| -rw-r--r-- | src/SignUpForm3.tsx | 28 | ||||
| -rw-r--r-- | src/signUpSchema.ts | 4 |
3 files changed, 18 insertions, 18 deletions
diff --git a/src/SignUpConfirm.tsx b/src/SignUpConfirm.tsx index b1a4548..64e78c9 100644 --- a/src/SignUpConfirm.tsx +++ b/src/SignUpConfirm.tsx @@ -35,8 +35,8 @@ export const SignUpConfirm = () => { </div> <h2>プログラミング関連の情報</h2> <div className="signUpForm"> - <p>GitHubのアカウントはある？: {form.hasGitHubRepo ? 'ある' : 'ない'}</p> - <p>GitHub の username: {form.gitHubUsername}</p> + <p>GitHubのアカウントはある？: {form.hasGithubRepo ? 'ある' : 'ない'}</p> + <p>GitHub の username: {form.githubUsername}</p> <p>お気に入りの GitHub リポジトリ: {form.repoName}</p> </div> </div> diff --git a/src/SignUpForm3.tsx b/src/SignUpForm3.tsx index e3b347d..bfe2f45 100644 --- a/src/SignUpForm3.tsx +++ b/src/SignUpForm3.tsx @@ -26,18 +26,18 @@ export const SignUpForm3Main = () => { const location = useLocation(); const formData = location.state as { form1: Form1Data, form2: Form2Data } | null; const navigate = useNavigate(); - const watchHasGitHubRepo = watch("hasGitHubRepo", false) - const gitHubUsername = watch("gitHubUsername", '') + const watchHasGithubRepo = watch("hasGithubRepo", false) + const githubUsername = watch("githubUsername", '') - const repoQueryEnabled = watchHasGitHubRepo && gitHubUsername.length > 0; + const repoQueryEnabled = watchHasGithubRepo && githubUsername.length > 0; - console.log(gitHubUsername) + console.log(githubUsername) console.log(repoQueryEnabled) const { data: reposData, isLoading: reposIsLoading, isError: reposIsError, error: reposError } = useQuery({ - queryKey: ['gitHubRepos', gitHubUsername], + queryKey: ['githubRepos', githubUsername], queryFn: async () => { - const res = await fetch(`https://api.github.com/users/${gitHubUsername}/repos?sort=updated&direction=desc&per_page=100`) + const res = await fetch(`https://api.github.com/users/${githubUsername}/repos?sort=updated&direction=desc&per_page=100`) if (res.ok) { return res.json(); } throw new Error(res.statusText) }, @@ -49,9 +49,9 @@ export const SignUpForm3Main = () => { [] useEffect(() => { - setValue('gitHubUsername', '') + setValue('githubUsername', '') setValue('repoName', '') - }, [watchHasGitHubRepo]) + }, [watchHasGithubRepo]) // form1, form2 のデータがない場合は form1 にリダイレクトする if (formData === null) { @@ -71,15 +71,15 @@ export const SignUpForm3Main = () => { <h1>会員登録 フェーズ 3</h1> <form className="SignUpForm" onSubmit={handleSubmit(onsubmit, onerror)}> <div> - <label htmlFor="hasGitHubRepo">GitHubのリポジトリある？: </label> - <input id="hasGitHubRepo" type="checkbox" {...register('hasGitHubRepo')}></input> - <div className="error">{errors.hasGitHubRepo?.message}</div> + <label htmlFor="hasGithubRepo">GitHubのリポジトリある？: </label> + <input id="hasGithubRepo" type="checkbox" {...register('hasGithubRepo')}></input> + <div className="error">{errors.hasGithubRepo?.message}</div> </div> { - (watchHasGitHubRepo && + (watchHasGithubRepo && <div> - <label htmlFor="gitHubUsername">github username: </label> - <input id="gitHubUsername" type="text" {...register('gitHubUsername')}></input> + <label htmlFor="githubUsername">github username: </label> + <input id="githubUsername" type="text" {...register('githubUsername')}></input> </div> ) } diff --git a/src/signUpSchema.ts b/src/signUpSchema.ts index 3b75ba1..338e137 100644 --- a/src/signUpSchema.ts +++ b/src/signUpSchema.ts @@ -44,8 +44,8 @@ const favLangSchema = z.object({ export const form3Schema = z.object({ // favLangs: z.array(favLangSchema), - hasGitHubRepo: z.boolean(), - gitHubUsername: z.string(), + hasGithubRepo: z.boolean(), + githubUsername: z.string(), repoName: z.string(), }) |