chore: Merge branch dev to main (#316)

Ushie · web-flow · commit b615f16bdd5e · 2025-09-17T03:34:11.000+03:00
diff --git a/src/app.html b/src/app.html
@@ -21,7 +21,7 @@
 		%sveltekit.head%
 	</head>
 
-	<body>
+	<body style="background-color: var(--background-one)">
 		<div style="display: contents">%sveltekit.body%</div>
 	</body>
 </html>
diff --git a/src/app.scss b/src/app.scss
@@ -23,7 +23,6 @@ html {
 body {
 	margin: 0;
 	padding: 0;
-	background-color: var(--background-one);
 }
 
 html,
diff --git a/src/data/api/settings.ts b/src/data/api/settings.ts
@@ -16,8 +16,6 @@ export function api_base_url(): string {
 	if (browser) {
 		const apiUrl = localStorage.getItem(URL_KEY) || default_api_url;
 
-		set_about_info(apiUrl);
-
 		return apiUrl;
 	}
 
@@ -46,11 +44,11 @@ export function set_api_base_url(url?: string) {
 		localStorage.removeItem(URL_KEY);
 	} else {
 		localStorage.setItem(URL_KEY, url);
-		set_about_info(url);
 	}
+	set_about_info(api_base_url());
 }
 
-function set_about_info(apiUrl: string) {
+export function set_about_info(apiUrl: string) {
 	if (!localStorage.getItem(STATUS_KEY) || !localStorage.getItem(EMAIL_KEY)) {
 		fetch(`${apiUrl}/v4/about`)
 			.then((response) => (response.ok ? response.json() : null))
diff --git a/src/layout/Banners/StatusBanner.svelte b/src/layout/Banners/StatusBanner.svelte
@@ -10,8 +10,8 @@
 
 <Banner
 	title="API service is currently down"
-	description="Some features of the site might be impacted. If this issue persists, reach out to mailto:{email()}"
-	buttonText={statusUrl ? 'View status' : undefined}
+	description="Some features of the site might be impacted. If this issue persists, reach out to {email()}."
+	buttonText={statusUrl ? 'Check status' : undefined}
 	buttonOnClick={statusUrl ? handleClick : undefined}
 	level="caution"
 	permanent
diff --git a/src/layout/Dialogs/EmailDialog.svelte b/src/layout/Dialogs/EmailDialog.svelte
@@ -0,0 +1,65 @@
+<script lang="ts">
+	import Divider from '$lib/components/Divider.svelte';
+	import { email } from '$data/api/settings';
+	import Dialog from '$layout/Dialogs/Dialog.svelte';
+	import Button from '$lib/components/Button.svelte';
+	import Input from '$lib/components/Input.svelte';
+
+	export let showEmailDialog: boolean;
+
+	let enableInputSeconds = 15;
+	let keyword: string = '';
+
+	let interval: NodeJS.Timeout;
+	function closeDialog() {
+		showEmailDialog = false;
+		clearInterval(interval);
+		enableInputSeconds = 15;
+		keyword = '';
+	}
+
+	$: if (showEmailDialog && !interval && enableInputSeconds != 0) {
+		interval = setInterval(() => {
+			if (enableInputSeconds <= 0) {
+				clearInterval(interval);
+				return;
+			}
+			enableInputSeconds -= 1;
+		}, 1000);
+	}
+</script>
+
+<Dialog bind:dialogOpen={showEmailDialog} notDismissible>
+	<svelte:fragment slot="title">Abuse notice</svelte:fragment>
+	<svelte:fragment slot="description">
+		<p>
+			This E-Mail address is <b>not</b> for support, help, bug reports or feature requests. It must
+			have a subject and body and have the keyword <span style="user-select: none;">'Reficio'</span>
+			in either, otherwise your mail will be
+			<b>ignored</b>.
+		</p>
+		<br />
+		{#if enableInputSeconds == 0}
+			<span>Enter the keyword, then click "Send".</span>
+			<br />
+			<br />
+			<Input placeholder="Keyword" type="text" bind:value={keyword}></Input>
+		{:else}
+			<span>Read above and wait <b>{enableInputSeconds}</b> seconds.</span>
+		{/if}
+	</svelte:fragment>
+	<svelte:fragment slot="buttons">
+		{#if keyword.toLowerCase() === 'reficio'}
+			<Button type="text"><a href="mailto:{email()}">Send</a></Button>
+		{/if}
+		<Button type="filled" on:click={closeDialog}>Close</Button>
+	</svelte:fragment>
+</Dialog>
+
+<style>
+	a {
+		text-decoration: none;
+		color: var(--text-four);
+		font-weight: 600;
+	}
+</style>
diff --git a/src/layout/Footer/FooterHost.svelte b/src/layout/Footer/FooterHost.svelte
@@ -10,18 +10,23 @@
 	import { RV_DMCA_GUID } from '$env/static/public';
 	import { onMount } from 'svelte';
 	import Divider from '$lib/components/Divider.svelte';
-	import { email } from '$data/api/settings';
+	import Button from '$lib/components/Button.svelte';
+	import EmailDialog from '$layout/Dialogs/EmailDialog.svelte';
 
 	const aboutQuery = createQuery(queries.about());
 
 	let location: string;
 
+	let showEmailDialog = false;
+
 	onMount(() => {
 		// DMCA Protection Badge
 		location = document.location.href;
 	});
 </script>
 
+<EmailDialog bind:showEmailDialog />
+
 <Divider horizontalPadding={'15px'} />
 <footer in:fly={{ y: 10, easing: quintOut, duration: 750 }}>
 	<div class="top">
@@ -60,8 +65,16 @@
 
 	<div class="bottom">
 		<div id="logo-name"><span>Re</span>Vanced</div>
-		<a href="/donate"><div>Donate</div></a>
-		<a href="mailto:{email()}"><div>Email</div></a>
+		<Button type="text" style="color: var(--text-four); font-weight: 600;">
+			<a href="/donate">Donate</a>
+		</Button>
+		<Button
+			type="text"
+			style="color: var(--text-four); font-weight: 600;"
+			on:click={() => (showEmailDialog = true)}
+		>
+			E-Mail
+		</Button>
 		<!-- DMCA Protection Badge -->
 		<a
 			href="//www.dmca.com/Protection/Status.aspx?ID={RV_DMCA_GUID}&refurl={location}"
@@ -78,7 +91,6 @@
 
 <style lang="scss">
 	footer {
-		background-color: var(--background-one);
 		max-width: min(87%, 100rem);
 		padding: 5rem 0rem;
 		margin: 0 auto;
diff --git a/src/lib/components/Button.svelte b/src/lib/components/Button.svelte
@@ -12,6 +12,7 @@
 	export let label: string = '';
 	export let disabled: boolean = false;
 	export let toolTipText: string | undefined = undefined;
+	export let style: string = '';
 
 	$: type = $$slots.default ? type : 'icon';
 </script>
@@ -26,6 +27,7 @@
 		<button
 			on:click
 			class={`${type} ${variant}`}
+			style="{style}"
 			class:disabled
 			aria-label={label}
 			type={functionType}
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -24,6 +24,7 @@
 	import { events as themeEvents } from '$util/themeEvents';
 
 	import FooterHost from '$layout/Footer/FooterHost.svelte';
+	import { api_base_url, set_about_info } from '$data/api/settings';
 
 	const queryClient = new QueryClient({
 		defaultOptions: {
@@ -50,6 +51,7 @@
 	);
 
 	onMount(() => {
+		set_about_info(api_base_url());
 		new DateTriggerEventHandler(themeEvents);
 
 		isRestoring.set(true);
diff --git a/src/routes/announcements/[slug]/AdminButtons.svelte b/src/routes/announcements/[slug]/AdminButtons.svelte
@@ -16,6 +16,7 @@
 	import Show from 'svelte-material-icons/EyeOutline.svelte';
 	import Hide from 'svelte-material-icons/EyeOffOutline.svelte';
 	import Unarchive from 'svelte-material-icons/ArchiveArrowUpOutline.svelte';
+	import { formatUTC } from '$util/formatUtc';
 
 	export let isEditing: boolean;
 	export let isCreating: boolean;
@@ -67,6 +68,11 @@
 	const save = async () => {
 		if (!isValid()) return;
 
+		Object.assign(draftInputs, {
+			created_at: formatUTC(draftInputs.created_at),
+			archived_at: formatUTC(draftInputs.archived_at)
+		});
+
 		await admin.update_announcement(announcementIdNumber!, sanitize(draftInputs));
 		await $query?.refetch();
 
@@ -76,8 +82,13 @@
 	const createAnnouncement = async () => {
 		if (!isValid()) return;
 
+		Object.assign(draftInputs, {
+			created_at: formatUTC(draftInputs.created_at),
+			archived_at: formatUTC(draftInputs.archived_at)
+		});
+
 		await admin.create_announcement(sanitize(draftInputs));
-		await client.invalidateQueries(queries['announcements']());
+		await client.invalidateQueries(queries.announcements());
 		goto('/announcements', { invalidateAll: true });
 	};
 
diff --git a/src/util/formatUtc.ts b/src/util/formatUtc.ts
@@ -0,0 +1,3 @@
+import moment from 'moment';
+
+export const formatUTC = (d: any) => d && moment(d).utc().format('YYYY-MM-DDTHH:mm[Z]');

Original file line number	Diff line number	Diff line change
`@@ -23,7 +23,6 @@ html {`
`23`	`23`	`body {`
`24`	`24`	`margin: 0;`
`25`	`25`	`padding: 0;`
`26`		`- background-color: var(--background-one);`
`27`	`26`	`}`
`28`	`27`
`29`	`28`	`html,`
Original file line number	Diff line number	Diff line change
`@@ -16,8 +16,6 @@ export function api_base_url(): string {`
`16`	`16`	`if (browser) {`
`17`	`17`	`const apiUrl = localStorage.getItem(URL_KEY) \|\| default_api_url;`
`18`	`18`
`19`		`- set_about_info(apiUrl);`
`20`		`-`
`21`	`19`	`return apiUrl;`
`22`	`20`	`}`
`23`	`21`
`@@ -46,11 +44,11 @@ export function set_api_base_url(url?: string) {`
`46`	`44`	`localStorage.removeItem(URL_KEY);`
`47`	`45`	`} else {`
`48`	`46`	`localStorage.setItem(URL_KEY, url);`
`49`		`- set_about_info(url);`
`50`	`47`	`}`
	`48`	`+ set_about_info(api_base_url());`
`51`	`49`	`}`
`52`	`50`
`53`		`-function set_about_info(apiUrl: string) {`
	`51`	`+export function set_about_info(apiUrl: string) {`
`54`	`52`	`if (!localStorage.getItem(STATUS_KEY) \|\| !localStorage.getItem(EMAIL_KEY)) {`
`55`	`53`	fetch(`${apiUrl}/v4/about`)
`56`	`54`	`.then((response) => (response.ok ? response.json() : null))`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+import moment from 'moment';`
	`2`	`+`
	`3`	`+export const formatUTC = (d: any) => d && moment(d).utc().format('YYYY-MM-DDTHH:mm[Z]');`