chore: merge dev to main (#171)

package.json

@@ -41,8 +41,6 @@
 		"@tanstack/query-core": "^4.24.4",
 		"@tanstack/query-persist-client-core": "^4.24.4",
 		"@tanstack/query-sync-storage-persister": "^4.24.4",
-		"@tanstack/svelte-query": "^4.24.4",
-		"asciidoctor": "^2.2.6",
-		"marked": "^4.1.1"
+		"@tanstack/svelte-query": "^4.24.4"
 	}
-}
+}

src/data/api/index.ts

@@ -9,13 +9,15 @@ import type {
 	TeamMember,
 	DonationPlatform,
 	CryptoWallet,
-	Social
+	Social,
+	Info
 } from '$lib/types';
 
 export type ReposData = { repositories: Repository[] };
 export type PatchesData = { patches: Patch[]; packages: string[] };
 export type ReleaseData = { metadata: Metadata; assets: Asset[] };
 export type TeamData = { members: TeamMember[] };
+export type InfoData = { info: Info };
 export type DonationData = { wallets: CryptoWallet[]; platforms: DonationPlatform[] };
 export type SocialsData = { socials: Social[] };
 
@@ -48,9 +50,8 @@ async function patches(): Promise<PatchesData> {
 	}
 
 	// sort packages by patch count to get most relevant apps on top
-	const packages = Object.entries(packagesWithCount)
-		.sort((a, b) => b[1] - a[1])
-		.map((pkg) => pkg[0]);
+	const packages = Object.keys(packagesWithCount);
+	packages.sort((a, b) => packagesWithCount[b] - packagesWithCount[a]);
 
 	return { patches: json.patches, packages };
 }
@@ -60,6 +61,11 @@ async function team(): Promise<TeamData> {
 	return { members: json.members };
 }
 
