Change komante to commentaire

components/komante/ekri-komante.js

@@ -11,26 +11,25 @@ import {
 } from '@mui/material'
 import MuiAlert from '@mui/material/Alert'
 
-const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:1337'
+const API_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:1337/api'
 
 const Alert = forwardRef(function Alert(props, ref) {
   return <MuiAlert ref={ref} elevation={6} variant='filled' {...props} />
 })
-function EkriKomante({session, teks, meteEsKomanteOuve}) {
+function EkriKomante({session, paroleId, meteEsKomanteOuve}) {
   const {jwt, user} = session
-  const {id} = teks
   const [komante, meteKomante] = useState({kontni: ''})
   const [ere, meteEre] = useState('')
   const [sikse, meteSikse] = useState('')
   const [chaje, meteChaje] = useState(false)
   const [esOuve, meteEsOuve] = useState(false)
 
-  const handleClick = () => {
+  const handleClick = async () => {
     meteChaje(true)
     const {kontni} = komante
 
     if (kontni === '') {
-      meteEre({mesaj: 'Champ obligatoire'})
+      meteEre({error: {message: 'Champ obligatoire'}})
       meteChaje(false)
 
       return
@@ -41,21 +40,28 @@ function EkriKomante({session, teks, meteEsKomanteOuve}) {
       Authorization: `Bearer ${jwt}`
     }
 
-    axios.post(`${API_URL}/komante`, {
-      kontni,
-      teks: id,
-      user: user.id
-    }, {
-      headers
-    })
-      .then(() => {
-        meteSikse('Commentaire envoyé avec succès. Il apparaîtra sur le site après validation.')
-        meteChaje(false)
-      })
-      .catch(error => {
-        meteEre(error)
-        meteChaje(false)
+    try {
+      await axios.post(`${API_URL}/commentaires`, {
+        data: {
+          contenu: kontni,
+          parole: paroleId,
+          user: {
+            id: user.id,
+            username: user.username,
+            email: user.email
+          },
+          datePublication: new Date()
+        }
+      }, {
+        headers
       })
+
+      meteSikse('Commentaire envoyé avec succès. Il apparaîtra sur le site après validation.')
+      meteChaje(false)
+    } catch (error) {
+      meteEre(error?.response?.data)
+      meteChaje(false)
+    }
   }
 
   const handleUpdate = useCallback(update => {
@@ -97,10 +103,10 @@ function EkriKomante({session, teks, meteEsKomanteOuve}) {
           fullWidth
           multiline
           required
-          helperText='Votre commentaire (obligatoire)'
+          helperText='*Obligatoire. 500 caractères maximum'
           style={{marginTop: '1em'}}
           id='komante'
-          label='Kòmantè'
+          label='Commentaire'
           value={komante.kontni}
           rows={8}
           variant='outlined'
@@ -123,16 +129,16 @@ function EkriKomante({session, teks, meteEsKomanteOuve}) {
         {chaje && <LinearProgress size={24} style={{width: '100%', marginBlock: '1em'}} />}
       </div>
       {sikse && (
-        <Snackbar open={esOuve} autoHideDuration={3000} onClose={handleClose}>
+        <Snackbar open={esOuve} autoHideDuration={10_000} onClose={handleClose}>
           <Alert severity='success' onClose={handleClose}>
             <strong>{sikse}</strong>
           </Alert>
         </Snackbar>
       )}
       {ere && (
-        <Snackbar open={esOuve} autoHideDuration={3000} onClose={handleClose}>
+        <Snackbar open={esOuve} autoHideDuration={10_000} onClose={handleClose}>
           <Alert severity='error' onClose={handleClose}>
-            <strong>Une erreur s’est produite</strong> : <i>{ere.message}</i>
+            <strong>Une erreur s’est produite</strong> : <i>{ere?.error?.message}</i>
           </Alert>
         </Snackbar>
       )}
@@ -142,7 +148,7 @@ function EkriKomante({session, teks, meteEsKomanteOuve}) {
 
 EkriKomante.propTypes = {
   session: PropTypes.object.isRequired,
-  teks: PropTypes.object.isRequired,
+  paroleId: PropTypes.number.isRequired,
   meteEsKomanteOuve: PropTypes.func.isRequired
 }