Merge pull request #93 from MemoriterApp/all-archived-fixes

Archive text fixes
MemoriterApp · Aug 15, 2023 · 4536bd9 · 4536bd9
2 parents 07b523f + 5af7efd
commit 4536bd9
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 19 deletions.
diff --git a/src/components/layout/archive/archive.css b/src/components/layout/archive/archive.css
@@ -15,4 +15,11 @@
   color: var(--color-font);
   font: 1.6rem var(--font-default);
   text-align: center;
+}
+
+.archive-empty {
+  font: italic 1.2rem var(--font-default);
+  color: var(--color-font-gray);
+  text-align: center;
+  margin: -4px 0 8px;
 }
diff --git a/src/components/layout/archive/archive.tsx b/src/components/layout/archive/archive.tsx
@@ -20,23 +20,27 @@ const Archive = ({
   return (
     <div className='archive'>
       <h1>Archive</h1>
-      {folders // render archived folders
-        .filter((folder: Type.Folder) => folder.archived)
-        .map((folder: Type.Folder) => (
-          <ArchiveFolder
-            key={folder._id}
-            folder={folder}
-            onChangeFolderIcon={(id, emoji) => onChangeFolderIcon(id, emoji)}
-            onUnarchiveFolder={(id) => onUnarchiveFolder(id)}
-            onDeleteFolder={(folder) => onDeleteFolder(folder)}
-            onUpdateCurrentFolder={(currentFolder: {
-              id: string;
-              title: string;
-              favorite: boolean;
-            }) => onUpdateCurrentFolder(currentFolder)}
-            onCloseArchive={() => onCloseArchive()}
-          />
-        ))}
+      {folders.filter((folder: Type.Folder) => folder.archived).length === 0 ? (
+        <p className='archive-empty'>Currently there are no archived folders.</p>
+      ) : (
+        folders // render archived folders
+          .filter((folder: Type.Folder) => folder.archived)
+          .map((folder: Type.Folder) => (
+            <ArchiveFolder
+              key={folder._id}
+              folder={folder}
+              onChangeFolderIcon={(id, emoji) => onChangeFolderIcon(id, emoji)}
+              onUnarchiveFolder={(id) => onUnarchiveFolder(id)}
+              onDeleteFolder={(folder) => onDeleteFolder(folder)}
+              onUpdateCurrentFolder={(currentFolder: {
+                id: string;
+                title: string;
+                favorite: boolean;
+              }) => onUpdateCurrentFolder(currentFolder)}
+              onCloseArchive={() => onCloseArchive()}
+            />
+          ))
+      )}
     </div>
   );
 };

diff --git a/src/pages/home-stuff/home/home.tsx b/src/pages/home-stuff/home/home.tsx
@@ -59,7 +59,7 @@ function HomePage() {
   const deleteFolder = (folder: Type.Folder) => {
     ref.current.onDeleteFolder(folder);
   };
-    
+
   const closeModal = () => {
     setModalIsOpen(false);
   };
@@ -98,7 +98,7 @@ function HomePage() {
               onDragStart={handleDragStart}
               sensors={sensors}
             >
-              {folders.length > 0 ? (
+              {folders.filter((folder: Type.Folder) => !folder.archived).length > 0 ? (
                 <div />
               ) : (
                 <div className='no-folder-text'>