Load subscriptions in non blocking manner

materialious/package-lock.json

@@ -1,12 +1,12 @@
 {
 	"name": "materialious",
-	"version": "1.15.3",
+	"version": "1.15.4",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "materialious",
-			"version": "1.15.3",
+			"version": "1.15.4",
 			"hasInstallScript": true,
 			"dependencies": {
 				"@capacitor-community/electron": "^5.0.1",
@@ -56,6 +56,7 @@
 				"sqlite3": "^5.1.7",
 				"svelte-awesome-color-picker": "^4.1.1",
 				"svelte-infinite-loading": "^1.4.0",
+				"tldts": "^7.0.23",
 				"youtubei.js": "^16.0.1",
 				"zod": "^4.3.6"
 			},

materialious/package.json

@@ -92,7 +92,8 @@
 		"sqlite3": "^5.1.7",
 		"svelte-awesome-color-picker": "^4.1.1",
 		"svelte-infinite-loading": "^1.4.0",
+		"tldts": "^7.0.23",
 		"youtubei.js": "^16.0.1",
 		"zod": "^4.3.6"
 	}
-}
+}

materialious/src/lib/components/settings/Engine.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { isYTBackend } from '$lib/misc';
+	import { isUnrestrictedPlatform, isYTBackend } from '$lib/misc';
 	import { _ } from '$lib/i18n';
 	import {
 		invidiousAuthStore,
@@ -7,7 +7,8 @@
 		engineCullYTStore,
 		engineFallbacksStore,
 		engineMaxConcurrentChannelsStore,
-		invidiousInstanceStore
+		invidiousInstanceStore,
+		backendInUseStore
 	} from '$lib/store';
 	import { useEngineFallback, type EngineFallback } from '$lib/api/misc';
 	import { get } from 'svelte/store';
@@ -95,7 +96,7 @@
 	<p>{$_('layout.backendEngine.warning')}</p>
 </article>
 
