Merge pull request #70 from brandonnorsworthy/final-data

fix overflows and final data rendering

src/constants.ts

@@ -0,0 +1,2 @@
+
+export const DEFAULT_IMG_URL = "https://questsandbox.s3.amazonaws.com/mission.png";

src/modals/EditQuest/EditQuest.tsx

@@ -3,6 +3,7 @@ import Button from '../../components/Button';
 import { Category } from '@/models/CategoryModels/categoryResponse';
 import { Quest } from '@/models/QuestModels/questResponse';
 import { EditQuestRequest } from '@/models/QuestModels/questRequests';
+import { DEFAULT_IMG_URL } from '@/constants';
 
 interface ModalProps {
   onClose: () => void;
@@ -23,7 +24,7 @@ const EditQuest: React.FC<ModalProps> = (props) => {
 
   const [previewQuest, setPreviewQuest] = useState(true);
 
-  const [imageUrl] = useState(quest.image_url);
+  const [imageUrl] = useState(quest?.image_url || DEFAULT_IMG_URL);
   const [title, setTitle] = useState(quest.title);
   const [description, setDescription] = useState(quest.description);
   const [objectives, setObjectives] = useState<string[]>(quest.objectives);

src/modals/EditSuggestions/EditSuggestions.tsx

@@ -3,6 +3,7 @@ import Button from '../../components/Button';
 import { Suggestion } from '@/models/SuggestionModels/suggestionResponse';
 import { Category } from '@/models/CategoryModels/categoryResponse';
 import { convertSuggestionIntoQuestBodyRequest } from '@/models/SuggestionModels/suggestionRequests';
+import { DEFAULT_IMG_URL } from '@/constants';
 
 interface ModalProps {
   onClose: () => void;
@@ -22,7 +23,7 @@ const EditSuggestion: React.FC<ModalProps> = (props) => {
   } = props;
 
   const [previewQuest, setPreviewQuest] = useState(true);
-  const [imageUrl] = useState("https://questsandbox.s3.amazonaws.com/mission.png");
+  const [imageUrl] = useState(DEFAULT_IMG_URL);
   const [title, setTitle] = useState(suggestion.title);
   const [description, setDescription] = useState(suggestion.description);
   const [objectives, setObjectives] = useState<string[]>([]);

src/modals/ViewQuest/ViewQuest.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import Button from '../../components/Button';
 import { Quest } from '@/models/QuestModels/questResponse';
+import { DEFAULT_IMG_URL } from '@/constants';
 
 interface ModalProps {
   onClose: () => void;
@@ -23,7 +24,7 @@ const ViewQuest: React.FC<ModalProps> = (props) => {
   return (
     <>
       <img
-        src={image_url}
+        src={image_url ? image_url : DEFAULT_IMG_URL}
         alt="logo"
         className='w-full max-h-[16rem] object-cover'
       />

src/pages/AllQuestsPage.tsx

@@ -91,7 +91,7 @@ const AllQuestsPage: React.FC = () => {
   }
 
   return (
-    <main className="h-dvh w-dvw">
+    <main className="overflow-hidden h-dvh w-dvw">
       <div className="absolute h-dvh w-dvw overflow-hidden z-[-1] bg-secondary/50">
       </div>
 

src/pages/LandingPage.tsx

@@ -161,7 +161,7 @@ const LandingPage = () => {
   };
 
   return (
-    <main className="flex justify-center w-full h-screen overflow-hidden">
+    <main className="flex justify-center overflow-hidden h-dvh">
       <div className="flex flex-col xl:max-w-[86rem] items-start mt-1 w-full ml-2 text-5xl sm:mt-10 sm:ml-10 text-white/50">
         <img src={logoImg} alt="logo" className="h-36 md:h-32" />
 

src/pages/LoginPage.tsx

@@ -13,7 +13,7 @@ const LoginPage: React.FC = () => {
   }
 
   return (
-    <main className="h-screen overflow-hidden">
+    <main className="overflow-hidden h-dvh w-dvw">
       <LoginPanel
         onLoginSuccess={() => navigate("/")}
         onRegistrationSuccess={() => navigate("/")}

src/pages/admin/AdminPage.tsx

@@ -9,7 +9,7 @@ import withAuth from "@/hocs/withAuth";
 const AdminPage = () => {
   const navigate = useNavigate();
   return (
-    <main className="flex justify-center w-full h-screen overflow-hidden">
+    <main className="flex justify-center overflow-hidden h-dvh w-dvw">
       <div className="flex flex-col xl:max-w-[86rem] items-start mt-1 w-full ml-2 text-5xl sm:mt-10 sm:ml-10 text-white/50">
         <img src={logoImg} alt="logo" className="h-36 md:h-32" />
 

src/pages/admin/AdminQuestsPage.tsx

@@ -134,7 +134,7 @@ const AdminQuestsPage = () => {
   };
 
   return (
-    <main className="h-dvh w-dvw">
+    <main className="overflow-hidden h-dvh w-dvw">
       <div className="absolute h-dvh w-dvw overflow-hidden z-[-1] bg-secondary/50">
       </div>
 

src/pages/admin/AdminSuggestionsPage.tsx

@@ -136,7 +136,7 @@ const AdminSuggestionsPage = () => {
   };
 
   return (
-    <main className="h-dvh w-dvw">
+    <main className="overflow-hidden h-dvh w-dvw">
       <div className="absolute h-dvh w-dvw overflow-hidden z-[-1] bg-secondary/50">
       </div>
 

src/pages/admin/AdminUsersPage.tsx

@@ -48,7 +48,7 @@ const AdminUsersPage = () => {
   }, [page, fetchUsers]);
 
   return (
-    <main className="h-dvh w-dvw">
+    <main className="overflow-hidden h-dvh w-dvw">
       <div className="absolute h-dvh w-dvw overflow-hidden z-[-1] bg-secondary/50">
       </div>