Fixes to instance checking

materialious/electron/package-lock.json

@@ -1,12 +1,12 @@
 {
 	"name": "Materialious",
-	"version": "1.8.5",
+	"version": "1.8.6",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "Materialious",
-			"version": "1.8.5",
+			"version": "1.8.6",
 			"license": "MIT",
 			"dependencies": {
 				"@capacitor-community/electron": "^5.0.0",

materialious/src/lib/components/Settings/Interface.svelte

@@ -1,6 +1,4 @@
 <script lang="ts">
-	import { preventDefault } from 'svelte/legacy';
-
 	import { goto } from '$app/navigation';
 	import { bookmarkletSaveToUrl } from '$lib/externalSettings';
 	import { letterCase, titleCases } from '$lib/letterCasing';
@@ -73,8 +71,16 @@
 
 		if (invalidInstance) return;
 
-		const resp = await fetch(`${instance}/api/v1/trending`);
-		if (!resp.ok) {
+		let resp;
+		try {
+			resp = await fetch(`${instance}/api/v1/trending`);
+		} catch {
+			invalidInstance = true;
+		}
+
+		if (invalidInstance) return;
+
+		if (resp && !resp.ok) {
 			invalidInstance = true;
 			return;
 		}
@@ -87,7 +93,7 @@
 </script>
 
 {#if Capacitor.isNativePlatform()}
-	<form style="margin-bottom: 2em;" onsubmit={setInstance}>
+	<form onsubmit={setInstance}>
 		<nav>
 			<div class="field label border max" class:invalid={invalidInstance}>
 				<input bind:value={invidiousInstance} name="invidious-instance" type="text" />
@@ -101,6 +107,9 @@
 			</button>
 		</nav>
 	</form>
+	{#if invalidInstance}
+		<div style="margin-bottom: 4em;"></div>
+	{/if}
 {/if}
 
 <button onclick={toggleDarkMode} class="no-margin">

materialious/src/lib/components/Settings/Settings.svelte

@@ -3,19 +3,6 @@
 	import { onMount } from 'svelte';
 	import { _ } from 'svelte-i18n';
 	import { get } from 'svelte/store';
-	import {
-		deArrowInstanceStore,
-		deArrowThumbnailInstanceStore,
-		instanceStore,
-		interfaceDefaultPage,
-		interfaceForceCase,
-		interfaceRegionStore,
-		playerDefaultLanguage,
-		returnYTDislikesInstanceStore,
-		sponsorBlockCategoriesStore,
-		sponsorBlockUrlStore,
-		synciousInstanceStore
-	} from '../../store';
 	import ApiExtended from './ApiExtended.svelte';
 	import DataPreferences from './DataPreferences.svelte';
 	import DeArrow from './DeArrow.svelte';
@@ -24,43 +11,6 @@
 	import Ryd from './RYD.svelte';
 	import SponsorBlock from './SponsorBlock.svelte';
 
-	let sponsorCategoriesList: string[] = [];
-	sponsorBlockCategoriesStore.subscribe((value) => (sponsorCategoriesList = value));
-
-	let sponsorBlockInstance = get(sponsorBlockUrlStore);
-	let synciousInstance = get(synciousInstanceStore);
-	let returnYTInstance = get(returnYTDislikesInstanceStore);
-	let invidiousInstance = get(instanceStore);
-	let deArrowUrl = get(deArrowInstanceStore);
-	let deArrowThumbnailUrl = get(deArrowThumbnailInstanceStore);
-	let region = get(interfaceRegionStore);
-	let forceCase = get(interfaceForceCase);
-	let defaultLanguage = get(playerDefaultLanguage);
-	let defaultPage = get(interfaceDefaultPage);
-
-	const languageNames = ISO6391.getAllCodes().map((code) =>
-		ISO6391.getName(code).toLocaleLowerCase()
-	);
-
-	const sponsorCategories = [
-		{ name: $_('layout.sponsors.sponsor'), category: 'sponsor' },
-		{ name: $_('layout.sponsors.unpaidSelfPromotion'), category: 'selfpromo' },
-		{ name: $_('layout.sponsors.interactionReminder'), category: 'interaction' },
-		{ name: $_('layout.sponsors.intermissionIntroAnimation'), category: 'intro' },
-		{ name: $_('layout.sponsors.credits'), category: 'outro' },
-		{ name: $_('layout.sponsors.preViewRecapHook'), category: 'preview' },
-		{ name: $_('layout.sponsors.tangentJokes'), category: 'filler' }
-	];
-
-	function toggleSponsor(category: string) {
-		if (sponsorCategoriesList.includes(category)) {
-			sponsorBlockCategoriesStore.set(sponsorCategoriesList.filter((value) => value !== category));
-		} else {
-			sponsorCategoriesList.push(category);
-			sponsorBlockCategoriesStore.set(sponsorCategoriesList);
-		}
-	}
-
 	let activeTab:
 		| 'interface'
 		| 'player'
@@ -84,15 +34,6 @@
 		checkWidth();
 
 		addEventListener('resize', () => checkWidth());
-
-		// Set default language if not set already based off browser.
-		if (!get(playerDefaultLanguage)) {
-			const languageCode = navigator.language || navigator.languages[0];
-			const languageName = ISO6391.getName(languageCode.split('-')[0]);
-			if (languageName) {
-				playerDefaultLanguage.set(languageName.toLowerCase());
-			}
-		}
 	});
 </script>
 
@@ -181,12 +122,11 @@
 	@media screen and (max-width: 1320px) {
 		.tabbed {
 			display: flex !important;
-			flex-direction: column !important;
 			gap: 0 !important;
 			flex: 0 !important;
-			margin-bottom: 1em !important;
 			align-items: start !important;
 			padding: 1em 0 !important;
+			overflow-x: scroll !important;
 			background-color: transparent;
 			border-bottom: solid 1px var(--outline-variant);
 		}

materialious/src/lib/components/Thumbnail.svelte

@@ -274,7 +274,7 @@
 	}
 
 	.sideways-root {
-		height: 115px;
+		height: 110px;
 		display: flex;
 		align-items: flex-start;
 	}

materialious/src/lib/css/global.css

@@ -59,16 +59,6 @@ button.row:hover {
 	}
 }
 
-@media screen and (max-width: 650px) {
-	::-webkit-scrollbar {
-		display: none !important;
-	}
-
-	html {
-		scrollbar-width: none !important;
-	}
-}
-
 @media screen and (max-width: 1000px) {
 	menu.mobile {
 		z-index: 9999 !important;

materialious/src/lib/patches/youtubejs.ts

@@ -42,7 +42,7 @@ export async function patchYoutubeJs(videoId: string): Promise<VideoPlay> {
 			: window.electronAPI.generatePoToken;
 
 	poTokenCacheStore.set(
-	    await platformMinter(challengeResponse.bg_challenge, requestKey, visitorData)
+		await platformMinter(challengeResponse.bg_challenge, requestKey, visitorData)
 	);
 
 	const extraArgs: Record<string, any> = {

materialious/src/routes/(app)/watch/[slug]/+page.svelte

@@ -443,7 +443,7 @@
 			<div class="s12 m12 l5">
 				<nav>
 					<a href={`/channel/${data.video.authorId}`}>
-						<nav>
+						<nav style="gap: 0.5em;">
 							{#if !$interfaceLowBandwidthMode}
 								<img
 									class="circle large"
@@ -482,18 +482,18 @@
 			<div class="s12 m12 l7 video-actions">
 				{#await data.streamed.returnYTDislikes then returnYTDislikes}
 					{#if returnYTDislikes}
-						<nav class="no-space" style="margin-right: .5em;">
+						<nav class="no-space">
 							<button style="cursor: default;" class="border left-round">
 								<i class="small">thumb_up</i>
 								<span>{cleanNumber(returnYTDislikes.likes)}</span>
 							</button>
-							<button style="cursor: default;" class="border right-round">
+							<button style="cursor: default;margin-right: 0.5em;" class="border right-round">
 								<i class="small">thumb_down_alt</i>
 								<span>{cleanNumber(returnYTDislikes.dislikes)}</span>
 							</button>
 						</nav>
 					{:else}
-						<button style="cursor: default;" class="border">
+						<button style="cursor: default;margin-right: 0.5em;" class="border">
 							<i class="small">thumb_up</i>
 							<span>{cleanNumber(data.video.likeCount)}</span>
 						</button>