added jsconfig

jsconfig.json

@@ -0,0 +1,6 @@
+{
+  "compilerOptions": {
+    "baseUrl": "src"
+  },
+  "include": ["src"]
+}

public/locales/en/translations.json

@@ -99,6 +99,9 @@
     "Cache": {
       "Title": "Cache settings",
       "Reset": "Reset"
+    },
+    "Appearance": {
+      "Title": "Appearance settings"
     }
   },
   "About": {

public/locales/ro/translations.json

@@ -90,6 +90,9 @@
     "Cache": {
       "Title": "Setări cache",
       "Reset": "Resetați"
+    },
+    "Appearance": {
+      "Title": "Appearance settings"
     }
   },
   "About": {

src/features/settings/appearance/AppearanceComponent.js

@@ -2,12 +2,11 @@ import React from "react";
 import { useApplicationTheme } from "../../../providers/ThemeProvider";
 import { Grid, Paper, FormControlLabel, Switch } from "@material-ui/core";
 import LanguageContainer from "./language/LanguageContainer";
+import { PaperTitle } from "components/common";
 import { makeStyles } from "@material-ui/core/styles";
+import { useTranslation } from "react-i18next";
 
 const useStyles = makeStyles(theme => ({
-  paper: {
-    paddingTop: theme.spacing(1)
-  },
   language: {
     paddingLeft: theme.spacing(1)
   }
@@ -15,7 +14,7 @@ const useStyles = makeStyles(theme => ({
 
 const AppearanceComponent = () => {
   const { isDark, onDarkModeChanged } = useApplicationTheme();
-
+  const { t } = useTranslation();
   const classes = useStyles();
 
   const handleChange = event => {
@@ -24,7 +23,8 @@ const AppearanceComponent = () => {
   };
 
   return (
-    <Paper variant="outlined" className={classes.paper}>
+    <Paper variant="outlined">
+      <PaperTitle text={t("Settings.Appearance.Title")} />
       <Grid container spacing={0}>
         <Grid item xs={12} sm={6} md={4} lg={3}>
           <FormControlLabel

src/features/settings/system/ResetCacheComponent.js

@@ -2,7 +2,8 @@ import React from "react";
 import { Paper, Button } from "@material-ui/core";
 import { makeStyles } from "@material-ui/core/styles";
 import { useTranslation } from "react-i18next";
-import { PaperTitle } from "../../../components/common";
+import { PaperTitle } from "components/common";
+import { usePermissions } from "hooks";
 
 const useStyles = makeStyles(theme => ({
   content: {
@@ -15,12 +16,13 @@ const useStyles = makeStyles(theme => ({
 const ResetCacheComponent = () => {
   const classes = useStyles();
   const { t } = useTranslation();
+  const { sysAdmin } = usePermissions();
 
   return (
     <Paper variant="outlined">
       <PaperTitle text={t("Settings.Cache.Title")} />
       <div className={classes.content}>
-        <Button variant="outlined" color="secondary">
+        <Button variant="outlined" color="secondary" disabled={!sysAdmin}>
           {t("Settings.Cache.Reset")}
         </Button>
       </div>