From 30ad1c47f0ef3ffb220405410e4fdbd321479d6e Mon Sep 17 00:00:00 2001
From: Crimekillz <crimekillz@161.sh>
Date: Sat, 6 Apr 2024 04:55:45 +0200
Subject: [PATCH] Add achievement page to user's public profile

---
 locales/en-US.yml                             |  1 +
 locales/ja-JP.yml                             |  1 +
 .../client/src/pages/user/achievements.vue    | 52 +++++++++++++++++++
 packages/client/src/pages/user/index.vue      |  7 +++
 4 files changed, 61 insertions(+)
 create mode 100644 packages/client/src/pages/user/achievements.vue

diff --git a/locales/en-US.yml b/locales/en-US.yml
index e504af584..3e2568a56 100644
--- a/locales/en-US.yml
+++ b/locales/en-US.yml
@@ -2330,6 +2330,7 @@ _notification:
     groupInvited: "Group invitations"
     app: "Notifications from linked apps"
     bite: "Chomps"
+    achievementEarned: "Achievement get!"
   _actions:
     followBack: "followed you back"
     reply: "Reply"
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index b6f18cdab..9a0718cef 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -2075,6 +2075,7 @@ _notification:
     followRequestAccepted: "フォローが受理された"
     groupInvited: "グループに招待された"
     app: "連携アプリからの通知"
+    achievementEarned: "実績を獲得"
   _actions:
     followBack: "フォローバック"
     reply: "返信"
diff --git a/packages/client/src/pages/user/achievements.vue b/packages/client/src/pages/user/achievements.vue
new file mode 100644
index 000000000..1f69ab388
--- /dev/null
+++ b/packages/client/src/pages/user/achievements.vue
@@ -0,0 +1,52 @@
+<template>
+<MkSpacer :content-max="1200">
+	<MkAchievements :user="user" :with-locked="false"/>
+</MkSpacer>
+</template>
+
+<script lang="ts" setup>
+import { onActivated, onDeactivated, onMounted, onUnmounted, ref } from 'vue';
+import * as iceshrimp from 'iceshrimp-js';
+import MkAchievements from '@/components/MkAchievements.vue';
+import { i18n } from '@/i18n';
+import { claimAchievement } from '@/scripts/achievements';
+import { $i } from '@/account';
+
+const props = defineProps<{
+	user: iceshrimp.entities.User;
+}>();
+
+let timer: number | null;
+
+function viewAchievements3min() {
+	if ($i && (props.user.id === $i.id)) {
+		claimAchievement('viewAchievements3min');
+	}
+}
+
+onMounted(() => {
+	if (timer == null) timer = window.setTimeout(viewAchievements3min, 1000 * 60 * 3);
+});
+
+onUnmounted(() => {
+	if (timer != null) {
+		window.clearTimeout(timer);
+		timer = null;
+	}
+});
+
+onActivated(() => {
+	if (timer == null) timer = window.setTimeout(viewAchievements3min, 1000 * 60 * 3);
+});
+
+onDeactivated(() => {
+	if (timer != null) {
+		window.clearTimeout(timer);
+		timer = null;
+	}
+});
+</script>
+
+<style lang="scss" module>
+
+</style>
diff --git a/packages/client/src/pages/user/index.vue b/packages/client/src/pages/user/index.vue
index 91e0cbaaa..94a0e3f41 100644
--- a/packages/client/src/pages/user/index.vue
+++ b/packages/client/src/pages/user/index.vue
@@ -16,6 +16,7 @@
 						:user="user"
 						@refresh="fetchUser()"
 					/>
+					<XAchievements v-else-if="tab === 'achievements'" :user="user"/>
 					<XReactions v-else-if="tab === 'reactions'" :user="user" />
 					<XClips v-else-if="tab === 'clips'" :user="user" />
 					<XPages v-else-if="tab === 'pages'" :user="user" />
@@ -43,6 +44,7 @@ import { i18n } from "@/i18n";
 import { $i } from "@/account";
 
 const XHome = defineAsyncComponent(() => import("./home.vue"));
+const XAchievements = defineAsyncComponent(() => import('./achievements.vue'));
 const XReactions = defineAsyncComponent(() => import("./reactions.vue"));
 const XClips = defineAsyncComponent(() => import("./clips.vue"));
 const XPages = defineAsyncComponent(() => import("./pages.vue"));
@@ -90,6 +92,11 @@ const headerTabs = $computed(() =>
 					title: i18n.ts.overview,
 					icon: "ph-user ph-bold ph-lg",
 				},
+				...(user.host == null ? [{
+					key: 'achievements',
+					title: i18n.ts.achievements,
+					icon: 'ph-medal-military ph-bold ph-lg',
+				}] : []),
 				...(($i && $i.id === user.id) || user.publicReactions
 					? [
 							{