Merge pull request narayan954#221 from narayan954/deepsource-transfor…

…m-21500910
AK-shat-JAIN · Mar 1, 2023 · b9375ae · b9375ae
2 parents 5af2310 + 18e40cb
commit b9375ae
Show file tree

Hide file tree

Showing 5 changed files with 79 additions and 73 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -130,13 +130,14 @@ function App() {
       window.document.body.style.setProperty("--bg-color", "black");
       window.document.body.style.setProperty("--color", "white");
       window.document.body.style.setProperty("--val", 1);
-      document.getElementsByClassName('app__header__img').item(0).style.filter="invert(100%)";
-
+      document.getElementsByClassName("app__header__img").item(0).style.filter =
+        "invert(100%)";
     } else {
       window.document.body.style.setProperty("--bg-color", "white");
       window.document.body.style.setProperty("--color", "#2B1B17");
       window.document.body.style.setProperty("--val", 0);
-      document.getElementsByClassName('app__header__img').item(0).style.filter="invert(0%)";
+      document.getElementsByClassName("app__header__img").item(0).style.filter =
+        "invert(0%)";
     }
 
     window.addEventListener("scroll", handleMouseScroll);
@@ -306,8 +307,6 @@ function App() {
       });
   };
 
-
-
   return (
     <div className="app">
       <div className="app__header">
@@ -341,7 +340,6 @@ function App() {
             </Button>
           </>
         ) : (
-
           <div className="login__container">
             <Button
               onClick={() => setOpenSignIn(true)}
@@ -363,7 +361,6 @@ function App() {
               Sign Up
             </Button>
           </div>
-
         )}
       </div>
 
@@ -373,31 +370,37 @@ function App() {
         onClose={() => setOpenNewUpload(false)}
       >
         <div
-          style={{ 
+          style={{
             backgroundColor: "var(--bg-color)",
-            padding: "20px", 
-            textAlign: "center", 
+            padding: "20px",
+            textAlign: "center",
             color: "var(--color)",
-            border: "2px solid var(--color)"
-            }}
+            border: "2px solid var(--color)",
+          }}
         >
           <img
             src="https://user-images.githubusercontent.com/27727921/185767526-a002a17d-c12e-4a6a-82a4-dd1a13a5ecda.png"
             alt="instagram"
             className="modal__signup__img"
             style={{ width: "50%", filter: "invert(var(--val))" }}
           />
-          <p style={{ 
-            fontSize: "25px", 
-            fontFamily: "monospace", 
-            color: "var(--color)" 
-            }}>
+          <p
+            style={{
+              fontSize: "25px",
+              fontFamily: "monospace",
+              color: "var(--color)",
+            }}
+          >
             New Post
           </p>
-
-          <DialogContent sx={{ 
-            // backgroundColor: "var(--bg-color)",
-            }}>
+
+          <DialogContent
+            sx={
+              {
+                // backgroundColor: "var(--bg-color)",
+              }
+            }
+          >
             {!loadingPosts &&
               (user ? (
                 <ImgUpload
@@ -408,7 +411,6 @@ function App() {
                 <h3>Sorry you need to login to upload posts</h3>
               ))}
           </DialogContent>
-
         </div>
       </Dialog>
 
@@ -419,7 +421,11 @@ function App() {
               src="https://user-images.githubusercontent.com/27727921/185767526-a002a17d-c12e-4a6a-82a4-dd1a13a5ecda.png"
               alt="instagram"
               className="modal__signup__img"
-              style={{ width: "80%", marginLeft: "10%", filter: "invert(var(--val))" }}
+              style={{
+                width: "80%",
+                marginLeft: "10%",
+                filter: "invert(var(--val))",
+              }}
             />
             <div
               style={{
@@ -499,7 +505,11 @@ function App() {
               src="https://user-images.githubusercontent.com/27727921/185767526-a002a17d-c12e-4a6a-82a4-dd1a13a5ecda.png"
               alt="dummygram"
               className="modal__signup__img"
-              style={{ width: "80%", marginLeft: "10%", filter: "invert(var(--val))" }}
+              style={{
+                width: "80%",
+                marginLeft: "10%",
+                filter: "invert(var(--val))",
+              }}
             />
             <Input
               type="text"
@@ -512,7 +522,7 @@ function App() {
               type="password"
               placeholder="PASSWORD"
               value={password}
-              style={{ margin: "5%", color: "var(--color)", }}
+              style={{ margin: "5%", color: "var(--color)" }}
               onChange={(e) => setPassword(e.target.value)}
             />
             <AnimatedButton
@@ -553,15 +563,19 @@ function App() {
               src="https://user-images.githubusercontent.com/27727921/185767526-a002a17d-c12e-4a6a-82a4-dd1a13a5ecda.png"
               alt="dummygram"
               className="modal__signup__img"
-              style={{ width: "80%", marginLeft: "10%", filter: "invert(var(--val))" }}
+              style={{
+                width: "80%",
+                marginLeft: "10%",
+                filter: "invert(var(--val))",
+              }}
             />
 
             <p
               style={{
                 fontSize: "15px",
                 fontFamily: "monospace",
                 padding: "10%",
-                color: "var(--color)"
+                color: "var(--color)",
               }}
             >
               Are you sure you want to Logout?
@@ -587,7 +601,7 @@ function App() {
           justifyContent: "center",
         }}
       >
-         <div
+        <div
           style={
             !loadingPosts
               ? {}
@@ -608,12 +622,11 @@ function App() {
                 <Post key={id} postId={id} user={user} post={post} />
               ))}
             </div>
-          )} 
+          )}
         </div>
-
-      </div> 
-
-       <FaArrowCircleUp
+      </div>
+
+      <FaArrowCircleUp
         fill="#777"
         // stroke="30"
         className="scrollTop"
@@ -622,7 +635,7 @@ function App() {
           height: 50,
           display: showScroll ? "flex" : "none",
         }}
-      /> 
+      />
     </div>
   );
 }

