Threads (#170)

src/Element/Tabs.tsx

@@ -0,0 +1,39 @@
+import './Tabs.css'
+
+export interface Tab {
+  text: string, value: number
+}
+
+interface TabsProps {
+  tabs: Tab[]
+  tab: Tab
+  setTab: (t: Tab) => void
+}
+
+interface TabElementProps extends Omit<TabsProps, 'tabs'> {
+  t: Tab
+}
+
+export const TabElement = ({ t, tab, setTab }: TabElementProps) =>  {
+  return  (
+    <div className={`tab ${tab.value === t.value ? "active" : ""}`} onClick={() => setTab(t)}>
+      {t.text}
+    </div>
+  )
+}
+
+const Tabs = ({ tabs, tab, setTab }: TabsProps) => {
+  return (
+    <div className="tabs">
+    {tabs.map((t) => {
+      return (
+        <div className={`tab ${tab.value === t.value ? "active" : ""}`} onClick={() => setTab(t)}>
+          {t.text}
+        </div>
+      )
+    })}
+    </div>
+  )
+}
+
+export default Tabs