From cc31688ded7c3c8cf36487d208d17895e78e1de5 Mon Sep 17 00:00:00 2001
From: mortezaei <mortezaei2324@gmail.com>
Date: Thu, 20 Aug 2026 19:24:40 +0330
Subject: [PATCH] fix input autofill code

---
 src/app/new-match/new-match-client.tsx | 115 +++++++++++++------------
 1 file changed, 58 insertions(+), 57 deletions(-)

diff --git a/src/app/new-match/new-match-client.tsx b/src/app/new-match/new-match-client.tsx
index 1b5d835..624c821 100644
--- a/src/app/new-match/new-match-client.tsx
+++ b/src/app/new-match/new-match-client.tsx
@@ -531,53 +531,51 @@ export default function NewMatchClient() {
             <PageHeader profile={profile} />
           </div>
 
-          <div className="min-h-0 flex-1 overflow-y-auto overscroll-y-contain flex flex-col justify-between">
-            {/* Header Section Skeleton */}
-            <section className="flex flex-col items-center mt-3.5 sm:mt-5 shrink-0">
+          <div className="min-h-0 flex-1 overflow-y-auto overscroll-y-contain flex flex-col justify-between py-1">
+            {/* 1. Header Section Skeleton */}
+            <section className="flex flex-col items-center shrink-0">
               <LoadingSkeleton className="h-[60px] w-[60px] rounded-full" />
               <LoadingSkeleton className="h-6 w-[220px] mt-2.5 sm:mt-3" />
               <LoadingSkeleton className="h-4 w-[280px] mt-2" />
               <LoadingSkeleton className="h-4 w-[240px] mt-1" />
             </section>
 
-            <div className="flex flex-col justify-between shrink-0">
-              {/* Match Card Skeleton */}
-              <section className="mt-4 sm:mt-6 rounded-[15px] border border-white/80 bg-white px-[17px] pt-[16px] pb-[16px] shadow-[0_18px_45px_rgba(15,23,42,0.06)] flex flex-col items-center">
-                {/* Name line */}
-                <LoadingSkeleton className="h-5 w-[140px]" />
+            {/* 2. Match Card Skeleton */}
+            <section className="w-full rounded-[15px] border border-white/80 bg-white px-[17px] pt-[16px] pb-[16px] shadow-[0_18px_45px_rgba(15,23,42,0.06)] flex flex-col items-center shrink-0">
+              {/* Name line */}
+              <LoadingSkeleton className="h-5 w-[140px]" />
 
-                {/* Subtitle / Details lines */}
-                <div className="mt-2 w-full flex flex-col items-center gap-2 min-h-[40px]">
-                  <LoadingSkeleton className="h-3 w-[180px]" />
-                  <LoadingSkeleton className="h-3 w-[150px]" />
-                </div>
-
-                {/* Button skeleton */}
-                <LoadingSkeleton className="mt-3 sm:mt-3.5 h-[40px] w-full rounded-[10px]" />
-              </section>
+              {/* Subtitle / Details lines */}
+              <div className="mt-2 w-full flex flex-col items-center gap-2 min-h-[40px]">
+                <LoadingSkeleton className="h-3 w-[180px]" />
+                <LoadingSkeleton className="h-3 w-[150px]" />
+              </div>
 
-              {/* Advisor Card Skeleton */}
-              <section className="mt-4 sm:mt-6">
-                <div className="rounded-[13px] border border-white/80 bg-white px-3 py-3.5 text-left shadow-[0_18px_45px_rgba(15,23,42,0.06)] backdrop-blur-sm">
-                  <LoadingSkeleton className="h-[16px] w-[140px]" />
-                  <div className="mt-2 space-y-1">
-                    <LoadingSkeleton className="h-[10px] w-[260px]" />
-                    <LoadingSkeleton className="h-[10px] w-[180px]" />
-                  </div>
+              {/* Button skeleton */}
+              <LoadingSkeleton className="mt-3 h-[40px] w-full rounded-[10px]" />
+            </section>
 
-                  <div className="mt-4 flex items-center justify-between gap-3">
-                    <div className="flex items-center pl-1">
-                      <LoadingSkeleton className="h-[30px] w-[30px] rounded-full border-2 border-white" />
-                      <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
-                      <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
-                      <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
-                    </div>
+            {/* 3. Advisor Card Skeleton */}
+            <section className="w-full shrink-0">
+              <div className="rounded-[13px] border border-white/80 bg-white px-3 py-3.5 text-left shadow-[0_18px_45px_rgba(15,23,42,0.06)] backdrop-blur-sm">
+                <LoadingSkeleton className="h-[16px] w-[140px]" />
+                <div className="mt-2 space-y-1">
+                  <LoadingSkeleton className="h-[10px] w-[260px]" />
+                  <LoadingSkeleton className="h-[10px] w-[180px]" />
+                </div>
 
-                    <LoadingSkeleton className="h-[38px] w-[120px] rounded-[9px]" />
+                <div className="mt-4 flex items-center justify-between gap-3">
+                  <div className="flex items-center pl-1">
+                    <LoadingSkeleton className="h-[30px] w-[30px] rounded-full border-2 border-white" />
+                    <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
+                    <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
+                    <LoadingSkeleton className="-ml-1.5 h-[30px] w-[30px] rounded-full border-2 border-white" />
                   </div>
+
+                  <LoadingSkeleton className="h-[38px] w-[120px] rounded-[9px]" />
                 </div>
-              </section>
-            </div>
+              </div>
+            </section>
           </div>
         </main>
       </>
@@ -628,8 +626,9 @@ export default function NewMatchClient() {
           <PageHeader profile={profile} />
         </div>
 
-        <div className="min-h-0 flex-1 overflow-y-auto overscroll-y-contain flex flex-col justify-between">
-          <section className="flex flex-col items-center mt-3.5 sm:mt-5 shrink-0">
+        <div className="min-h-0 flex-1 overflow-y-auto overscroll-y-contain flex flex-col justify-between py-1">
+          {/* 1. Header Section */}
+          <section className="flex flex-col items-center shrink-0">
             <div
               aria-hidden="true"
               className="relative flex h-[60px] w-[60px] items-center justify-center rounded-full bg-[#FF4E67] shadow-[0_12px_28px_rgba(240,68,91,0.22)]"
@@ -649,9 +648,10 @@ export default function NewMatchClient() {
             </p>
           </section>
 
-          <div className="flex flex-col justify-between shrink-0">
+          {/* 2. Match Summary Card Section */}
+          <div className="w-full shrink-0">
             {isLoading ? (
-              <section className="mt-4 sm:mt-6 rounded-[15px] border border-white/80 bg-white px-[17px] pt-[16px] pb-[16px] shadow-[0_18px_45px_rgba(15,23,42,0.06)]">
+              <section className="rounded-[15px] border border-white/80 bg-white px-[17px] pt-[16px] pb-[16px] shadow-[0_18px_45px_rgba(15,23,42,0.06)]">
                 <div className="flex flex-col items-center py-2">
                   {/* Name line */}
                   <LoadingSkeleton className="h-5 w-[140px]" />
@@ -663,11 +663,11 @@ export default function NewMatchClient() {
                   </div>
 
                   {/* Button skeleton */}
-                  <LoadingSkeleton className="mt-3 sm:mt-3.5 h-[40px] w-full rounded-[10px]" />
+                  <LoadingSkeleton className="mt-3 h-[40px] w-full rounded-[10px]" />
                 </div>
               </section>
             ) : (
-              <section className="mt-4 sm:mt-6 rounded-[15px] bg-[linear-gradient(180deg,#F0445B_0%,#F4556E_100%)] px-[17px] pt-[16px] pb-[16px] text-white shadow-[0_18px_38px_rgba(240,68,91,0.25)]">
+              <section className="rounded-[15px] bg-[linear-gradient(180deg,#F0445B_0%,#F4556E_100%)] px-[17px] pt-[16px] pb-[16px] text-white shadow-[0_18px_38px_rgba(240,68,91,0.25)]">
                 {isError ? (
                   <p className="py-8 text-[13px] font-semibold">
                     Unable to load match summary.
@@ -736,7 +736,7 @@ export default function NewMatchClient() {
                           openProfile();
                         }
                       }}
-                      className="mt-3 sm:mt-3.5 inline-flex w-full items-center justify-center rounded-[10px] border-none bg-white h-[40px] text-[16px] font-semibold text-[#F0445B] no-underline shadow-none hover:bg-white/95 transition-colors cursor-pointer"
+                      className="mt-3 inline-flex w-full items-center justify-center rounded-[10px] border-none bg-white h-[40px] text-[16px] font-semibold text-[#F0445B] no-underline shadow-none hover:bg-white/95 transition-colors cursor-pointer"
                     >
                       {t["View more details"]}
                     </button>
@@ -748,21 +748,22 @@ export default function NewMatchClient() {
                 )}
               </section>
             )}
-            <div className="w-full space-y-3">
-              <AdvisorActionsCard
-                className="mt-4 sm:mt-6"
-                title={t["Get an advisor"]}
-                description={
-                  t[
-                    "Not sure what to do next? Our psychology section is here to guide you at every step."
-                  ]
-                }
-                avatars={advisorAvatars}
-                extraCount={7}
-                getAdvisorLabel={t["Get Advisor"]}
-                onGetAdvisor={openAdvisors}
-              />
-            </div>
+          </div>
+
+          {/* 3. Advisor Section */}
+          <div className="w-full shrink-0">
+            <AdvisorActionsCard
+              title={t["Get an advisor"]}
+              description={
+                t[
+                  "Not sure what to do next? Our psychology section is here to guide you at every step."
+                ]
+              }
+              avatars={advisorAvatars}
+              extraCount={7}
+              getAdvisorLabel={t["Get Advisor"]}
+              onGetAdvisor={openAdvisors}
+            />
           </div>
         </div>
       </main>