Lint Fixes

lint fixes
AstroStreakNet · Sep 1, 2024 · 19a5640 · 19a5640
1 parent 3c0dc1f
commit 19a5640
Show file tree

Hide file tree

Showing 49 changed files with 401 additions and 314 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,19 +1,19 @@
-import './styles/index.css';
+import "./styles/index.css";
 
-import { AuthProvider, UIProvider } from './context';
-import { BrowserRouter, Route, Routes } from 'react-router-dom';
-import { ROUTES } from './constants';
+import { AuthProvider, UIProvider } from "./context";
+import { BrowserRouter, Route, Routes } from "react-router-dom";
+import { ROUTES } from "./constants";
 
-import Footer from './components/layout/Footer/Footer';
-import GalleryPage from './pages/GalleryPage';
-import HomePage from './pages/HomePage';
-import ImageInfoPage from './pages/ImageInfoPage';
-import LoginPage from './pages/LoginPage';
-import NavBar from './components/layout/NavBar/NavBar';
-import NotFoundPage from './pages/NotFoundPage';
-import React from 'react';
-import RegisterPage from './pages/RegisterPage';
-import UploadPage from './pages/UploadPage';
+import Footer from "./components/layout/Footer/Footer";
+import GalleryPage from "./pages/GalleryPage";
+import HomePage from "./pages/HomePage";
+import ImageInfoPage from "./pages/ImageInfoPage";
+import LoginPage from "./pages/LoginPage";
+import NavBar from "./components/layout/NavBar/NavBar";
+import NotFoundPage from "./pages/NotFoundPage";
+import React from "react";
+import RegisterPage from "./pages/RegisterPage";
+import UploadPage from "./pages/UploadPage";
 
 const App: React.FC = () => {
   return (
@@ -26,7 +26,10 @@ const App: React.FC = () => {
               <Routes>
                 <Route path={ROUTES.HOME} element={<HomePage />} />
                 <Route path={ROUTES.GALLERY} element={<GalleryPage />} />
-                <Route path={ROUTES.IMAGE_DETAILS} element={<ImageInfoPage />} />
+                <Route
+                  path={ROUTES.IMAGE_DETAILS}
+                  element={<ImageInfoPage />}
+                />
                 <Route path={ROUTES.UPLOAD} element={<UploadPage />} />
                 <Route path={ROUTES.LOGIN} element={<LoginPage />} />
                 <Route path={ROUTES.REGISTER} element={<RegisterPage />} />
@@ -41,4 +44,4 @@ const App: React.FC = () => {
   );
 };
 
-export default App;
+export default App;
diff --git a/src/components/common/Button/Button.tsx b/src/components/common/Button/Button.tsx
@@ -1,15 +1,21 @@
 // src/components/common/Button/Button.tsx
-import React from 'react';
+import React from "react";
 
 interface ButtonProps {
-  variant: 'primary' | 'secondary';
+  variant: "primary" | "secondary";
   children: React.ReactNode;
   onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
   disabled?: boolean;
-  type?: 'button' | 'submit' | 'reset';
+  type?: "button" | "submit" | "reset";
 }
 
-const Button: React.FC<ButtonProps> = ({ variant, children, onClick, disabled = false, type = 'button' }) => {
+const Button: React.FC<ButtonProps> = ({
+  variant,
+  children,
+  onClick,
+  disabled = false,
+  type = "button",
+}) => {
   return (
     <button
       className={`button button-${variant}`}
@@ -22,4 +28,4 @@ const Button: React.FC<ButtonProps> = ({ variant, children, onClick, disabled =
   );
 };
 
-export default Button;
+export default Button;
diff --git a/src/components/common/ErrorMessage/ErrorMessage.tsx b/src/components/common/ErrorMessage/ErrorMessage.tsx
@@ -1,6 +1,6 @@
 // src/components/common/ErrorMessage/ErrorMessage.tsx
-import './ErrorMessage.css';
-import React from 'react';
+import "./ErrorMessage.css";
+import React from "react";
 
 interface ErrorMessageProps {
   message: string;
@@ -14,4 +14,4 @@ const ErrorMessage: React.FC<ErrorMessageProps> = ({ message }) => {
   );
 };
 
-export default ErrorMessage;
+export default ErrorMessage;
diff --git a/src/components/common/ImageTile/ImageTile.tsx b/src/components/common/ImageTile/ImageTile.tsx
@@ -1,6 +1,6 @@
 // src/components/common/ImageTile/ImageTile.tsx
-import { Image } from '../../../types/image';
-import React from 'react';
+import { Image } from "../../../types/image";
+import React from "react";
 
 interface ImageTileProps {
   image: Image;
@@ -15,4 +15,4 @@ const ImageTile: React.FC<ImageTileProps> = ({ image }) => {
   );
 };
 
-export default ImageTile;
+export default ImageTile;
diff --git a/src/components/common/Input/Input.tsx b/src/components/common/Input/Input.tsx
@@ -1,8 +1,8 @@
 // src/components/common/Input/Input.tsx
-import React from 'react';
+import React from "react";
 
 interface InputProps {
-  type: 'text' | 'number' | 'email' | 'password' | 'date';
+  type: "text" | "number" | "email" | "password" | "date";
   label: string;
   value: string;
   onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
@@ -20,11 +20,14 @@ const Input: React.FC<InputProps> = ({
   name,
   placeholder,
   required = false,
-  error
+  error,
 }) => {
   return (
     <div className="input-group">
-      <label htmlFor={name}>{label}{required && <span className="required">*</span>}</label>
+      <label htmlFor={name}>
+        {label}
+        {required && <span className="required">*</span>}
+      </label>
       <input
         type={type}
         id={name}
@@ -39,4 +42,4 @@ const Input: React.FC<InputProps> = ({
   );
 };
 
-export default Input;
+export default Input;
diff --git a/src/components/common/LoadingMessage/LoadingMessage.tsx b/src/components/common/LoadingMessage/LoadingMessage.tsx
@@ -1,8 +1,8 @@
 // src/components/common/LoadingMessage/LoadingMessage.tsx
-import React from 'react';
+import React from "react";
 
 const LoadingMessage: React.FC = () => {
   return <div className="loading-message">Loading...</div>;
 };
 
-export default LoadingMessage;
+export default LoadingMessage;
diff --git a/src/components/common/Modal/Modal.tsx b/src/components/common/Modal/Modal.tsx
@@ -1,6 +1,6 @@
 // src/components/common/Modal/Modal.tsx
-import React from 'react';
-import './Modal.css';
+import React from "react";
+import "./Modal.css";
 
 interface ModalProps {
   isOpen: boolean;
@@ -14,14 +14,14 @@ const Modal: React.FC<ModalProps> = ({ isOpen, onClose, title, children }) => {
 
   return (
     <div className="modal-overlay" onClick={onClose}>
-      <div className="modal" onClick={e => e.stopPropagation()}>
+      <div className="modal" onClick={(e) => e.stopPropagation()}>
         <div className="modal-header">
           <h2>{title}</h2>
-          <button onClick={onClose} className="modal-close">&times;</button>
-        </div>
-        <div className="modal-content">
-          {children}
+          <button onClick={onClose} className="modal-close">
+            &times;
+          </button>
         </div>
+        <div className="modal-content">{children}</div>
       </div>
     </div>
   );

diff --git a/src/components/features/Gallery/GalleryHeader.tsx b/src/components/features/Gallery/GalleryHeader.tsx
@@ -1,16 +1,19 @@
-
-import React from 'react';
+import React from "react";
 
 const GalleryHeader: React.FC = () => {
   return (
     <div className="gallery-header">
       <h1 className="gallery-title">Gallery Search</h1>
       <div className="search-container">
         <input type="text" className="search-bar" placeholder="Search" />
-        <img src="/assets/icons/search-icon.png" alt="Search Icon" className="search-icon" />
+        <img
+          src="/assets/icons/search-icon.png"
+          alt="Search Icon"
+          className="search-icon"
+        />
       </div>
     </div>
   );
 };
 
-export default GalleryHeader;
+export default GalleryHeader;
diff --git a/src/components/features/Gallery/GalleryList.tsx b/src/components/features/Gallery/GalleryList.tsx
@@ -1,15 +1,18 @@
 // src/components/features/Gallery/GalleryList.tsx
-import ErrorMessage from '../../common/ErrorMessage/ErrorMessage';
-import ImageTile from '../../common/ImageTile/ImageTile';
-import LoadingMessage from '../../common/LoadingMessage/LoadingMessage';
-import React from 'react';
-import useFetchImageList from '../../../hooks/useFetchImageList';
+import ErrorMessage from "../../common/ErrorMessage/ErrorMessage";
+import ImageTile from "../../common/ImageTile/ImageTile";
+import LoadingMessage from "../../common/LoadingMessage/LoadingMessage";
+import React from "react";
+import useFetchImageList from "../../../hooks/useFetchImageList";
 
 const GalleryList: React.FC = () => {
   const { isLoading, isError, data, error } = useFetchImageList();
 
   if (isLoading) return <LoadingMessage />;
-  if (isError) return <ErrorMessage message={`Error fetching images: ${error?.message}`} />;
+  if (isError)
+    return (
+      <ErrorMessage message={`Error fetching images: ${error?.message}`} />
+    );
   if (!data) return <ErrorMessage message="No images available." />;
 
   return (
@@ -21,4 +24,4 @@ const GalleryList: React.FC = () => {
   );
 };
 
-export default GalleryList;
+export default GalleryList;
diff --git a/src/components/features/Home/HomeHero.tsx b/src/components/features/Home/HomeHero.tsx
@@ -1,19 +1,26 @@
-
-import { Link } from 'react-router-dom';
-import React from 'react';
+import { Link } from "react-router-dom";
+import React from "react";
 
 const HomeHero: React.FC = () => {
   return (
     <div className="homepage">
       <div className="background-img"></div>
       <div className="content">
-        <h1>Send us your<br />Satellite Streak</h1>
-        <Link to="/about" className="learn-more-btn">Learn more</Link>
+        <h1>
+          Send us your
+          <br />
+          Satellite Streak
+        </h1>
+        <Link to="/about" className="learn-more-btn">
+          Learn more
+        </Link>
         <div className="Home-Line"></div>
-        <Link to="/gallery" className="gallery-link">View Gallery &#8250;</Link>
+        <Link to="/gallery" className="gallery-link">
+          View Gallery &#8250;
+        </Link>
       </div>
     </div>
   );
 };
 
-export default HomeHero;
+export default HomeHero;
diff --git a/src/components/features/Home/HomeImageList.tsx b/src/components/features/Home/HomeImageList.tsx
@@ -1,16 +1,19 @@
 // src/components/features/Home/HomeImageList.tsx
-import ErrorMessage from '../../common/ErrorMessage/ErrorMessage';
-import ImageTile from '../../common/ImageTile/ImageTile';
-import { Link } from 'react-router-dom';
-import LoadingMessage from '../../common/LoadingMessage/LoadingMessage';
-import React from 'react';
-import useFetchImageList from '../../../hooks/useFetchImageList';
+import ErrorMessage from "../../common/ErrorMessage/ErrorMessage";
+import ImageTile from "../../common/ImageTile/ImageTile";
+import { Link } from "react-router-dom";
+import LoadingMessage from "../../common/LoadingMessage/LoadingMessage";
+import React from "react";
+import useFetchImageList from "../../../hooks/useFetchImageList";
 
 const HomeImageList: React.FC = () => {
   const { isLoading, isError, data, error } = useFetchImageList();
 
   if (isLoading) return <LoadingMessage />;
-  if (isError) return <ErrorMessage message={`Error fetching images: ${error?.message}`} />;
+  if (isError)
+    return (
+      <ErrorMessage message={`Error fetching images: ${error?.message}`} />
+    );
   if (!data) return <ErrorMessage message="No images available." />;
 
   const firstRowImages = data.slice(0, 6);
@@ -22,9 +25,11 @@ const HomeImageList: React.FC = () => {
           <ImageTile key={image.name} image={image} />
         ))}
       </div>
-      <Link to="/gallery" className="view-gallery-link">View Gallery &#8250;</Link>
+      <Link to="/gallery" className="view-gallery-link">
+        View Gallery &#8250;
+      </Link>
     </div>
   );
 };
 
-export default HomeImageList;
+export default HomeImageList;
diff --git a/src/components/features/ImageInfo/ImageDetails.tsx b/src/components/features/ImageInfo/ImageDetails.tsx
@@ -1,6 +1,6 @@
 // src/components/features/ImageInfo/ImageDetails.tsx
-import { Image } from '../../../types/image';
-import React from 'react';
+import { Image } from "../../../types/image";
+import React from "react";
 
 interface ImageDetailsProps {
   image: Image;
@@ -16,12 +16,14 @@ const ImageDetails: React.FC<ImageDetailsProps> = ({ image }) => {
         <p>Upload Date: {new Date(image.uploadDate).toLocaleDateString()}</p>
         <div className="image-tags">
           {image.tags.map((tag, index) => (
-            <span key={index} className="tag">{tag}</span>
+            <span key={index} className="tag">
+              {tag}
+            </span>
           ))}
         </div>
       </div>
     </div>
   );
 };
 
-export default ImageDetails;
+export default ImageDetails;
diff --git a/src/components/features/Upload/DragAndDrop.tsx b/src/components/features/Upload/DragAndDrop.tsx
@@ -1,10 +1,14 @@
 // src/components/features/Upload/DragAndDrop.tsx
-import React from 'react';
+import React from "react";
 
 const DragAndDrop: React.FC = () => {
   return (
     <div className="drag-and-drop">
-      <img src="/src/assets/icons/upload-icon.png" alt="Upload" className="upload-icon" />
+      <img
+        src="/src/assets/icons/upload-icon.png"
+        alt="Upload"
+        className="upload-icon"
+      />
       <p>Drag and drop your files here</p>
       <p>or</p>
       <label htmlFor="file-upload" className="custom-file-upload">
@@ -15,4 +19,4 @@ const DragAndDrop: React.FC = () => {
   );
 };
 
-export default DragAndDrop;
+export default DragAndDrop;