diff --git a/public/locales/en/translations.json b/public/locales/en/translations.json
index 4c67fa5..6f54e06 100644
--- a/public/locales/en/translations.json
+++ b/public/locales/en/translations.json
@@ -61,6 +61,12 @@
"Advanced": "Advanced"
}
},
+ "Settings": {
+ "Navigation": {
+ "Appearance": "Appearance",
+ "Notifications": "Notifications"
+ }
+ },
"About": {
"Navigation": {
"System": "System",
diff --git a/public/locales/ro/translations.json b/public/locales/ro/translations.json
index b54b91b..135429b 100644
--- a/public/locales/ro/translations.json
+++ b/public/locales/ro/translations.json
@@ -52,6 +52,12 @@
"Advanced": "Avansat"
}
},
+ "Settings": {
+ "Navigation": {
+ "Appearance": "Aspect",
+ "Notifications": "Notificări"
+ }
+ },
"About": {
"Navigation": {
"System": "Sistem",
diff --git a/src/components/layout/AppRoutes.js b/src/components/layout/AppRoutes.js
index 6935a82..43e83bb 100644
--- a/src/components/layout/AppRoutes.js
+++ b/src/components/layout/AppRoutes.js
@@ -2,7 +2,7 @@ import React from "react";
import { Route, Switch } from "react-router-dom";
import PageNotFound from "./PageNotFound";
import NetworkContainer from "../../features/network/components/NetworkContainer";
-import SettingsContainer from "../../features/settings/components/SettingsContainer";
+import SettingsContainer from "../../features/settings/SettingsContainer";
import DashboardContainer from "../../features/dashboard/components/DashboardContainer";
import UserProfileContainer from "../../features/user/profile/components/UserProfileContainer";
import AboutContainer from "../../features/about/AboutContainer";
diff --git a/src/features/settings/SettingsContainer.js b/src/features/settings/SettingsContainer.js
new file mode 100644
index 0000000..8e1ace8
--- /dev/null
+++ b/src/features/settings/SettingsContainer.js
@@ -0,0 +1,49 @@
+import React, { useState, useMemo } from "react";
+import BrushIcon from "@material-ui/icons/Brush";
+import NotificationsIcon from "@material-ui/icons/Notifications";
+import { useTranslation } from "react-i18next";
+import PageTitle from "../../components/common/PageTitle";
+import NavigationButtons from "../../components/common/NavigationButtons";
+import AppearanceContainer from "./appearance/AppearanceContainer";
+import NotificationsContainer from "./notifications/NotificationsContainer";
+
+const NavigationTabs = {
+ APPEARANCE: "Settings.Navigation.Appearance",
+ NOTIFICATIONS: "Settings.Navigation.Notifications"
+};
+
+const tabs = [
+ {
+ code: NavigationTabs.APPEARANCE,
+ icon: BrushIcon
+ },
+ {
+ code: NavigationTabs.NOTIFICATIONS,
+ icon: NotificationsIcon
+ }
+];
+
+const SettingsContainer = () => {
+ const [tab, setTab] = useState(NavigationTabs.APPEARANCE);
+ const { t } = useTranslation();
+
+ const navigationTabs = useMemo(
+ () => tabs.map(z => ({ ...z, tooltip: t(z.code) })),
+ [t]
+ );
+
+ return (
+ <>
+