diff --git a/src/app/pages/setting-page.tsx b/src/app/pages/setting-page.tsx
index 46fe6c2..846c130 100644
--- a/src/app/pages/setting-page.tsx
+++ b/src/app/pages/setting-page.tsx
@@ -188,8 +188,8 @@ export function SettingPage({ cardId }: { cardId: number }) {
if (features !== null) {
setSelectedState({
...selectedState,
- smoking: features[0],
- room: features[1],
+ smoking: features[0].split(':')[1],
+ room: features[1].split(':')[1],
});
}
}
@@ -206,10 +206,14 @@ export function SettingPage({ cardId }: { cardId: number }) {
if (isMySelf) {
if (features !== null) {
const initialOptions: SelectedOptions = {};
- features.slice(2).forEach(option => {
+ const optionsString = features[3].split(':')[1];
+ const budgetIdx = optionsString.indexOf('[');
+ const budget = optionsString.slice(budgetIdx);
+ setInitialBudget(budget.slice(1, -1));
+
+ const options = optionsString.slice(0, budgetIdx).split(',');
+ options.forEach(option => {
if (
- !option.includes(',') &&
- !option.includes('±') &&
!option.includes('E') &&
!option.includes('I') &&
!majorArray.includes(option)
@@ -220,7 +224,6 @@ export function SettingPage({ cardId }: { cardId: number }) {
if (option.includes('E') || option.includes('I'))
setInitialMbti(option);
if (majorArray.includes(option)) setInitialMajor(option);
- if (option.includes(',')) setInitialBudget(option);
});
setSelectedOptions(initialOptions);
}
@@ -269,16 +272,19 @@ export function SettingPage({ cardId }: { cardId: number }) {
const array = Object.keys(selectedOptions).filter(
key => selectedOptions[key] && key !== '전공' && key !== '엠비티아이',
);
+ const options = [
+ ...array,
+ ...(mbti != null ? [mbti] : []),
+ ...(major != null ? [major] : []),
+ ...(budget != null ? [budget] : []),
+ ].filter(Boolean);
const location = locationInput ?? '';
const myFeatures = [
- selectedState.smoking,
- selectedState.room,
- mateAge !== '' ? mateAge : undefined,
- ...array,
- ...(mbti !== null && mbti !== undefined ? [mbti] : []),
- ...(major !== null && major !== undefined ? [major] : []),
- budget,
+ `smoking:${selectedState.smoking}`,
+ `room:${selectedState.room}`,
+ `mateAge:${mateAge !== '' ? mateAge : undefined}`,
+ `options:${options.join(',')}`,
];
mutate({ location, features: myFeatures });
@@ -379,24 +385,45 @@ export function SettingPage({ cardId }: { cardId: number }) {
-
+ {type === 'myCard' ? (
+
+ ) : (
+
+ )}
);
diff --git a/src/app/pages/user-input-page.tsx b/src/app/pages/user-input-page.tsx
index 29d05d2..0a98451 100644
--- a/src/app/pages/user-input-page.tsx
+++ b/src/app/pages/user-input-page.tsx
@@ -227,6 +227,7 @@ interface UserProps {
interface SelectedState {
smoking: string | undefined;
room: string | undefined;
+ mateAge: string | undefined;
}
type SelectedOptions = Record;
@@ -239,6 +240,7 @@ const useSelectedState = (): [
const [selectedState, setSelectedState] = useState({
smoking: undefined,
room: undefined,
+ mateAge: undefined,
});
const [selectedOptions, setSelectedOptions] = useState({});
@@ -315,25 +317,32 @@ export function UserInputPage() {
key => selectedMateOptions[key] && key !== '전공' && key !== '엠비티아이',
);
+ const myOptionsString = [
+ ...myOptions,
+ ...(mbti != null ? [mbti] : []),
+ ...(major != null ? [major] : []),
+ ...(budget != null ? [budget] : []),
+ ].filter(Boolean);
+ const mateOptionsString = [
+ ...mateOptions,
+ ...(mateMbti != null ? [mateMbti] : []),
+ ...(mateMajor != null ? [mateMajor] : []),
+ ...(mateBudget != null ? [mateBudget] : []),
+ ].filter(Boolean);
+
const location = locationInput ?? '';
const myFeatures = [
- selectedState.smoking,
- selectedState.room,
- mateAge,
- ...myOptions,
- ...(mbti !== null && mbti !== undefined ? [mbti] : []),
- ...(major !== null && major !== undefined ? [major] : []),
- budget,
+ `smoking:${selectedState.smoking}`,
+ `room:${selectedState.room}`,
+ `mateAge:${mateAge !== '' ? mateAge : undefined}`,
+ `options:${myOptionsString.join(',')}`,
];
const mateFeatures = [
- selectedMateState.smoking,
- selectedMateState.room,
- mateAge,
- ...mateOptions,
- ...(mateMbti !== null && mateMbti !== undefined ? [mateMbti] : []),
- ...(mateMajor !== null && mateMajor !== undefined ? [mateMajor] : []),
- mateBudget,
+ `smoking:${selectedMateState.smoking}`,
+ `room:${selectedMateState.room}`,
+ `mateAge:${mateAge !== '' ? mateAge : undefined}`,
+ `options:${mateOptionsString.join(',')}`,
];
try {
diff --git a/src/components/UserInputSection.tsx b/src/components/UserInputSection.tsx
index f6322c0..2f5b1b1 100644
--- a/src/components/UserInputSection.tsx
+++ b/src/components/UserInputSection.tsx
@@ -37,7 +37,7 @@ interface UserInputProps {
budget: string | undefined;
features: string[] | null;
isMySelf: boolean;
- type: string;
+ type: 'myCard' | 'mateCard';
onVitalChange: (
optionName: keyof SelectedState,
item: string | number,
diff --git a/src/components/card/OptionSection.tsx b/src/components/card/OptionSection.tsx
index 0b0fcf9..bfe9f61 100644
--- a/src/components/card/OptionSection.tsx
+++ b/src/components/card/OptionSection.tsx
@@ -198,10 +198,12 @@ export function OptionSection({
useEffect(() => {
if (optionFeatures !== null) {
const initialOptions: SelectedOptions = {};
- optionFeatures.slice(2).forEach(option => {
+ const optionsString = optionFeatures[3].split(':')[1];
+ const budgetIdx = optionsString.indexOf('[');
+
+ const options = optionsString.slice(0, budgetIdx).split(',');
+ options.forEach(option => {
if (
- !option.includes(',') &&
- !option.includes('±') &&
!option.includes('E') &&
!option.includes('I') &&
!majorArray.includes(option)
@@ -251,6 +253,7 @@ export function OptionSection({
const [initialMin, setInitialMin] = useState(0);
const [initialMax, setInitialMax] = useState(355);
+
useEffect(() => {
if (budget !== undefined) {
const [min, max] = budget.split(',').map(Number);
@@ -298,7 +301,7 @@ export function OptionSection({
}, [selectedMajor]);
useEffect(() => {
- const budgetString = `${budgetMin},${budgetMax}`;
+ const budgetString = `[${budgetMin},${budgetMax}]`;
onBudgetChange(budgetString);
}, [budgetMin, budgetMax]);
diff --git a/src/components/card/VitalSection.tsx b/src/components/card/VitalSection.tsx
index 8710ff6..905c7ef 100644
--- a/src/components/card/VitalSection.tsx
+++ b/src/components/card/VitalSection.tsx
@@ -247,8 +247,8 @@ export function VitalSection({
useEffect(() => {
setSelectedState({
...selectedState,
- smoking: vitalFeatures?.[0],
- room: vitalFeatures?.[1],
+ smoking: vitalFeatures?.[0].split(':')[1],
+ room: vitalFeatures?.[1].split(':')[1],
});
}, [vitalFeatures]);
@@ -285,7 +285,7 @@ export function VitalSection({
const [initialAge, setInitialAge] = useState(0);
useEffect(() => {
if (vitalFeatures !== null)
- setInitialAge(Number(vitalFeatures?.[2].slice(1)));
+ setInitialAge(Number(vitalFeatures?.[2].split(':')[1].slice(1)));
}, [vitalFeatures?.[2]]);
const [ageValue, setAgeValue] = useState(0);