🎨 standardJS all files

website/components/FunctionPage/CommentCard/CommentCard.css

@@ -1,33 +1,33 @@
 .CommentCard {
-    display: flex;
-    flex-direction: column;
-    word-wrap: break-word;
-    box-shadow: 0px 0px 6px 6px rgba(0, 0, 0, .25);
-    border: 1px solid black;
-    border-radius: .7em;
-    margin: 15px 0 15px 0;
+  display: flex;
+  flex-direction: column;
+  word-wrap: break-word;
+  box-shadow: 0px 0px 6px 6px rgba(0, 0, 0, 0.25);
+  border: 1px solid black;
+  border-radius: 0.7em;
+  margin: 15px 0 15px 0;
 }
 .CommentCard__container {
-    height: 100%;
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-    padding: 20px;
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 20px;
 }
 .CommentCard__user-logo {
-    border-radius: 50%;
-    object-fit: cover;
-    width: 50px;
-    height: 50px;
-    cursor: pointer;
+  border-radius: 50%;
+  object-fit: cover;
+  width: 50px;
+  height: 50px;
+  cursor: pointer;
 }
 .CommentCard__message-info {
-    display: flex;
-    align-items: center;
-    margin-left: 10px;
-    font-size: 16px;
+  display: flex;
+  align-items: center;
+  margin-left: 10px;
+  font-size: 16px;
 }
 .CommentCard__message {
-    line-height: 1.8;
-    margin: 15px 0 0 0;
-}
+  line-height: 1.8;
+  margin: 15px 0 0 0;
+}

website/components/FunctionPage/CommentCard/CommentCard.jsx

@@ -23,28 +23,42 @@ const CommentCard = forwardRef((props, ref) => {
     props.manageComment.setLoadingComments(true)
     if (isAuth && user.token != null) {
       try {
-        await api.delete(`/comments/${props.id}`, { headers: { Authorization: user.token } })
+        await api.delete(`/comments/${props.id}`, {
+          headers: { Authorization: user.token }
+        })
         const newCommentsData = { ...props.manageComment.commentsData }
-        const commentIndex = newCommentsData.rows.findIndex((value) => value.id === props.id)
+        const commentIndex = newCommentsData.rows.findIndex(
+          value => value.id === props.id
+        )
         newCommentsData.rows.splice(commentIndex, 1)
-        props.manageComment.setCommentsData({ hasMore: props.manageComment.commentsData.hasMore, rows: newCommentsData.rows })
+        props.manageComment.setCommentsData({
+          hasMore: props.manageComment.commentsData.hasMore,
+          rows: newCommentsData.rows
+        })
       } catch {}
     }
     props.manageComment.setLoadingComments(false)
   }
 
-  const handleChange = (event) => {
+  const handleChange = event => {
     setEditInput(event.target.value)
   }
 
-  const handleSubmit = (event) => {
+  const handleSubmit = event => {
     event.preventDefault()
-    api.put(`/comments/${props.id}`, { message: editInput }, { headers: { Authorization: user.token } })
-      .then((_response) => {
+    api
+      .put(
+        `/comments/${props.id}`,
+        { message: editInput },
+        { headers: { Authorization: user.token } }
+      )
+      .then(_response => {
         setEditing(false)
       })
-      .catch((error) => {
-        setMessage(`<p class="form-error"><b>Erreur:</b> ${error.response.data.message}</p>`)
+      .catch(error => {
+        setMessage(
+          `<p class="form-error"><b>Erreur:</b> ${error.response.data.message}</p>`
+        )
       })
   }
 
@@ -58,47 +72,73 @@ const CommentCard = forwardRef((props, ref) => {
       <div className='CommentCard__container'>
         <div className='row'>
           <Link href='/users/[name]' as={`/users/${props.user.name}`}>
-            <img className='CommentCard__user-logo' src={API_URL + props.user.logo} alt={props.user.name} />
+            <img
+              className='CommentCard__user-logo'
+              src={API_URL + props.user.logo}
+              alt={props.user.name}
+            />
           </Link>
           <span className='CommentCard__message-info'>
             <Link href='/users/[name]' as={`/users/${props.user.name}`}>
               <a>{props.user.name}</a>
             </Link>
-                        &nbsp;- {date.format(new Date(props.createdAt), 'DD/MM/YYYY à HH:mm', true)}
+            &nbsp;-{' '}
+            {date.format(new Date(props.createdAt), 'DD/MM/YYYY à HH:mm', true)}
           </span>
         </div>
         <div className='row'>
           <div className='col-24'>
-            {
-              (!isEditing)
-                ? (
-                  <>
-                    <div className='CommentCard__message'>
-                      <ReactMarkdown source={editInput} renderers={{ code: CodeBlock }} />
-                    </div>
-                    {(isAuth && user.name === props.user.name) &&
-                      <p style={{ fontSize: '15px', margin: '15px 0 0 0', fontStyle: 'italic' }}>
-                        <a onClick={deleteCommentById} href='#'>supprimer</a>
-                                              &nbsp;-&nbsp;
-                        <a style={{ cursor: 'pointer' }} onClick={editComment}>modifier</a>
-                      </p>}
-                  </>
-                )
-                : (
-                  <form onSubmit={handleSubmit}>
-                    <div className='form-group FunctionComments__post-group'>
-                      <label className='form-label' htmlFor='commentEdit'>Modifier le commentaire :</label>
-                      <textarea style={{ height: 'auto' }} value={editInput} onChange={handleChange} name='commentEdit' id='commentEdit' className='form-control' rows='5' placeholder="Idée d'amélioration, avis, remarque, partage d'expérience personnel, ... (Markdown autorisé)" />
-                    </div>
-                    <div className='form-group' style={{ marginTop: '0.7em' }}>
-                      <button type='submit' className='btn btn-dark'>Envoyer</button>
-                    </div>
-                    <div className='text-center'>
-                      {htmlParser(message)}
-                    </div>
-                  </form>
-                )
-            }
+            {!isEditing ? (
+              <>
+                <div className='CommentCard__message'>
+                  <ReactMarkdown
+                    source={editInput}
+                    renderers={{ code: CodeBlock }}
+                  />
+                </div>
+                {isAuth && user.name === props.user.name && (
+                  <p
+                    style={{
+                      fontSize: '15px',
+                      margin: '15px 0 0 0',
+                      fontStyle: 'italic'
+                    }}
+                  >
+                    <a onClick={deleteCommentById} href='#'>
+                      supprimer
+                    </a>
+                    &nbsp;-&nbsp;
+                    <a style={{ cursor: 'pointer' }} onClick={editComment}>
+                      modifier
+                    </a>
+                  </p>
+                )}
+              </>
+            ) : (
+              <form onSubmit={handleSubmit}>
+                <div className='form-group FunctionComments__post-group'>
+                  <label className='form-label' htmlFor='commentEdit'>
+                    Modifier le commentaire :
+                  </label>
+                  <textarea
+                    style={{ height: 'auto' }}
+                    value={editInput}
+                    onChange={handleChange}
+                    name='commentEdit'
+                    id='commentEdit'
+                    className='form-control'
+                    rows='5'
+                    placeholder="Idée d'amélioration, avis, remarque, partage d'expérience personnel, ... (Markdown autorisé)"
+                  />
+                </div>
+                <div className='form-group' style={{ marginTop: '0.7em' }}>
+                  <button type='submit' className='btn btn-dark'>
+                    Envoyer
+                  </button>
+                </div>
+                <div className='text-center'>{htmlParser(message)}</div>
+              </form>
+            )}
           </div>
         </div>
       </div>