chore: Switch to v3 API (#247)

Author: oSumAtrIX

src/data/api/index.ts

@@ -3,22 +3,21 @@ import * as settings from './settings';
 // API Endpoints
 import type {
 	Patch,
-	Repository,
-	Metadata,
-	Asset,
+	Contributable,
+	Release,
 	TeamMember,
 	DonationPlatform,
 	CryptoWallet,
 	Social,
-	Info,
+	About,
 	CompatiblePackage
 } from '$lib/types';
 
-export type ReposData = { repositories: Repository[] };
+export type ContributorsData = { contributables: Contributable[] };
 export type PatchesData = { patches: Patch[]; packages: string[] };
-export type ReleaseData = { metadata: Metadata; assets: Asset[] };
+export type ReleaseData = { release: Release };
 export type TeamData = { members: TeamMember[] };
-export type InfoData = { info: Info };
+export type AboutData = { about: About };
 export type DonationData = { wallets: CryptoWallet[]; platforms: DonationPlatform[] };
 export type SocialsData = { socials: Social[] };
 
@@ -27,25 +26,24 @@ async function get_json(endpoint: string) {
 	return await fetch(url).then((r) => r.json());
 }
 
-async function repositories(): Promise<ReposData> {
-	const json = await get_json('contributors');
-	return { repositories: json.repositories };
+async function contributors(): Promise<ContributorsData> {
+	const json = await get_json('v3/contributors');
+	return { contributables: json };
 }
 
 async function manager(): Promise<ReleaseData> {
-	const json = await get_json('v2/revanced-manager/releases/latest');
-	// console.log(json.release.metadata.tag_name);
-	console.log(json.release.assets[0].browser_download_url);
-	return { metadata: json.release.metadata, assets: json.release.assets };
+	const json = await get_json('v3/manager/latest');
+
+	return { release: json };
 }
 
 async function patches(): Promise<PatchesData> {
-	const json = await get_json('v2/patches/latest');
+	const json = await get_json('v3/patches/latest/list');
 	const packagesWithCount: { [key: string]: number } = {};
 
 	// gets packages and patch count
-	for (let i = 0; i < json.patches.length; i++) {
-		json.patches[i].compatiblePackages?.forEach((pkg: CompatiblePackage) => {
+	for (let i = 0; i < json.length; i++) {
+		json[i].compatiblePackages?.forEach((pkg: CompatiblePackage) => {
 			packagesWithCount[pkg.name] = (packagesWithCount[pkg.name] || 0) + 1;
 		});
 	}
@@ -54,27 +52,17 @@ async function patches(): Promise<PatchesData> {
 	const packages = Object.keys(packagesWithCount);
 	packages.sort((a, b) => packagesWithCount[b] - packagesWithCount[a]);
 
-	return { patches: json.patches, packages };
+	return { patches: json, packages };
 }
 
 async function team(): Promise<TeamData> {
-	const json = await get_json('v2/team/members');
-	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 };
+	const json = await get_json('v3/team');
+	return { members: json };
 }
 
-async function socials(): Promise<SocialsData> {
-	const json = await get_json('v2/socials');
-	return { socials: json.socials };
+async function about(): Promise<AboutData> {
+	const json = await get_json('v3/about');
+	return { about: json };
 }
 
 export const staleTime = 5 * 60 * 1000;
@@ -89,29 +77,19 @@ export const queries = {
 		queryFn: patches,
 		staleTime
 	},
-	repositories: {
-		queryKey: ['repositories'],
-		queryFn: repositories,
+	contributors: {
+		queryKey: ['contributors'],
+		queryFn: contributors,
 		staleTime
 	},
 	team: {
 		queryKey: ['team'],
 		queryFn: team,
 		staleTime
 	},
-	info: {
+	about: {
 		queryKey: ['info'],
-		queryFn: info,
-		staleTime
-	},
-	donate: {
-		queryKey: ['donate'],
-		queryFn: donate,
-		staleTime
-	},
-	socials: {
-		queryKey: ['socials'],
-		queryFn: socials,
+		queryFn: about,
 		staleTime
 	}
 };

src/layout/Footer/FooterHost.svelte

@@ -8,8 +8,7 @@
 	import Query from '$lib/components/Query.svelte';
 	import FooterSection from './FooterSection.svelte';
 
-	const infoQuery = createQuery(['info'], queries.info);
-	const socialsQuery = createQuery(['socials'], queries.socials);
+	const aboutQuery = createQuery(['about'], queries.about);
 </script>
 
 <!-- squiggly divider line -->
@@ -33,11 +32,11 @@
 	<div class="footer-top">
 		<section class="main-content">
 			<img src="/logo.svg" class="logo-image" alt="ReVanced Logo" />
-			<Query query={infoQuery} let:data>
+			<Query query={aboutQuery} let:data>
 				{#if data}
 					<div>
 						<p>
-							{data.info.about}
+							{data.about.about}
 						</p>
 					</div>
 				{/if}
@@ -52,10 +51,10 @@
 				<li><a href="/contributors">Contributors</a></li>
 				<li><a href="/donate">Donate</a></li>
 			</FooterSection>
-			<Query query={socialsQuery} let:data>
+			<Query query={aboutQuery} let:data>
 				{#if data}
 					<FooterSection title="Socials">
-						{#each data.socials as { name, url }}
+						{#each data.about.socials as { name, url }}
 							<li>
 								<a href={url} target="_blank" rel="noreferrer">{name}</a>
 							</li>
@@ -65,12 +64,12 @@
 			</Query>
 		</section>
 	</div>
-	<Query query={infoQuery} let:data>
+	<Query query={aboutQuery} 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>
+				<a href="mailto:{data.about.contact.email}"><div>Email</div></a>
 			</div>
 		{/if}
 	</Query>

src/layout/Hero/SocialHost.svelte

@@ -4,13 +4,13 @@
 	import { createQuery } from '@tanstack/svelte-query';
 	import Query from '$lib/components/Query.svelte';
 
-	const query = createQuery(['socials'], queries.socials);
+	const aboutQuery = createQuery(['about'], queries.about);
 </script>
 
 <div class="social-host">
-	<Query {query} let:data>
+	<Query query={aboutQuery} let:data>
 		{#if data}
-			{#each data.socials.filter((s) => s.name != 'Website') as social}
+			{#each data.about.socials.filter((s) => s.name != 'Website') as social}
 				<SocialButton {social} />
 			{/each}
 		{/if}

src/layout/Navbar/NavHost.svelte

@@ -78,12 +78,10 @@
 					<Navigation href="/" label="Home">Home</Navigation>
 					<Navigation queryKey="manager" href="/download" label="Download">Download</Navigation>
 					<Navigation queryKey="patches" href="/patches" label="Patches">Patches</Navigation>
-					<Navigation queryKey="repositories" href="/contributors" label="Contributors">
+					<Navigation queryKey="contributors" href="/contributors" label="Contributors">
 						Contributors
 					</Navigation>
-					<Navigation queryKey={['donate', 'team']} href="/donate" label="Donate">
-						Donate
-					</Navigation>
+					<Navigation queryKey={['about', 'team']} href="/donate" label="Donate">Donate</Navigation>
 				</ul>
 			</div>
 			<div id="secondary-navigation">

src/lib/types.ts

@@ -1,10 +1,11 @@
 export interface Contributor {
-	login: string;
+	name: string;
 	avatar_url: string;
-	html_url: string;
+	url: string;
+	contributions: number;
 }
 
-export interface Repository {
+export interface Contributable {
 	name: string;
 	contributors: Contributor[];
 }
@@ -33,24 +34,20 @@ export interface PatchOption {
 
 export interface Asset {
 	name: string;
-	content_type: string;
-	browser_download_url: string;
+	download_url: string;
 }
 
-export interface Metadata {
-	tag_name: string;
-	name: string;
-	draft: boolean;
-	prerelease: boolean;
+export interface Release {
+	version: string;
 	created_at: string;
-	published_at: string;
-	body: string;
+	description: string;
+	assets: Asset[];
 }
 
 export interface TeamMember {
-	login: string;
+	name: string;
 	avatar_url: string;
-	html_url: string;
+	url: string;
 	bio?: string;
 }
 
@@ -70,6 +67,7 @@ export interface DonationPlatform {
 export interface Social {
 	name: string;
 	url: string;
+	preferred: boolean;
 }
 
 interface Donations {
@@ -81,7 +79,7 @@ interface Contact {
 	email: string;
 }
 
-export interface Info {
+export interface About {
 	name: string;
 	about: string;
 	contact: Contact;

src/routes/contributors/+page.svelte

@@ -10,7 +10,7 @@
 	import { queries } from '$data/api';
 	import { createQuery } from '@tanstack/svelte-query';
 
-	const query = createQuery(['repositories'], queries.repositories);
+	const query = createQuery(['contributors'], queries.contributors);
 </script>
 
 <Head
@@ -52,7 +52,7 @@
 		</div>
 		<div class="repos">
 			<Query {query} let:data>
-				{#each data.repositories as { contributors, name: repo }}
+				{#each data.contributables as { contributors, name: repo }}
 					<div in:fly={{ y: 10, easing: quintOut, duration: 750 }}>
 						<ContributorHost {contributors} {repo} />
 					</div>

src/routes/contributors/ContributorSection.svelte

@@ -9,8 +9,7 @@
 	export let repo: string;
 	let expanded = true;
 
-	// Yes
-	let usersIwantToExplodeSoBadly = ['semantic-release-bot', 'revanced-bot'];
+	let bots = ['semantic-release-bot', 'revanced-bot'];
 	let repo_name = friendlyName(repo);
 </script>
 
@@ -34,9 +33,9 @@
 
 	{#if expanded}
 		<div class="contrib-host" transition:slide={{ easing: quintOut, duration: 500 }}>
-			{#each contributors as { login, avatar_url, html_url }}
-				{#if !usersIwantToExplodeSoBadly.includes(login)}
-					<ContributorButton name={login} pfp={avatar_url} url={html_url} />
+			{#each contributors as { name, avatar_url, url }}
+				{#if !bots.includes(name)}
+					<ContributorButton {name} pfp={avatar_url} {url} />
 				{/if}
 			{/each}
 		</div>

src/routes/donate/+page.svelte

@@ -19,7 +19,7 @@
 	import { supportsWebP } from '$util/supportsWebP';
 
 	const teamQuery = createQuery(['team'], queries.team);
-	const donateQuery = createQuery(['donate'], queries.donate);
+	const aboutQuery = createQuery(['about'], queries.about);
 
 	let qrCodeDialogue = false;
 	let cryptoDialogue = false;
@@ -89,24 +89,24 @@
 		</div>
 	</section>
 	<h3>Donate</h3>
-	<Query query={donateQuery} let:data>
+	<Query query={aboutQuery} let:data>
 		<div class="donate-cards">
-			{#if data.platforms}
-				{#each data.platforms as platform}
-					<a class="donate-card" target="_blank" rel="noreferrer" href={platform.url}>
+			{#if data.about.donations.links}
+				{#each data.about.donations.links as link}
+					<a class="donate-card" target="_blank" rel="noreferrer" href={link.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()
+							style="background-image: url('/donate/card-images/{link.name}.{supportsWebP()
 								? 'webp'
 								: 'png'}'), url('/donate/card-images/fallback.svg');"
 							role="img"
-							aria-label="{platform.name} preview image"
+							aria-label="{link.name} preview image"
 						/>
-						<span>{platform.name}</span>
+						<span>{link.name}</span>
 					</a>
 				{/each}
 			{/if}
-			{#if data.wallets}
+			{#if data.about.donations.wallets}
 				<button class="donate-card" on:click={() => (cryptoDialogue = !cryptoDialogue)}>
 					<div
 						style="background-image: url('/donate/card-images/Cryptocurrencies.{supportsWebP()
@@ -141,8 +141,8 @@
 	<svelte:fragment slot="description">
 		<hr style="margin: 1rem 0;" />
 		<div class="wallets">
-			<Query query={donateQuery} let:data>
-				{#each data.wallets as wallet}
+			<Query query={aboutQuery} let:data>
+				{#each data.about.donations.wallets as wallet}
 					<button
 						on:click={() => {
 							qrCodeValue = wallet.address;

src/routes/donate/TeamMember.svelte

@@ -10,15 +10,15 @@
 
 <a
 	class="member"
-	href={member.html_url}
+	href={member.url}
 	rel="noreferrer"
 	target="_blank"
 	in:fly|global={{ y: 10, easing: quintOut, duration: 750, delay: 50 * i }}
 >
-	<img src={member.avatar_url} alt="{member.login}'s profile picture." />
+	<img src={member.avatar_url} alt="{member.name}'s profile picture." />
 
 	<div class="member-text">
-		<h4>{member.login}</h4>
+		<h4>{member.name}</h4>
 		{#if member.bio}
 			<h6>{member.bio}</h6>
 		{/if}