achievements

3 files changed, 116 insertions, 5 deletions

diff --git a/src/lib/APITypes.d.ts b/src/lib/APITypes.d.ts
index e01a950..04cd554 100644
--- a/src/lib/APITypes.d.ts
+++ b/src/lib/APITypes.d.ts
@@ -59,6 +59,7 @@ export interface CleanPlayer extends CleanBasicPlayer {
 	socials: CleanSocialMedia
 	profiles?: CleanBasicProfile[]
 	claimed?: ClaimedSkyBlockItem[]
+	achievements?: Achievements
 }
 
 export interface StatItem {
@@ -454,3 +455,22 @@ export interface ItemAuctionsSchema {
 	sbId: string
 	auctions: SimpleAuctionSchema[]
 }
+
+interface TieredAchievement {
+	id: string
+	name: string
+	value: number | null
+	description: string
+}
+
+interface ChallengeAchievement {
+	id: string
+	name: string
+	unlocked: boolean
+	description: string
+}
+
+export interface Achievements {
+	tiered: TieredAchievement[]
+	challenge: ChallengeAchievement[]
+}
diff --git a/src/lib/sections/Achievements.svelte b/src/lib/sections/Achievements.svelte
new file mode 100644
index 0000000..61f320e
--- /dev/null
+++ b/src/lib/sections/Achievements.svelte
@@ -0,0 +1,81 @@
+<script lang="ts">
+	import type { CleanMemberProfile } from '$lib/APITypes'
+	import Tooltip from '$lib/Tooltip.svelte'
+	export let data: CleanMemberProfile
+</script>
+
+{#if data.member.achievements}
+	<h3>
+		Tiered
+		<span class="achievement-count">
+			({data.member.achievements.tiered.filter(a => a.value).length}/{data.member.achievements
+				.tiered.length})
+		</span>
+	</h3>
+	<ul>
+		{#each data.member.achievements.tiered as achievement}
+			<li class="achievement">
+				<Tooltip>
+					<span slot="tooltip">
+						{achievement.description}
+					</span>
+
+					{#if achievement.value}
+						<span>
+							{achievement.name}: <b>{achievement.value}</b>
+						</span>
+					{:else}
+						<span class="achievement-locked">
+							{achievement.name}
+						</span>
+					{/if}
+				</Tooltip>
+			</li>
+		{/each}
+	</ul>
+
+	<h3>
+		Challenge
+		<span class="achievement-count">
+			({data.member.achievements.challenge.filter(a => a.unlocked).length}/{data.member.achievements
+				.challenge.length})
+		</span>
+	</h3>
+	<ul>
+		{#each data.member.achievements.challenge as achievement}
+			<li class="achievement">
+				<Tooltip>
+					<span slot="tooltip">
+						{achievement.description}
+					</span>
+
+					{#if achievement.unlocked}
+						<span>
+							{achievement.name}
+						</span>
+					{:else}
+						<span class="achievement-locked">
+							{achievement.name}
+						</span>
+					{/if}
+				</Tooltip>
+			</li>
+		{/each}
+	</ul>
+{/if}
+
+<style>
+	ul {
+		margin: 0;
+		padding-left: 1em;
+	}
+
+	.achievement-locked {
+		opacity: 0.5;
+	}
+
+	.achievement-count {
+		color: var(--theme-darker-text);
+		font-weight: normal;
+	}
+</style>
diff --git a/src/routes/player/[player]/[profile].svelte b/src/routes/player/[player]/[profile].svelte
index 62f77b9..363b439 100644
--- a/src/routes/player/[player]/[profile].svelte
+++ b/src/routes/player/[player]/[profile].svelte
@@ -45,6 +45,7 @@
 
 <script lang="ts">
 	import { inventoryIconMap, skyblockItemToUrl } from '$lib/minecraft/inventory'
+	import FarmingContests from '$lib/sections/FarmingContests.svelte'
 	import Leaderboards from '$lib/sections/Leaderboards.svelte'
 	import Inventories from '$lib/sections/Inventories.svelte'
 	import Collections from '$lib/sections/Collections.svelte'
@@ -57,22 +58,22 @@
 	import Minions from '$lib/sections/Minions.svelte'
 	import Slayers from '$lib/sections/Slayers.svelte'
 	import type { MatcherFile } from 'skyblock-assets'
+	import Claimed from '$lib/sections/Claimed.svelte'
 	import Collapsible from '$lib/Collapsible.svelte'
 	import Skills from '$lib/sections/Skills.svelte'
 	import { generateInfobox } from '$lib/profile'
 	import Zones from '$lib/sections/Zones.svelte'
 	import Armor from '$lib/sections/Armor.svelte'
+	import Harp from '$lib/sections/Harp.svelte'
+	import Pets from '$lib/sections/Pets.svelte'
+	import Coop from '$lib/sections/Coop.svelte'
 	import Bank from '$lib/sections/Bank.svelte'
 	import Header from '$lib/Header.svelte'
 	import Emoji from '$lib/Emoji.svelte'
 	import { cleanId } from '$lib/utils'
 	import Head from '$lib/Head.svelte'
 	import Toc from '$lib/Toc.svelte'
-	import Harp from '$lib/sections/Harp.svelte'
-	import Claimed from '$lib/sections/Claimed.svelte'
-	import Pets from '$lib/sections/Pets.svelte'
-	import FarmingContests from '$lib/sections/FarmingContests.svelte'
-	import Coop from '$lib/sections/Coop.svelte'
+	import Achievements from '$lib/sections/Achievements.svelte'
 
 	export let data: CleanMemberProfile
 	export let pack: MatcherFile
@@ -97,6 +98,7 @@
 		if (data.member.pets.list.length > 0) categories.push('pets')
 		if (data.member.farmingContests.list.length > 0) categories.push('farming_contests')
 		if (data.member.coopInvitation) categories.push('co-op')
+		if (data.member.achievements) categories.push('achievements')
 		categories.push('leaderboards')
 	}
 
@@ -270,6 +272,14 @@
 					</Collapsible>
 				</section>
 			{/if}
+			{#if categories.includes('achievements')}
+				<section>
+					<Collapsible id="achievements">
+						<h2 slot="title">Achievements</h2>
+						<Achievements {data} />
+					</Collapsible>
+				</section>
+			{/if}
 			<section>
 				<Collapsible id="leaderboards">
 					<h2 slot="title">Leaderboards</h2>