From 5ab9f0b2c2e6f62b329044d73b30655b858f4dc3 Mon Sep 17 00:00:00 2001
From: Mike Smith <89040888+smiggiddy@users.noreply.github.com>
Date: Sat, 14 Jun 2025 20:54:36 -0400
Subject: [PATCH] feat: added styling

---
 file-uploader/prisma/schema.prisma              |  2 +-
 file-uploader/public/css/style.css              | 15 ++++++++++++++-
 .../src/controllers/indexController.js          |  4 +++-
 file-uploader/src/middlewares/auth.js           |  3 +--
 file-uploader/src/utils/formatHelpers.js        |  2 +-
 file-uploader/src/views/main.ejs                | 17 ++++++++---------
 .../src/views/partials/directoryListing.ejs     | 13 ++++++-------
 7 files changed, 34 insertions(+), 22 deletions(-)

diff --git a/file-uploader/prisma/schema.prisma b/file-uploader/prisma/schema.prisma
index 20808ad..dcdc230 100644
--- a/file-uploader/prisma/schema.prisma
+++ b/file-uploader/prisma/schema.prisma
@@ -41,7 +41,7 @@ model File {
 model Folder {
         id                String   @id @default(uuid())
         name              String   @db.VarChar(255)
-        creation_date     DateTime @default(now())
+        createdAt         DateTime @default(now())
         modification_date DateTime @default(now())
         File              File[]
         owner             User?    @relation(fields: [owner_user_id], references: [id])
diff --git a/file-uploader/public/css/style.css b/file-uploader/public/css/style.css
index cefe11d..df9bda9 100644
--- a/file-uploader/public/css/style.css
+++ b/file-uploader/public/css/style.css
@@ -141,8 +141,17 @@ input[type='file']:focus::file-selector-button {
 
 main {
     display: flex;
-    align-items: center;
     justify-content: center;
+    width: 100%;
+}
+
+main > div {
+    width: 100%;
+}
+
+aside {
+    min-width: 250px;
+    padding: 1em;
 }
 .flex {
     display: flex;
@@ -153,5 +162,9 @@ main {
     grid-template-columns: 1fr 1fr 1fr;
 }
 
+.app {
+    height: 100%;
+}
+
 @media screen and (max-width: 600px) {
 }
diff --git a/file-uploader/src/controllers/indexController.js b/file-uploader/src/controllers/indexController.js
index 4da1d99..ddb1e60 100644
--- a/file-uploader/src/controllers/indexController.js
+++ b/file-uploader/src/controllers/indexController.js
@@ -2,9 +2,10 @@ const {
     getDirectoryContents,
     getParentDirectories,
 } = require('../services/fileService');
+const { formatBytes } = require('../utils/formatHelpers');
 
 const indexGet = async (req, res) => {
-    if (req.user) {
+    if (req.isAuthenticated()) {
         res.redirect(`/fs/${req.user.username}/${req.user.rootDirectoryId}`);
         // if unauthenticated redirect
     } else {
@@ -27,6 +28,7 @@ const userDirectoryNavigation = async (req, res) => {
         folder: { id: directoryId, name: dirContents.name },
         directoryListing: dirContents,
         parentDirectories: parentDirectories,
+        formatBytes: formatBytes,
     });
 };
 
diff --git a/file-uploader/src/middlewares/auth.js b/file-uploader/src/middlewares/auth.js
index afef4fb..a56c6fe 100644
--- a/file-uploader/src/middlewares/auth.js
+++ b/file-uploader/src/middlewares/auth.js
@@ -51,8 +51,7 @@ passport.deserializeUser(async (id, done) => {
 });
 
 const loggedIn = function (req, res, next) {
-    if (req.isAuthenticated()) console.log('logged in');
-    if (!req.user) res.redirect('/');
+    if (!req.isAuthenticated()) res.redirect('/');
     next();
 };
 
diff --git a/file-uploader/src/utils/formatHelpers.js b/file-uploader/src/utils/formatHelpers.js
index ecb001e..5dc87dd 100644
--- a/file-uploader/src/utils/formatHelpers.js
+++ b/file-uploader/src/utils/formatHelpers.js
@@ -8,7 +8,7 @@ const getFullUploadPath = async (folderId, folderName, username, filename) => {
 };
 
 const formatBytes = (bytes, decimals = 2) => {
-    if (!+bytes) return '0 Bytes';
+    if (!+bytes) return '-';
 
     const k = 1024;
     const dm = decimals < 0 ? 0 : decimals;
diff --git a/file-uploader/src/views/main.ejs b/file-uploader/src/views/main.ejs
index fe50d4e..40592db 100644
--- a/file-uploader/src/views/main.ejs
+++ b/file-uploader/src/views/main.ejs
@@ -1,23 +1,22 @@
 <%- include('partials/header') %>
 <body>
     <% if(currentUser) { %>
-      <div class="container flex">
-       <p> Hello <%= currentUser.username %> </p>
-       <a href="/auth/logout">sign out</a>
-	</div>
-
+      <div class="container flex app">
+      <aside class="nav">
+	       <p> Hello <%= currentUser.username %> </p>
+	       <a href="/auth/logout">sign out</a>
+	       <%- include('partials/newDirectory') %>
+	       <%- include('partials/fileUpload') %>
+      </aside>
        <main>
            <div class="container">
-		<div class="container flex">
-		       <%- include('partials/newDirectory') %>
-		       <%- include('partials/fileUpload') %>
-		</div>
 
 
 	       <%- include('partials/parentDirectories') %>
 	       <%- include('partials/directoryListing') %>
 	   </div>
        </main>
+	</div>
         <% } else {  %>
     <main>
 	    <form action="/auth/login" method="post">
diff --git a/file-uploader/src/views/partials/directoryListing.ejs b/file-uploader/src/views/partials/directoryListing.ejs
index 97938c0..8f2d060 100644
--- a/file-uploader/src/views/partials/directoryListing.ejs
+++ b/file-uploader/src/views/partials/directoryListing.ejs
@@ -1,15 +1,15 @@
 <section class="container directory-listing">
     <div class="directory-grid">
     <div class="col file-name heading directory__grid_heading">
-    	<p>Name</p>
+    	<p class="title__heading">Name</p>
     </div>
 
     <div class="col file-size directory__grid__heading">
-   	<p>Size</p> 
+   	<p class="title__heading">Size</p> 
     </div>
 
     <div class="col file-modified directory__grid__heading">
-    	<p>Modified Last</p>
+    	<p class="title__heading">Created</p>
     </div>
     <!-- Combined loop for both directories and files -->
     <% 
@@ -23,10 +23,10 @@
         <% } %>
       </div>
       <div class="col file-size">
-          <p><%= item?.size %></p>
+          <p><%= formatBytes(item?.size) %></p>
       </div>
       <div class="col file-modified">
-         <p><%= item?.modifiedAt %></p>
+         <p><%= item?.createdAt %></p>
       </div>
     <% }; %>
 
@@ -36,6 +36,5 @@
     <!-- Render files -->
     <% directoryListing.File.forEach(f => renderItem(f, false)); %>
   </div>  
-
-    </div>  
+</div>  
 </section>