fix: add manual refresh of achievement status (RSSNext#642)

* fix: mint Signed-off-by: Innei <i@innei.in> * chore: auto-fix linting and formatting issues --------- Signed-off-by: Innei <i@innei.in> Co-authored-by: Innei <Innei@users.noreply.github.com>
realSunyz · Sep 26, 2024 · 419c9cf · 419c9cf
1 parent 85a52ad
commit 419c9cf
Show file tree

Hide file tree

Showing 2 changed files with 64 additions and 20 deletions.
diff --git a/apps/renderer/src/modules/achievement/hooks.tsx b/apps/renderer/src/modules/achievement/hooks.tsx
@@ -15,6 +15,7 @@ import { SlideUpModal } from "~/components/ui/modal/stacked/custom-modal"
 import { useI18n } from "~/hooks/common"
 import { apiClient } from "~/lib/api-fetch"
 import { Chain } from "~/lib/chain"
+import { cn } from "~/lib/utils"
 import achievementAnimationUri from "~/lottie/achievement.lottie?url"
 
 const absoluteachievementAnimationUri = new URL(achievementAnimationUri, import.meta.url).href
@@ -124,6 +125,18 @@ export const AchievementModalContent: FC = () => {
     },
   })
   const achievementsDataAtom = useSingleton(() => atom<typeof achievements>())
+  const { mutateAsync: checkAchievement, isPending: checkPending } = useMutation({
+    mutationFn: async (actionId: number) => {
+      return apiClient.achievement.check.$post({
+        json: {
+          actionId,
+        },
+      })
+    },
+    onSuccess: () => {
+      refetch()
+    },
+  })
   const t = useI18n()
 
   return (
@@ -191,30 +204,45 @@ export const AchievementModalContent: FC = () => {
                     <span className="select-none opacity-0">{t("words.mint")}</span>
                   </div>
                 )}
+
                 {achievement.type === "incomplete" && (
-                  <div
+                  <button
+                    type="button"
                     className={styledButtonVariant({
                       variant: "ghost",
-                      className: "relative hover:bg-transparent",
+                      className: "relative hover:bg-transparent group cursor-pointer",
                     })}
+                    onClick={() => {
+                      checkAchievement(achievement.actionId)
+                    }}
                   >
-                    <span className="center relative ml-2 inline-flex w-24 -translate-y-1 flex-col *:!m-0">
-                      <small className="shrink-0 text-xs leading-tight text-muted-foreground">
-                        {achievement.progress} / {achievement.progressMax}
-                      </small>
-                      <span className="relative h-1 w-full overflow-hidden rounded-full bg-accent/10">
-                        <span
-                          className="absolute -left-3 top-0 inline-block h-1 rounded-full bg-accent"
-                          style={{
-                            width: `calc(${Math.min(
-                              (achievement.progress / achievement.progressMax) * 100,
-                              100,
-                            )}% + 0.75rem)`,
-                          }}
-                        />
+                    <div className="center absolute z-[1] opacity-0 duration-200 group-hover:opacity-100">
+                      <i
+                        className={cn(
+                          "i-mgc-refresh-2-cute-re size-5 text-accent",
+                          checkPending && "animate-spin",
+                        )}
+                      />
+                    </div>
+                    <div className="duration-200 group-hover:opacity-30">
+                      <span className="center relative ml-2 inline-flex w-24 -translate-y-1 flex-col *:!m-0">
+                        <small className="shrink-0 text-xs leading-tight text-muted-foreground">
+                          {achievement.progress} / {achievement.progressMax}
+                        </small>
+                        <span className="relative h-1 w-full overflow-hidden rounded-full bg-accent/10">
+                          <span
+                            className="absolute -left-3 top-0 inline-block h-1 rounded-full bg-accent"
+                            style={{
+                              width: `calc(${Math.min(
+                                (achievement.progress / achievement.progressMax) * 100,
+                                100,
+                              )}% + 0.75rem)`,
+                            }}
+                          />
+                        </span>
                       </span>
-                    </span>
-                  </div>
+                    </div>
+                  </button>
                 )}
 
                 {achievement.type === "received" && (

diff --git a/packages/shared/src/hono.ts b/packages/shared/src/hono.ts
@@ -3426,8 +3426,6 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
                         handle: string | null;
                         createdAt: string;
                     } | null | undefined;
-                    subscriptionCount?: number | undefined;
-                    purchaseAmount?: number | undefined;
                 }[];
             };
             outputFormat: "json" | "text";
@@ -4956,6 +4954,24 @@ declare const _routes: hono_hono_base.HonoBase<Env, {
             status: 200;
         };
     };
+    "/achievement/check": {
+        $post: {
+            input: {
+                json: {
+                    actionId: number;
+                };
+            };
+            output: {
+                code: number;
+                data: {
+                    actionId: number;
+                    result: boolean;
+                };
+            };
+            outputFormat: "json" | "text";
+            status: 200;
+        };
+    };
 }, "/">;
 type AppType = typeof _routes;