fix image rendering in electron

electron/main.cjs

@@ -1,11 +1,26 @@
 'use strict'
 
 const { app, BrowserWindow, ipcMain, shell } = require('electron')
+const fs = require('fs')
 const path = require('path')
 
 /** True when running from source (`electron .`); false when packaged. */
 const isDev = !app.isPackaged
 
+function resolveWindowIcon() {
+  const candidates = isDev
+    ? [path.join(__dirname, '..', 'public', 'favicon.png')]
+    : [path.join(__dirname, '..', 'dist', 'favicon.png')]
+  for (const p of candidates) {
+    try {
+      if (fs.existsSync(p)) return p
+    } catch {
+      // ignore
+    }
+  }
+  return undefined
+}
+
 function loadRenderer(win) {
   if (isDev) {
     const devUrl = process.env.VITE_DEV_SERVER_URL || 'http://127.0.0.1:5173'
@@ -25,6 +40,7 @@ function createWindow() {
     minWidth: 400,
     minHeight: 500,
     show: false,
+    icon: resolveWindowIcon(),
     webPreferences: {
       preload: path.join(__dirname, 'preload.cjs'),
       contextIsolation: true,

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "imwald",
-  "version": "22.0.0",
+  "version": "22.0.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "imwald",
-      "version": "22.0.0",
+      "version": "22.0.1",
       "license": "MIT",
       "dependencies": {
         "@asciidoctor/core": "^3.0.4",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "imwald",
-  "version": "22.0.0",
+  "version": "22.0.1",
   "description": "Imwald — a user-friendly Nostr client focused on relay feed browsing, publications, and relay discovery",
   "private": true,
   "type": "module",
@@ -156,7 +156,7 @@
       ],
       "category": "Network",
       "maintainer": "Silberengel",
-      "icon": "build/icon.png"
+      "icon": "public/favicon.png"
     }
   },
   "overrides": {

src/assets/Icon.tsx

@@ -1,10 +1,11 @@
+import { publicAssetUrl } from '@/constants'
 import { cn } from '@/lib/utils'
 
 /** Compact mark for narrow sidebar (from `public/favicon.png`). */
 export default function Icon({ className }: { className?: string }) {
   return (
     <img
-      src="/favicon.png"
+      src={publicAssetUrl('favicon.png')}
       alt=""
       width={216}
       height={215}

src/assets/Logo.tsx

@@ -1,3 +1,4 @@
+import { publicAssetUrl } from '@/constants'
 import { cn } from '@/lib/utils'
 import type { MouseEvent } from 'react'
 
@@ -5,7 +6,7 @@ import type { MouseEvent } from 'react'
 export default function Logo({ className }: { className?: string }) {
   return (
     <img
-      src="/banner.png"
+      src={publicAssetUrl('banner.png')}
       alt="Imwald"
       width={868}
       height={194}

src/components/Note/index.tsx

@@ -1,5 +1,5 @@
 import { useSmartNoteNavigationOptional } from '@/PageManager'
-import { ExtendedKind } from '@/constants'
+import { ExtendedKind, publicAssetUrl } from '@/constants'
 import { isRenderableNoteKind } from '@/lib/note-renderable-kinds'
 import {
   getHttpUrlFromITags,
@@ -457,7 +457,7 @@ export default function Note({
                   }`}
                 >
                   <img
-                    src="/favicon.png"
+                    src={publicAssetUrl('favicon.png')}
                     alt=""
                     className="w-full h-full object-cover"
                     width={size === 'small' ? 36 : 40}

src/components/QrCode/index.tsx

@@ -1,3 +1,4 @@
+import { publicAssetUrl } from '@/constants'
 import QRCodeStyling from 'qr-code-styling'
 import { useEffect, useRef } from 'react'
 
@@ -12,7 +13,7 @@ export default function QrCode({ value, size = 180 }: { value: string; size?: nu
         qrOptions: {
           errorCorrectionLevel: 'M'
         },
-        image: '/favicon.svg',
+        image: publicAssetUrl('favicon.svg'),
         width: size * pixelRatio,
         height: size * pixelRatio,
         data: value,

src/constants.ts

@@ -31,6 +31,15 @@ export const READ_ALOUD_TTS_URL =
 export const HIVETALK_BASE_URL =
   (import.meta.env.VITE_HIVETALK_BASE_URL as string | undefined) ?? 'https://vanilla.hivetalk.org'
 
+/**
+ * URL for a file from `public/` (banner, favicon, payto logos, etc.).
+ * Uses Vite `base`: `/` on the web, `./` when built for Electron (`loadFile` + `file:`).
+ */
+export function publicAssetUrl(assetPath: string): string {
+  const trimmed = assetPath.replace(/^\//, '')
+  return `${import.meta.env.BASE_URL}${trimmed}`
+}
+
 /**
  * Default URL for the sidebar “Download desktop app” entry (e.g. GitHub Releases with AppImage/deb).
  * Override per deploy with `DESKTOP_DOWNLOAD_URL` in `/config.json` (empty string hides the entry).

src/lib/payto.ts

@@ -3,6 +3,8 @@
  * Parse and normalize payto://<type>/<authority> URIs; known types for UI (icons, labels, dialogs).
  */
 
+import { publicAssetUrl } from '@/constants'
+
 export const PAYTO_URI_REGEX = /payto:\/\/([a-z0-9-]+)\/([^\s\]\)\<\"']+)/gi
 
 export interface ParsedPayto {
@@ -162,7 +164,7 @@ export function getPaytoLogoPath(type: string): string | null {
   const key = type.toLowerCase()
   const file = PAYTO_LOGO_FILES[key]
   if (!file) return null
-  return `/payto_logos/${file}`
+  return publicAssetUrl(`payto_logos/${file}`)
 }
 
 export function getPaytoTypeInfo(type: string): (typeof PAYTO_KNOWN_TYPES)[string] | undefined {