From fa18f308d071928448bf0009598ebb8c62425338 Mon Sep 17 00:00:00 2001 From: ocahs9 Date: Wed, 20 Nov 2024 03:16:35 +0900 Subject: [PATCH 1/4] =?UTF-8?q?feat:=20=EC=97=94=ED=84=B0=EB=A5=BC=20?= =?UTF-8?q?=ED=86=B5=ED=95=B4=20=EC=84=A0=ED=83=9D=20=EC=8B=9C=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=20=EC=95=88=EB=90=A8=20=ED=91=9C=EC=8B=9C=20-=20?= =?UTF-8?q?=ED=9D=B0=EC=83=89=20=ED=85=8D=EC=8A=A4=ED=8A=B8=20=EC=83=89=20?= =?UTF-8?q?=EC=9C=A0=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/form/SearchMention/index.tsx | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/form/SearchMention/index.tsx b/src/components/form/SearchMention/index.tsx index af7c186b..aa699fa4 100644 --- a/src/components/form/SearchMention/index.tsx +++ b/src/components/form/SearchMention/index.tsx @@ -99,7 +99,9 @@ const SearchMention = ({ <> handleUserClick(suggestion as mentionableDataType)} + onClick={() => { + handleUserClick(suggestion as mentionableDataType); + }} onKeyDown={(e: React.KeyboardEvent) => { //엔터 누르면 간편히 설정되도록 하고 싶은데, //위에 react-mention의 li(aria-selected 속성 사용)를 조작해야할 것 같아서.. 아직은 구현 못함 @@ -176,6 +178,13 @@ const SearchMention = ({ return data; }} renderSuggestion={renderSuggestion} + // onKeyDown={(e: React.KeyboardEvent) => { + // if (e.key === 'Enter') { + // // 엔터 키를 눌렀을 때 기본 동작(개행) 방지 + // console.log('hiss'); + // e.preventDefault(); + // } + // }} /> ); @@ -225,7 +234,6 @@ const FeedModalMentionStyle = { lineHeight: 'inherit', }, highlighter: { - color: colors.success, innerHeight: '0', border: 'none', padding: '0', From efccb1e773ff7fdc2abd979d0d04dae582934c2a Mon Sep 17 00:00:00 2001 From: ocahs9 Date: Wed, 20 Nov 2024 03:34:00 +0900 Subject: [PATCH 2/4] =?UTF-8?q?feat:=20=EC=BB=A4=EC=84=9C=20=EC=B4=88?= =?UTF-8?q?=EB=B0=98=20=ED=81=AC=EA=B8=B0=20=ED=82=A4=EC=9A=B0=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/form/SearchMention/index.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/components/form/SearchMention/index.tsx b/src/components/form/SearchMention/index.tsx index aa699fa4..5f857086 100644 --- a/src/components/form/SearchMention/index.tsx +++ b/src/components/form/SearchMention/index.tsx @@ -215,6 +215,7 @@ const FeedModalMentionStyle = { boxSizing: 'border-box', }, input: { + //요 부분이 textArea! color: colors.gray50, innerHeight: '0', borderRadius: '10px', @@ -226,6 +227,7 @@ const FeedModalMentionStyle = { boxSizing: 'border-box', overflow: 'auto', width: '100%', + height: '30px', maxHeight: '208px', overscrollBehavior: 'none', fontFamily: 'inherit', From 065444d1d6ef22fb0e3333fce8f4fddcbc654e80 Mon Sep 17 00:00:00 2001 From: ocahs9 Date: Wed, 20 Nov 2024 03:45:38 +0900 Subject: [PATCH 3/4] =?UTF-8?q?feat:=20AddButton=20=EC=9E=AC=ED=81=B4?= =?UTF-8?q?=EB=A6=AD=20=EB=B0=8F=20=EC=9D=B4=EC=99=B8=20=EA=B3=B5=EA=B0=84?= =?UTF-8?q?=20=ED=81=B4=EB=A6=AD=EC=8B=9C=20input=20=EB=8B=AB=ED=9E=88?= =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../form/Presentation/CoLeader/index.tsx | 18 ++++++++++++++---- 1 file changed, 14 insertions(+), 4 deletions(-) diff --git a/src/components/form/Presentation/CoLeader/index.tsx b/src/components/form/Presentation/CoLeader/index.tsx index 6e05dc50..b6e017cb 100644 --- a/src/components/form/Presentation/CoLeader/index.tsx +++ b/src/components/form/Presentation/CoLeader/index.tsx @@ -40,7 +40,8 @@ interface metionUserType { const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps) => { const { data: user } = useQueryMyProfile(); const { data: mentionUserList } = useQueryGetMentionUsers(); - //API 연결에서 타입을 지정해두지 않았기 때문에 any 이용 + const containerRef = useRef(null); + const filteredMeList = mentionUserList?.filter((mentionUser: metionUserType) => mentionUser.userId !== user?.id); const handleUserSelect = (user: mentionableDataType) => { @@ -64,8 +65,17 @@ const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps setIsMobile(window.innerWidth <= 414); }; window.addEventListener('resize', handleResize); + + const handleClickOutSide = (event: MouseEvent) => { + if (containerRef.current && !containerRef.current.contains(event.target as Node)) setShowInput(false); + }; + handleResize(); // Initial check - return () => window.removeEventListener('resize', handleResize); + document.addEventListener('mousedown', handleClickOutSide); + return () => { + window.removeEventListener('resize', handleResize); + document.removeEventListener('mousedown', handleClickOutSide); + }; }, []); const handleBackdropClick = () => { @@ -78,7 +88,7 @@ const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps }; return ( - + {/*추가 버튼과 멘션 인풋 */} {coLeaders.length < 3 && ( @@ -86,7 +96,7 @@ const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps { - setShowInput(true); + setShowInput(prev => !prev); setComment(''); }} isActive={showInput} From 7bffe515de42378f03f7621367d26c057c68edd9 Mon Sep 17 00:00:00 2001 From: ocahs9 Date: Fri, 22 Nov 2024 16:24:49 +0900 Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=EC=97=94=EB=93=9C=ED=8F=AC=EC=9D=B8?= =?UTF-8?q?=ED=8A=B8=20=EB=8B=A4=EC=8B=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/index.ts | 4 +--- src/components/form/SearchMention/index.tsx | 1 + 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/api/index.ts b/src/api/index.ts index e5a5f2ae..261cd274 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -8,9 +8,7 @@ export type PromiseResponse = { data: T; statusCode: number }; export type Data = PromiseResponse; const baseURL = - process.env.NEXT_PUBLIC_APP_ENV === 'production' - ? 'https://crew.api.prod.sopt.org' - : 'https://crew.api.develop.sopt.org'; + process.env.NEXT_PUBLIC_APP_ENV === 'production' ? 'https://crew.api.prod.sopt.org' : 'https://crew.api.dev.sopt.org'; const playgroundBaseURL = process.env.NEXT_PUBLIC_APP_ENV === 'production' diff --git a/src/components/form/SearchMention/index.tsx b/src/components/form/SearchMention/index.tsx index 5f857086..958cead0 100644 --- a/src/components/form/SearchMention/index.tsx +++ b/src/components/form/SearchMention/index.tsx @@ -162,6 +162,7 @@ const SearchMention = ({ onKeyDown={(e: React.KeyboardEvent) => { if (e.key === 'Enter') { // 엔터 키를 눌렀을 때 기본 동작(개행) 방지 + console.log('hi'); e.preventDefault(); } }}