Merge pull request #539 from gloddy-dev/feature/521-set-country

Feature : 국가 설정 구현

.github/CODEOWNERS

@@ -1 +1 @@
-* @guesung @kangju2000
+* @guesung @dev-dong-su

README.md

@@ -34,10 +34,10 @@ Gloddy는 국적에 상관없이 자유롭게 모임을 형성하고 원하는 
  </tr>
  <tr>
  <td align="center">
-  <a href="https://play.google.com/store/apps/details?id=com.goodcode.gloddy&pcampaignid=web_share"><img src="https://github.com/gloddy-dev/gloddy-client/assets/23312485/7c02379a-4c8f-4428-b3fd-686d34a0b220" width="400px" /></a> 
+  <a href="https://apps.apple.com/kr/app/gloddy/id6463738953"><img src="https://github.com/gloddy-dev/gloddy-client/assets/23312485/7c02379a-4c8f-4428-b3fd-686d34a0b220" width="400px" /></a> 
  </td>
  <td align="center">
-  <a href="https://apps.apple.com/kr/app/gloddy/id6463738953"><img src="https://github.com/gloddy-dev/gloddy-client/assets/23312485/9971e47d-cf65-4df5-80d7-0dfaf7640909" width="400px" /></a>
+  <a href="https://play.google.com/store/apps/details?id=com.goodcode.gloddy&pcampaignid=web_share"><img src="https://github.com/gloddy-dev/gloddy-client/assets/23312485/9971e47d-cf65-4df5-80d7-0dfaf7640909" width="400px" /></a>
  </td>
  </tr>
 </table>

next.config.mjs

@@ -1,5 +1,4 @@
 import withPlaiceholder from '@plaiceholder/next';
