added quest filters, setting to reset all progress

public/assets/text/news.md

@@ -3,7 +3,7 @@
 ## September 21, 2024
 **New Release:** Version 1.0.0 is out!
 - spin the wheel to get a random challenge
-- add category filters to exclude stuff like "Roleplay" or "PVP"
+- add category filters to select only categories you want quests from "Roleplay" or "PVP"
 - submit your own challenges to be added to the wheel
 - track your progress with all the challenges
 - create an account to save your progress across devices

src/components/UsernameBubble/UsernameBubble.tsx

@@ -1,17 +1,15 @@
+import { UserToken } from '@/models/AuthModels/userToken';
 import React from 'react';
 
 type UsernameBubbleProps = {
-  user: {
-    username: string;
-    role: string;
-  }
+  user: UserToken
 }
 
 const UsernameBubble: React.FC<UsernameBubbleProps> = ({ user }) => {
   return (
     <div className="fixed flex flex-col justify-end p-2 rounded top-4 md:top-8 right-4 md:right-8 text-black/50 bg-white/50">
       <p className="text-right">
-        <span className="font-bold">Hello, {user.username}</span>
+        <span className="font-bold">Hello, {user.role === 'guest' ? "Anonymous" : user.username}</span>
         {
           (user.role === "admin" || user.role === "moderator") &&
           <span className={`font-bold ${user.role === "admin" ? "text-red-500" : user.role === "moderator" ? "text-blue-500"  : ""}`}> [{user.role}]</span>

src/modals/Settings/Settings.tsx

@@ -8,6 +8,8 @@ import categoryService from "@/service/categoryService";
 import { Category } from "@/models/CategoryModels/categoryResponse";
 import MultiSelect from "@/components/MultiSelect";
 import Loader from "@/components/Loader";
+import Modal from "@/components/Modal";
+import ConfirmDialog from "@/components/ConfirmDialog";
 
 interface SettingsProps {
   onClose: () => void;
@@ -24,6 +26,7 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
 
   const [categories, setCategories] = useState<Category[]>([]);
   const [isCategoriesLoading, setIsCategoriesLoading] = useState(true);
+  const [confirmDialog, setConfirmDialog] = useState<{ title: string; description: string; onConfirm: () => void; } | null>(null);
 
   const formRef = useRef<HTMLFormElement>(null);
 
@@ -81,6 +84,27 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
     }
   };
 
+  const handleResetAllQuests = async () => {
+    const onConfirm = async () => {
+      try {
+        if (!accessToken) return;
+
+        await userService.resetAllQuests(accessToken);
+        toast.success("All quests have been reset successfully");
+      } catch (error) {
+        toast.error("Failed to reset all quests", error);
+      } finally {
+        setConfirmDialog(null);
+      }
+    };
+
+    setConfirmDialog({
+      title: "Are you sure?",
+      description: "If you reset all quests you will lose all progress, this cannot be undone.",
+      onConfirm: onConfirm,
+    });
+  }
+
   return (
     <div className="max-h-full w-full md:w-[500px]">
       <form onSubmit={handleSubmit} ref={formRef}>
@@ -98,7 +122,7 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
             <span>Disable Animations</span>
           </label>
 
-          <label className="flex items-center space-x-2">
+          {/* <label className="flex items-center space-x-2">
             <input
               type="checkbox"
               checked={instrumentDLCQuests}
@@ -123,7 +147,7 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
               onChange={() => setSunburnDLCQuests(!sunburnDLCQuests)}
             />
             <span>Show Sunburn DLC Quests</span>
-          </label>
+          </label> */}
         </div>
 
         {/* Category Filters */}
@@ -176,16 +200,17 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
         </div> */}
 
         {/* Danger Zone */}
-        {/* <div className="p-2 mt-2 space-y-4 rounded bg-secondary-highlight">
+        <div className="p-2 mt-2 space-y-4 rounded bg-secondary-highlight">
           <h2 className="font-medium text-red-500">Danger Zone</h2>
+          <p>This sets all quests back to incomplete for you to keep going on your favorite categories</p>
           <button
             type="button"
             className="px-4 py-2 bg-red-500 rounded text-white-500"
-            onClick={() => toast.warning("This has not been implemented yet")}
+            onClick={handleResetAllQuests}
           >
-            Reset all Quests
+            Reset Quest Progress
           </button>
-        </div> */}
+        </div>
 
         {/* Buttons */}
         <div className="flex flex-col items-start w-full gap-2 mt-2 sm:items-center sm:flex-row sm:justify-between">
@@ -202,6 +227,20 @@ const Settings: React.FC<SettingsProps> = ({ onClose }) => {
           </Button>
         </div>
       </form>
+
+      {
+        confirmDialog &&
+        <Modal
+          onClose={() => setConfirmDialog(null)}
+        >
+          <ConfirmDialog
+            title={confirmDialog.title}
+            description={confirmDialog.description}
+            onConfirm={confirmDialog.onConfirm}
+            onCancel={() => setConfirmDialog(null)}
+          />
+        </Modal>
+      }
     </div>
   );
 }

src/models/UserModels/userResponse.ts

@@ -2,6 +2,6 @@ export interface User {
   id: string;
   username: string;
   role: string;
-  last_login: string;
-  login_count: string;
+  last_login?: string;
+  login_count?: string;
 }

src/pages/LandingPage.tsx

@@ -51,7 +51,7 @@ const LandingPage = () => {
       const randomQuestResponse = await questService.getRandomQuest(accessToken);
 
       if (!randomQuestResponse) {
-        toast.warning("No quests available, check filters or you completed them all");
+        toast.warning("No quests available, add new filters or reset your progress to see more quests.");
         return;
       }
 

src/service/questService.ts

@@ -6,8 +6,8 @@ const basePath = '/quests';
 export default {
   getRandomQuest: async (accessToken: string) => await sendRequest({
     method: 'GET',
-    endpoint: `${basePath}/random-quest?filters=pvp,raiding`,
-    accessToken
+    endpoint: `${basePath}/random-quest`,
+    accessToken,
   }) as Promise<Quest>,
 
   /**

src/service/userService.ts

@@ -35,4 +35,10 @@ export default {
     accessToken,
     queryParams: { page: page.toString() }
   }) as Promise<User[]>,
+
+  resetAllQuests: async (accessToken: string) => await sendRequest({
+    method: 'DELETE',
+    endpoint: `${basePath}/completed-quests`,
+    accessToken
+  }),
 }