-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* refactor: refactor page * feat: add new icon * fix: add props * feat: add floating button * feat: add ui and delete useless * docs: add todos * fix: fix design system
- Loading branch information
Showing
63 changed files
with
906 additions
and
477 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,181 +1,5 @@ | ||
'use client' | ||
|
||
import { HomeHeader } from '@widgets/HomeHeader/HomeHeader' | ||
import { Button } from '@gmi-design-system/component/Button/Button' | ||
import React, { useState } from 'react' | ||
import dynamic from 'next/dynamic' | ||
import Green from '@gmi-design-system/component/Recommend/home/Green.svg' | ||
import Blue from '@gmi-design-system/component/Recommend/home/Blue.svg' | ||
import Orange from '@gmi-design-system/component/Recommend/home/Orange.svg' | ||
import { useScrollHandler } from '@features/useScrollHandler' | ||
import Question from '@shared/ui/QuestionList/Question' | ||
import { IconArrowRight } from '@gmi-design-system/icon' | ||
import HomeRecommend from '@gmi-design-system/component/Recommend/home/HomeRecommend' | ||
import { FloatButton, JobGreenTag } from '@gds/component' | ||
import { useClientSideRender } from './useClientSideRender' | ||
|
||
import './slider.css' | ||
import * as styles from './index.css' | ||
|
||
const Slider = dynamic(() => import('react-slick'), { ssr: false }) | ||
|
||
const data = [ | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
{ | ||
tag: '법원경비관리', | ||
reward: '2000', | ||
title: '서류 처리 관련 질문', | ||
content: '안녕ㅎ아세요', | ||
date: '2024', | ||
bookmark: 23, | ||
likes: 2, | ||
}, | ||
] | ||
import { ClientHomePage } from 'src/clientPages/home' | ||
|
||
export default function Home() { | ||
const isClient = useClientSideRender() | ||
|
||
const settings = { | ||
className: 'center', | ||
infinite: true, | ||
slidesToShow: 1, | ||
swipeToSlide: true, | ||
nextArrow: ( | ||
<div className={styles.ArrowBox}> | ||
<IconArrowRight /> | ||
</div> | ||
), | ||
} | ||
|
||
const [fixed, setFixed] = useState<boolean>(false) | ||
useScrollHandler(setFixed, 'nav-section') | ||
|
||
return ( | ||
<div style={{ position: 'fixed', height: '844px' }}> | ||
<div | ||
style={{ | ||
position: 'absolute', | ||
top: 0, | ||
left: 0, | ||
overflowY: 'scroll', | ||
}} | ||
> | ||
<div className={styles.HomeWrapper}> | ||
<HomeHeader /> | ||
<div className={styles.RecommendWrapper}> | ||
<div className={styles.RecommendHeaderBox}> | ||
<div className={styles.RecommendTitle}>추천 질문</div> | ||
<div className={styles.MoreBox}> | ||
<Button size="small" variant="outlined"> | ||
더보기 | ||
</Button> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div className={styles.RecommendContentBox}> | ||
{isClient && ( | ||
<div className="slider-container"> | ||
<Slider | ||
className={settings.className} | ||
infinite={settings.infinite} | ||
slidesToShow={settings.slidesToShow} | ||
swipeToSlide={settings.swipeToSlide} | ||
nextArrow={settings.nextArrow} | ||
> | ||
{/** TODO: 데이터 형식으로 변경하기 */} | ||
<HomeRecommend | ||
src={Blue} | ||
coin="2000" | ||
title="ddd" | ||
bookmark={20} | ||
likes={4} | ||
/> | ||
<HomeRecommend | ||
src={Green} | ||
coin="2000" | ||
title="ddd" | ||
bookmark={20} | ||
likes={4} | ||
/> | ||
<HomeRecommend | ||
src={Orange} | ||
coin="2000" | ||
title="ddd" | ||
bookmark={20} | ||
likes={4} | ||
/> | ||
</Slider> | ||
</div> | ||
)} | ||
</div> | ||
<hr className={styles.Line} /> | ||
<div id="nav-section" className={styles.HomeWrapper}> | ||
<div | ||
className={`${styles.QuestionListsWrapper} ${fixed && styles.fixedNav}`} | ||
> | ||
<div className={styles.QuestionListHeaderWrapper}> | ||
<div className={styles.QuestionHeaderTitle}> | ||
<span>질문 리스트</span> | ||
</div> | ||
<div className={styles.QuestionFilterBox}> | ||
{/** TODO: 디자인시스템 작성필요 */} | ||
<JobGreenTag name="더보기" /> | ||
</div> | ||
</div> | ||
</div> | ||
<div className={styles.QuestionsWrapper}> | ||
{data.map((el) => { | ||
return <Question data={el} /> | ||
})} | ||
</div> | ||
</div> | ||
</div> | ||
<FloatButton /> | ||
</div> | ||
) | ||
return <ClientHomePage /> | ||
} |
13 changes: 0 additions & 13 deletions
13
packages/client/app/(withLayout)/home/useClientsideRender.ts
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export { ClientHomePage } from './ui/ClientHomePage' |
Oops, something went wrong.