From 45f997bb5d71d4601fee7685cd514dcf345970c8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ademi=CC=81lson=20F=2E=20Tonato?= <ademilsonft@outlook.com>
Date: Mon, 10 Oct 2022 10:51:45 +0100
Subject: [PATCH] refactor: update HTML (React) warnings

---
 frontend/src/components/Account/Account.js     |  8 ++++----
 .../ForgotPassword/ForgotPassword.js           |  6 +++---
 frontend/src/components/Login/Login.js         |  2 +-
 frontend/src/components/Notes/MarkdownNotes.js |  4 ++--
 frontend/src/components/Notes/Notes.js         | 18 +++++++++---------
 .../components/ResetPassword/ResetPassword.js  |  4 ++--
 frontend/src/components/Sidenav/Sidenav.js     |  2 +-
 frontend/src/components/Signup/Signup.js       |  2 +-
 8 files changed, 23 insertions(+), 23 deletions(-)

diff --git a/frontend/src/components/Account/Account.js b/frontend/src/components/Account/Account.js
index a700308..7678aa0 100644
--- a/frontend/src/components/Account/Account.js
+++ b/frontend/src/components/Account/Account.js
@@ -118,7 +118,7 @@ const Account = () => {
                 onSubmit={changePassword}
                 id="notes-form"
                 action="#"
-                enctype="multipart/form-data"
+                encType="multipart/form-data"
               >
                 <div className="row title">
                   <label>Current Password</label>
@@ -126,7 +126,7 @@ const Account = () => {
                     id="modal-current-password-input"
                     type="password"
                     name="title"
-                    spellcheck="false"
+                    spellCheck="false"
                     onChange={(e) => setCurrentPassword(e.target.value)}
                   />
                 </div>
@@ -137,7 +137,7 @@ const Account = () => {
                     id="modal-new-password-input"
                     type="password"
                     name="title"
-                    spellcheck="false"
+                    spellCheck="false"
                     onChange={(e) => setNewPassword(e.target.value)}
                   />
                 </div>
@@ -148,7 +148,7 @@ const Account = () => {
                     id="modal-confirm-password-input"
                     type="password"
                     name="title"
-                    spellcheck="false"
+                    spellCheck="false"
                     onChange={(e) => setConfirmPassword(e.target.value)}
                   />
                 </div>
diff --git a/frontend/src/components/ForgotPassword/ForgotPassword.js b/frontend/src/components/ForgotPassword/ForgotPassword.js
index d32e45a..dd2b179 100644
--- a/frontend/src/components/ForgotPassword/ForgotPassword.js
+++ b/frontend/src/components/ForgotPassword/ForgotPassword.js
@@ -35,7 +35,7 @@ const ForgotPassword = () => {
         <title>Noteslify | Forgot Password</title>
         <meta name="description" content="Noteslify. Reset Your Password From Here." />
       </Helmet>
-      <div class="form-wrapper">
+      <div className="form-wrapper">
         <h1>Forgot Password?</h1>
         <br></br>
         <p>Please enter your registered email to receive your forgot Password Link</p>
@@ -46,8 +46,8 @@ const ForgotPassword = () => {
             <input type="email" name="email" value={email} onChange={(e) => setEmail(e.target.value)} required="required" placeholder="Email Address"></input>
           </div>
           <div className="button-panel">
-            {!isLoading && <input type="submit" class="button" title="Sign In" value="Send Email"></input>}
-            {isLoading && <button style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true} class="button" value=""><span class="loader"></span></button>}
+            {!isLoading && <input type="submit" className="button" title="Sign In" value="Send Email"></input>}
+            {isLoading && <button style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true} className="button" value=""><span className="loader"></span></button>}
           </div>
         </form>
         <div className="form-footer">
diff --git a/frontend/src/components/Login/Login.js b/frontend/src/components/Login/Login.js
index 371d7a9..44466a7 100644
--- a/frontend/src/components/Login/Login.js
+++ b/frontend/src/components/Login/Login.js
@@ -122,7 +122,7 @@ const Login = () => {
                 <Link to="/forgotpassword" className="form__forgot">Forgot Password?</Link>
 
                 {!isLoading && <button type="submit" className="form__button">Login</button>}
-                {isLoading && <button type="submit" className="form__button" style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true}><span class="loader"></span></button>}
+                {isLoading && <button type="submit" className="form__button" style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true}><span className="loader"></span></button>}
 
                 <div style={{marginBottom: '25px',textAlign:'center'}}>
                     Don't have an account ? <Link to={'/signup'}>Sign up here</Link>
diff --git a/frontend/src/components/Notes/MarkdownNotes.js b/frontend/src/components/Notes/MarkdownNotes.js
index bef32a1..9467a99 100644
--- a/frontend/src/components/Notes/MarkdownNotes.js
+++ b/frontend/src/components/Notes/MarkdownNotes.js
@@ -16,10 +16,10 @@ export default function MarkdownNotes(props) {
   return (
     <div className="content">
 
-  <form onSubmit={addANewNote} id="notes-form" action="#" enctype="multipart/form-data">
+  <form onSubmit={addANewNote} id="notes-form" action="#" encType="multipart/form-data">
     <div className="md">
       <div className="row title">
-      <input id='modal-title-input' value={props.addNoteTitle} onChange={(e) => props.setAddNoteTitle(e.target.value)} type="text" name="title" spellcheck="false"/>
+      <input id='modal-title-input' value={props.addNoteTitle} onChange={(e) => props.setAddNoteTitle(e.target.value)} type="text" name="title" spellCheck="false"/>
     </div>
     <div className="row description wmde-markdown-var">
       <MDEditor value={props.addNoteDescription} onChange={(e) => props.setAddNoteDescription(e)}  />
diff --git a/frontend/src/components/Notes/Notes.js b/frontend/src/components/Notes/Notes.js
index bd340a6..f5ed448 100644
--- a/frontend/src/components/Notes/Notes.js
+++ b/frontend/src/components/Notes/Notes.js
@@ -237,17 +237,17 @@ const Notes = () => {
           <div className="content">
             <header>
               <p>Add a new Note</p>
-              <i class="fa-brands fa-markdown" onClick={openAddMarkdownWindow}></i>
+              <i className="fa-brands fa-markdown" onClick={openAddMarkdownWindow}></i>
               <i onClick={closeAddNoteModal} className="fa-solid fa-xmark"></i>
             </header>
-            <form onSubmit={addANewNote} id="notes-form" action="#" enctype="multipart/form-data">
+            <form onSubmit={addANewNote} id="notes-form" action="#" encType="multipart/form-data">
               <div className="row title">
                 {/* <label>Title</label> */}
-                <input id='modal-title-input' value={addNoteTitle} onChange={(e) => setAddNoteTitle(e.target.value)} type="text" name="title" spellcheck="false"/>
+                <input id='modal-title-input' value={addNoteTitle} onChange={(e) => setAddNoteTitle(e.target.value)} type="text" name="title" spellCheck="false"/>
               </div>
               <div className="row description">
                 {/* <label>Description</label> */}
-                <textarea value={addNoteDescription} onChange={(e) => setAddNoteDescription(e.target.value)} name="description" spellcheck="false"></textarea>
+                <textarea value={addNoteDescription} onChange={(e) => setAddNoteDescription(e.target.value)} name="description" spellCheck="false"></textarea>
               </div>
               <button>Add Note</button>
             </form>
@@ -272,18 +272,18 @@ const Notes = () => {
           <div className="content">
             <header>
               <p>Edit Note</p>
-              <i class="fa-brands fa-markdown" onClick={openEditMarkdownWindow}></i>
+              <i className="fa-brands fa-markdown" onClick={openEditMarkdownWindow}></i>
               <i onClick={closeEditNoteModal} className="fa-solid fa-xmark"></i>
 
             </header>
-            <form onSubmit={updateNote} id="notes-form" action="#" enctype="multipart/form-data">
+            <form onSubmit={updateNote} id="notes-form" action="#" encType="multipart/form-data">
               <div className="row title">
                 {/* <label>Title</label> */}
-                <input value={addNoteTitle} onChange={(e) => setAddNoteTitle(e.target.value)} id='modal-title-input' type="text" name="title" spellcheck="false"/>
+                <input value={addNoteTitle} onChange={(e) => setAddNoteTitle(e.target.value)} id='modal-title-input' type="text" name="title" spellCheck="false"/>
               </div>
               <div className="row description">
                 {/* <label>Description</label> */}
-                <textarea value={addNoteDescription} onChange={(e) => setAddNoteDescription(e.target.value)} name="description" spellcheck="false"></textarea>
+                <textarea value={addNoteDescription} onChange={(e) => setAddNoteDescription(e.target.value)} name="description" spellCheck="false"></textarea>
               </div>
               <button>Update Note</button>
             </form>
@@ -311,7 +311,7 @@ const Notes = () => {
               <i onClick={closePreviewNoteModal} className="fa-solid fa-xmark"></i>
 
             </header>
-            <form id="notes-form" action="#" enctype="multipart/form-data">
+            <form id="notes-form" action="#" encType="multipart/form-data">
               <div className="row title">
               <div name="title" className="previewbox previewtitle" dangerouslySetInnerHTML={{ __html: marked(addNoteTitle) }}></div>
               </div>
diff --git a/frontend/src/components/ResetPassword/ResetPassword.js b/frontend/src/components/ResetPassword/ResetPassword.js
index d98262e..bc126f6 100644
--- a/frontend/src/components/ResetPassword/ResetPassword.js
+++ b/frontend/src/components/ResetPassword/ResetPassword.js
@@ -59,7 +59,7 @@ const ResetPassword = () => {
 
   return (
     <div>
-      {isValidToken && <div class="form-wrapper">
+      {isValidToken && <div className="form-wrapper">
         <h1>Set New Password</h1>
         <br></br>
         <p>Your Email Address: <strong>{email}</strong></p>
@@ -70,7 +70,7 @@ const ResetPassword = () => {
             <input type="password" name="password" value={password} onChange={(e) => setPassword(e.target.value)} required="required" placeholder="Enter Your New Password"></input>
           </div>
           <div className="button-panel">
-            <input type="submit" class="button" title="Sign In" value="Change Password"></input>
+            <input type="submit" className="button" title="Sign In" value="Change Password"></input>
           </div>
         </form>
         <div className="form-footer">
diff --git a/frontend/src/components/Sidenav/Sidenav.js b/frontend/src/components/Sidenav/Sidenav.js
index e701888..071fe3f 100644
--- a/frontend/src/components/Sidenav/Sidenav.js
+++ b/frontend/src/components/Sidenav/Sidenav.js
@@ -105,7 +105,7 @@ const Sidenav = () => {
 
                   <li className="nav-link">
                       <a href="/">
-                          <i class="fa-solid fa-wallet icon"></i>
+                          <i className="fa-solid fa-wallet icon"></i>
                           <span className="text nav-text">Soon..</span>
                       </a>
                   </li>
diff --git a/frontend/src/components/Signup/Signup.js b/frontend/src/components/Signup/Signup.js
index 485bb6e..347163a 100644
--- a/frontend/src/components/Signup/Signup.js
+++ b/frontend/src/components/Signup/Signup.js
@@ -122,7 +122,7 @@ const Signup = () => {
                 </div>
                 <br></br>
                 {!isLoading && <button type="submit" className="form__button">Register</button>}
-                {isLoading && <button type="submit" className="form__button" style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true}><span class="loader"></span></button>}
+                {isLoading && <button type="submit" className="form__button" style={{backgroundColor: '#15203a', cursor: 'not-allowed'}} disabled={true}><span className="loader"></span></button>}
 
                 <div style={{marginBottom: '25px',textAlign:'center'}}>
                     Already have an account ? <Link to={'/login'}>Login here</Link>