Skip to content

Commit

Permalink
refactor: HotThreeBox server side
Browse files Browse the repository at this point in the history
  • Loading branch information
uiop5809 committed Aug 20, 2024
1 parent e5fd4d8 commit 5322c8f
Showing 1 changed file with 14 additions and 46 deletions.
60 changes: 14 additions & 46 deletions src/components/home/HotThreeBox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

import { useHotThree } from '@/service/home/useHomeService'
import { User } from '@/model/User'
import { HotThreeI } from '@/model/Home'
import HotThree from './HotThree'
import NotLogin from '../auth/NotLogin'
import Login from '../auth/Login'
Expand All @@ -10,62 +11,29 @@ interface HotThreeBoxProps {
userInfo: User | null
}

const renderHotThree = (hotThree: HotThreeI) => (
<>
<HotThree hotThree={hotThree} board="board" />
<HotThree hotThree={hotThree} board="discussion" />
<HotThree hotThree={hotThree} board="worry" />
</>
)

const HotThreeBox = ({ userInfo }: HotThreeBoxProps) => {
const { data: hotThree } = useHotThree()

return (
<>
{/* mobile */}
<div className="bg-main4 flex items-center w-full-vw ml-half-vw gap-5 px-6% py-5 overflow-x-scroll scrollbar-hide sm:hidden">
{userInfo ? (
<>
<Login user={userInfo} />
{hotThree && (
<>
<HotThree hotThree={hotThree} board="board" />
<HotThree hotThree={hotThree} board="discussion" />
<HotThree hotThree={hotThree} board="worry" />
</>
)}
</>
) : (
<>
<NotLogin />
{hotThree && (
<>
<HotThree hotThree={hotThree} board="board" />
<HotThree hotThree={hotThree} board="discussion" />
<HotThree hotThree={hotThree} board="worry" />
</>
)}
</>
)}
{userInfo ? <Login user={userInfo} /> : <NotLogin />}
{hotThree && renderHotThree(hotThree)}
</div>

{/* desktop */}
<div className="hidden bg-main4 w-full-vw ml-half-vw gap-7.5 px-6% py-7.5 sm:px-8% sm:grid sm:grid-cols-2 md:px-13% lg:py-12.5 lg:grid lg:grid-cols-4">
{userInfo ? (
<>
{hotThree && (
<>
<HotThree hotThree={hotThree} board="board" />
<HotThree hotThree={hotThree} board="discussion" />
<HotThree hotThree={hotThree} board="worry" />
</>
)}
<Login user={userInfo} />
</>
) : (
<>
<NotLogin />
{hotThree && (
<>
<HotThree hotThree={hotThree} board="board" />
<HotThree hotThree={hotThree} board="discussion" />
<HotThree hotThree={hotThree} board="worry" />
</>
)}
</>
)}
{hotThree && renderHotThree(hotThree)}
{userInfo ? <Login user={userInfo} /> : <NotLogin />}
</div>
</>
)
Expand Down

0 comments on commit 5322c8f

Please sign in to comment.