初期登録にステップ進行状態を追加

Author: RRRyoma

web/app/signup/steps/step1_profile.tsx

@@ -44,7 +44,7 @@ export default function Step1({ onSave, prev, caller }: StepProps<Step1User>) {
   return (
     <>
       <div className="flex h-full flex-col gap-4 p-4">
-        <h1 className="text-xl">アカウント設定</h1>
+        <h1 className="text-xl">アカウント設定(1/5)</h1>
         <div className="flex flex-col gap-2">
           <form onSubmit={handleSubmit(onSubmit)}>
             <Field fieldName="name" fieldLabel="名前" error={errors?.name}>

web/app/signup/steps/step2_img.tsx

@@ -39,6 +39,7 @@ export default function Step2({
   return (
     <>
       <div className="g-2 flex flex-col p-2">
+        <h1 className="text-xl">プロフィール画像設定(2/5)</h1>
         <div style={{ textAlign: "center", marginTop: "15vh" }}>
           <PhotoModal
             open={open}

web/app/signup/steps/step4_course.tsx

@@ -13,7 +13,7 @@ export default function Step4({ onSave }: StepProps<void>) {
           <FullScreenCircularProgress />
         ) : (
           <div className="mx-4 mt-4 flex flex-1 flex-col gap-4">
-            <h1>授業情報の登録 (スキップ可)</h1>
+            <h1>授業情報の登録(4/5,スキップ可)</h1>
             <div className="flex-1">
               <EditableCoursesTable userId={state.data} />
             </div>

web/app/signup/steps/step5_interests.tsx

@@ -86,6 +86,7 @@ export default function Step5({ back }: BackProp) {
     <>
       <div className="h-full overflow-y-scroll">
         <div className="mx-auto flex h-full max-w-lg flex-col px-4">
+          <h1 className="text-xl">興味分野の登録(5/5、スキップ可)</h1>
           <div className="flex-1">
             <div className="flex flex-wrap gap-2 p-2">
               {draftSubjects.map((subject, index) => (