Merge branch 'categories-page' of https://github.com/TritonSE/DFM-Sid…

…eline-Sidekick-App into categories-page
TritonSE · May 27, 2024 · f2f5f64 · f2f5f64
2 parents 55b7dcf + f40f64e
commit f2f5f64
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 17 deletions.
diff --git a/admin-portal-frontend/src/app/components/CategoryContainer.tsx b/admin-portal-frontend/src/app/components/CategoryContainer.tsx
@@ -6,7 +6,6 @@ import EditIcon from "../icons/edit.svg";
 import TrashIcon from "../icons/trash.svg";
 
 import DeleteConfirmationPopup from "./DeletePopup";
-
 import { Category } from "./categoryRoutes";
 
 type IconProps = {
@@ -19,7 +18,7 @@ type CategoryItemProps = {
   title: string;
   visibility?: boolean;
   pages: number;
-  onDeleteCategory: (categoryId: string) => void;
+  onDeleteCategory: (categoryId: string) => Promise<void>;
 };
 
 const CategoryItem: React.FC<CategoryItemProps> = ({ id, title, pages, onDeleteCategory }) => {
@@ -33,7 +32,7 @@ const CategoryItem: React.FC<CategoryItemProps> = ({ id, title, pages, onDeleteC
 
   const handleConfirmDelete = () => {
     try {
-      onDeleteCategory(id);
+      void onDeleteCategory(id);
       setPopupVisible(false);
     } catch (error) {
       console.error("Error deleting category:", error);
@@ -93,7 +92,7 @@ const CategoryItem: React.FC<CategoryItemProps> = ({ id, title, pages, onDeleteC
 export const CategoryContainer: React.FC<{
   items: Category[];
   type: string;
-  onDeleteCategory: (categoryId: string) => void;
+  onDeleteCategory: (categoryId: string) => Promise<void>;
 }> = ({ items: categories, type, onDeleteCategory }) => {
   return (
     <table>

diff --git a/admin-portal-frontend/src/app/components/Toast.tsx b/admin-portal-frontend/src/app/components/Toast.tsx
@@ -1,8 +1,12 @@
-import React from "react";
+import React, { useEffect } from "react";
 
-import { useEffect, useState } from "react";
-import CloseIcon from "../icons/close.svg";
 import CheckIcon from "../icons/check.svg";
+import CloseIcon from "../icons/close.svg";
+
+type IconProps = {
+  'content-type': string,
+  src: string
+}
 
 type ToastProps = {
   backgroundColor: string;
@@ -28,10 +32,10 @@ const Toast: React.FC<ToastProps> = ({ backgroundColor, message, onClose }) => {
         style={{ backgroundColor: backgroundColor }}
         className={`flex items-center justify-between w-auto py-4 px-6 rounded-lg transition-opacity duration-300 ease-in opacity-100 text-white`}
       >
-        <img src={CheckIcon.src} alt="Check" className="w-4 h-4 mr-2" />
+        <img src={( CheckIcon as IconProps ).src} alt="Check" className="w-4 h-4 mr-2" />
         <p className="text-sm mr-2">{message}</p>
         <button className="focus:outline-none" onClick={onClose}>
-          <img src={CloseIcon.src} alt="Close" className="w-4 h-4" />
+          <img src={( CloseIcon as IconProps ).src} alt="Close" className="w-4 h-4" />
         </button>
       </div>
     </div>

diff --git a/admin-portal-frontend/src/app/emergencies/page.tsx b/admin-portal-frontend/src/app/emergencies/page.tsx
@@ -1,9 +1,10 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import CategoryContainer from "../components/CategoryContainer";
-import { Category, getAllCategories, deleteCategory } from "../components/categoryRoutes";
+
+import { CategoryContainer } from "../components/CategoryContainer";
 import Toast from "../components/Toast";
+import { Category, deleteCategory, getAllCategories } from "../components/categoryRoutes";
 
 export default function CategoriesPage() {
   const [categories, setCategories] = useState([]);
@@ -19,7 +20,7 @@ export default function CategoriesPage() {
       }
     };
 
-    fetchData();
+    void fetchData();
   }, [categories]);
 
   const onDeleteCategory = async (categoryId: string) => {

diff --git a/admin-portal-frontend/src/app/general-principles/page.tsx b/admin-portal-frontend/src/app/general-principles/page.tsx
@@ -1,9 +1,10 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import CategoryContainer from "../components/CategoryContainer";
-import { Category, getAllCategories, deleteCategory } from "../components/categoryRoutes";
+
+import { CategoryContainer } from "../components/CategoryContainer";
 import Toast from "../components/Toast";
+import { Category, deleteCategory, getAllCategories } from "../components/categoryRoutes";
 
 export default function CategoriesPage() {
   const [categories, setCategories] = useState([]);
@@ -19,7 +20,7 @@ export default function CategoriesPage() {
       }
     };
 
-    fetchData();
+    void fetchData();
   }, [categories]);
 
   const onDeleteCategory = async (categoryId: string) => {
@@ -41,8 +42,8 @@ export default function CategoriesPage() {
       <div className="flex flex-row justify-between w-full md:w-5/6 lg:w-4/5 xl:w-3/4 mb-6">
         <h1 className="text-start text-2xl font-bold">General Principles</h1>
         <div>
-          <select className="px-3 py-1 bg-white">
-            <option disabled selected hidden>
+          <select defaultValue="Filter by" className="px-3 py-1 bg-white">
+            <option value="Filter by" disabled hidden>
               Filter by
             </option>
             <option value="Alphabetical Order">Alphabetical Order</option>