fix : 수미 코드리뷰 반영

depromeet · Mar 28, 2024 · cadc522 · cadc522
1 parent 05d6a34
commit cadc522
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 12 deletions.
diff --git a/src/app/onboarding/page.tsx b/src/app/onboarding/page.tsx
@@ -3,13 +3,14 @@
 import { useCallback, useState } from 'react';
 import { useRouter } from 'next/navigation';
 import { FOLLOW_API } from '@/apis/follow';
-import { RECOMMENDATION } from '@/app/onboarding/onboarding.constants';
+import { RECOMMENDATION, RECOMMENDATION_REAL } from '@/app/onboarding/onboarding.constants';
 import RecommendFollowItem from '@/app/onboarding/RecommendFollowItem';
 import Button from '@/components/Button/Button';
 import CenterTextHeader from '@/components/Header/CenterTextHeader';
 import { EVENT_LOG_CATEGORY, EVENT_LOG_NAME } from '@/constants/eventLog';
 import { ROUTER } from '@/constants/router';
 import { eventLogger } from '@/utils';
+import { getEnv } from '@/utils/appEnv';
 import { css } from '@styled-system/css';
 
 function OnboardingPage() {
@@ -46,6 +47,8 @@ function OnboardingPage() {
     router.replace(ROUTER.HOME);
   };
 
+  const follows = getEnv() === 'real' ? RECOMMENDATION_REAL : RECOMMENDATION;
+
   return (
     <div>
       <CenterTextHeader
@@ -68,13 +71,10 @@ function OnboardingPage() {
         <p className={subTitleCss}>팔로우를 통해 미션과 인증을 공유할 수 있어요.</p>
       </div>
       <ul className={followListCss}>
-        {RECOMMENDATION.map((props) => (
+        {follows.map((props) => (
           <RecommendFollowItem
             key={props.id.toString()}
-            id={props.id}
-            tags={props.tags}
-            nickname={props.nickname}
-            profileImageUrl={props.profileImageUrl}
+            {...props}
             isFollowing={followList.includes(props.id)}
             onChangeFollow={handleFollow}
           />

diff --git a/src/components/Header/CenterTextHeader.tsx b/src/components/Header/CenterTextHeader.tsx
@@ -1,4 +1,5 @@
 import { css, cx } from '@styled-system/css';
+import { center } from '@styled-system/patterns';
 
 interface CenterTextHeaderProps {
   title: string;
@@ -33,12 +34,7 @@ const sectionWrapperCss = css({
   width: '33%',
 });
 
-const centerCss = css({
-  display: 'flex',
-  alignItems: 'center',
-  textAlign: 'center',
-  justifyContent: 'center',
-});
+const centerCss = center();
 
 const flexEndCss = css({
   display: 'flex',

diff --git a/src/utils/appEnv.ts b/src/utils/appEnv.ts
@@ -11,3 +11,17 @@ const getUserAgent = () => {
 export const isWebView = () => RegExp(APP_USER_AGENT).test(getUserAgent());
 export const isAndroid = () => RegExp(ANDROID).test(getUserAgent());
 export const isIOS = () => RegExp(IOS).test(getUserAgent());
+
+type EnvType = 'local' | 'dev' | 'real';
+
+export const getEnv = (): EnvType => {
+  if (process.env.node_env === 'development') {
+    return 'local';
+  }
+
+  if (process.env.NEXT_PUBLIC_ENV === 'real') {
+    return 'real';
+  }
+
+  return 'dev';
+};