fix(model-editor): add null safety for tools, functions, and file input (#19939)

This commit is contained in:
G30 2025-12-14 12:12:57 -05:00 committed by GitHub
parent a1bde74e97
commit e11c6dca75
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -361,7 +361,7 @@
on:change={() => { on:change={() => {
let reader = new FileReader(); let reader = new FileReader();
reader.onload = (event) => { reader.onload = (event) => {
let originalImageUrl = `${event.target.result}`; let originalImageUrl = `${event.target?.result}`;
const img = new Image(); const img = new Image();
img.src = originalImageUrl; img.src = originalImageUrl;
@ -409,12 +409,12 @@
inputFiles && inputFiles &&
inputFiles.length > 0 && inputFiles.length > 0 &&
['image/gif', 'image/webp', 'image/jpeg', 'image/png', 'image/svg+xml'].includes( ['image/gif', 'image/webp', 'image/jpeg', 'image/png', 'image/svg+xml'].includes(
inputFiles[0]['type'] (inputFiles[0] as any)?.['type']
) )
) { ) {
reader.readAsDataURL(inputFiles[0]); reader.readAsDataURL(inputFiles[0]);
} else { } else {
console.log(`Unsupported File Type '${inputFiles[0]['type']}'.`); console.log(`Unsupported File Type '${(inputFiles[0] as any)?.['type']}'.`);
inputFiles = null; inputFiles = null;
} }
}} }}
@ -713,22 +713,22 @@
<hr class=" border-gray-100/30 dark:border-gray-850/30 my-2" /> <hr class=" border-gray-100/30 dark:border-gray-850/30 my-2" />
<div class="my-2"> <div class="my-2">
<ToolsSelector bind:selectedToolIds={toolIds} tools={$tools} /> <ToolsSelector bind:selectedToolIds={toolIds} tools={$tools ?? []} />
</div> </div>
{#if $functions.filter((func) => func.type === 'filter').length > 0 || $functions.filter((func) => func.type === 'action').length > 0} {#if ($functions ?? []).filter((func) => func.type === 'filter').length > 0 || ($functions ?? []).filter((func) => func.type === 'action').length > 0}
<hr class=" border-gray-100/30 dark:border-gray-850/30 my-2" /> <hr class=" border-gray-100/30 dark:border-gray-850/30 my-2" />
{#if $functions.filter((func) => func.type === 'filter').length > 0} {#if ($functions ?? []).filter((func) => func.type === 'filter').length > 0}
<div class="my-2"> <div class="my-2">
<FiltersSelector <FiltersSelector
bind:selectedFilterIds={filterIds} bind:selectedFilterIds={filterIds}
filters={$functions.filter((func) => func.type === 'filter')} filters={($functions ?? []).filter((func) => func.type === 'filter')}
/> />
</div> </div>
{#if filterIds.length > 0} {#if filterIds.length > 0}
{@const toggleableFilters = $functions.filter( {@const toggleableFilters = ($functions ?? []).filter(
(func) => (func) =>
func.type === 'filter' && func.type === 'filter' &&
(filterIds.includes(func.id) || func?.is_global) && (filterIds.includes(func.id) || func?.is_global) &&
@ -746,11 +746,11 @@
{/if} {/if}
{/if} {/if}
{#if $functions.filter((func) => func.type === 'action').length > 0} {#if ($functions ?? []).filter((func) => func.type === 'action').length > 0}
<div class="my-2"> <div class="my-2">
<ActionsSelector <ActionsSelector
bind:selectedActionIds={actionIds} bind:selectedActionIds={actionIds}
actions={$functions.filter((func) => func.type === 'action')} actions={($functions ?? []).filter((func) => func.type === 'action')}
/> />
</div> </div>
{/if} {/if}