fix: resolve all issues in npm run check (#70)

Co-authored-by: Ax333l <main@axelen.xyz>

src/app.d.ts

@@ -9,3 +9,15 @@ declare namespace App {
 	// interface Session {}
 	// interface Stuff {}
 }
+
+
+declare module "*&picture" {
+	/**
+	 * actual types
+	 * taken from https://github.com/JonasKruckenberg/imagetools/issues/160#issuecomment-1009292026
+	 * - code https://github.com/JonasKruckenberg/imagetools/blob/main/packages/core/src/output-formats.ts
+	 * - docs https://github.com/JonasKruckenberg/imagetools/blob/main/docs/guide/getting-started.md#metadata
+	 */
+	const out;
+	export default out;
+  }

src/data/RouterEvents.ts

@@ -20,7 +20,7 @@ function makeStore(): Readable<RouterEvent> {
     });
   } else {
     // On client.
-    let current = new URL(location);
+    let current = new URL(location.href);
 
     // Return store that responds to navigation events.
     // The `navigating` store immediately "pushes" `null`.

src/layout/Footer.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { queries } from '$data/api';
-	import { friendlyName } from '$lib/utils';
+	import { friendlyName } from '$util/friendlyName';
 
 	import { createQuery } from '@tanstack/svelte-query';
 	import Query from '$lib/components/Query.svelte';

src/layout/Hero/HeroSection.svelte

@@ -1,7 +1,4 @@
 <script>
-	import { fly } from 'svelte/transition';
-	import { quintOut } from 'svelte/easing';
-
 	import Button from '$lib/components/Button.svelte';
 </script>
 
@@ -51,10 +48,6 @@
 			padding-bottom: 0;
 		}
 
-		h4 {
-			font-size: clamp(1rem, 1.2rem, 1.5rem);
-		}
-
 		br {
 			content: ' ';
 		}

src/layout/Navbar/NavButton.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { queries } from '$data/api';
-	import { dev_log } from '$lib/utils';
+	import { dev_log } from '$util/dev';
 
 	import RouterEvents from '$data/RouterEvents';
 	import { useQueryClient } from '@tanstack/svelte-query';

src/layout/Navbar/NavHost.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { onMount } from 'svelte';
-	import { horizontalSlide } from '$lib/utils';
+	import { horizontalSlide } from '$util/horizontalSlide';
 	import { fade } from 'svelte/transition';
 	import { expoOut } from 'svelte/easing';
 

src/lib/components/Button.svelte

@@ -7,17 +7,29 @@
 </script>
 
 <button on:click>
