Ensure image is routed through proxy on mobile

materialious/android/.idea/deploymentTargetSelector.xml

@@ -4,7 +4,7 @@
     <selectionStates>
       <SelectionState runConfigName="app">
         <option name="selectionMode" value="DROPDOWN" />
-        <DropdownSelection timestamp="2026-04-29T14:13:42.770873710Z">
+        <DropdownSelection timestamp="2026-04-29T14:41:26.350324296Z">
           <Target type="DEFAULT_BOOT">
             <handle>
               <DeviceId pluginId="LocalEmulator" identifier="path=/home/wpearce/.android/avd/Pixel_9.avd" />

materialious/electron/package.json

@@ -25,7 +25,6 @@
 		"@capacitor-community/electron": "^5.0.0",
 		"@types/jsdom": "^28.0.1",
 		"bgutils-js": "^3.2.0",
-		"capacitor-nodejs": "https://github.com/hampoelz/capacitor-nodejs/releases/download/v1.0.0-beta.9/capacitor-nodejs.tgz",
 		"chokidar": "~5.0.0",
 		"electron-is-dev": "~2.0.0",
 		"electron-serve": "~3.0.0",
@@ -46,4 +45,4 @@
 		"capacitor",
 		"electron"
 	]
-}
+}

materialious/electron/src/rt/electron-plugins.js

@@ -1,6 +1,4 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-const CapacitorNodejs = require('../../../node_modules/capacitor-nodejs/electron/dist/plugin.js');
 
 module.exports = {
-  CapacitorNodejs,
 }

materialious/src/lib/components/thumbnail/PlaylistThumbnail.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { getBestThumbnail } from '$lib/images';
+	import { getBestThumbnail, imageHandleCors } from '$lib/images';
 	import { resolve } from '$app/paths';
 	import { letterCase } from '$lib/letterCasing';
 	import { _ } from '$lib/i18n';
@@ -23,7 +23,7 @@
 		thumbnailSrc = playlist.playlistThumbnail;
 	}
 
-	const thumbnail = new Avatar({ src: thumbnailSrc });
+	const thumbnail = new Avatar({ src: imageHandleCors(thumbnailSrc) });
 </script>
 
 <a href={playlistLink} style="width: 100%; overflow: hidden;min-height:100px;" class="wave">

materialious/src/lib/components/thumbnail/VideoThumbnail.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { resolve } from '$app/paths';
-	import { getBestThumbnail } from '$lib/images';
+	import { getBestThumbnail, imageHandleCors } from '$lib/images';
 	import { letterCase } from '$lib/letterCasing';
 	import { cleanNumber, videoLength } from '$lib/numbers';
 	import { onDestroy, onMount } from 'svelte';
@@ -78,7 +78,7 @@
 	let thumbnailElement: HTMLElement | undefined = $state();
 
 	const thumbnail = new Avatar({
-		src: () => thumbnailSrc,
+		src: () => imageHandleCors(thumbnailSrc),
 		onLoadingStatusChange: () => {
 			if (thumbnailImageElement) thumbnailHeight = thumbnailImageElement.naturalHeight;
 		}

materialious/src/lib/images.ts

@@ -2,6 +2,8 @@ import { get } from 'svelte/store';
 import type { Image } from './api/model';
 import { invidiousInstanceStore } from './store';
 import { isYTBackend } from './misc';
+import { Capacitor } from '@capacitor/core';
+import { corsProxyUrl } from './fetchProxy';
 
 export class ImageCache {
 	private cache = new Map<string, HTMLImageElement>();
@@ -67,3 +69,11 @@ export function proxyGoogleImage(source: string): string {
 
 	return `${get(invidiousInstanceStore)}/ggpht${path}`;
 }
+
+export function imageHandleCors(source: string): string {
+	if (Capacitor.getPlatform() === 'android') {
+		return corsProxyUrl + source;
+	}
+
+	return source;
+}