diff --git a/src/components/ImgUpload.jsx b/src/components/ImgUpload.jsx
@@ -192,10 +192,7 @@ function ImgUpload(props) {
           borderRadius: "8px",
         }}
       />
-      <AnimatedButton 
-        onClick={handleUpload} 
-        loading={uploadingPost}
-        >
+      <AnimatedButton onClick={handleUpload} loading={uploadingPost}>
         Upload
       </AnimatedButton>
     </div>

diff --git a/src/components/Post.jsx b/src/components/Post.jsx
@@ -229,7 +229,7 @@ function Post(prop) {
             aria-haspopup="true"
             onClick={(event) => setAnchorEl(event.currentTarget)}
             sx={{
-              color: "var(--color)"
+              color: "var(--color)",
             }}
           >
             <MoreHorizOutlinedIcon />
@@ -347,7 +347,7 @@ function Post(prop) {
               onClose={handleCommentClose}
               title="All Comments"
             >
-              <Box sx={{ flexGrow: 1}}>
+              <Box sx={{ flexGrow: 1 }}>
                 <Grid container>
                   <Grid item xs={6} md={6}>
                     <Item>
@@ -418,28 +418,27 @@ function Post(prop) {
                     placeholder="Add a comment..."
                     value={comment}
                     onChange={(e) => setComment(e.target.value)}
-                    style={{ 
-                      backgroundColor: "var(--bg-color)", 
+                    style={{
+                      backgroundColor: "var(--bg-color)",
                       color: "var(--color)",
                       borderRadius: "22px",
                       marginTop: "4px",
-                     }}
+                    }}
                   />
                   <button
                     className="post__button"
                     disabled={!comment}
                     type="submit"
                     onClick={postComment}
                     style={{
-                      fontWeight: 'bold', 
-                      textTransform: "uppercase", 
-                      }}
+                      fontWeight: "bold",
+                      textTransform: "uppercase",
+                    }}
                   >
                     Comment
                   </button>
                 </form>
               )}
