From d4a5f877609208015800444cf49dfb336d51f1e6 Mon Sep 17 00:00:00 2001
From: PalmDevs <git@palmdevs.me>
Date: Thu, 6 Jun 2024 23:04:54 +0700
Subject: [PATCH] fix: move download page components to home

---
 src/layout/Footer/FooterHost.svelte |   1 -
 src/layout/Hero/HeroSection.svelte  |  62 ++++++++++-
 src/layout/Navbar/NavHost.svelte    |   1 -
 src/routes/download/+page.svelte    | 153 ----------------------------
 4 files changed, 59 insertions(+), 158 deletions(-)
 delete mode 100644 src/routes/download/+page.svelte

diff --git a/src/layout/Footer/FooterHost.svelte b/src/layout/Footer/FooterHost.svelte
index 2fe33a4..d86d8e9 100644
--- a/src/layout/Footer/FooterHost.svelte
+++ b/src/layout/Footer/FooterHost.svelte
@@ -47,7 +47,6 @@
 		<section class="links-container">
 			<FooterSection title="Pages">
 				<li><a href="/">Home</a></li>
-				<li><a href="/download">Download</a></li>
 				<li><a href="/patches">Patches</a></li>
 				<li><a href="/contributors">Contributors</a></li>
 				<li><a href="/donate">Donate</a></li>
diff --git a/src/layout/Hero/HeroSection.svelte b/src/layout/Hero/HeroSection.svelte
index c5fc729..97c5c4b 100644
--- a/src/layout/Hero/HeroSection.svelte
+++ b/src/layout/Hero/HeroSection.svelte
@@ -1,7 +1,57 @@
-<script>
-	import Button from '$lib/components/Button.svelte';
+<script lang="ts">
+import Button from "$lib/components/Button.svelte";
+import { queries } from "$data/api";
+import { onMount } from "svelte";
+import { createQuery } from "@tanstack/svelte-query";
+import Query from "$lib/components/Query.svelte";
+import Dialogue from "$lib/components/Dialogue.svelte";
+
+const query = createQuery(["manager"], queries.manager);
+
+let warning: string;
+let warningDialogue = false;
+
+let userAgent: string;
+let isAndroid: boolean;
+let androidVersionMatch: RegExpExecArray | null;
+let androidVersion: number;
+let managerUrl: string;
+
+onMount(() => {
+	userAgent = navigator.userAgent;
+	androidVersionMatch = /Android\s([\d.]+)/i.exec(userAgent);
+	androidVersion = androidVersionMatch ? parseInt(androidVersionMatch[1]) : 0;
+	isAndroid = !!androidVersion;
+});
+
+query.subscribe((val) => {
+	if (val.data) managerUrl = val.data.assets[0].browser_download_url;
+});
+
+function handleClick() {
+	if (!isAndroid) {
+		warning = "Your device is not running Android.";
+		warningDialogue = true;
+	} else if (androidVersion < 8) {
+		warning = `Your device is running ${androidVersion}. ReVanced Manager only supports Android versions 8 and above.`;
+		warningDialogue = true;
+	}
+}
 </script>
 
+<Dialogue bind:modalOpen={warningDialogue}>
+	<svelte:fragment slot="title">Device unsupported</svelte:fragment>
+	<svelte:fragment slot="description">{warning} Do you still want to download ReVanced Manager?</svelte:fragment>
+	<svelte:fragment slot="buttons">
+		<Button
+			type="text"
+			href={managerUrl}
+			on:click={() => (warningDialogue = false)}>Download</Button
+		>
+		<Button type="text" on:click={() => (warningDialogue = false)}>Cancel</Button>
+	</svelte:fragment>
+</Dialogue>
+
 <section class="hero">
 	<div class="hero-text">
 		<h1>Continuing the <br />legacy of <span>Vanced.</span></h1>
@@ -9,7 +59,13 @@
 			Customize your mobile experience through ReVanced <br /> by applying patches to your applications.
 		</p>
 		<div class="hero-buttons">
-			<Button icon="download" type="filled" href="download">Download</Button>
+				<Button
+					on:click={handleClick}
+					type="filled"
+					icon="download"
+				>
+					Download Manager
+				</Button>
 			<Button icon="docs" type="tonal" href="patches">View patches</Button>
 		</div>
 	</div>
diff --git a/src/layout/Navbar/NavHost.svelte b/src/layout/Navbar/NavHost.svelte
index cb04577..0817e68 100644
--- a/src/layout/Navbar/NavHost.svelte
+++ b/src/layout/Navbar/NavHost.svelte
@@ -72,7 +72,6 @@
 			<div id="main-navigation">
 				<ul class="nav-buttons">
 					<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">
 						Contributors
