snort/packages/app/src/Pages/Discover.tsx
Martti Malmi ef673c2a05
Some checks failed
continuous-integration/drone/push Build is failing
tab selector vs content naming, refactoring
2024-01-12 17:33:02 +02:00

42 lines
1.2 KiB
TypeScript

import { useState } from "react";
import { useIntl } from "react-intl";
import SuggestedProfiles from "@/Components/SuggestedProfiles";
import { Tab, TabSelector } from "@/Components/TabSelectors/TabSelectors";
import TrendingNotes from "@/Components/Trending/TrendingPosts";
import TrendingUsers from "@/Components/Trending/TrendingUsers";
export default function Discover() {
const { formatMessage } = useIntl();
// tabs
const Tabs = {
Follows: { text: formatMessage({ defaultMessage: "Suggested Follows", id: "C8HhVE" }), value: 0 },
Posts: { text: formatMessage({ defaultMessage: "Trending Notes", id: "Ix8l+B" }), value: 1 },
Profiles: { text: formatMessage({ defaultMessage: "Trending People", id: "CVWeJ6" }), value: 2 },
};
const [tab, setTab] = useState<Tab>(Tabs.Follows);
function renderTab() {
switch (tab.value) {
case 0:
return <SuggestedProfiles />;
case 1:
return <TrendingNotes />;
case 2:
return <TrendingUsers />;
}
return null;
}
return (
<>
<div className="tabs p">
{[Tabs.Follows, Tabs.Posts, Tabs.Profiles].map(a => (
<TabSelector key={a.value} tab={tab} setTab={setTab} t={a} />
))}
</div>
{renderTab()}
</>
);
}