41 lines
1.2 KiB
TypeScript
41 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
import { useMessages } from "@/i18n/locale-context";
|
|
|
|
export default function AboutTabs() {
|
|
const t = useMessages();
|
|
const [tab, setTab] = useState<"resume" | "goals">("resume");
|
|
|
|
return (
|
|
<div>
|
|
<div className="tabs" role="tablist">
|
|
<button type="button" className={tab === "resume" ? "active" : undefined} onClick={() => setTab("resume")}>
|
|
{t.aboutTabs.resume}
|
|
</button>
|
|
<button type="button" className={tab === "goals" ? "active" : undefined} onClick={() => setTab("goals")}>
|
|
{t.aboutTabs.goalsTab}
|
|
</button>
|
|
</div>
|
|
{tab === "resume" ? (
|
|
<p className="muted">{t.aboutTabs.resumeText}</p>
|
|
) : (
|
|
<div>
|
|
{t.aboutTabs.goalsParagraphs.map((paragraph) => (
|
|
<p key={paragraph.slice(0, 24)} className="muted">
|
|
{paragraph}
|
|
</p>
|
|
))}
|
|
<p className="muted">{t.aboutTabs.qualityIntro}</p>
|
|
<ol className="muted">
|
|
{t.aboutTabs.qualityPolicy.map((item) => (
|
|
<li key={item}>{item}</li>
|
|
))}
|
|
</ol>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|