Add: User reset avatar to default (#695)

Author: kev306

src/databaseAdapters/user.ts

@@ -22,6 +22,7 @@ class MongoUserAdapter implements DatabaseAdapter {
 
     user.avatarImgRes = resLink;
     user.avatarImgSpy = spyLink;
+
     await user.save();
   }
 }

src/routes/profile/avatarRoutes.tsx

@@ -10,11 +10,8 @@ import { checkProfileOwnership } from '../middleware';
 import userAdapter from '../../databaseAdapters/user';
 import { S3AvatarSet, S3Agent } from '../../clients/s3/S3Agent';
 import S3Controller from '../../clients/s3/S3Controller';
-import { PatreonAgent } from '../../clients/patreon/patreonAgent';
-import { PatreonController } from '../../clients/patreon/patreonController';
 
 import { getAndUpdatePatreonRewardTierForUser } from '../../rewards/getRewards';
-import { isMod } from '../../modsadmins/mods';
 
 export type AllAvatarsRouteReturnType = {
   currentResLink: string;
@@ -24,7 +21,6 @@ export type AllAvatarsRouteReturnType = {
 
 const router = express.Router();
 const s3Agent = new S3Agent(new S3Controller());
-const patreonAgent = new PatreonAgent(new PatreonController());
 
 // Show the user's avatar homepage
 router.get(
@@ -70,6 +66,21 @@ router.post(
   },
 );
 
+// Reset user's avatar to default
+router.post(
+  '/:profileUsername/avatar/resetavatar',
+  checkProfileOwnership,
+  async (req: EnrichedRequest, res: Response) => {
+    if (!req.user.avatarImgRes && !req.user.avatarImgSpy) {
+      return res.status(400).send('You are already using the default avatar.');
+    }
+
+    await userAdapter.updateAvatar(req.user.username, null, null);
+
+    return res.status(200).send('Avatar reset successful.');
+  },
+);
+
 // Get a user's avatar library links
 router.get(
   '/:profileUsername/avatar/getalluseravatars',

src/views/changelog.ejs

@@ -18,6 +18,7 @@
         <li class="list-group-item">
             <strong>4-06-2024: </strong>
             <ul>
+                <li>Added: Reset avatar button in avatar homepage.</li>
                 <li>Fixed: Dark mode for Avatar Library view.</li>
             </ul>
         </li>

src/views/components/avatar/avatarHome/avatarHome.tsx

@@ -11,6 +11,8 @@ const getLinks = {
     `/profile/${username}/avatar/getalluseravatars`,
   changeavatar: (username: string) =>
     `/profile/${username}/avatar/changeavatar`,
+  resetavatar: (username: string) => `/profile/${username}/avatar/resetavatar`,
+
   customavatar: (username: string) => `/profile/${username}/customavatar`,
   edit: (username: string) => `/profile/${username}/edit`,
 };
@@ -97,6 +99,29 @@ export function AvatarHome() {
     setSelectedAvatarSet(selectedAvatarSet === avatarSet ? null : avatarSet);
   };
 
+  const handleResetAvatar = async () => {
+    await Swal.fire({
+      title: 'Sending request',
+      didOpen: async () => {
+        Swal.showLoading();
+        const response = await fetch(getLinks.resetavatar(username), {
+          method: 'POST',
+        });
+
+        if (response.status === 200) {
+          setCurrentResImgLink(BaseAvatarLinks.baseRes);
+          setCurrentSpyImgLink(BaseAvatarLinks.baseSpy);
+
+          Swal.close();
+          await Swal.fire({ title: await response.text(), icon: 'success' });
+        } else {
+          Swal.close();
+          await Swal.fire({ title: await response.text(), icon: 'error' });
+        }
+      },
+    });
+  };
+
   if (isLoading) {
     return (
       <div className="loading-container">
@@ -131,6 +156,19 @@ export function AvatarHome() {
       <a className="btn btn-info" href={getLinks.customavatar(username)}>
         Submit a custom avatar
       </a>
+      <button
+        className="btn btn-warning"
+        style={{
+          marginLeft: '5px',
+        }}
+        onClick={handleResetAvatar}
+        disabled={
+          currentResImgLink === BaseAvatarLinks.baseRes &&
+          currentSpyImgLink === BaseAvatarLinks.baseSpy
+        }
+      >
+        Reset avatar
+      </button>
       <hr
         style={{
           borderColor: 'lightgrey',