Merge pull request #982 from idurar/dev

Update to 4.0.0-beta.3
idurar · Feb 28, 2024 · 5affc1f · 5affc1f
2 parents 92a1439 + f684028
commit 5affc1f
Show file tree

Hide file tree

Showing 87 changed files with 258 additions and 101 deletions.
diff --git a/backend/package.json b/backend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "idurar-erp-crm",
-  "version": "4.0.0-beta.1",
+  "version": "4.0.0-beta.3",
   "engines": {
     "npm": "10.2.4",
     "node": "20.9.0"

diff --git a/frontend/package.json b/frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "idurar-erp-crm",
-  "version": "4.0.0-beta.1",
+  "version": "4.0.0-beta.3",
   "engines": {
     "npm": "10.2.4",
     "node": "20.9.0"

diff --git a/frontend/src/apps/ErpApp.jsx b/frontend/src/apps/ErpApp.jsx
@@ -22,6 +22,7 @@ import AppRouter from '@/router/AppRouter';
 import useResponsive from '@/hooks/useResponsive';
 
 import storePersist from '@/redux/storePersist';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 export default function ErpCrmApp() {
   const { Content } = Layout;
@@ -50,10 +51,11 @@ export default function ErpCrmApp() {
       window.localStorage.setItem('firstVisit', JSON.stringify({ loadDefaultLang: true }));
     }
   }, [appSettings]);
+  const langDirection = useSelector(selectLangDirection);
 
   if (settingIsloaded)
     return (
-      <Layout hasSider>
+      <Layout hasSider style={{ flexDirection: langDirection === 'rtl' ? 'row-reverse' : 'row' }}>
         {/* {currentApp === 'default' ? <Navigation /> : <ExpensesNav />} */}
         <Navigation />
 
@@ -73,7 +75,7 @@ export default function ErpCrmApp() {
             </Content>
           </Layout>
         ) : (
-          <Layout style={{ marginLeft: 275 }}>
+          <Layout>
             <HeaderContent />
             <Content
               style={{

diff --git a/frontend/src/apps/Header/HeaderContainer.jsx b/frontend/src/apps/Header/HeaderContainer.jsx
@@ -16,6 +16,7 @@ import ChooseCurrency from '@/components/ChooseCurrency';
 
 import UpgradeButton from './UpgradeButton';
 import AppsButton from './AppsButton';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 export default function HeaderContent() {
   const currentAdmin = useSelector(selectCurrentAdmin);
@@ -88,14 +89,16 @@ export default function HeaderContent() {
       label: <Link to={'/logout'}>{translate('logout')}</Link>,
     },
   ];
+
+  const langDirection=useSelector(selectLangDirection)
   return (
     <Header
       style={{
         padding: '20px',
         background: '#f9fafc',
-        display: ' flex',
-        flexDirection: ' row-reverse',
-        justifyContent: ' flex-start',
+        display: 'flex',
+        flexDirection: langDirection==="rtl"?"row":'row-reverse',
+        justifyContent: 'flex-start',
         gap: ' 15px',
       }}
     >

diff --git a/frontend/src/apps/Navigation/NavigationContainer.jsx b/frontend/src/apps/Navigation/NavigationContainer.jsx
@@ -27,6 +27,8 @@ import {
   WalletOutlined,
   ReconciliationOutlined,
 } from '@ant-design/icons';
+import { useSelector } from 'react-redux';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 const { Sider } = Layout;
 
@@ -184,6 +186,7 @@ function Sidebar({ collapsible, isMobile = false }) {
     navMenu.collapse();
   };
 
+  const langDirection=useSelector(selectLangDirection)
   return (
     <Sider
       collapsible={collapsible}
@@ -194,12 +197,13 @@ function Sidebar({ collapsible, isMobile = false }) {
       style={{
         overflow: 'auto',
         height: '100vh',
-        position: 'fixed',
+        direction:langDirection,
+        position:isMobile?"absolute":"relative",
         bottom: '20px',
         ...(!isMobile && {
           background: 'none',
           border: 'none',
-          left: '20px',
+          [langDirection==="rtl"?"right":"left"]: '20px',
           top: '20px',
           borderRadius: '8px',
         }),
@@ -250,14 +254,18 @@ function MobileSidebar() {
   const onClose = () => {
     setVisible(false);
   };
+
+  const langDirection=useSelector(selectLangDirection)
   return (
     <>
       <Button
         type="text"
         size="large"
         onClick={showDrawer}
         className="mobile-sidebar-btn"
-        style={{ marginLeft: 25 }}
+
+
+        style={{ [langDirection==="rtl"?"marginRight":"marginLeft"]: 25 }}
       >
         <MenuOutlined style={{ fontSize: 18 }} />
       </Button>
@@ -267,13 +275,16 @@ function MobileSidebar() {
           boxShadow: 'none',
         }}
         style={{ backgroundColor: 'rgba(255, 255, 255, 0)' }}
-        placement="left"
+        placement={langDirection==="rtl"?"right":"left"}
+
         closable={false}
         onClose={onClose}
         open={visible}
+
       >
         <Sidebar collapsible={false} isMobile={true} />
       </Drawer>
+
     </>
   );
 }
diff --git a/frontend/src/components/DataTable/DataTable.jsx b/frontend/src/components/DataTable/DataTable.jsx
@@ -6,6 +6,8 @@ import {
   DeleteOutlined,
   EllipsisOutlined,
   RedoOutlined,
+  ArrowRightOutlined,
+  ArrowLeftOutlined,
 } from '@ant-design/icons';
 import { Dropdown, Table, Button, Input } from 'antd';
 import { PageHeader } from '@ant-design/pro-layout';
@@ -20,6 +22,7 @@ import { useMoney, useDate } from '@/settings';
 import { generate as uniqueId } from 'shortid';
 
 import { useCrudContext } from '@/context/crud';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 function AddNewItem({ config }) {
   const { crudContextAction } = useCrudContext();
@@ -173,17 +176,20 @@ export default function DataTable({ config, extra = [] }) {
     };
   }, []);
 
+  const langDirection=useSelector(selectLangDirection)
+
   return (
     <>
       <PageHeader
         onBack={() => window.history.back()}
+        backIcon={langDirection==="rtl"?<ArrowRightOutlined/>:<ArrowLeftOutlined />}
         title={DATATABLE_TITLE}
         ghost={false}
         extra={[
           <Input
             key={`searchFilterDataTable}`}
             onChange={filterTable}
-            placeholder={translate('Search')}
+            placeholder={translate('search')}
             allowClear
           />,
           <Button onClick={handelDataTableLoad} key={`${uniqueId()}`} icon={<RedoOutlined />}>
@@ -194,6 +200,7 @@ export default function DataTable({ config, extra = [] }) {
         ]}
         style={{
           padding: '20px 0px',
+          direction:langDirection
         }}
       ></PageHeader>
 

diff --git a/frontend/src/forms/DynamicForm/index.jsx b/frontend/src/forms/DynamicForm/index.jsx
@@ -10,11 +10,15 @@ import { generate as uniqueId } from 'shortid';
 import SelectCurrency from '@/components/SelectCurrency';
 
 import { countryList } from '@/utils/countryList';
+import { selectLangDirection } from '@/redux/translate/selectors';
+import { useSelector } from 'react-redux';
 
 export default function DynamicForm({ fields, isUpdateForm = false }) {
   const [feedback, setFeedback] = useState();
+  const langDirection=useSelector(selectLangDirection)
+
   return (
-    <>
+    <div style={{direction:langDirection}}>
       {Object.keys(fields).map((key) => {
         let field = fields[key];
 
@@ -41,7 +45,7 @@ export default function DynamicForm({ fields, isUpdateForm = false }) {
           }
         }
       })}
-    </>
+    </div>
   );
 }
 

diff --git a/frontend/src/forms/ForgetPasswordForm.jsx b/frontend/src/forms/ForgetPasswordForm.jsx
@@ -1,10 +1,12 @@
 import React from 'react';
 import { Form, Input } from 'antd';
 import { MailOutlined } from '@ant-design/icons';
+import useLanguage from '@/locale/useLanguage';
 
 // import useLanguage from '@/locale/useLanguage';
 
 export default function ForgetPasswordForm() {
+  const translate=useLanguage()
   return (
     <Form.Item
       name="email"
@@ -20,7 +22,7 @@ export default function ForgetPasswordForm() {
       <Input
         prefix={<MailOutlined className="site-form-item-icon" />}
         type="email"
-        placeholder="Email"
+        placeholder={translate('email')}
         size="large"
       />
     </Form.Item>

diff --git a/frontend/src/forms/LoginForm.jsx b/frontend/src/forms/LoginForm.jsx
@@ -3,23 +3,29 @@ import { Form, Input, Checkbox } from 'antd';
 import { UserOutlined, LockOutlined } from '@ant-design/icons';
 
 import useLanguage from '@/locale/useLanguage';
+import { useSelector } from 'react-redux';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 export default function LoginForm() {
+  const langDirection = useSelector(selectLangDirection)
+
   const translate = useLanguage();
   return (
-    <>
+    <div style={{direction:langDirection}}>
       <Form.Item
         label={translate('email')}
         name="email"
         rules={[
           {
             required: true,
+
           },
           {
             type: 'email',
           },
         ]}
-      >
+
+>
         <Input
           prefix={<UserOutlined className="site-form-item-icon" />}
           placeholder={translate('email')}
@@ -42,15 +48,16 @@ export default function LoginForm() {
           size="large"
         />
       </Form.Item>
+
       <Form.Item>
         <Form.Item name="remember" valuePropName="checked" noStyle>
           <Checkbox>{translate('Remember me')}</Checkbox>
         </Form.Item>
-
-        <a className="login-form-forgot" href="/forgetpassword">
+        <a className="login-form-forgot" href="/forgetpassword" style={{marginLeft:langDirection==="rtl"?"220px":"0px"}}>
           {translate('Forgot password')}
         </a>
+
       </Form.Item>
-    </>
+    </div>
   );
 }
diff --git a/frontend/src/layout/AuthLayout/index.jsx b/frontend/src/layout/AuthLayout/index.jsx
@@ -1,30 +1,46 @@
 import React from 'react';
 import { Layout, Row, Col } from 'antd';
+import { selectLangDirection } from '@/redux/translate/selectors';
+import { useSelector } from 'react-redux';
+import { Content } from 'antd/lib/layout/layout';
+import SelectLanguage from '@/components/SelectLanguage';
 export default function AuthLayout({ sideContent, children }) {
+  const langDirection = useSelector(selectLangDirection)
+
   return (
-    <Layout>
-      <Row>
-        <Col
-          xs={{ span: 0, order: 2 }}
-          sm={{ span: 0, order: 2 }}
-          md={{ span: 11, order: 1 }}
-          lg={{ span: 12, order: 1 }}
+    <Layout style={{ textAlign: langDirection === "rtl" ? "right" : "left",direction:langDirection}}>
+      <Content
           style={{
-            minHeight: '100vh',
+            padding: '10px 20px'
           }}
+
         >
-          {sideContent}
-        </Col>
-        <Col
-          xs={{ span: 24, order: 1 }}
-          sm={{ span: 24, order: 1 }}
-          md={{ span: 13, order: 2 }}
-          lg={{ span: 12, order: 2 }}
-          style={{ background: '#FFF', minHeight: '100vh' }}
-        >
-          {children}
-        </Col>
-      </Row>
+          <SelectLanguage />
+        </Content>
+        <Row>
+          <Col
+            xs={{ span: 0, order: 2 }}
+            sm={{ span: 0, order: 2 }}
+            md={{ span: 11, order: 1 }}
+            lg={{ span: 12, order: 1 }}
+            style={{
+              minHeight: '100vh',
+            }}
+          >
+            {sideContent}
+          </Col>
+          <Col
+            xs={{ span: 24, order: 1 }}
+            sm={{ span: 24, order: 1 }}
+            md={{ span: 13, order: 2 }}
+            lg={{ span: 12, order: 2 }}
+            style={{ background: '#FFF', minHeight: '100vh' }}
+          >
+            {children}
+          </Col>
+        </Row>
+
+
     </Layout>
   );
 }
diff --git a/frontend/src/layout/ErpLayout/index.jsx b/frontend/src/layout/ErpLayout/index.jsx
@@ -1,10 +1,14 @@
 import { ErpContextProvider } from '@/context/erp';
+import { selectLangDirection } from '@/redux/translate/selectors';
 
 import { Layout } from 'antd';
+import { useSelector } from 'react-redux';
 
 const { Content } = Layout;
 
 export default function ErpLayout({ children }) {
+  const langDirection=useSelector(selectLangDirection)
+
   return (
     <ErpContextProvider>
       <Content
@@ -14,6 +18,7 @@ export default function ErpLayout({ children }) {
           width: '100%',
           maxWidth: '1100px',
           minHeight: '600px',
+          direction:langDirection
         }}
       >
         {children}

diff --git a/frontend/src/locale/antdLocale.js b/frontend/src/locale/antdLocale.js
@@ -39,7 +39,6 @@ import ltLT from 'antd/es/locale/lt_LT';
 import caES from 'antd/es/locale/ca_ES';
 import faIR from 'antd/es/locale/fa_IR';
 import srRS from 'antd/es/locale/sr_RS';
-import he_IL from 'antd/es/locale/he_IL';
 import az_AZ from 'antd/es/locale/az_AZ';
 import ga_IE from 'antd/es/locale/ga_IE';
 import hy_AM from 'antd/es/locale/hy_AM';
@@ -68,7 +67,6 @@ const antdLocale = {
   km_kh: km_KH,
   si_lk: si_LK,
   ta_in: ta_IN,
-  he_il: he_IL,
   az_az: az_AZ,
   ga_ie: ga_IE,
   hy_am: hy_AM,