Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: 커피챗 마무리작업 #1647

Merged
merged 5 commits into from
Nov 4, 2024
Merged

feat: 커피챗 마무리작업 #1647

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
7edad1b
feat: 오픈 버튼 로직 수정
seojisoosoo Nov 3, 2024
356f274
fix: 오픈 로직 에러 잡기
seojisoosoo Nov 3, 2024
4ae1786
feat: 전화번호 존재하는 경우에만 보이기
seojisoosoo Nov 3, 2024
c8dd4ac
feat: 커피챗 수정 로직 수정
seojisoosoo Nov 3, 2024
7b005fd
fix: 커피챗 수정 로직 커리어 타입 따른 분기 수정
seojisoosoo Nov 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/api/endpoint/coffeechat/getCoffeechatDetail.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { useQuery } from '@tanstack/react-query';
import { z } from 'zod';

import { createEndpoint } from '@/api/typedAxios';
import { useQuery } from '@tanstack/react-query';

const CoffeechatDetailSchema = z.object({
bio: z.string(),
Expand All @@ -21,6 +21,7 @@ const CoffeechatDetailSchema = z.object({
isBlind: z.boolean().nullable(),
profileImage: z.string().nullable(),
isCoffeeChatActivate: z.boolean().nullable(),
sections: z.array(z.string()),
});

export const getCoffeechatDetail = createEndpoint({
Expand Down
117 changes: 54 additions & 63 deletions src/components/coffeechat/CoffeeChatCategory/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,7 @@ import styled from '@emotion/styled';
import { colors } from '@sopt-makers/colors';
import { fonts } from '@sopt-makers/fonts';
import { IconChevronDown } from '@sopt-makers/icons';
import { SelectV2 } from '@sopt-makers/ui';
import { SearchField } from '@sopt-makers/ui';
import { width100 } from '@toss/emotion-utils';
import { SearchField, SelectV2 } from '@sopt-makers/ui';
import { useEffect, useState } from 'react';

import { useGetMembersCoffeeChat } from '@/api/endpoint/members/getMembersCoffeeChat';
Expand All @@ -21,16 +19,12 @@ import Loading from '@/components/common/Loading';
import Responsive from '@/components/common/Responsive';
import {
MB_BIG_MEDIA_QUERY,
MB_BIG_WIDTH,
MB_MID_MEDIA_QUERY,
MB_SM_MEDIA_QUERY,
MOBILE_MEDIA_QUERY,
PCTA_BIG_MEDIA_QUERY,
PCTA_MID_MEDIA_QUERY,
PCTA_S_MEDIA_QUERY,
PCTA_S_WIDTH,
PCTA_SM_MEDIA_QUERY,
PCTA_SM_WIDTH,
} from '@/styles/mediaQuery';

export default function CoffeeChatCategory() {
Expand Down Expand Up @@ -86,7 +80,7 @@ export default function CoffeeChatCategory() {
</SelectV2.Root>

<SelectV2.Root
className='career-select'
className='career-select'
onChange={(e: number) => setCareer(CAREER_FILTER_OPTIONS[e - 1].label)}
defaultValue={CAREER_FILTER_OPTIONS.find((option) => option.label === career)}
type='text'
Expand All @@ -103,7 +97,7 @@ export default function CoffeeChatCategory() {
</SelectV2.Root>

<SelectV2.Root
className='part-select'
className='part-select'
onChange={(e: number) => setPart(PART_FILTER_OPTIONS[e - 1].label)}
defaultValue={PART_FILTER_OPTIONS.find((option) => option.label === part)}
type='text'
Expand Down Expand Up @@ -177,8 +171,8 @@ export default function CoffeeChatCategory() {
}))}
placeholder='분야'
trigger={(placeholder) => (
<MobileFilterTrigger selected={section.length>0} value={section}>
{section?section:placeholder}
<MobileFilterTrigger selected={section.length > 0} value={section}>
{section ? section : placeholder}
<StyledChevronDown />
</MobileFilterTrigger>
)}
Expand All @@ -192,8 +186,8 @@ export default function CoffeeChatCategory() {
}))}
placeholder='주제'
trigger={(placeholder) => (
<MobileFilterTrigger selected={topicType.length>0}>
{topicType?topicType:placeholder}
<MobileFilterTrigger selected={topicType.length > 0}>
{topicType ? topicType : placeholder}
<StyledChevronDown />
</MobileFilterTrigger>
)}
Expand All @@ -207,8 +201,8 @@ export default function CoffeeChatCategory() {
}))}
placeholder='경력'
trigger={(placeholder) => (
<MobileFilterTrigger selected={career.length>0}>
{career?career:placeholder}
<MobileFilterTrigger selected={career.length > 0}>
{career ? career : placeholder}
<StyledChevronDown />
</MobileFilterTrigger>
)}
Expand All @@ -222,8 +216,8 @@ export default function CoffeeChatCategory() {
}))}
placeholder='파트'
trigger={(placeholder) => (
<MobileFilterTrigger selected={part.length>0}>
{part?part:placeholder}
<MobileFilterTrigger selected={part.length > 0}>
{part ? part : placeholder}
<StyledChevronDown />
</MobileFilterTrigger>
)}
Expand Down Expand Up @@ -272,11 +266,11 @@ const Container = styled.div`
align-items: center;
justify-content: center;
margin-top: 48px;
.responsive-mobile-only{
@media ${MB_BIG_MEDIA_QUERY}{
width:100%;
}

.responsive-mobile-only {
@media ${MB_BIG_MEDIA_QUERY} {
width: 100%;
}
}
@media ${PCTA_S_MEDIA_QUERY} {
margin-top: 28px;
Expand All @@ -294,11 +288,11 @@ const Header = styled.div`
margin-bottom: 24px;
width: 100%;
width: 1300px;
@media ${PCTA_BIG_MEDIA_QUERY}{
width:866px;
@media ${PCTA_BIG_MEDIA_QUERY} {
width: 866px;
}
@media ${PCTA_SM_MEDIA_QUERY}{
padding-left:30px;
@media ${PCTA_SM_MEDIA_QUERY} {
padding-left: 30px;
width: 100%;
}
@media ${PCTA_S_MEDIA_QUERY} {
Expand Down Expand Up @@ -427,47 +421,45 @@ const SelectFilterArea = styled.div`
white-space: nowrap;
}

.topic-select{
.topic-select {
width: 130px;

button{
width:130px;
button {
width: 130px;

div{
width:130px;
div {
width: 130px;
}
}
}

.career-select{
width:162px;
.career-select {
width: 162px;

button{
width:162px;
button {
width: 162px;

div{
width:162px;
div {
width: 162px;
}
}
}

.part-select{
width:109px;
.part-select {
width: 109px;

button{
width:109px;
button {
width: 109px;

div{
width:109px;
div {
width: 109px;
}
}
}


ul {
z-index: 203;
z-index: 99;
}

`;

const StyledSearchField = styled(SearchField)`
Expand All @@ -480,16 +472,16 @@ const StyledSearchField = styled(SearchField)`
width: 424px;
}
@media ${MB_BIG_MEDIA_QUERY} {
padding-right:20px;
padding-left:20px;
padding-right: 20px;
padding-left: 20px;
width: 100%;

button{
right:15px;
button {
right: 15px;
}
}
@media ${MB_MID_MEDIA_QUERY} {
width: 100%
width: 100%;
}
`;
const LoadingContainer = styled.div`
Expand Down Expand Up @@ -587,7 +579,6 @@ const StyledChevronDown = styled(IconChevronDown)`

const StyledMobileFilter = styled(CoffeeChatFilterSheet)`
flex: none;

`;

const StyledMobileFilterWrapper = styled.div`
Expand All @@ -603,26 +594,26 @@ const StyledMobileFilterWrapper = styled.div`
/* to disable scroll bar */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
button{
width:auto;
button {
width: auto;
}

::-webkit-scrollbar {
display: none; /* Chrome, Safari, Opera */
}
@media ${PCTA_S_MEDIA_QUERY}{
padding:0;
width:424px;
@media ${PCTA_S_MEDIA_QUERY} {
padding: 0;
width: 424px;

button{
width:100px;
button {
width: 100px;
white-space: nowrap;
}
}
@media ${MB_BIG_MEDIA_QUERY}{
padding-right:20px;
padding-left:20px;
width:auto;
@media ${MB_BIG_MEDIA_QUERY} {
padding-right: 20px;
padding-left: 20px;
width: auto;
max-width: 100%;
}
`;
Loading
Loading