Add Photos onboarding step; let pending/rejected users re-edit freely

- New /onboarding/photos step (upload/delete grid, needs >=1 photo to
  continue), inserted as step 2 right after basic info.
- Pending screen gets an "edit your info" entry point into the wizard;
  Rejected screen's edit button now goes there too instead of just
  the read-only profile page.
- Step 1's back button now returns to /home instead of /login when
  the user is already onboarded (was previously always /login).
- Progress bar segments become clickable to jump directly to any step
  once the user is already onboarded.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/components/onboarding/OnboardingScreen.tsx

@@ -12,6 +12,9 @@ interface OnboardingScreenProps {
   description?: string;
   children: ReactNode;
   onBack?: () => void;
+  // وقتی پروفایل قبلاً کامل شده (در انتظار بررسی یا ردشده)، کاربر می‌تونه
+  // مستقیم روی هر بخش از نوار پیشرفت بزنه و بین مراحل جابه‌جا بشه
+  onJumpToStep?: (slug: string) => void;
 }
 
 export function OnboardingScreen({
@@ -21,6 +24,7 @@ export function OnboardingScreen({
   description,
   children,
   onBack,
+  onJumpToStep,
 }: OnboardingScreenProps) {
   const router = useRouter();
   const total = ONBOARDING_STEPS.length;
@@ -36,14 +40,25 @@ export function OnboardingScreen({
           <ChevronRight size={20} className="text-(--color-content-secondary)" />
         </button>
         <div className="flex-1 flex gap-1.5">
-          {ONBOARDING_STEPS.map((s) => (
-            <div
-              key={s.key}
-              className={`h-1.5 flex-1 rounded-(--radius-full) transition-colors duration-300 ${
-                s.order <= order ? "bg-(--color-brand-500)" : "bg-(--color-bg-tertiary)"
-              }`}
-            />
-          ))}
+          {ONBOARDING_STEPS.map((s) =>
+            onJumpToStep ? (
+              <button
+                key={s.key}
+                onClick={() => onJumpToStep(s.slug)}
+                aria-label={s.title}
+                className={`h-1.5 flex-1 rounded-(--radius-full) transition-colors duration-300 cursor-pointer ${
+                  s.order <= order ? "bg-(--color-brand-500)" : "bg-(--color-bg-tertiary)"
+                }`}
+              />
+            ) : (
+              <div
+                key={s.key}
+                className={`h-1.5 flex-1 rounded-(--radius-full) transition-colors duration-300 ${
+                  s.order <= order ? "bg-(--color-brand-500)" : "bg-(--color-bg-tertiary)"
+                }`}
+              />
+            )
+          )}
         </div>
         <span className="text-[11px] font-bold text-(--color-content-tertiary) shrink-0">
           {order}/{total}

src/components/onboarding/steps/PhotosStep.tsx

@@ -0,0 +1,110 @@
+"use client";
+
+import { useRef, useState } from "react";
+import { Plus, X } from "lucide-react";
+import { Button } from "@/components/ui/Button";
+import { ErrorBanner } from "@/components/ui/ErrorBanner";
+import { confirmPhotosStep, uploadPhoto, deletePhoto, photoUrl, FullProfile, Photo } from "@/lib/api";
+import { formatApiError } from "@/lib/hooks";
+
+const MAX_PHOTOS = 6;
+
+export function PhotosStep({
+  initialProfile,
+  onNext,
+}: {
+  initialProfile: FullProfile | null;
+  onNext: () => void;
+}) {
+  const [photos, setPhotos] = useState<Photo[]>(initialProfile?.photos ?? []);
+  const [uploading, setUploading] = useState(false);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+
+  async function handleFile(e: React.ChangeEvent<HTMLInputElement>) {
+    const file = e.target.files?.[0];
+    e.target.value = "";
+    if (!file) return;
+    setUploading(true);
+    setError(null);
+    try {
+      const photo = await uploadPhoto(file);
+      setPhotos((prev) => [...prev, photo]);
+    } catch (err) {
+      setError(formatApiError(err));
+    } finally {
+      setUploading(false);
+    }
+  }
+
+  async function handleDelete(id: number) {
+    setError(null);
+    try {
+      await deletePhoto(id);
+      setPhotos((prev) => prev.filter((p) => p.id !== id));
+    } catch (err) {
+      setError(formatApiError(err));
+    }
+  }
+
+  async function handleNext() {
+    if (photos.length === 0) return;
+    setLoading(true);
+    setError(null);
+    try {
+      await confirmPhotosStep();
+      onNext();
+    } catch (err) {
+      setError(formatApiError(err));
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-6">
+      <p className="text-[13px] font-semibold text-(--color-content-secondary)">
+        حداقل ۱ عکس لازمه؛ هرچی بیشتر بذاری، شانس دیده شدنت بیشتره ({photos.length}/{MAX_PHOTOS})
+      </p>
+
+      <div className="grid grid-cols-3 gap-2.5">
+        {photos.map((p) => (
+          <div key={p.id} className="relative aspect-square rounded-(--radius-md) overflow-hidden">
+            {/* eslint-disable-next-line @next/next/no-img-element */}
+            <img src={photoUrl(p.url)} alt="" className="w-full h-full object-cover" />
+            <button
+              onClick={() => handleDelete(p.id)}
+              className="absolute top-1 left-1 w-6 h-6 rounded-full bg-black/50 flex items-center justify-center text-white"
+              aria-label="حذف عکس"
+            >
+              <X size={13} />
+            </button>
+          </div>
+        ))}
+        {photos.length < MAX_PHOTOS && (
+          <button
+            onClick={() => fileInputRef.current?.click()}
+            disabled={uploading}
+            className="aspect-square rounded-(--radius-md) border-2 border-dashed border-(--color-border-default) flex items-center justify-center text-(--color-content-tertiary) disabled:opacity-50"
+          >
+            <Plus size={22} />
+          </button>
+        )}
+      </div>
+      <input
+        ref={fileInputRef}
+        type="file"
+        accept="image/jpeg,image/png,image/webp"
+        className="hidden"
+        onChange={handleFile}
+      />
+
+      <ErrorBanner message={error} />
+
+      <Button size="lg" isBlock disabled={photos.length === 0} isLoading={loading} onClick={handleNext}>
+        بریم مرحله بعد
+      </Button>
+    </div>
+  );
+}