Add OtomatikSwitch to AjouteTradiksyon and EkriTeks

components/soumet/ajoute-tradiksyon.js

@@ -4,6 +4,8 @@ import PropTypes from 'prop-types'
 import {MenuItem, Menu, Button} from '@mui/material'
 import {uniq} from 'lodash'
 
+import OtomatikSwitch from './otomatik-switch'
+
 const PREFIX = 'AjouteTradiksyon'
 
 const classes = {
@@ -49,7 +51,7 @@ function StyledMenu(props) {
 
 const StyledMenuItem = MenuItem
 
-function AjouteTradiksyon({chwaLang, setChwaLang}) {
+function AjouteTradiksyon({disableSwitch, tradiksyonOtomatik, setTradiksyonOtomatik, canAutoTranslate, chwaLang, setChwaLang}) {
   const [anchorElement, setAnchorElement] = useState(null)
 
   const handleClick = event => {
@@ -63,66 +65,75 @@ function AjouteTradiksyon({chwaLang, setChwaLang}) {
   }
 
   return (
-    <Root style={{textAlign: 'center', marginTop: 20}}>
-      <Button
-        aria-controls='lang-menu'
-        variant='outlined'
-        aria-haspopup='true'
-        onClick={handleClick}
-      >
-        Ajouter une traduction <br /> 🇫🇷 🇬🇧 🇪🇸 🇩🇪 🇮🇹
-      </Button>
-      <StyledMenu
-        keepMounted
-        id='lang-menu'
-        anchorEl={anchorElement}
-        open={Boolean(anchorElement)}
-        classes={{
-          paper: classes.paper
-        }}
-        onClose={handleClose}
-      >
-        <StyledMenuItem
-          id='fr'
+    <>
+      {canAutoTranslate && (
+        <OtomatikSwitch tradiksyonOtomatik={tradiksyonOtomatik} setTradiksyonOtomatik={setTradiksyonOtomatik} disabled={!chwaLang.includes('fr') || disableSwitch} />
+      )}
+      <Root style={{textAlign: 'center', marginTop: 20}}>
+        <Button
+          aria-controls='lang-menu'
+          variant='outlined'
+          aria-haspopup='true'
+          onClick={handleClick}
+        >
+          Ajouter une traduction <br /> 🇫🇷 🇬🇧 🇪🇸 🇩🇪 🇮🇹
+        </Button>
+        <StyledMenu
+          keepMounted
+          id='lang-menu'
+          anchorEl={anchorElement}
+          open={Boolean(anchorElement)}
           classes={{
-            root: classes.root
+            paper: classes.paper
           }}
-          onClick={handleClose}
-        >🇫🇷 Français</StyledMenuItem>
-        <StyledMenuItem
-          id='en'
-          classes={{
-            root: classes.root
-          }}
-          onClick={handleClose}
-        >🇬🇧 English</StyledMenuItem>
-        <StyledMenuItem
-          id='es'
-          classes={{
-            root: classes.root
-          }}
-          onClick={handleClose}
-        >🇪🇸 Español</StyledMenuItem>
-        <StyledMenuItem
-          id='de'
-          classes={{
-            root: classes.root
-          }}
-          onClick={handleClose}
-        >🇩🇪 Deutsch</StyledMenuItem>
-        <StyledMenuItem
-          id='it'
-          classes={{
-            root: classes.root
-          }}
-          onClick={handleClose}
-        >🇮🇹 Italiano</StyledMenuItem>
-      </StyledMenu>
-    </Root>
+          onClose={handleClose}
+        >
+          <StyledMenuItem
+            id='fr'
+            classes={{
+              root: classes.root
+            }}
+            onClick={handleClose}
+          >🇫🇷 Français</StyledMenuItem>
+          <StyledMenuItem
+            id='en'
+            classes={{
+              root: classes.root
+            }}
+            onClick={handleClose}
+          >🇬🇧 English</StyledMenuItem>
+          <StyledMenuItem
+            id='es'
+            classes={{
+              root: classes.root
+            }}
+            onClick={handleClose}
+          >🇪🇸 Español</StyledMenuItem>
+          <StyledMenuItem
+            id='de'
+            classes={{
+              root: classes.root
+            }}
+            onClick={handleClose}
+          >🇩🇪 Deutsch</StyledMenuItem>
+          <StyledMenuItem
+            id='it'
+            classes={{
+              root: classes.root
+            }}
+            onClick={handleClose}
+          >🇮🇹 Italiano</StyledMenuItem>
+        </StyledMenu>
+      </Root>
+    </>
   )
 }
 
 AjouteTradiksyon.propTypes = {
+  disableSwitch: PropTypes.bool.isRequired,
+  tradiksyonOtomatik: PropTypes.bool.isRequired,
+  setTradiksyonOtomatik: PropTypes.func.isRequired,
+  canAutoTranslate: PropTypes.bool.isRequired,
   chwaLang: PropTypes.array.isRequired,
   setChwaLang: PropTypes.func.isRequired
 }