-
 import { withSentryConfig } from '@sentry/nextjs';
 
 /**
@@ -12,6 +11,10 @@ const nextConfig = {
  protocol: 'https',
  hostname: 'gloddy.s3.ap-northeast-2.amazonaws.com',
  },
+ {
+ protocol: 'https',
+ hostname: 'opendata.mofa.go.kr',
+ },
  ],
  },
  experimental: {

src/apis/auth/type.ts

@@ -64,6 +64,8 @@ export interface SignUpRequest {
  birth: string;
  gender: GenderType;
  personalities: string[];
+ countryName: string;
+ countryImage: string;
 }
 
 export interface SignUpResponse {

src/apis/profile/queries.ts

@@ -4,9 +4,15 @@ import { useSuspenseQuery } from '@suspensive/react-query';
 export const useGetProfile = () =>
  useSuspenseQuery(Keys.getProfile(), getProfile, {
  select: (data) => {
- const { introduce } = data;
- const defaultIntroduce = introduce ?? '';
- return { ...data, introduce: defaultIntroduce };
+ const { introduce, countryName, countryImage } = data;
+ return {
+ ...data,
+ introduce: introduce || '',
+ countryName: countryName || 'Korea',
+ countryImage:
+ countryImage ||
+ 'https://opendata.mofa.go.kr:8444/fileDownload/images/country_images/flags/241/20220224_233513043.gif',
+ };
  },
  });
 

src/apis/profile/type.ts

@@ -17,15 +17,19 @@ export interface ProfileResponse {
  participatedGroupCount: 0;
  praiseCount: number;
  reviewCount: number;
+ countryName: string;
+ countryImage: string;
 }
 
 export interface ProfileRequest {
  imageUrl: string;
  name: string;
- birth: string;
  gender: 'MAIL' | 'FEMAIL';
  introduce: string;
  personalities: Array<PersonalityType['keywordDTO']>;
+ countryName: string;
+ countryImage: string;
+ birth: string;
 }
 
 export interface PraisesResponse {

src/app/[lng]/(main)/community/page.tsx

@@ -3,7 +3,6 @@ import ContentSection from './components/ContentSection.client';
 import { FloatAddButton } from '@/components/Button';
 import { Footer } from '@/components/Footer';
 import { NavLink } from '@/components/NavLink';
-import { PageAnimation } from '@/components/PageAnimation';
 import { Spacing } from '@/components/Spacing';
 
 interface CommunityPageProps {
@@ -16,9 +15,7 @@ export default function CommunityPage({ params: { lng } }: CommunityPageProps) {
  return (
  <>
  <CommunityHeader lng={lng} />
- <PageAnimation>
- <ContentSection />
- </PageAnimation>
+ <ContentSection />
  <div className="fixed inset-x-0 bottom-0 mx-auto h-70 max-w-450">
  <NavLink href="/community/write">
  <FloatAddButton className="absolute bottom-90 right-20 ml-auto" />

src/app/[lng]/(main)/grouping/[groupId]/apply/page.tsx

@@ -1,7 +1,6 @@
 import ApplyHeader from './components/ApplyHeader';
 import InputForm from './components/InputForm.client';
 import { serverTranslation } from '@/app/i18n';
-import { PageAnimation } from '@/components/PageAnimation';
 import { Spacing } from '@/components/Spacing';
 
 interface GroupingApplyPageProps {
@@ -15,13 +14,11 @@ export default async function ApplyPage({ params: { lng } }: GroupingApplyPagePr
 
  return (
  <main className="px-20">
- <PageAnimation>
- <ApplyHeader />
- <Spacing size={32} />
- <h4 className="text-h4 text-sign-cto">{t('apply.description')}</h4>
- <Spacing size={36} />
- <InputForm />
- </PageAnimation>
+ <ApplyHeader />
+ <Spacing size={32} />
+ <h4 className="text-h4 text-sign-cto">{t('apply.description')}</h4>
+ <Spacing size={36} />
+ <InputForm />
  </main>
  );
 }

src/app/[lng]/(main)/grouping/[groupId]/articles/[articleId]/components/ArticleHeader.client.tsx

@@ -5,7 +5,7 @@ import { useTranslation } from '@/app/i18n/client';
 import { IconButton } from '@/components/Button';
 import { Header } from '@/components/Header';
 import { Icon } from '@/components/Icon';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import useAppRouter from '@/hooks/useAppRouter';
 import { useNumberParams } from '@/hooks/useNumberParams';
 import { Suspense } from 'react';
@@ -23,9 +23,7 @@ export default function ArticleHeader() {
  </Header.Left>
  <Header.Right>
  <Suspense>
- <PageAnimation>
- <IconButtonAction />
- </PageAnimation>
+ <IconButtonAction />
  </Suspense>
  </Header.Right>
  </Header>

src/app/[lng]/(main)/grouping/[groupId]/articles/[articleId]/page.tsx

@@ -4,7 +4,7 @@ import CommentForm from './components/CommentForm';
 import { Keys, getArticle } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { HydrationProvider } from '@/components/Provider';
 import { Spacing } from '@/components/Spacing';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
@@ -27,14 +27,12 @@ export default function ArticlePage({ params }: ArticleDetailPageProps) {
  rejectedFallback={RejectedFallback}
  pendingFallback={<Loading className="h-[calc(100dvh-250px)]" />}
  >
- <PageAnimation>
- <HydrationProvider
- queryFn={() => getArticle(groupId, articleId)}
- queryKey={Keys.getArticle(groupId, articleId)}
- >
- <ArticleDetail />
- </HydrationProvider>
- </PageAnimation>
+ <HydrationProvider
+ queryFn={() => getArticle(groupId, articleId)}
+ queryKey={Keys.getArticle(groupId, articleId)}
+ >
+ <ArticleDetail />
+ </HydrationProvider>
  </QueryAsyncBoundary>
  <Spacing size={100} />
  <CommentForm />

src/app/[lng]/(main)/grouping/[groupId]/manage/page.tsx

@@ -3,7 +3,7 @@ import ManageHeader from './components/ManageHeader.client';
 import { Keys, getApplies } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 
@@ -20,14 +20,9 @@ export default function GroupingManagePage({ params }: GroupingManagePageProps)
  <>
  <ManageHeader />
  <QueryAsyncBoundary rejectedFallback={RejectedFallback} pendingFallback={<Loading />}>
- <PageAnimation>
- <HydrationProvider
- queryFn={() => getApplies(groupId)}
- queryKey={Keys.getApplies(groupId)}
- >
- <ManageDetail />
- </HydrationProvider>
- </PageAnimation>
+ <HydrationProvider queryFn={() => getApplies(groupId)} queryKey={Keys.getApplies(groupId)}>
+ <ManageDetail />
+ </HydrationProvider>
  </QueryAsyncBoundary>
  </>
  );

src/app/[lng]/(main)/grouping/[groupId]/members/page.tsx

@@ -3,7 +3,7 @@ import MembersHeader from './components/MembersHeader.client';
 import { Keys, getGroupMembers } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 
@@ -20,14 +20,12 @@ export default function GroupingMembersPage({ params }: GroupingMembersPageProps
  <>
  <MembersHeader />
  <QueryAsyncBoundary rejectedFallback={RejectedFallback} pendingFallback={<Loading />}>
- <PageAnimation>
- <HydrationProvider
- queryFn={() => getGroupMembers(groupId)}
- queryKey={Keys.getGroupMembers(groupId)}
- >
- <MemeberList />
- </HydrationProvider>
- </PageAnimation>
+ <HydrationProvider
+ queryFn={() => getGroupMembers(groupId)}
+ queryKey={Keys.getGroupMembers(groupId)}
+ >
+ <MemeberList />
+ </HydrationProvider>
  </QueryAsyncBoundary>
  </>
  );

src/app/[lng]/(main)/grouping/[groupId]/page.tsx

@@ -3,7 +3,6 @@ import GroupDetailHeader from './components/GroupDetailHeader.client';
 import { Keys, getGroupDetail, getGroupMembers, getNotices } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 

src/app/[lng]/(main)/grouping/[groupId]/write/page.tsx

@@ -3,7 +3,6 @@ import WriteHeader from './components/WriteHeader.client';
 import { Keys, getGroupDetail } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 
@@ -17,7 +16,7 @@ export default function WritePage({ params }: WritePageProps) {
  const groupId = Number(params.groupId);
 
  return (
- <PageAnimation className="flex h-full flex-col">
+ <div className="flex h-full flex-col">
  <WriteHeader />
  <QueryAsyncBoundary rejectedFallback={RejectedFallback} pendingFallback={<Loading />}>
  <HydrationProvider
@@ -27,6 +26,6 @@ export default function WritePage({ params }: WritePageProps) {
  <InputForm />
  </HydrationProvider>
  </QueryAsyncBoundary>
- </PageAnimation>
+ </div>
  );
 }

src/app/[lng]/(main)/grouping/create/funnels/CreateGroupFunnel.client.tsx

@@ -5,7 +5,7 @@ import MeetDateStep from './meetDate/MeetDateStep.client';
 import CreateHeader from '../components/CreateHeader.client';
 import { usePostCreateGroup } from '@/apis/groups';
 import { LayerLoading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { useFunnel } from '@/hooks/useFunnel';
 import { format } from 'date-fns';
 

src/app/[lng]/(main)/grouping/page.tsx

@@ -3,8 +3,6 @@ import GroupingCardList from './components/GroupingCardList.client';
 import GroupingHeader from './components/GroupingHeader';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Footer } from '@/components/Footer';
-import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
 import { Spacing } from '@/components/Spacing';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 

src/app/[lng]/(main)/meeting/participate/components/ContentSection.client.tsx

@@ -4,7 +4,6 @@ import ParticipatingContent from './ParticipatingContent.client';
 import WaitingContent from './WaitingContent.client';
 import { useTranslation } from '@/app/i18n/client';
 import { Tabs } from '@/components/Tabs';
-import { Suspense } from 'react';
 
 export default function ContentSection() {
  const { t } = useTranslation('meeting');
@@ -17,19 +16,13 @@ export default function ContentSection() {
  <Tabs.Tab value="feedback" text={t('home.evaluation')} />
  </Tabs.List>
  <Tabs.Panel value="participating">
- <Suspense>
- <ParticipatingContent />
- </Suspense>
+ <ParticipatingContent />
  </Tabs.Panel>
  <Tabs.Panel value="waiting">
- <Suspense>
- <WaitingContent />
- </Suspense>
+ <WaitingContent />
  </Tabs.Panel>
  <Tabs.Panel value="feedback">
- <Suspense>
- <FeedbackContent />
- </Suspense>
+ <FeedbackContent />
  </Tabs.Panel>
  </Tabs>
  );

src/app/[lng]/(main)/meeting/participate/feedback/[groupId]/page.tsx

@@ -3,7 +3,7 @@ import FeedbackProvider from './components/FeedbackProvider.client';
 import { Keys, getEstimate } from '@/apis/groups';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 
@@ -18,16 +18,11 @@ export default function page({ params }: PageProps) {
 
  return (
  <QueryAsyncBoundary rejectedFallback={RejectedFallback} pendingFallback={<Loading />}>
- <PageAnimation>
- <HydrationProvider
- queryKey={Keys.getEstimate(groupId)}
- queryFn={() => getEstimate(groupId)}
- >
- <FeedbackProvider>
- <FeedbackFunnel />
- </FeedbackProvider>
- </HydrationProvider>
- </PageAnimation>
+ <HydrationProvider queryKey={Keys.getEstimate(groupId)} queryFn={() => getEstimate(groupId)}>
+ <FeedbackProvider>
+ <FeedbackFunnel />
+ </FeedbackProvider>
+ </HydrationProvider>
  </QueryAsyncBoundary>
  );
 }

src/app/[lng]/(main)/meeting/scrap/page.tsx

@@ -4,7 +4,7 @@ import { Keys, getMeetingScrap } from '@/apis/meeting';
 import { RejectedFallback } from '@/components/ErrorBoundary';
 import { Footer } from '@/components/Footer';
 import { Loading } from '@/components/Loading';
-import { PageAnimation } from '@/components/PageAnimation';
+
 import { HydrationProvider } from '@/components/Provider';
 import { QueryAsyncBoundary } from '@suspensive/react-query';
 
@@ -19,11 +19,9 @@ export default function MeetingPage({ params: { lng } }: MeetingPageProps) {
  <>
  <MeetingScrapHeader />
  <QueryAsyncBoundary rejectedFallback={RejectedFallback} pendingFallback={<Loading />}>
- <PageAnimation>
- <HydrationProvider queryFn={getMeetingScrap} queryKey={Keys.getMeetingScraps()}>
- <ContentSection />
- </HydrationProvider>
- </PageAnimation>
+ <HydrationProvider queryFn={getMeetingScrap} queryKey={Keys.getMeetingScraps()}>
+ <ContentSection />
+ </HydrationProvider>
  </QueryAsyncBoundary>
  <Footer page="meeting" lng={lng} />
  </>