From 819135cb2d65a9c589e0cf2249ef92fb36af600f Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Mon, 13 May 2024 02:21:55 -0700
Subject: refactor(badges): move awc to component

---
 src/routes/user/[user]/badges/+page.svelte | 107 +----------------------------
 1 file changed, 3 insertions(+), 104 deletions(-)

(limited to 'src/routes')

diff --git a/src/routes/user/[user]/badges/+page.svelte b/src/routes/user/[user]/badges/+page.svelte
index 772cfdfe..eb895dbd 100644
--- a/src/routes/user/[user]/badges/+page.svelte
+++ b/src/routes/user/[user]/badges/+page.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+	import AWC from './../../../../lib/User/BadgeWall/AWC.svelte';
 	import { userIdentity } from '$lib/Data/AniList/identity';
 	import { user, type User } from '$lib/Data/AniList/user';
 	import type { Badge } from '$lib/Database/userBadges';
@@ -29,7 +30,7 @@
 	import { thumbnail } from '$lib/Utility/image.js';
 	import authorisedJson from '$lib/Data/Static/authorised.json';
 	import identity from '$stores/identity';
-	import type { AWCBadgesGroup } from '$lib/Data/AWC.js';
+	import '$lib/User/BadgeWall/badges.css';
 
 	export let data;
 
@@ -160,54 +161,6 @@
 	// 	});
 	// };
 
-	const awcBadgesGrouped = (awcResponse: string): AWCBadgesGroup[] => {
-		return Array.from(
-			new DOMParser().parseFromString(awcResponse, 'text/html').querySelectorAll('.container')
-		)
-			.map((c) => {
-				const container = c as HTMLDivElement;
-				const header = container.querySelector('.container-header') as HTMLDivElement;
-
-				if (!header) return;
-
-				if (!['Anime', 'Manga', 'Special'].includes(header.innerText)) return;
-
-				if (header.innerText === 'Special') {
-					return {
-						group: header.innerText,
-						badges: Array.from(container.querySelectorAll('.badge-display img')).map((b) => {
-							const badge = b as HTMLImageElement;
-
-							return {
-								link: '#',
-								description: badge.alt,
-								image: badge.src.includes('placeholder')
-									? cdn('https://awc.moe/static/images/badge-placeholder.png')
-									: badge.src
-							};
-						})
-					};
-				}
-
-				return {
-					group: header.innerText,
-					badges: Array.from(container.querySelectorAll('.badge-display a')).map((b) => {
-						const badge = b as HTMLAnchorElement;
-						const image = badge.querySelector('img') as HTMLImageElement;
-
-						return {
-							link: badge.href,
-							description: image.alt,
-							image: image.src.includes('placeholder')
-								? cdn('https://awc.moe/static/images/badge-placeholder.png')
-								: image.src
-						};
-					})
-				};
-			})
-			.filter((b) => b !== undefined) as AWCBadgesGroup[];
-	};
-
 	const submitBadge = () => {
 		const imageURL = document.querySelector('input[name="image_url"]') as HTMLInputElement;
 		const activityURL = document.querySelector('input[name="activity_url"]') as HTMLInputElement;
@@ -537,42 +490,7 @@
 
 					<div id="badges">
 						{#if !preferences.hide_awc_badges}
-							{#await awcPromise then badges}
-								{#await badges.clone().text() then text}
-									{@const parsedBadges = awcBadgesGrouped(text)}
-
-									{#if parsedBadges.length > 0}
-										{#each parsedBadges as group}
-											<details open={categoryFilter || isOwner ? false : true}>
-												<summary>
-													Anime Watching Club <span class="opaque">|</span>
-													{group.group}
-												</summary>
-
-												<p />
-
-												<div class="badges">
-													{#each group.badges as badge, index}
-														<div id={`badge-${index}`}>
-															<FallbackBadge
-																{badge}
-																source={cdn(thumbnail(badge.image))}
-																alternative={badge.description}
-																fallback={thumbnail(badge.image)}
-																hideOnError={preferences.hide_missing_badges}
-																awc
-																{index}
-															/>
-														</div>
-													{/each}
-												</div>
-											</details>
-
-											<p />
-										{/each}
-									{/if}
-								{/await}
-							{/await}
+							<AWC {awcPromise} {categoryFilter} {isOwner} {preferences} />
 						{/if}
 
 						{#if ungroupedBadges === null}
@@ -1161,22 +1079,3 @@
 		>Toggle Visibility</button
 	>
 </Popup>
-
-<style>
-	/* body {
-		margin: 0;
-		padding: 0;
-		text-align: center;
-		background-color: #151f2e;
-	} */
-
-	.badges {
-		display: grid;
-		grid-template-columns: repeat(auto-fill, minmax(8%, 1fr));
-		gap: 0.25rem;
-	}
-
-	.edit-row-2 {
-		margin-top: -1.25rem;
-	}
-</style>
-- 
cgit v1.2.3