-
             </DialogBox>
           </>
         ) : (
@@ -475,7 +474,7 @@ function Post(prop) {
               value={comment}
               onChange={(e) => setComment(e.target.value)}
               style={{
-                backgroundColor: "var(--bg-color)", 
+                backgroundColor: "var(--bg-color)",
                 color: "var(--color)",
                 borderRadius: "22px",
                 margin: "4px 0px",
@@ -487,15 +486,14 @@ function Post(prop) {
               type="submit"
               onClick={postComment}
               style={{
-                      fontWeight: 'bold', 
-                      textTransform: "uppercase", 
-                      }}
+                fontWeight: "bold",
+                textTransform: "uppercase",
+              }}
             >
               Post
             </button>
           </form>
         )}
-
       </div>
     </div>
   );

diff --git a/src/reusableComponents/DialogBox.jsx b/src/reusableComponents/DialogBox.jsx
@@ -20,27 +20,31 @@ const DialogBox = (props) => {
       onClose={props.onClose}
       aria-labelledby="responsive-dialog-title"
     >
-      <DialogTitle 
-        id="responsive-dialog-title" 
+      <DialogTitle
+        id="responsive-dialog-title"
         sx={{
-          fontWeight: "bold", 
-          backgroundColor: "var(--bg-color)", 
+          fontWeight: "bold",
+          backgroundColor: "var(--bg-color)",
           color: "var(--color)",
-          }}
+        }}
       >
         {props.title}
       </DialogTitle>
 
       <Divider />
 
-      <DialogContent sx={{color: "var(--color)"}}>
+      <DialogContent sx={{ color: "var(--color)" }}>
         <DialogContentText>{props.children}</DialogContentText>
       </DialogContent>
 
-      <DialogActions sx={{backgroundColor: "var(--bg-color)"}}>
-        <Button onClick={props.onClose} sx={{fontWeight: "bold", color: 'var(--color)'}} >Cancel</Button>
+      <DialogActions sx={{ backgroundColor: "var(--bg-color)" }}>
+        <Button
+          onClick={props.onClose}
+          sx={{ fontWeight: "bold", color: "var(--color)" }}
+        >
+          Cancel
+        </Button>
       </DialogActions>
-
     </Dialog>
   );
 };

diff --git a/src/script.js b/src/script.js
@@ -21,27 +21,21 @@ document.getElementById("scrollbar_style").innerHTML =
 document
   .querySelector("button.darkmode-toggle")
   .addEventListener("click", function () {
-
     if (document.body.classList.contains("darkmode--activated")) {
-      document.getElementsByClassName('app__header__img').item(0).style.filter="invert(100%)";
+      document.getElementsByClassName("app__header__img").item(0).style.filter =
+        "invert(100%)";
       document.body.style.setProperty("--color", "white");
       document.body.style.setProperty("--bg-color", "black");
       window.document.body.style.setProperty("--val", 1);
       document.getElementById("scrollbar_style").innerHTML =
-      "body::-webkit-scrollbar { width: 10px; } /* Track */ body::-webkit-scrollbar-track { background: black; } /* Handle */ body::-webkit-scrollbar-thumb { background: linear-gradient( 45deg, #f4f80c, #addb51, #a2b43a, #51c135, #5ce130, #1dfddf ); border-radius: 10px; }";
-
-
-    } 
-
-    else {
-      document.getElementsByClassName('app__header__img').item(0).style.filter="invert(0%)";
+        "body::-webkit-scrollbar { width: 10px; } /* Track */ body::-webkit-scrollbar-track { background: black; } /* Handle */ body::-webkit-scrollbar-thumb { background: linear-gradient( 45deg, #f4f80c, #addb51, #a2b43a, #51c135, #5ce130, #1dfddf ); border-radius: 10px; }";
+    } else {
+      document.getElementsByClassName("app__header__img").item(0).style.filter =
+        "invert(0%)";
       document.body.style.setProperty("--color", "black");
       document.body.style.setProperty("--bg-color", "white");
       window.document.body.style.setProperty("--val", 0);
       document.getElementById("scrollbar_style").innerHTML =
         "body::-webkit-scrollbar { width: 10px; } /* Track */ body::-webkit-scrollbar-track { background: white; } /* Handle */ body::-webkit-scrollbar-thumb { background: linear-gradient( 45deg, #405de6,#5851db,#833ab4,#c13584,#e1306c,#fd1d1d ); border-radius: 10px; }";
-
-
     }
-
   });