diff --git a/packages/app/components/i18n/IntlProvider.tsx b/packages/app/components/i18n/IntlProvider.tsx
index 2340aae..134c75d 100644
--- a/packages/app/components/i18n/IntlProvider.tsx
+++ b/packages/app/components/i18n/IntlProvider.tsx
@@ -1,5 +1,8 @@
import React, { useState, useEffect, ComponentType } from 'react';
import { RawIntlProvider, IntlShape } from 'react-intl';
+import { Helmet } from 'react-helmet-async';
+
+import { getLangDir } from 'rtl-detect';
import i18n from 'app/services/i18n';
import { useReduxSelector } from 'app/functions';
@@ -26,7 +29,12 @@ const IntlProvider: ComponentType = ({ children }) => {
return null;
}
- return {children};
+ return (
+
+
+ {children}
+
+ );
};
export default IntlProvider;
diff --git a/packages/app/package.json b/packages/app/package.json
index a3a13ce..b733761 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -30,6 +30,7 @@
"redux": "^4.0.5",
"redux-localstorage": "^0.4.1",
"redux-thunk": "^2.0.0",
+ "rtl-detect": "^1.0.2",
"url-search-params-polyfill": "^8.1.0",
"webfontloader": "^1.6.26",
"whatwg-fetch": "^3.0.0"
@@ -45,6 +46,7 @@
"@types/react-helmet": "^6.0.0",
"@types/react-motion": "^0.0.29",
"@types/react-transition-group": "^4.2.4",
+ "@types/rtl-detect": "^1.0.0",
"@types/webfontloader": "^1.6.30",
"@types/webpack-env": "^1.15.2",
"utility-types": "^3.10.0"
diff --git a/packages/app/pages/root/RootPage.tsx b/packages/app/pages/root/RootPage.tsx
index f65a667..c9ba816 100644
--- a/packages/app/pages/root/RootPage.tsx
+++ b/packages/app/pages/root/RootPage.tsx
@@ -1,6 +1,5 @@
import React from 'react';
import { Route, Switch } from 'react-router-dom';
-import { Helmet } from 'react-helmet-async';
import clsx from 'clsx';
import { connect } from 'app/functions';
@@ -54,10 +53,6 @@ class RootPage extends React.PureComponent<{
return (