+async function info(): Promise<InfoData> {
+	const json = await get_json('v2/info');
+	return { info: json.info };
+}
+
 async function donate(): Promise<DonationData> {
 	const json = await get_json('v2/donations');
 	return { wallets: json.donations.wallets, platforms: json.donations.links };
@@ -92,6 +98,11 @@ export const queries = {
 		queryFn: team,
 		staleTime
 	},
+	info: {
+		queryKey: ['info'],
+		queryFn: info,
+		staleTime
+	},
 	donate: {
 		queryKey: ['donate'],
 		queryFn: donate,

src/layout/Footer/FooterHost.svelte

@@ -4,13 +4,11 @@
 
 	import { queries } from '$data/api';
 	import { createQuery } from '@tanstack/svelte-query';
-	
-	import { friendlyName } from '$util/friendlyName';
 
 	import Query from '$lib/components/Query.svelte';
 	import FooterSection from './FooterSection.svelte';
 
-	const repoQuery = createQuery(['repositories'], queries.repositories);
+	const infoQuery = createQuery(['info'], queries.info);
 	const socialsQuery = createQuery(['socials'], queries.socials);
 </script>
 
@@ -37,15 +35,15 @@
 	<div class="footer-top">
 		<section class="main-content">
 			<img src="/logo.svg" class="logo-image" alt="ReVanced Logo" />
-			<div>
-				<p>
-					ReVanced was born out of Vanced's discontinuation and it is our goal to continue the
-					legacy of what Vanced left behind. Thanks to ReVanced Patcher, it's possible to create
-					long-lasting patches for nearly any Android app. ReVanced's patching system is designed to
-					allow patches to work on new versions of the apps automatically with bare minimum
-					maintenance.
-				</p>
-			</div>
+			<Query query={infoQuery} let:data>
+				{#if data}
+					<div>
+						<p>
+							{data.info.about}
+						</p>
+					</div>
+				{/if}
+			</Query>
 		</section>
 
 		<section class="links-container">
@@ -56,37 +54,28 @@
 				<li><a href="/contributors">Contributors</a></li>
 				<li><a href="/donate">Donate</a></li>
 			</FooterSection>
-			<FooterSection title="Repositories">
-				<Query query={repoQuery} let:data>
-					{#if data}
-						{#each data.repositories as { name }}
-							<li>
-								<a href="https://github.com/{name}" target="_blank" rel="noreferrer">
-									{friendlyName(name)}
-								</a>
-							</li>
-						{/each}
-					{/if}
-				</Query>
-			</FooterSection>
-			<FooterSection title="Socials">
-				<Query query={socialsQuery} let:data>
-					{#if data}
+			<Query query={socialsQuery} let:data>
+				{#if data}
+					<FooterSection title="Socials">
 						{#each data.socials as { name, url }}
 							<li>
-								<a href={url} target="_blank" rel="noreferrer">{friendlyName(name)}</a>
+								<a href={url} target="_blank" rel="noreferrer">{name}</a>
 							</li>
 						{/each}
-					{/if}
-				</Query>
-			</FooterSection>
+					</FooterSection>
+				{/if}
+			</Query>
 		</section>
 	</div>
-	<div class="footer-bottom">
-		<div id="logo-name"><span>Re</span>Vanced</div>
-		<a href="/donate"><div>Donate</div></a>
-		<a href="mailto:contact@revanced.app"><div>Email</div></a>
-	</div>
+	<Query query={infoQuery} let:data>
+		{#if data}
+			<div class="footer-bottom">
+				<div id="logo-name"><span>Re</span>Vanced</div>
+				<a href="/donate"><div>Donate</div></a>
+				<a href="mailto:{data.info.contact.email}"><div>Email</div></a>
+			</div>
+		{/if}
+	</Query>
 </footer>
 
 <style>

src/lib/types.ts

@@ -68,8 +68,24 @@ export interface DonationPlatform {
 	preferred: boolean;
 }
 
-
 export interface Social {
-	name: string
-	url: string
-}
+	name: string;
+	url: string;
+}
+
+interface Donations {
+	wallets: CryptoWallet[];
+	links: DonationPlatform[];
+}
+
+interface Contact {
+	email: string;
+}
+
+export interface Info {
+	name: string;
+	about: string;
+	contact: Contact;
+	socials: Social[];
+	donations: Donations;
+}

src/routes/donate/+page.svelte

@@ -67,7 +67,7 @@
 					<a class="donate-card" target="_blank" rel="noreferrer" href={platform.url}>
 						<!-- not using <img/> because we want the image height to always be 200px -->
 						<div
-							style="background-image: url('/donate/card-images/{platform.name}.{supportsWebP() ? 'webp' : 'png'}'), url('/donate/card-images/fallback.png');"
+							style="background-image: url('/donate/card-images/{platform.name}.{supportsWebP() ? 'webp' : 'png'}'), url('/donate/card-images/fallback.svg');"
 							role="img"
 							aria-label="{platform.name} preview image"
 							>
@@ -79,7 +79,7 @@
 			{#if data.wallets}
 				<button class="donate-card" on:click={() => (cryptoDialogue = !cryptoDialogue)}>
 					<div
-						style="background-image: url('/donate/card-images/Cryptocurrencies.{supportsWebP() ? 'webp' : 'png'}'), url('/donate/card-images/fallback.png');"
+						style="background-image: url('/donate/card-images/Cryptocurrencies.{supportsWebP() ? 'webp' : 'png'}'), url('/donate/card-images/fallback.svg');"
 						role="img"
 						aria-label="Cryptocurrencies preview image"
 					/>

static/donate/card-images/fallback.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 2400 1260"><path fill="#E0F2FF" d="M0 0h2400v1260H0z"/><path fill="#182244" d="M1176 812v-45h52v45h-52Zm0-301v-45h52v45h-52Zm26 269c-19 0-37-3-52-11a98 98 0 0 1-56-77l51-8a59 59 0 0 0 60 48c15 0 26-3 36-10 9-6 14-15 14-24 0-7-2-13-7-17-4-4-10-8-19-11l-67-20c-38-12-58-36-58-71a75 75 0 0 1 45-71c15-7 32-10 51-10a106 106 0 0 1 83 37c10 11 16 25 21 42l-53 10a51 51 0 0 0-28-36c-7-3-15-5-23-5-9-1-16 1-23 3-7 3-12 7-16 11-4 5-6 10-6 16 0 7 3 12 8 17 6 5 15 9 27 12l48 14c24 7 41 16 52 28 10 12 16 27 16 47 0 17-5 32-13 45-9 13-21 23-37 30-15 8-33 11-54 11Z"/></svg>