Loccus enhancements (#532)

* Tools Refactoring (#519)

* Synthetic image detection UX improvements

* refactoring + updated offline translations

* wip

* Refactored footer types and Footer, Navbar, DrawerItem, AllTools. Highlight the tool used in the side menu

* Added missing package, fixed scroll bars and enhanced general layout

* Improved naming to have TopMenu, MainContentMenu, and SideMenu, fixed some variables, code cleanup

* Improved alignment

* Fixed RTL padding

* Fixed RTL chevron

* Improved naming

* Fixed lint warning

* Added jsdoc

* Cleanup

* Fixed error

* add v0.81 manifest

* Added chartJs, added chart with detection percentage over time

* Removed console.log

* Added chart gradient based on detection score

* Updated packages

* Moved variables

* Fixed lint warnings

* Bumped version, added missing keyword, added rtl support

---------

Co-authored-by: Bertrand Goupil <[email protected]>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "weverify-plugin",
-  "version": "0.80",
+  "version": "0.81",
   "description": "",
   "main": "index.js",
   "scripts": {

src/components/NavItems/tools/Loccus/loccusResults.jsx

@@ -42,6 +42,9 @@ const LoccusResults = (props) => {
 
   const keyword = i18nLoadNamespace("components/NavItems/tools/Loccus");
 
+  const currentLang = useSelector((state) => state.language);
+  const isCurrentLanguageLeftToRight = currentLang !== "ar";
+
   const role = useSelector((state) => state.userSession.user.roles);
 
   const result = props.result;
@@ -100,7 +103,7 @@ const LoccusResults = (props) => {
       },
       title: {
         display: true,
-        text: "Detection percentage over time",
+        text: keyword("loccus_chart_title"),
       },
       tooltip: {
         callbacks: {
@@ -126,6 +129,7 @@ const LoccusResults = (props) => {
             return printDurationInMinutesWithoutModulo(val);
           },
         },
+        reverse: isCurrentLanguageLeftToRight ? false : true,
       },
       y: {
         beginAtZero: true,
@@ -136,6 +140,7 @@ const LoccusResults = (props) => {
             return value + "%";
           },
         },
+        position: isCurrentLanguageLeftToRight ? "left" : "right",
       },
     },
   };