diff --git a/src/routes/download/+page.svelte b/src/routes/download/+page.svelte
deleted file mode 100644
index 1dd60e3..0000000
--- a/src/routes/download/+page.svelte
+++ /dev/null
@@ -1,153 +0,0 @@
-<script lang="ts">
-	import { queries } from '$data/api';
-	import { fly } from 'svelte/transition';
-	import { quintOut } from 'svelte/easing';
-
-	import { createQuery } from '@tanstack/svelte-query';
-
-	import manager_screenshot from '$images/manager.png?format=avif;webp;png&as=picture';
-
-	import Head from '$lib/components/Head.svelte';
-	import Query from '$lib/components/Query.svelte';
-	import Button from '$lib/components/Button.svelte';
-	import Footer from '$layout/Footer/FooterHost.svelte';
-	import Picture from '$lib/components/Picture.svelte';
-	import Dialogue from '$lib/components/Dialogue.svelte';
-	import { onMount } from 'svelte';
-
-	const query = createQuery(['manager'], queries.manager);
-
-	let warning: string;
-	let warningDialogue = false;
-
-	let userAgent: string;
-	let isAndroid: boolean;
-	let androidVersionMatch: RegExpExecArray | null;
-	let androidVersion: number;
-
-	onMount(() => {
-		userAgent = navigator.userAgent;
-		androidVersionMatch = /Android\s([\d.]+)/i.exec(userAgent);
-		androidVersion = androidVersionMatch ? parseInt(androidVersionMatch[1]) : 0;
-		isAndroid = !!androidVersion;
-	});
-
-	function handleClick() {
-		if (!isAndroid) {
-			warning = 'Your device is not running Android.';
-			warningDialogue = true;
-		} else if (androidVersion < 8) {
-			warning = `Your device is running ${androidVersion}. ReVanced only supports Android versions 8 and above.`;
-			warningDialogue = true;
-		}
-	}
-</script>
-
-<Head
-	title="Download ReVanced"
-	description="Download ReVanced Manager to patch your favourite apps, right on your device."
-	schemas={[
-		{
-			'@context': 'https://schema.org',
-			'@type': 'BreadcrumbList',
-			itemListElement: [
-				{
-					'@type': 'ListItem',
-					position: 1,
-					name: 'Home',
-					item: 'https://revanced.app/'
-				},
-				{
-					'@type': 'ListItem',
-					position: 2,
-					name: 'Download',
-					item: 'https://revanced.app/download'
-				}
-			]
-		}
-	]}
-/>
-
-<Dialogue bind:modalOpen={warningDialogue}>
-	<svelte:fragment slot="title">Warning</svelte:fragment>
-	<svelte:fragment slot="description">{warning} Do you still want to download?</svelte:fragment>
-	<svelte:fragment slot="buttons">
-		<Query {query} let:data>
-			<Button
-				type="text"
-				href={data.assets[0].browser_download_url}
-				on:click={() => (warningDialogue = false)}>Okay</Button
-			>
-		</Query>
-		<Button type="text" on:click={() => (warningDialogue = false)}>Cancel</Button>
-	</svelte:fragment>
-</Dialogue>
-
-<div class="wrapper center" in:fly={{ y: 10, easing: quintOut, duration: 750 }}>
-	<h2>ReVanced <span>Manager</span></h2>
-	<p>Patch your favourite apps, right on your device.</p>
-	<div class="buttons">
-		<Query {query} let:data>
-			{#if !isAndroid || androidVersion < 8}
-				<Button on:click={handleClick} type="filled" icon="download">
-					{data.metadata.tag_name}
-				</Button>
-			{:else}
-				<Button
-					on:click={handleClick}
-					type="filled"
-					icon="download"
-					href={data.assets[0].browser_download_url}
-				>
-					{data.metadata.tag_name}
-				</Button>
-			{/if}
-		</Query>
-		<Button type="tonal" href="https://github.com/revanced/revanced-manager" target="_blank">
-			View Source
-		</Button>
-	</div>
-	<div class="screenshot">
-		<Picture data={manager_screenshot} alt="Manager Screenshot" />
-	</div>
-</div>
-
-<Footer />
-
-<style>
-	.center {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-	}
-
-	h2 {
-		text-align: center;
-		color: var(--white);
-	}
-
-	p {
-		text-align: center;
-		margin-bottom: 1.5rem;
-	}
-
-	.screenshot :global(img) {
-		margin-top: 2.5rem;
-		margin-bottom: 2.5rem;
-		height: 50rem;
-		width: auto;
-		padding: 0.5rem 0.5rem;
-		border-radius: 2rem;
-		background-color: var(--grey-six);
-		user-select: none;
-	}
-
-	.buttons {
-		display: flex;
-		gap: 1rem;
-	}
-
-	span {
-		color: var(--accent-color);
-	}
-</style>