= ({ banner }) => {
)}
+ {isEmpty &&
+ {profiles?.map((profiles, index) => (
+
+ {profiles.map((profile) => {
+ const sorted = profile.activities.sort((a, b) => b.generation - a.generation);
+ const badges = sorted.map((activity) => ({
+ content: `${activity.generation}기 ${activity.part}`,
+ isActive: activity.generation === LATEST_GENERATION,
+ }));
+
+ const belongs = profile.careers.find((career) => career.isCurrent)?.companyName ?? profile.university;
+
+ return (
+ handleClickCard(profile)}
+ >
+ {
+ e.preventDefault();
+ logClickEvent('messageBadge');
+ setMessageModalState({
+ show: true,
+ data: {
+ targetId: `${profile.id}`,
+ name: profile.name,
+ profileUrl: profile.profileImage,
+ },
+ });
+ }}
+ />
+
+
+
+ );
+ })}
+
+ ))}
+
{
+ className?: string;
+ value?: Option;
+ options: Option[];
+ onChange?: (value: string) => void;
+}
+
+export function MemberListOrder({ className, value, options, onChange }: MemberListOrderProps) {
+ return (
+
+
+
+ {value?.label}
+
+
+
+ {options.map((option) => (
+
+
+ );
+}
+
+const TriggerContentWrapper = styled.div`
+ display: flex;
+ gap: 12px;
+ align-items: center;
+ padding: 11px 16px;
+ width: 100%;
+`;
+
+const TriggerContent = styled.div`
+ color: ${colors.gray300};
+
+ & > svg {
+ display: none;
+ }
+`;
+
+const StyledIconSwitchVertical = styled(IconSwitchVertical)`
+ width: 20px;
+ height: 20px;
+ color: ${colors.gray300};
+`;
diff --git a/src/components/members/main/MemberList/index.tsx b/src/components/members/main/MemberList/index.tsx
index 2c5e66153..3de333876 100644
--- a/src/components/members/main/MemberList/index.tsx
+++ b/src/components/members/main/MemberList/index.tsx
@@ -32,6 +32,7 @@ import {
} from '@/components/members/main/MemberList/filters/constants';
import MemberListFilter from '@/components/members/main/MemberList/filters/MemberListFilter';
import MemberListFilterSheet from '@/components/members/main/MemberList/filters/MemberListFilterSheet';
+import { MemberListOrder } from '@/components/members/main/MemberList/filters/MemberListOrder';
import { LATEST_GENERATION } from '@/constants/generation';
import { playgroundLink } from '@/constants/links';
import useIntersectionObserver from '@/hooks/useIntersectionObserver';
@@ -66,7 +67,7 @@ const MemberList: FC = ({ banner }) => {
const [employed, setEmployed] = useState
)}
{convertBirthdayFormat(profile.birthday)}
+ {profile.phone.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3')}
+ {profile.email}
+
+
+ {profile.profileImage ? (
+
+
+
+
+
+
+ )}
+ {profile.isCoffeeChatActivate && (
+
+
+ )}
+
+
+
+
+
+
-
-
-
- )}
- {profile.isCoffeeChatActivate && (
-
-
+
+
+ {profile.isMine ? (
+ {profile.name}
+ {uniq(profile.soptActivities.map(({ part }) => part)).join('/')}
+ {profile.introduction}
+ {profile.name}
- {uniq(profile.soptActivities.map(({ part }) => part)).join('/')}
- {profile.introduction}
-
-
-
- )}
- {profile.email && (
-
- {profile.phone}
-
-
-
- )}
- {profile.email}
- {profile.email}
-
+ {profile.email && (
+
+
+
+
+ )}
+
);
};
@@ -294,7 +296,7 @@ const ContactWrapper = styled.div`
& > div {
display: flex;
- gap: 4px;
+ gap: 12px;
align-items: center;
@media ${MOBILE_MEDIA_QUERY} {
From b9dd49a9f042994aba7b2aaae16d2e5ea9b5243b Mon Sep 17 00:00:00 2001
From: Eunseo Sim <55528304+simeunseo@users.noreply.github.com>
Date: Fri, 20 Dec 2024 01:32:05 +0900
Subject: [PATCH 13/24] =?UTF-8?q?feat:=20BottomSheetSelect=20=EC=88=98?=
=?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../BottomSheetSelect/index.tsx | 24 +++++++++++++++----
1 file changed, 20 insertions(+), 4 deletions(-)
diff --git a/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx b/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
index 5bc99965b..dcc997878 100644
--- a/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
+++ b/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
@@ -14,11 +14,13 @@ interface Option {
interface BottomSheetSelectProps {
options: Option[];
- value: string | string[] | null | undefined;
+ defaultOption?: Option;
+ value: string | null | undefined;
placeholder: string;
onChange: (value: string) => void;
}
-const BottomSheetSelect = ({ options, value, placeholder, onChange }: BottomSheetSelectProps) => {
+
+const BottomSheetSelect = ({ options, defaultOption, value, placeholder, onChange }: BottomSheetSelectProps) => {
const [open, setOpen] = useState(false);
const [selectedValue, setSelectedValue] = useState(value);
const [temporaryValue, setTemporaryValue] = useState(value);
@@ -32,7 +34,7 @@ const BottomSheetSelect = ({ options, value, placeholder, onChange }: BottomShee
const handleConfirm = () => {
setSelectedValue(temporaryValue);
- if (temporaryValue !== '') onChange(temporaryValue as string);
+ onChange(temporaryValue as string);
handleClose();
};
@@ -49,10 +51,14 @@ const BottomSheetSelect = ({ options, value, placeholder, onChange }: BottomShee
};
}, [open]);
+ const getSelectedLabel = (value: string) => {
+ return options.find((option) => option.value === value)?.label;
+ };
+
return (
{profile.email}
+ {selectedValue}
:{placeholder}
} + {selectedValue ?{getSelectedLabel(selectedValue)}
:{placeholder}
}{getSelectedLabel(selectedValue)}
:{placeholder}
} -{convertBirthdayFormat(profile.birthday)}
- {profile.phone.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3')}
+ {(profile.birthday || profile.phone) && (
+ {convertBirthdayFormat(profile.birthday)}
{profile.phone.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3')}
+
{profile.email && (
From fda6a9864568746d70752c7375fadf4974378752 Mon Sep 17 00:00:00 2001
From: Eunseo Sim <55528304+simeunseo@users.noreply.github.com>
Date: Sun, 5 Jan 2025 03:21:51 +0900
Subject: [PATCH 24/24] =?UTF-8?q?feat:=20BottomSheetSelect=20width=20?=
=?UTF-8?q?=EC=A0=95=EC=9D=98=20=EB=B0=A9=EC=8B=9D=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../upload/CoffeechatForm/BottomSheetSelect/index.tsx | 2 +-
src/components/members/main/MemberList/index.tsx | 4 ++++
2 files changed, 5 insertions(+), 1 deletion(-)
diff --git a/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx b/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
index b8068e7c9..5521d98c3 100644
--- a/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
+++ b/src/components/coffeechat/upload/CoffeechatForm/BottomSheetSelect/index.tsx
@@ -125,7 +125,7 @@ const InputField = styled.div`
padding: 11px 16px;
${fonts.BODY_16_M};
- width: max-content;
+ width: 100%;
`;
const Overlay = styled.div`
diff --git a/src/components/members/main/MemberList/index.tsx b/src/components/members/main/MemberList/index.tsx
index 301e39f70..5b63b7c7a 100644
--- a/src/components/members/main/MemberList/index.tsx
+++ b/src/components/members/main/MemberList/index.tsx
@@ -604,6 +604,10 @@ const StyledMobileFilterWrapper = styled.div`
::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
}
+
+ & > div {
+ flex-shrink: 0;
+ }
`;
const StyledSwitchVertical = styled(IconSwitchVertical)`