50 lines
1.3 KiB
JavaScript
50 lines
1.3 KiB
JavaScript
import React, { useState, useMemo } from "react";
|
|
import PageTitle from "../../../components/common/PageTitle";
|
|
import BubbleChartIcon from "@material-ui/icons/BubbleChart";
|
|
import NotesIcon from "@material-ui/icons/Notes";
|
|
import { useTranslation } from "react-i18next";
|
|
import AboutSystemContainer from "../system/AboutSystemContainer";
|
|
import ReleaseNotesContainer from "../releaseNotes/ReleaseNotesContainer";
|
|
import NavigationButtons from "../../../components/common/NavigationButtons";
|
|
|
|
const NavigationTabs = {
|
|
SYSTEM: "About.Navigation.System",
|
|
RELEASE_NOTES: "About.Navigation.ReleaseNotes"
|
|
};
|
|
|
|
const tabs = [
|
|
{
|
|
code: NavigationTabs.SYSTEM,
|
|
icon: BubbleChartIcon
|
|
},
|
|
{
|
|
code: NavigationTabs.RELEASE_NOTES,
|
|
icon: NotesIcon
|
|
}
|
|
];
|
|
|
|
const AboutContainer = () => {
|
|
const [tab, setTab] = useState(NavigationTabs.SYSTEM);
|
|
const { t } = useTranslation();
|
|
|
|
const navigationTabs = useMemo(
|
|
() => tabs.map(z => ({ ...z, tooltip: t(z.code) })),
|
|
[t]
|
|
);
|
|
|
|
return (
|
|
<>
|
|
<PageTitle
|
|
text={t(tab)}
|
|
navigation={
|
|
<NavigationButtons tabs={navigationTabs} onTabChange={setTab} />
|
|
}
|
|
/>
|
|
{tab === NavigationTabs.SYSTEM && <AboutSystemContainer />}
|
|
{tab === NavigationTabs.RELEASE_NOTES && <ReleaseNotesContainer />}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default AboutContainer;
|