diff --git a/web/pages/experimental/home/index.tsx b/web/pages/experimental/home/index.tsx index ebbe716e..d9c7dc9e 100644 --- a/web/pages/experimental/home/index.tsx +++ b/web/pages/experimental/home/index.tsx @@ -79,28 +79,7 @@ export default function Home() { - {sections.map((item) => { - const { id } = item - if (id === 'daily-movers') { - return - } - const sort = SORTS.find((sort) => sort.value === id) - if (sort) - return ( - - ) - - const group = groups.find((g) => g.id === id) - if (group) return - - return null - })} + {sections.map((section) => renderSection(section, user, groups))} @@ -118,14 +97,19 @@ export default function Home() { ) } +const HOME_SECTIONS = [ + { label: 'Daily movers', id: 'daily-movers' }, + { label: 'Trending', id: 'score' }, + { label: 'New', id: 'newest' }, + { label: 'New for you', id: 'new-for-you' }, +] + export const getHomeItems = (groups: Group[], sections: string[]) => { // Accommodate old home sections. if (!isArray(sections)) sections = [] const items = [ - { label: 'Trending', id: 'score' }, - { label: 'New for you', id: 'newest' }, - { label: 'Daily movers', id: 'daily-movers' }, + ...HOME_SECTIONS, ...groups.map((g) => ({ label: g.name, id: g.id, @@ -144,6 +128,37 @@ export const getHomeItems = (groups: Group[], sections: string[]) => { } } +function renderSection( + section: { id: string; label: string }, + user: User | null | undefined, + groups: Group[] +) { + const { id, label } = section + if (id === 'daily-movers') { + return + } + if (id === 'new-for-you') + return ( + + ) + const sort = SORTS.find((sort) => sort.value === id) + if (sort) + return ( + + ) + + const group = groups.find((g) => g.id === id) + if (group) return + + return null +} + function SectionHeader(props: { label: string href: string