From ff0ee3757c9f370b97f96c93e516d8bea5206fd4 Mon Sep 17 00:00:00 2001
From: gahusb <bgg8988@gmail.com>
Date: Tue, 7 Apr 2026 04:43:15 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=ED=94=84=EB=A1=9C=ED=95=84=20preferred?=
 =?UTF-8?q?=5Fregions/types=20=EB=B0=B0=EC=97=B4=20=EB=B3=80=ED=99=98=20+?=
 =?UTF-8?q?=20=ED=95=84=EC=88=98=20=EC=9E=85=EB=A0=A5=20=ED=91=9C=EC=8B=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 쉼표 구분 문자열 → List[str] 변환 (백엔드 422 에러 수정)
- API 응답 배열 → 표시용 문자열 변환
- 매칭 필수 필드에 * 표시 (무주택, 세대주, 납입기간, 가족수, 선호지역)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/pages/subscription/Subscription.jsx | 36 +++++++++++++++++++------
 1 file changed, 28 insertions(+), 8 deletions(-)

diff --git a/src/pages/subscription/Subscription.jsx b/src/pages/subscription/Subscription.jsx
index 5a02495..a74c55e 100644
--- a/src/pages/subscription/Subscription.jsx
+++ b/src/pages/subscription/Subscription.jsx
@@ -742,7 +742,10 @@ function ProfileTab() {
             try {
                 const data = await apiGet('/api/realestate/profile');
                 if (data && Object.keys(data).length > 0) {
-                    setProfile({ ...DEFAULT_PROFILE, ...data });
+                    const display = { ...DEFAULT_PROFILE, ...data };
+                    if (Array.isArray(display.preferred_regions)) display.preferred_regions = display.preferred_regions.join(', ');
+                    if (Array.isArray(display.preferred_types)) display.preferred_types = display.preferred_types.join(', ');
+                    setProfile(display);
                 }
             } catch (e) {
                 console.error('Profile load error:', e);
@@ -775,9 +778,24 @@ function ProfileTab() {
                     payload[k] = null;
                 }
             });
+            // Convert comma-separated strings to arrays
+            payload.preferred_regions = typeof payload.preferred_regions === 'string'
+                ? payload.preferred_regions.split(',').map(s => s.trim()).filter(Boolean)
+                : (payload.preferred_regions || []);
+            payload.preferred_types = typeof payload.preferred_types === 'string'
+                ? payload.preferred_types.split(',').map(s => s.trim()).filter(Boolean)
+                : (payload.preferred_types || []);
+            // Send empty arrays as null
+            if (payload.preferred_regions.length === 0) payload.preferred_regions = null;
+            if (payload.preferred_types.length === 0) payload.preferred_types = null;
+
             const updated = await apiPut('/api/realestate/profile', payload);
             if (updated && Object.keys(updated).length > 0) {
-                setProfile({ ...DEFAULT_PROFILE, ...updated });
+                // Convert arrays back to comma-separated strings for display
+                const display = { ...DEFAULT_PROFILE, ...updated };
+                if (Array.isArray(display.preferred_regions)) display.preferred_regions = display.preferred_regions.join(', ');
+                if (Array.isArray(display.preferred_types)) display.preferred_types = display.preferred_types.join(', ');
+                setProfile(display);
             }
             setMessage('저장 완료');
             setTimeout(() => setMessage(''), 2000);
@@ -789,6 +807,8 @@ function ProfileTab() {
         }
     };
 
+    const reqMark = <span style={{ color: '#f43f5e', marginLeft: 2 }}>*</span>;
+
     if (loading) return <div className="sub-empty">불러오는 중...</div>;
 
     return (
@@ -797,7 +817,7 @@ function ProfileTab() {
                 <div>
                     <p className="sub-panel__eyebrow">프로필</p>
                     <h3>내 청약 프로필</h3>
-                    <p className="sub-panel__sub">자격 조건과 선호 조건을 설정하면 공고 매칭에 활용됩니다.</p>
+                    <p className="sub-panel__sub">자격 조건과 선호 조건을 설정하면 공고 매칭에 활용됩니다. <span style={{ color: '#f43f5e', fontSize: 11 }}>* 필수 입력</span></p>
                 </div>
                 <div style={{ display: 'flex', gap: 8, alignItems: 'center' }}>
                     {message && (
@@ -853,11 +873,11 @@ function ProfileTab() {
                     <div className="sub-form-checks">
                         <label className="sub-form-check">
                             <input type="checkbox" checked={!!profile.is_homeless} onChange={() => handleCheckbox('is_homeless')} />
-                            무주택자
+                            무주택자{reqMark}
                         </label>
                         <label className="sub-form-check">
                             <input type="checkbox" checked={!!profile.is_householder} onChange={() => handleCheckbox('is_householder')} />
-                            세대주
+                            세대주{reqMark}
                         </label>
                         <label className="sub-form-check">
                             <input type="checkbox" checked={!!profile.has_dependents} onChange={() => handleCheckbox('has_dependents')} />
@@ -879,7 +899,7 @@ function ProfileTab() {
 
                     <div className="sub-form-row--three" style={{ display: 'grid', gridTemplateColumns: '1fr 1fr 1fr', gap: 12 }}>
                         <label className="sub-form-label">
-                            청약 납입 기간 (개월)
+                            청약 납입 기간 (개월){reqMark}
                             <input
                                 className="sub-form-input"
                                 type="number"
@@ -899,7 +919,7 @@ function ProfileTab() {
                             />
                         </label>
                         <label className="sub-form-label">
-                            가족 수
+                            가족 수{reqMark}
                             <input
                                 className="sub-form-input"
                                 type="number"
@@ -950,7 +970,7 @@ function ProfileTab() {
 
                     <div className="sub-form-row">
                         <label className="sub-form-label">
-                            선호 지역
+                            선호 지역{reqMark}
                             <input
                                 className="sub-form-input"
                                 value={profile.preferred_regions || ''}