fix(stage-tamagotchi): cannot load static assets due to file not able to be accessed with in Electron

Author: nekomeowww

packages/stage-ui-three/src/components/ThreeScene.vue

@@ -12,6 +12,7 @@ import type { DirectionalLight, SphericalHarmonics3, Texture, WebGLRenderTarget
 
 import type { Vec3 } from '../stores/model-store'
 
+import { withBase } from '@proj-airi/stage-shared'
 import { EffectComposerPmndrs, HueSaturationPmndrs } from '@proj-airi/tresjs/post-processing'
 import { TresCanvas } from '@tresjs/core'
 import { useElementBounding } from '@vueuse/core'
@@ -43,7 +44,7 @@ const props = withDefaults(defineProps<{
   paused?: boolean
 }>(), {
   showAxes: false,
-  idleAnimation: '/assets/vrm/animations/idle_loop.vrma',
+  idleAnimation: withBase('/assets/vrm/animations/idle_loop.vrma'),
   paused: false,
 })
 

packages/stage-ui/src/components/scenarios/dialogs/model-selector/model-selector.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import type { DisplayModel } from '../../../../stores/display-models'
 
+import { withBase } from '@proj-airi/stage-shared'
 import { useFileDialog } from '@vueuse/core'
 import { storeToRefs } from 'pinia'
 import { DropdownMenuContent, DropdownMenuItem, DropdownMenuPortal, DropdownMenuRoot, DropdownMenuTrigger, EditableArea, EditableEditTrigger, EditableInput, EditablePreview, EditableRoot, EditableSubmitTrigger } from 'reka-ui'
@@ -162,7 +163,7 @@ vrmDialog.onChange(handleAddVRMModel)
             aspect="12/16"
             px-1 py-2
           >
-            <img v-if="model.previewImage" :src="model.previewImage" h-full w-full rounded-lg object-cover :class="[highlightDisplayModelCard && highlightDisplayModelCard === model.id ? 'ring-3 ring-primary-400' : 'ring-0 ring-transparent']" transition="all duration-200 ease-in-out">
+            <img v-if="model.previewImage" :src="withBase(model.previewImage)" h-full w-full rounded-lg object-cover :class="[highlightDisplayModelCard && highlightDisplayModelCard === model.id ? 'ring-3 ring-primary-400' : 'ring-0 ring-transparent']" transition="all duration-200 ease-in-out">
             <div v-else bg="neutral-100 dark:neutral-900" relative h-full w-full flex flex-col items-center justify-center gap-2 overflow-hidden rounded-lg :class="[highlightDisplayModelCard && highlightDisplayModelCard === model.id ? 'ring-3 ring-primary-400' : 'ring-0 ring-transparent']" transition="all duration-200 ease-in-out">
               <div i-solar:question-square-bold-duotone text-4xl opacity-75 />
               <div translate-y="100%" absolute top-0 flex flex-col translate-x--7 rotate-45 scale-250 gap-0 opacity-5>

packages/stage-ui/src/components/scenes/Stage.vue

@@ -7,6 +7,7 @@ import type { Emotion } from '../../constants/emotions'
 
 import { drizzle } from '@proj-airi/drizzle-duckdb-wasm'
 import { getImportUrlBundles } from '@proj-airi/drizzle-duckdb-wasm/bundles/import-url-browser'
+import { withBase } from '@proj-airi/stage-shared'
 import { ThreeScene, useModelStore } from '@proj-airi/stage-ui-three'
 // import { createTransformers } from '@xsai-transformers/embed'
 // import embedWorkerURL from '@xsai-transformers/embed/worker?worker&url'
@@ -286,7 +287,7 @@ defineExpose({
         v-if="stageModelRenderer === 'vrm' && showStage"
         ref="vrmViewerRef"
         :model-src="stageModelSelectedUrl"
-        idle-animation="/assets/vrm/animations/idle_loop.vrma"
+        :idle-animation="withBase('/assets/vrm/animations/idle_loop.vrma')"
         min-w="50% <lg:full" min-h="100 sm:100" h-full w-full flex-1
         :paused="paused"
         :show-axes="stageViewControlsEnabled"

packages/stage-ui/src/stores/providers.ts

@@ -17,6 +17,7 @@ import type {
   VoiceProviderWithExtraOptions,
 } from 'unspeech'
 
+import { isUrl } from '@proj-airi/stage-shared'
 import { computedAsync, useLocalStorage } from '@vueuse/core'
 import {
   createAzure,
@@ -56,7 +57,6 @@ import {
 import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { isUrl } from '../utils/url'
 import { models as elevenLabsModels } from './providers/elevenlabs/list-models'
 import { buildOpenAICompatibleProvider } from './providers/openai-compatible-builder'
 

packages/stage-ui/src/stores/settings.ts

@@ -2,6 +2,7 @@ import type { DisplayModel } from './display-models'
 
 import messages from '@proj-airi/i18n/locales'
 
+import { withBase } from '@proj-airi/stage-shared'
 import { useEventListener, useLocalStorage } from '@vueuse/core'
 import { converter } from 'culori'
 import { defineStore } from 'pinia'
@@ -80,7 +81,7 @@ export const useSettings = defineStore('settings', () => {
       stageModelSelectedUrl.value = URL.createObjectURL(model.file)
     }
     else {
-      stageModelSelectedUrl.value = model.url
+      stageModelSelectedUrl.value = withBase(model.url)
     }
 
     stageModelSelectedDisplayModel.value = model