-{#if isYTBackend()}
+{#if $backendInUseStore === 'yt'}
 	<h6>Feed</h6>
 	<div class="field label prefix surface-container-highest">
 		<i>view_stream</i>

materialious/src/lib/externalSettings/index.ts

@@ -25,6 +25,8 @@ export async function syncSettingsToBackend() {
 
 			let initalLoad = true;
 			store.store.subscribe((value) => {
+				if (!get(rawMasterKeyStore)) return;
+
 				if (initalLoad) {
 					initalLoad = false;
 					return;

materialious/src/lib/store.ts

@@ -368,6 +368,7 @@ export const searchHistoryStore: Writable<string[]> = persist(
 	'searchHistory'
 );
 
+export const feedLoadingStore: Writable<boolean> = writable(false);
 export const feedCacheStore: Writable<{
 	[key: string]: (VideoBase | Video | PlaylistPageVideo)[];
 }> = writable({});

materialious/src/routes/(app)/+layout.svelte

@@ -23,7 +23,8 @@
 		playertheatreModeIsActive,
 		rawMasterKeyStore,
 		syncPartyPeerStore,
-		themeColorStore
+		themeColorStore,
+		backendInUseStore
 	} from '$lib/store';
 	import { Capacitor } from '@capacitor/core';
 	import 'beercss';
@@ -51,6 +52,9 @@
 	rawMasterKeyStore.subscribe(() => {
 		pages = getPages();
 	});
+	backendInUseStore.subscribe(() => {
+		pages = getPages();
+	});
 
 	page.subscribe((pageData) => {
 		playerIsPip = !pageData.url.pathname.includes('/watch');

materialious/src/routes/(app)/subscriptions/+page.svelte

@@ -1,14 +1,15 @@
 <script lang="ts">
 	import { getFeed } from '$lib/api/index';
 	import type { PlaylistPageVideo, Video, VideoBase } from '$lib/api/model';
-	import { feedCacheStore } from '$lib/store';
+	import { feedCacheStore, feedLoadingStore } from '$lib/store';
 	import InfiniteLoading, { type InfiniteEvent } from 'svelte-infinite-loading';
 	import ItemsList from '$lib/components/ItemsList.svelte';
 	import { resolve } from '$app/paths';
 	import { _ } from '$lib/i18n';
+	import PageLoading from '$lib/components/PageLoading.svelte';
 
 	let currentPage = 1;
-	let videos: (VideoBase | Video | PlaylistPageVideo)[] = $state($feedCacheStore.subscription);
+	let videos: (VideoBase | Video | PlaylistPageVideo)[] = $derived($feedCacheStore.subscription);
 
 	async function loadMore(event: InfiniteEvent) {
 		currentPage++;
@@ -31,6 +32,9 @@
 </nav>
 <div class="space"></div>
 
-<ItemsList items={videos ?? []} />
-
-<InfiniteLoading on:infinite={loadMore} />
+{#if !$feedLoadingStore}
+	<ItemsList items={videos ?? []} />
+	<InfiniteLoading on:infinite={loadMore} />
+{:else}
+	<PageLoading />
+{/if}

materialious/src/routes/(app)/subscriptions/+page.ts

@@ -2,7 +2,7 @@ import { getFeed } from '$lib/api/index';
 import type { PlaylistPageVideo, Video, VideoBase } from '$lib/api/model';
 import { localDb } from '$lib/dexie';
 import { authProtected, excludeDuplicateFeeds } from '$lib/misc';
-import { feedCacheStore } from '$lib/store';
+import { feedCacheStore, feedLoadingStore } from '$lib/store';
 import { error } from '@sveltejs/kit';
 import { get } from 'svelte/store';
 
@@ -40,17 +40,23 @@ export async function load() {
 	let videos = get(feedCacheStore).subscription;
 
 	if (!videos) {
-		let feeds;
-		try {
-			feeds = await getFeed(100, 1);
-		} catch (errorMessage: any) {
-			error(500, errorMessage);
-		}
+		feedCacheStore.set({ ...get(feedCacheStore), subscription: [] });
 
-		videos = await sortVideosByFavourites([...feeds.notifications, ...feeds.videos]);
-
-		feedCacheStore.set({ ...get(feedCacheStore), subscription: videos });
+		feedLoadingStore.set(true);
+		getFeed(100, 1)
+			.then(async (feed) => {
+				videos = await sortVideosByFavourites([...feed.notifications, ...feed.videos]);
+				feedCacheStore.set({ ...get(feedCacheStore), subscription: videos });
+			})
+			.catch((error) => {
+				error(500, error);
+			})
+			.finally(() => {
+				feedLoadingStore.set(false);
+			});
 	} else {
+		feedLoadingStore.set(false);
+
 		await getFeed(100, 1).then(async (feeds) => {
 			const newVideos = await sortVideosByFavourites([
 				...feeds.notifications,

materialious/src/routes/api/proxy/[urlToProxy]/+server.ts

@@ -2,18 +2,18 @@ import { isOwnBackend } from '$lib/shared';
 import { env } from '$env/dynamic/public';
 
 import { error } from '@sveltejs/kit';
+import { parse as tldParse } from 'tldts';
 
-const allowedDomains: string[] = [
+const allowedBaseDomains: string[] = [
 	'youtube.com',
 	'ytimg.com',
 	'googlevideo.com',
 	'returnyoutubedislike.com',
 	'sponsor.ajay.app',
-	'dearrow-thumb.ajay.app',
-	'ryd-proxy.materialio.us'
+	'dearrow-thumb.ajay.app'
 ];
 
-const dynamicAllowDomains = [
+const dynamicAllowDomainsEnvVars = [
 	env.PUBLIC_DEFAULT_DEARROW_THUMBNAIL_INSTANCE,
 	env.PUBLIC_DEFAULT_DEARROW_INSTANCE,
 	env.PUBLIC_DEFAULT_INVIDIOUS_INSTANCE,
@@ -23,9 +23,11 @@ const dynamicAllowDomains = [
 	env.PUBLIC_DEFAULT_COMPANION_INSTANCE
 ];
 
-for (const dynamicDomain of dynamicAllowDomains) {
+const dynamicAllowDomains: string[] = [];
+
+for (const dynamicDomain of dynamicAllowDomainsEnvVars) {
 	if (dynamicDomain) {
-		allowedDomains.push(dynamicDomain.replace(/^https?:\/\//, ''));
+		dynamicAllowDomains.push(dynamicDomain.replace(/^https?:\/\//, ''));
 	}
 }
 
@@ -51,7 +53,12 @@ async function proxyRequest(
 		throw error(400, 'Invalid URL');
 	}
 
-	if (!allowedDomains.includes(urlToProxyObj.host)) {
+	const baseDomain = tldParse(urlToProxyObj.host).domain;
+
+	if (
+		!dynamicAllowDomains.includes(urlToProxyObj.host) &&
+		(!baseDomain || !allowedBaseDomains.includes(baseDomain))
+	) {
 		// allowAnyProxy allows a instance owner to bypass the whitelist.
 		// BUT is extremely strict.
 		// AND I still don't recommend this.