From a1efa79f12abc23777dfce21b6499d31d6edce1a Mon Sep 17 00:00:00 2001 From: sooki88 Date: Sun, 7 Jul 2024 11:32:44 +0900 Subject: [PATCH 01/10] =?UTF-8?q?Fix:=20useMainStore,=20main-store-provide?= =?UTF-8?q?r=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(main)/_components/ChannelList.tsx | 17 +++++++---- src/app/page.tsx | 31 +++++++++++--------- src/components/Header.tsx | 2 +- src/providers/main-store-provider.tsx | 33 ++++++++++++++++++++++ src/stores/useChannelStore.ts | 22 --------------- src/stores/useMainStore.ts | 32 +++++++++++++++++++++ 6 files changed, 94 insertions(+), 43 deletions(-) create mode 100644 src/providers/main-store-provider.tsx delete mode 100644 src/stores/useChannelStore.ts create mode 100644 src/stores/useMainStore.ts diff --git a/src/app/(main)/_components/ChannelList.tsx b/src/app/(main)/_components/ChannelList.tsx index 511a338..ec982dc 100644 --- a/src/app/(main)/_components/ChannelList.tsx +++ b/src/app/(main)/_components/ChannelList.tsx @@ -1,9 +1,9 @@ 'use client'; import { useCallback, useEffect, useRef, useState } from 'react'; +import { useMainStore } from '@/providers/main-store-provider'; import { getSearchChannelList } from '@/services/channel'; import { GetChannelSearchResponse } from '@/services/channel/type'; -import { useChannelStore } from '@/stores/useChannelStore'; import { useInView } from 'react-intersection-observer'; import ChannelItem from './ChannelItem'; @@ -14,9 +14,15 @@ interface ChannelListProps { } const ChannelList = ({ query, channelsData }: ChannelListProps) => { - const { channels, setChannels, cursor, incrementCursor } = useChannelStore(); const [loading, setLoading] = useState(false); + const { channels, setChannels, addChannels, cursor } = useMainStore((state) => ({ + channels: state.channels, + setChannels: state.setChannels, + addChannels: state.addChannels, + cursor: state.cursor, + })); + const [ref, inView] = useInView(); const channelsRef = useRef(null); const noNextChannel = channelsData.page.total_count < cursor * 12; @@ -27,14 +33,13 @@ const ChannelList = ({ query, channelsData }: ChannelListProps) => { setLoading(true); const nextChannelsData = await getSearchChannelList({ - cursor: cursor + 1, + cursor: cursor, keyword: `${query ? query : ''}`, }); - setChannels(nextChannelsData.channels); - incrementCursor(); + addChannels(nextChannelsData.channels); setLoading(false); - }, [cursor, incrementCursor, loading, query, setChannels]); + }, [cursor, loading, query, addChannels]); useEffect(() => { if (channelsData && channelsData.channels) { diff --git a/src/app/page.tsx b/src/app/page.tsx index 76574e6..8a15eb6 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,5 +1,6 @@ import ChannelCreatorBox from '@/components/ChannelCreatorBox'; import SearchBar from '@/components/SearchBar'; +import { MainStoreProvider } from '@/providers/main-store-provider'; import { getSearchChannelList } from '@/services/channel'; import { PLACEHOLDER } from '@/utils/constants'; @@ -11,20 +12,22 @@ const MainPage = async () => { const noChannel = channelsData?.page.total_count === 0; return ( -
- {noChannel ? ( - - 생성된 채널이 없어서 조용하네요! -
- 폭탄뉴진세님의 채널을 기다릴지도! - - ) : ( - <> - - - - )} -
+ +
+ {noChannel ? ( + + 생성된 채널이 없어서 조용하네요! +
+ 폭탄뉴진세님의 채널을 기다릴지도! + + ) : ( + <> + + + + )} +
+ ); }; diff --git a/src/components/Header.tsx b/src/components/Header.tsx index b292374..552ec15 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -7,7 +7,7 @@ import { Button } from './ui/button'; function Header() { return ( -
+
; + +export const MainStoreContext = createContext(undefined); + +export interface MainStoreProviderProps { + children: ReactNode; +} + +export const MainStoreProvider = ({ children }: MainStoreProviderProps) => { + const storeRef = useRef(); + if (!storeRef.current) { + storeRef.current = createMainStore(); + } + + return {children}; +}; + +export const useMainStore = (selector: (store: CreateMainStoreType) => T): T => { + const mainStoreContext = useContext(MainStoreContext); + + if (!mainStoreContext) { + throw new Error('useMainStore은 반드시 MainStoreProvider 안에서 사용해야 합니다.'); + } + + return useStore(mainStoreContext, selector); +}; diff --git a/src/stores/useChannelStore.ts b/src/stores/useChannelStore.ts deleted file mode 100644 index 57b9a2e..0000000 --- a/src/stores/useChannelStore.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { SearchedChannel } from '@/services/channel/type'; -import { create } from 'zustand'; - -interface UseChannelStoreType { - channels: SearchedChannel[]; - setChannels: (data: SearchedChannel | SearchedChannel[]) => void; - cursor: number; - incrementCursor: () => void; -} - -export const useChannelStore = create((set) => ({ - channels: [], - setChannels: (data) => { - if (Array.isArray(data)) { - set({ channels: data }); - } else { - set((state) => ({ channels: [...state.channels, data] })); - } - }, - cursor: 1, - incrementCursor: () => set((state) => ({ cursor: state.cursor + 1 })), -})); diff --git a/src/stores/useMainStore.ts b/src/stores/useMainStore.ts new file mode 100644 index 0000000..764dba5 --- /dev/null +++ b/src/stores/useMainStore.ts @@ -0,0 +1,32 @@ +import { SearchedChannel } from '@/services/channel/type'; +import { createStore } from 'zustand'; + +export type MainStateType = { + channels: SearchedChannel[]; + cursor: number; +}; + +export type MainActionType = { + setChannels: (newChannels: SearchedChannel[]) => void; + addChannels: (newChannels: SearchedChannel[]) => void; + incrementCursor: () => void; +}; + +export type CreateMainStoreType = MainStateType & MainActionType; + +export const defaultData: MainStateType = { + channels: [], + cursor: 1, +}; + +export const createMainStore = (initState: MainStateType = defaultData) => { + return createStore()((set, get) => ({ + ...initState, + addChannels: (newChannels: SearchedChannel[]) => { + const { channels, cursor } = get(); + set({ channels: [...channels, ...newChannels], cursor: cursor + 1 }); + }, + setChannels: (newChannels: SearchedChannel[]) => set({ channels: newChannels }), + incrementCursor: () => set((state) => ({ cursor: state.cursor + 1 })), + })); +}; From 5b62445365a8a6bdbd76d7b66b429057de47bede Mon Sep 17 00:00:00 2001 From: sooki88 Date: Mon, 8 Jul 2024 14:16:01 +0900 Subject: [PATCH 02/10] =?UTF-8?q?Chore:=20=EC=B1=84=EB=84=90=20=EC=97=86?= =?UTF-8?q?=EC=9D=84=EB=95=8C=20=EB=AC=B8=EA=B5=AC=20=EC=88=98=EC=A0=95=20?= =?UTF-8?q?=EB=B0=8F=20=EC=84=9C=EC=B9=98=ED=8E=98=EC=9D=B4=EC=A7=80?= =?UTF-8?q?=EC=97=90=EC=84=9C=20=EB=92=A4=EB=A1=9C=EA=B0=80=EA=B8=B0=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/page.tsx | 6 +----- src/app/search/page.tsx | 17 +++++++---------- src/components/ChannelCreatorBox.tsx | 20 ++++++++++++++------ src/components/SearchBar.tsx | 4 ++-- src/utils/getNoChannelText.ts | 21 +++++++++++++++++++++ 5 files changed, 45 insertions(+), 23 deletions(-) create mode 100644 src/utils/getNoChannelText.ts diff --git a/src/app/page.tsx b/src/app/page.tsx index 8a15eb6..c3097b0 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -15,11 +15,7 @@ const MainPage = async () => {
{noChannel ? ( - - 생성된 채널이 없어서 조용하네요! -
- 폭탄뉴진세님의 채널을 기다릴지도! - + ) : ( <> diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx index 1207ce8..85bc938 100644 --- a/src/app/search/page.tsx +++ b/src/app/search/page.tsx @@ -1,5 +1,6 @@ import ChannelCreatorBox from '@/components/ChannelCreatorBox'; import SearchBar from '@/components/SearchBar'; +import { MainStoreProvider } from '@/providers/main-store-provider'; import { getSearchChannelList } from '@/services/channel'; import { PLACEHOLDER } from '@/utils/constants'; @@ -12,25 +13,21 @@ interface SearchPageProps { const SearchPage = async ({ searchParams }: SearchPageProps) => { const query = typeof searchParams.query === 'string' ? searchParams.query : ''; - const channelsData = await getSearchChannelList({ cursor: 1, keyword: query }); + const channelsData = query && (await getSearchChannelList({ cursor: 1, keyword: query })); - const noChannel = channelsData?.page.total_count === 0; + const noChannel = channelsData && channelsData?.page.total_count === 0; return ( - <> + {noChannel ? ( - - '{query}'로 검색된 채널이 없어요. -
- 폭탄뉴진세님이 먼저 만들어보는 건 어떠세요? - + ) : ( <> - + {channelsData && } )} - + ); }; diff --git a/src/components/ChannelCreatorBox.tsx b/src/components/ChannelCreatorBox.tsx index bb23580..0317dd9 100644 --- a/src/components/ChannelCreatorBox.tsx +++ b/src/components/ChannelCreatorBox.tsx @@ -1,21 +1,29 @@ -import { ReactNode } from 'react'; +'use client'; +import { getNoChannelText } from '@/utils/getNoChannelText'; import { PAGE_ROUTE } from '@/utils/route'; import { Plus } from 'lucide-react'; import Link from 'next/link'; +import { useSession } from 'next-auth/react'; import { Button } from './ui/button'; interface ChannelCreatorBoxProps { - page?: string; - children: ReactNode; + query?: string | undefined; } -const ChannelCreatorBox = ({ page = 'main', children }: ChannelCreatorBoxProps) => { +const ChannelCreatorBox = ({ query }: ChannelCreatorBoxProps) => { + const { data: session } = useSession(); + const username = session?.user?.name ?? undefined; + + const content = getNoChannelText(query, username); + return (
- {children} + {content && content.text1} +
+ {content && content.text2}
- {page === 'search' && ( + {query && ( { setSearchQuery(''); - router.replace(PAGE_ROUTE.HOME); + router.push(PAGE_ROUTE.HOME); }; const handleSubmit = (event: React.FormEvent) => { @@ -37,7 +37,7 @@ const SearchBar = ({ initialQuery = '', handleSearch, placeholder }: SearchBarPr if (handleSearch) { handleSearch(searchQuery); } else { - router.replace(PAGE_ROUTE.SEARCH(searchQuery)); + router.push(PAGE_ROUTE.SEARCH(searchQuery)); } }; diff --git a/src/utils/getNoChannelText.ts b/src/utils/getNoChannelText.ts new file mode 100644 index 0000000..5b3f6a6 --- /dev/null +++ b/src/utils/getNoChannelText.ts @@ -0,0 +1,21 @@ +export const getNoChannelText = (query: string | undefined, username: string | undefined) => { + switch (username) { + case undefined: + return ( + (query && { + text1: `${query}로 검색된 채널이 없어요.`, + text2: `로그인하면 직접 만들 수 있어요!`, + }) ?? { text1: '생성된 채널이 없어서 조용하네요!', text2: '로그인해서 먼저 만들어주세요!' } + ); + default: + return ( + (query && { + text1: `${query}로 검색된 채널이 없어요.`, + text2: `${username}님의 채널을 기다릴지도!`, + }) ?? { + text1: '생성된 채널이 없어서 조용하네요!', + text2: `${username}님이 먼저 만들어보는 건 어떠세요?`, + } + ); + } +}; From 83598955b93a6107d1243e20e1f8ce8f6fef4f5a Mon Sep 17 00:00:00 2001 From: sooki88 Date: Mon, 8 Jul 2024 14:29:54 +0900 Subject: [PATCH 03/10] =?UTF-8?q?Chore:=20/=EA=B3=BC=20/search=EC=9D=98=20?= =?UTF-8?q?=EB=A6=AC=EC=8A=A4=ED=8A=B8=EC=97=90=EC=84=9C=20=ED=95=B4?= =?UTF-8?q?=EC=8B=9C=ED=83=9C=EA=B7=B8=20=EC=84=A0=ED=83=9D=EC=8B=9C=20?= =?UTF-8?q?=ED=95=B4=EC=8B=9C=ED=83=9C=EA=B7=B8=EB=A1=9C=20=EA=B2=80?= =?UTF-8?q?=EC=83=89=EB=90=98=EA=B2=8C=20=ED=95=98=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/(main)/_components/Hashtags.tsx | 22 +++++++++++++++------- 1 file changed, 15 insertions(+), 7 deletions(-) diff --git a/src/app/(main)/_components/Hashtags.tsx b/src/app/(main)/_components/Hashtags.tsx index 5a983cd..24e0e80 100644 --- a/src/app/(main)/_components/Hashtags.tsx +++ b/src/app/(main)/_components/Hashtags.tsx @@ -1,5 +1,8 @@ import { useState, useEffect, useCallback } from 'react'; +import { PAGE_ROUTE } from '@/utils/route'; +import Link from 'next/link'; + interface HashtagsProps { hashtage: string; color: string; @@ -21,17 +24,18 @@ const Hashtags = ({ hashtage, color }: HashtagsProps) => { if (windowWidth >= 1200) { maxWidth = 180; - // maxWidth = 155; + /** maxWidth = 155; */ } else if (windowWidth >= 744) { maxWidth = 240; - // maxWidth = 215; + /** maxWidth = 215; */ } else if (windowWidth >= 375) { maxWidth = 283; - // maxWidth = 258; + /** maxWidth = 258; */ } for (let i = 0; i < hashtagArray.length; i++) { - const width = (hashtagArray[i].length - 1) * 12 + 9 + 5; // 전체 글자수 -1(#) * 글자당 12 + # 9 + gap 5 + const width = (hashtagArray[i].length - 1) * 12 + 9 + 5; + /** 전체 글자수 -1(#) * 글자당 12 + # 9 + gap 5 */ totalWidth += width; if (totalWidth > maxWidth) return; @@ -56,11 +60,15 @@ const Hashtags = ({ hashtage, color }: HashtagsProps) => { return (
{hashtagArray.map((tag, index) => { + const noSharpTag = tag.substring(tag.indexOf('#') + 1); + if (index < visibleIndex) return ( - - {tag} - + + + {tag} + + ); })} {restHashtagCount !== 0 && ( From 064ef6da9b4d4b6c2cff45bfbd5b18897ccfe883 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 17:54:22 +0900 Subject: [PATCH 04/10] =?UTF-8?q?build:=20develop=20=EB=B8=8C=EB=9E=9C?= =?UTF-8?q?=EC=B9=98=20=EB=B0=B0=ED=8F=AC=EC=9E=91=EC=97=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .github/workflows/deploy_develop.yml | 48 ++++++++++++++++++++++++++++ build.sh | 12 +++++++ 2 files changed, 60 insertions(+) create mode 100644 .github/workflows/deploy_develop.yml create mode 100644 build.sh diff --git a/.github/workflows/deploy_develop.yml b/.github/workflows/deploy_develop.yml new file mode 100644 index 0000000..81c4936 --- /dev/null +++ b/.github/workflows/deploy_develop.yml @@ -0,0 +1,48 @@ +name: Deploy-Develop + +on: + push: + branches: ['develop'] + +jobs: + build: + runs-on: ubuntu-latest + + container: pandoc/latex + + steps: + - uses: actions/checkout@v2 + + - name: Install mustache (to update the date) + + run: apk add ruby && gem install mustache + + - name: creates output + + run: sh ./build.sh + + - name: Pushes to another repository + + id: push_directory + + uses: cpina/github-action-push-to-another-repository@main + + env: + API_TOKEN_GITHUB: ${{ secrets.AUTO_ACTIONS }} + + with: + source-directory: 'output' + + destination-github-username: Si-off + + destination-repository-name: partage_web_develop + + user-email: ${{ secrets.EMAIL }} + + commit-message: ${{ github.event.commits[0].message }} + + target-branch: main + + - name: Test get variable exported by push-to-another-repository + + run: echo $DESTINATION_CLONED_DIRECTORY diff --git a/build.sh b/build.sh new file mode 100644 index 0000000..64a7a3a --- /dev/null +++ b/build.sh @@ -0,0 +1,12 @@ +#!/bin/sh + +# 상위 디렉토리로 이동 +cd ../ || { echo "Failed to change directory"; exit 1; } + +# output 디렉토리 생성 (이미 존재하면 무시) +mkdir -p output + +# partage_web의 모든 파일과 디렉토리를 output으로 복사 +cp -R ./partage_web/* ./output + +echo "Script executed successfully." From d0c77fc929d7eb939ad7421760e2379bef5bf100 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 18:00:22 +0900 Subject: [PATCH 05/10] =?UTF-8?q?build:=20develop=20=EB=B0=B0=ED=8F=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build.sh | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/build.sh b/build.sh index 64a7a3a..01a8693 100644 --- a/build.sh +++ b/build.sh @@ -1,12 +1,10 @@ + #!/bin/sh -# 상위 디렉토리로 이동 -cd ../ || { echo "Failed to change directory"; exit 1; } +cd ../ -# output 디렉토리 생성 (이미 존재하면 무시) -mkdir -p output +mkdir output -# partage_web의 모든 파일과 디렉토리를 output으로 복사 -cp -R ./partage_web/* ./output +cp -R ./[team-repo-name]/* ./output -echo "Script executed successfully." +cp -R ./output ./[team-repo-name]/ \ No newline at end of file From 4e3d67dc55e886a37e4ac3be5f5ae7d49eddb9f4 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 18:14:18 +0900 Subject: [PATCH 06/10] =?UTF-8?q?build:=20develop=20=EB=B0=B0=ED=8F=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build.sh | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/build.sh b/build.sh index 01a8693..b444e6c 100644 --- a/build.sh +++ b/build.sh @@ -1,10 +1,5 @@ - #!/bin/sh - cd ../ - mkdir output - -cp -R ./[team-repo-name]/* ./output - -cp -R ./output ./[team-repo-name]/ \ No newline at end of file +cp -R ./partage_web/* ./output +cp -R ./output ./partage_web/ \ No newline at end of file From 5dad8bda48cb84995f2274210f090fbdbff44045 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 18:23:00 +0900 Subject: [PATCH 07/10] =?UTF-8?q?fix:=20=EB=B9=8C=EB=93=9C=20=EC=97=90?= =?UTF-8?q?=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Edge 런타임에서 동적 코드 평가 문제 --- src/lib/fetcher/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/fetcher/index.ts b/src/lib/fetcher/index.ts index eef0582..b6e59ae 100644 --- a/src/lib/fetcher/index.ts +++ b/src/lib/fetcher/index.ts @@ -1,4 +1,4 @@ -import { merge } from 'lodash'; +import merge from 'lodash/merge'; import qs from 'qs'; type FetcherRequestInit = Omit; From 5e930b81846587de0d56f6518362de00b1e55e39 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 18:57:37 +0900 Subject: [PATCH 08/10] =?UTF-8?q?fix:=20Dynamic=20code=20evaluation=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit refs: https://github.com/lodash/lodash/issues/5525#issuecomment-2127680313 --- next.config.mjs | 1 + 1 file changed, 1 insertion(+) diff --git a/next.config.mjs b/next.config.mjs index 62b4f1e..f2ff000 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,5 +1,6 @@ /** @type {import('next').NextConfig} */ const nextConfig = { + unstable_allowDynamic: ['*lodash.js'], images: { remotePatterns: [ { From e7186b30c3a4540b47bd1b83f0388a7a7a347db8 Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 19:05:42 +0900 Subject: [PATCH 09/10] =?UTF-8?q?fix:=20lodash=20edge=20=EB=9F=B0=ED=83=80?= =?UTF-8?q?=EC=9E=84=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- next.config.mjs | 1 + 1 file changed, 1 insertion(+) diff --git a/next.config.mjs b/next.config.mjs index f2ff000..8a7a4cc 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,5 +1,6 @@ /** @type {import('next').NextConfig} */ const nextConfig = { + runtime: 'edge', unstable_allowDynamic: ['*lodash.js'], images: { remotePatterns: [ From 207d7d325e732d2431569ccd50d0ecde309f67dc Mon Sep 17 00:00:00 2001 From: noismik Date: Mon, 8 Jul 2024 19:21:18 +0900 Subject: [PATCH 10/10] =?UTF-8?q?fix:=20lodash/merge=20edge=20=EB=9F=B0?= =?UTF-8?q?=ED=83=80=EC=9E=84=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- next.config.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/next.config.mjs b/next.config.mjs index 8a7a4cc..074e23d 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -1,7 +1,7 @@ /** @type {import('next').NextConfig} */ const nextConfig = { runtime: 'edge', - unstable_allowDynamic: ['*lodash.js'], + unstable_allowDynamic: ['lodash/merge.js'], images: { remotePatterns: [ {