-	<svelte:element
-		this={href ? 'a' : 'div'}
-		{href}
-		{target}
-		class={type}
-	>
-		{#if icon}
-			<img src="../icons/{icon}.svg" alt={icon} />
-		{/if}
-		<slot />
-	</svelte:element>
+	{#if href}
+		<a
+			{href}
+			{target}
+			{...$$restProps}
+			class={type}
+		>
+			{#if icon}
+				<img src="../icons/{icon}.svg" alt={icon} />
+			{/if}
+			<slot />
+		</a>
+	{:else}
+		<div
+			{...$$restProps}
+			class={type}
+		>
+			{#if icon}
+				<img src="../icons/{icon}.svg" alt={icon} />
+			{/if}
+			<slot />
+		</div>
+	{/if}
 </button>
 
 <style>

src/lib/components/Picture.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   // See: https://github.com/JonasKruckenberg/imagetools/blob/main/docs/directives.md#picture
-  export let data;
+  import type { Picture } from 'vite-imagetools';
+  export let data: Picture;
   export let alt: string;
 </script>
 

src/routes/+error.svelte

@@ -13,10 +13,10 @@
 	{#if status == 404}
 		<p>This page received a cease and desist letter from a multi-billion dollar tech company.</p>
 		<br />
-		<Navigation href="/" is_selected={() => true}>Home</Navigation>
+		<Navigation href="/">Home</Navigation>
 	{:else}
 		<p>
-			{$page.error.message}
+			{$page.error?.message}
 		</p>
 	{/if}
 </section>

src/routes/contributors/ContributorSection.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import { friendlyName } from '$lib/utils';
-	import { slide, fade } from 'svelte/transition';
+	import { friendlyName } from '$util/friendlyName';
+	import { slide } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 	import type { Contributor } from '$lib/types';
 	import ContributorButton from './ContributorPerson.svelte';

src/routes/docs/+layout.server.ts

@@ -1,4 +1,4 @@
-import type { PageServerLoad } from './$types';
+import type { LayoutServerLoad } from './$types';
 
 import { index_content } from './documentation.server';
 
@@ -7,4 +7,4 @@ import { index_content } from './documentation.server';
 // If you can no longer prerender the docs, then you are going to have to move the load functions here to a prerendered server route like before and fetch them here.
 export const prerender = true;
 
-export const load: PageServerLoad = () => ({ tree: index_content() });
+export const load: LayoutServerLoad = () => ({ tree: index_content() });

src/routes/docs/+layout.svelte

@@ -1,13 +1,10 @@
 <script lang="ts">
-	import type { PageData } from './$types';
+	import type { LayoutData } from './$types';
 
 	import DocsNavTree from './DocsNavTree.svelte';
-
-	import { fly } from 'svelte/transition';
-	import { quintOut } from 'svelte/easing';
 	import Footer from '$layout/Footer.svelte';
 
-	export let data: PageData;
+	export let data: LayoutData;
 </script>
 
 <section id="doc-section-main">

src/routes/docs/DocsNavTree.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { is_tree } from './documentation.shared';
+	import { is_tree, assert_is_info_node } from './documentation.shared';
 	import type { DocsTree } from './documentation.shared';
 
 	import DocsNavNode from './DocsNavNode.svelte';
@@ -25,7 +25,7 @@
 			<!-- Recursion here is fine. We are not dealing with a tree the size of a linux root file system. -->
 			<svelte:self tree={node} nested={nested + 1} />
 		{:else}
-			<DocsNavNode info={node} />
+			<DocsNavNode info={assert_is_info_node(node)} />
 		{/if}
 	{/each}
 </ul>

src/routes/docs/documentation.server.ts

@@ -1,12 +1,12 @@
 import { is_tree } from './documentation.shared';
 import type { Document, DocsTree, DocsTreeNode, DocumentInfo } from './documentation.shared';
 
-import { browser, building } from '$app/environment';
+import { browser } from '$app/environment';
 
 import fs, { existsSync as exists } from 'fs';
 import path from 'path';
 
-import { parse as parse_md } from 'marked';
+import { marked } from 'marked';
 import AsciiDocProcessor from 'asciidoctor';
 
 // This file does not work in a browser.
@@ -18,7 +18,7 @@ if (browser) {
 
 const supported_formats: Map<string, (markup: string) => Document> = new Map();
 
-supported_formats.set('md', (markup) => {
+supported_formats.set('md', (markup: string) => {
 	let lines = markup.split('\n');
 
 	// Get and remove the first line.
@@ -27,13 +27,13 @@ supported_formats.set('md', (markup) => {
 	const title = first_line.substring(2);
 
 	// Convert the rest to html
-	const content = parse_md(lines.join('\n'));
+	const content = marked(lines.join('\n'));
 
 	return { title, content };
 });
 
 const asciidoctor = AsciiDocProcessor();
-const adoc_fn = (markup) => {
+const adoc_fn = (markup: string) => {
 	// Get first line.
 	const first_line = markup.split('\n')[0];
 	// Remove `= `.
@@ -41,7 +41,7 @@ const adoc_fn = (markup) => {
 
 	// Convert it to html. Unlike markdown, we do not need to remove the first title heading.
 	// NOTE: Maybe consider change the safe mode value.
-	const content = asciidoctor.convert(markup, { doctype: 'book' });
+	const content = asciidoctor.convert(markup, { doctype: 'book' }) as string;
 
 	return { title, content };
 };
@@ -51,13 +51,7 @@ supported_formats.set('asciidoc', adoc_fn);
 
 const supported_filetypes = [...supported_formats.keys()];
 
-let docs_folder = process.env.REVANCED_DOCS_FOLDER;
-if (docs_folder === undefined) {
-	if (building) {
-		console.warn('Using testing docs in production build');
-	}
-	docs_folder = 'testing-docs';
-}
+let docs_folder = process.env.REVANCED_DOCS_FOLDER ?? 'testing-docs';
 
 const ignored_items = ['assets'];
 
@@ -74,10 +68,10 @@ function get_ext(fname: string) {
 
 function get_slug_of_node(node: DocsTreeNode): string {
 	if (is_tree(node)) {
-		return node.index.slug;
+		return (node as DocsTree).index.slug;
 	}
 
-	return node.slug;
+	return (node as DocumentInfo).slug;
 }
 
 /// Important functions
@@ -95,8 +89,8 @@ export function get(slug: string): Document | null {
 		return null;
 	}
 
-	let full_path,
-		ext,
+	let full_path: string,
+		ext: string,
 		found = false;
 	// We are looking for the file `${target}.(any_supported_extension)`. Try to find it.
 	for (const item of fs.readdirSync(dir)) {
@@ -122,7 +116,7 @@ export function get(slug: string): Document | null {
 	}
 
 	// Process the file and return.
-	return supported_formats.get(ext)(fs.readFileSync(full_path, 'utf-8'));
+	return supported_formats.get(ext!!)!!(fs.readFileSync(full_path!!, 'utf-8'));
 }
 
 // Get file information
@@ -139,7 +133,7 @@ function process_file(fname: string): DocumentInfo {
 	}
 
 	const slug = parts.join('/');
-	const title = get(slug).title;
+	const title = get(slug)!!.title;
 
 	return { slug, title };
 }
@@ -147,7 +141,7 @@ function process_file(fname: string): DocumentInfo {
 // Returns a document tree.
 function process_folder(dir: string): DocsTree | null {
 	let tree: DocsTree = {
-		index: null,
+		index: null as any,
 		nodes: []
 	};
 
@@ -184,7 +178,7 @@ function process_folder(dir: string): DocsTree | null {
 		}
 
 		if (is_index_file) {
-			tree.index = node;
+			tree.index = node as DocumentInfo;
 		} else {
 			tree.nodes.push(node);
 		}

src/routes/docs/documentation.shared.ts

@@ -1,22 +1,22 @@
 /// Types
 
 export interface Document {
-  title: string;
-  // HTML
-  content: string;
+	title: string;
+	// HTML
+	content: string;
 }
 
 export interface DocumentInfo {
-  title: string;
-  slug: string;
+	title: string;
+	slug: string;
 }
 
 // A tree representing the `docs` folder.
 export interface DocsTree {
-  // index.whatever
-  index: DocumentInfo;
-  // Everything except index.whatever
-  nodes: DocsTreeNode[];
+	// index.whatever
+	index: DocumentInfo;
+	// Everything except index.whatever
+	nodes: DocsTreeNode[];
 }
 
 export type DocsTreeNode = DocsTree | DocumentInfo;
@@ -24,5 +24,12 @@ export type DocsTreeNode = DocsTree | DocumentInfo;
 /// Functions
 
 export function is_tree(node: DocsTreeNode) {
-  return node.hasOwnProperty('nodes');
+	return Object.prototype.hasOwnProperty.call(node, 'nodes');
+}
+
+export function assert_is_info_node(v: DocsTreeNode) {
+	if (is_tree(v)) {
+		throw new Error('Value is not an info node.');
+	}
+	return v as DocumentInfo;
 }

src/routes/download/+page.svelte

@@ -23,7 +23,7 @@
 	<p>Patch your favourite apps, right on your device.</p>
 	<div class="buttons">
 		<Query {query} let:data>
-			<Button kind="primary" icon="download" href={data.assets[0].url} target="_blank">
+			<Button kind="primary" icon="download" href={data.assets[0].url} download>
 				{data.version}
 			</Button>
 		</Query>

src/routes/patches/PatchItem.svelte

@@ -2,7 +2,7 @@
 	import { slide, fade } from 'svelte/transition';
 	import { quintOut } from 'svelte/easing';
 	import type { Patch } from '$lib/types';
-	import { friendlyName } from '$lib/utils';
+	import { friendlyName } from '$util/friendlyName';
 
 	export let patch: Patch;
 	const hasPatchOptions = !!patch.options.length;
@@ -26,7 +26,7 @@
 	</div>
 	<h5>{patch.description}</h5>
 	<ul class="info-container">
-		{#each patch.compatiblePackages as pkg, i}
+		{#each patch.compatiblePackages as pkg}
 			<a
 				href="https://play.google.com/store/apps/details?id={pkg.name}"
 				target="_blank"

src/routes/patches/[[package]]/+page.svelte

@@ -25,7 +25,7 @@
 
 	let searchTerm: string;
 	let searchTermFiltered: string;
-	let timeout: any = null;
+	let timeout: ReturnType<typeof setTimeout>;
 	let mobilePackages = false;
 
 	function checkCompatibility(patch: Patch, pkg: string) {

src/util/dev.ts

@@ -0,0 +1,8 @@
+import { dev } from '$app/environment';
+
+// console.log, but only if in dev environment.
+export function dev_log(part: string, ...args: any[]) {
+	if (dev) {
+		console.log(`[${part}]:`, ...args);
+	}
+}

src/util/friendlyName.ts

@@ -0,0 +1,14 @@
+export function friendlyName(text: string): string {
+	return text
+		.replace(/-/g, ' ')
+		.replace(/revanced\/revanced/g, '')
+		.replace(/revanced/g, 'ReVanced')
+		.replace(/\bcli\b/g, 'CLI')
+		.replace(/api/g, 'API')
+		.replace(/microg/g, 'MicroG')
+		.replace(/hdr/g, 'HDR')
+		.replace(/sponsorblock/g, 'SponsorBlock')
+		.replace(/tiktok/g, 'TikTok')
+		.replace(/vr/g, 'VR')
+		.replace(/(?:^|\s)\S/g, (x: string) => x.toUpperCase());
+}

src/util/horizontalSlide.js

@@ -1,28 +1,6 @@
-import { dev } from '$app/environment';
+// @ts-nocheck
 import { cubicOut } from 'svelte/easing';
 
-// console.log, but only if in dev environment.
-export function dev_log(part: string, ...args) {
-	if (dev) {
-		console.log(`[${part}]:`, ...args);
-	}
-}
-
-export function friendlyName(text: string): string {
-	return text
-		.replace(/-/g, ' ')
-		.replace(/revanced\/revanced/g, '')
-		.replace(/revanced/g, 'ReVanced')
-		.replace(/\bcli\b/g, 'CLI')
-		.replace(/api/g, 'API')
-		.replace(/microg/g, 'MicroG')
-		.replace(/hdr/g, 'HDR')
-		.replace(/sponsorblock/g, 'SponsorBlock')
-		.replace(/tiktok/g, 'TikTok')
-		.replace(/vr/g, 'VR')
-		.replace(/(?:^|\s)\S/g, (x: string) => x.toUpperCase());
-}
-
 // stolen from https://svelte.dev/repl/6d5239f09b0b4dc6aafeb70606a0fe94?version=3.46.4
 // please add this svelte thanks ily <3
 export function horizontalSlide(

tsconfig.json

@@ -16,7 +16,8 @@
 			"$lib": ["src/lib"],
 			"$lib/*": ["./src/lib/*"],
 			"$layout/*": ["./src/layout/*"],
-			"$images/*": ["./images/*"]
+			"$images/*": ["./images/*"],
+			"$util/*": ["./src/util/*"]
 		}
 	}
 }

vite.config.js

@@ -10,7 +10,8 @@ const config = {
     alias: {
 			$images: path.resolve('./images'),
 			$data: path.resolve('./src/data'),
-			$layout: path.resolve('./src/layout')
+			$layout: path.resolve('./src/layout'),
+			$util: path.resolve('./src/util')
 		}
 	}
 };