ran prettier

nheek · Oct 28, 2024 · b2c4ba2 · b2c4ba2
1 parent ab0ea98
commit b2c4ba2
Show file tree

Hide file tree

Showing 10 changed files with 132 additions and 55 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -57,7 +57,7 @@ jobs:
             mkdir .sql_data
             cd .sql_data
             curl -O -L https://raw.githubusercontent.com/nheek/uppy/main/.sql_data/create_database.sql
-            
+
             cd ..
             docker compose pull
-            docker compose up -d && curl -d "uppy deployed succesfully 🚀" https://ntfy.nheek.com/${{ secrets.NTFY_TOPIC }}
+            docker compose up -d && curl -d "uppy deployed succesfully 🚀" https://ntfy.nheek.com/${{ secrets.NTFY_TOPIC }}
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
@@ -29,4 +29,4 @@ services:
 
 volumes:
   postgres_db_data:
-  uploads:
+  uploads:
diff --git a/docker-compose.yml b/docker-compose.yml
@@ -23,4 +23,4 @@ services:
 
 volumes:
   postgres_db_data:
-  uploads:
+  uploads:
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "uppy",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -24,14 +24,14 @@
     "react": "^18.3.1",
     "react-cropper": "^2.3.3",
     "react-dom": "^18.3.1",
-    "uuid": "^10.0.0"
+    "uuid": "^11.0.2"
   },
   "devDependencies": {
     "@types/bcryptjs": "^2.4.6",
     "@types/formidable": "^3.4.5",
     "@types/js-cookie": "^3.0.6",
     "@types/jsonwebtoken": "^9.0.7",
-    "@types/node": "22.7.5",
+    "@types/node": "22.8.1",
     "@types/pg": "^8.11.10",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.0",

diff --git a/src/app/components/FileUpload/FileUpload.tsx b/src/app/components/FileUpload/FileUpload.tsx
@@ -119,7 +119,19 @@ const FileUpload = () => {
           type="submit"
           className="neu w-full h-14 bg-blue-500 flex items-center justify-center gap-4 text-blue-950 mt-6 p-2 rounded-3xl"
         >
-          <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 8l-5-5-5 5M12 4.2v10.3"/></svg>
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="30"
+            height="30"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="#172554"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 8l-5-5-5 5M12 4.2v10.3" />
+          </svg>
           <span className="text-lg">Upload File</span>
         </button>
       </form>

diff --git a/src/app/components/Header/Header.tsx b/src/app/components/Header/Header.tsx
@@ -26,31 +26,95 @@ const Header = () => {
           <ul className="flex gap-4 items-center">
             <li>
               <Link href="/file-upload">
-              <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 8l-5-5-5 5M12 4.2v10.3"/></svg>
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="30"
+                  height="30"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="#172554"
+                  stroke-width="2"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                >
+                  <path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 8l-5-5-5 5M12 4.2v10.3" />
+                </svg>
               </Link>
             </li>
             <li>
               <Link href="/my-files">
-              <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 2H6a2 2 0 0 0-2 2v16c0 1.1.9 2 2 2h12a2 2 0 0 0 2-2V9l-7-7z"/><path d="M13 3v6h6"/></svg>
+                <svg
+                  xmlns="http://www.w3.org/2000/svg"
+                  width="30"
+                  height="30"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="#172554"
+                  stroke-width="2"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                >
+                  <path d="M13 2H6a2 2 0 0 0-2 2v16c0 1.1.9 2 2 2h12a2 2 0 0 0 2-2V9l-7-7z" />
+                  <path d="M13 3v6h6" />
+                </svg>
               </Link>
             </li>
             {!isLoggedIn ? (
               <>
                 <li>
                   <Link href="/register">
-                  <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="20" y1="8" x2="20" y2="14"></line><line x1="23" y1="11" x2="17" y2="11"></line></svg>
+                    <svg
+                      xmlns="http://www.w3.org/2000/svg"
+                      width="30"
+                      height="30"
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="#172554"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                    >
+                      <path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
+                      <circle cx="8.5" cy="7" r="4"></circle>
+                      <line x1="20" y1="8" x2="20" y2="14"></line>
+                      <line x1="23" y1="11" x2="17" y2="11"></line>
+                    </svg>
                   </Link>
                 </li>
                 <li>
                   <Link href="/login">
-                  <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4M10 17l5-5-5-5M13.8 12H3"/></svg>
+                    <svg
+                      xmlns="http://www.w3.org/2000/svg"
+                      width="30"
+                      height="30"
+                      viewBox="0 0 24 24"
+                      fill="none"
+                      stroke="#172554"
+                      stroke-width="2"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                    >
+                      <path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4M10 17l5-5-5-5M13.8 12H3" />
+                    </svg>
                   </Link>
                 </li>
               </>
             ) : (
               <li className="flex">
                 <button onClick={handleLogout}>
-                <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" fill="none" stroke="#172554" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 17l5-5-5-5M19.8 12H9M13 22a10 10 0 1 1 0-20"/></svg>
+                  <svg
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="30"
+                    height="30"
+                    viewBox="0 0 24 24"
+                    fill="none"
+                    stroke="#172554"
+                    stroke-width="2"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                  >
+                    <path d="M16 17l5-5-5-5M19.8 12H9M13 22a10 10 0 1 1 0-20" />
+                  </svg>
                 </button>
               </li>
             )}

diff --git a/src/app/components/Modal/Modal.tsx b/src/app/components/Modal/Modal.tsx
@@ -24,16 +24,16 @@ const Modal: React.FC<ModalProps> = ({
       <div className="neu-modal bg-gray-500 text-blue-950 rounded-lg shadow-lg w-11/12 max-w-md p-6">
         <h2 className="text-xl font-semibold mb-4">{title}</h2>
         <p className="mb-6">{message}</p>
-        {children && <div className="mb-4">{children}</div>} {/* Render children if provided */}
-        {
-          closeBtn &&
-            <button
-              onClick={onClose}
-              className="block bg-blue-950 text-white mt-2 px-6 py-2 rounded-3xl mr-0 ml-auto"
-            >
-              Close
-            </button>
-        }
+        {children && <div className="mb-4">{children}</div>}{" "}
+        {/* Render children if provided */}
+        {closeBtn && (
+          <button
+            onClick={onClose}
+            className="block bg-blue-950 text-white mt-2 px-6 py-2 rounded-3xl mr-0 ml-auto"
+          >
+            Close
+          </button>
+        )}
       </div>
     </div>
   );

diff --git a/src/app/components/MyFiles/MyFiles.tsx b/src/app/components/MyFiles/MyFiles.tsx
@@ -3,7 +3,13 @@ import Cookies from "js-cookie";
 import Cropper from "react-cropper";
 import "cropperjs/dist/cropper.css";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faTrash, faCopy, faCrop, faEye, faFileAlt } from "@fortawesome/free-solid-svg-icons";
+import {
+  faTrash,
+  faCopy,
+  faCrop,
+  faEye,
+  faFileAlt,
+} from "@fortawesome/free-solid-svg-icons";
 import Modal from "@/app/components/Modal/Modal";
 
 interface File {
@@ -22,7 +28,8 @@ const MyFiles = () => {
   const [isModalVisible, setIsModalVisible] = useState(false);
   const [modalTitle, setModalTitle] = useState("");
   const [modalMessage, setModalMessage] = useState("");
-  const [isDeleteConfirmationVisible, setIsDeleteConfirmationVisible] = useState(false);
+  const [isDeleteConfirmationVisible, setIsDeleteConfirmationVisible] =
+    useState(false);
   const [fileToDelete, setFileToDelete] = useState<File | null>(null);
   const [websiteUrl, setWebsiteUrl] = useState<string>("");
 
@@ -62,7 +69,11 @@ const MyFiles = () => {
   }, []);
 
   if (loading) {
-    return <div className="flex items-center justify-center min-h-screen text-xl font-bold text-blue-600">Loading...</div>;
+    return (
+      <div className="flex items-center justify-center min-h-screen text-xl font-bold text-blue-600">
+        Loading...
+      </div>
+    );
   }
 
   if (!isLoggedIn) {
@@ -186,17 +197,16 @@ const MyFiles = () => {
 
   return (
     <div className="flex flex-col min-h-screen py-6">
-      <h1 className="text-4xl mt-[20%] md:mt-[5%] mb-4 pl-4 font-bold text-blue-950">My Files</h1>
+      <h1 className="text-4xl mt-[20%] md:mt-[5%] mb-4 pl-4 font-bold text-blue-950">
+        My Files
+      </h1>
 
       {files.length === 0 ? (
         <p className="text-gray-600 pl-4">No files uploaded yet.</p>
       ) : (
         <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 md:gap-2 px-4">
           {files.map((file) => (
-            <div
-              key={file.id}
-              className="py-2 neu"
-            >
+            <div key={file.id} className="py-2 neu">
               <p className="font-semibold mt-4 mb-2 pl-4 text-blue-950">
                 {file.original_name}
               </p>
@@ -219,7 +229,9 @@ const MyFiles = () => {
                   <FontAwesomeIcon icon={faTrash} className="text-red-500" />
                 </button>
                 <button
-                  onClick={() => copyToClipboard(`${websiteUrl}/uploads/${file.saved_name}`)}
+                  onClick={() =>
+                    copyToClipboard(`${websiteUrl}/uploads/${file.saved_name}`)
+                  }
                   className="py-1 px-2 rounded hover:bg-gray-200 transition"
                   title="Copy Shareable Link"
                 >

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -9,7 +9,7 @@
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --background: #DBDDDA    ;
+    --background: #dbddda;
     --foreground: #ededed;
   }
 }
@@ -29,12 +29,14 @@ body {
 .neu {
   border-radius: 50px;
   background: #e0e0e0;
-  box-shadow:  20px 20px 60px #bebebe,
-             -20px -20px 60px #ffffff;
+  box-shadow:
+    20px 20px 60px #bebebe,
+    -20px -20px 60px #ffffff;
 }
 .neu-modal {
   border-radius: 50px;
   background: #e0e0e0;
-  box-shadow:  5px 5px 12px #bebebe,
-             -5px -5px 12px #ffffff;
-}
+  box-shadow:
+    5px 5px 12px #bebebe,
+    -5px -5px 12px #ffffff;
+}
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,10 +1,6 @@
 {
   "compilerOptions": {
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -22,19 +18,10 @@
       }
     ],
     "paths": {
-      "@/*": [
-        "./src/*"
-      ]
+      "@/*": ["./src/*"]
     },
     "target": "ES2017"
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
 }