From fdd28f284cee69a6e9ae550028959d9fd4fe55b6 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Fri, 22 May 2026 19:15:49 -0400
Subject: [PATCH] wip

---
 lang/de.json                                       |  1 -
 lang/de_CH.json                                    |  1 -
 lang/fr.json                                       |  1 -
 lang/nl.json                                       |  1 -
 lang/ru.json                                       |  1 -
 resources/js/components/fieldtypes/assets/Asset.js |  9 ++++++++-
 .../js/components/fieldtypes/assets/AssetRow.vue   | 12 ++++++++----
 .../js/components/fieldtypes/assets/AssetTile.vue  | 14 +++++++++++---
 .../js/components/inputs/relationship/Item.vue     |  5 ++---
 9 files changed, 29 insertions(+), 16 deletions(-)

diff --git a/lang/de.json b/lang/de.json
index f15c1e48b3f..4b424e4ce31 100644
--- a/lang/de.json
+++ b/lang/de.json
@@ -600,7 +600,6 @@
     "Icon": "Icon",
     "Icon Set": "Icon-Set",
     "ID": "ID",
-    "ID not found": "ID nicht gefunden",
     "ID regenerated and Stache cleared": "ID neu generiert und Stache geleert",
     "If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser:": "Falls das Klicken auf den „:actionText“-Button nicht funktioniert, kopiere die folgende URL in deinen Webbrowser:",
     "Ignoring Section|Ignoring Sections": "Abschnitt wird ignoriert|Abschnitte werden ignoriert",
diff --git a/lang/de_CH.json b/lang/de_CH.json
index 4097416f593..96a9c39eeef 100644
--- a/lang/de_CH.json
+++ b/lang/de_CH.json
@@ -600,7 +600,6 @@
     "Icon": "Icon",
     "Icon Set": "Icon-Set",
     "ID": "ID",
-    "ID not found": "ID nicht gefunden",
     "ID regenerated and Stache cleared": "ID neu generiert und Stache geleert",
     "If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser:": "Falls das Klicken auf den «:actionText»-Button nicht funktioniert, kopiere die folgende URL in deinen Webbrowser:",
     "Ignoring Section|Ignoring Sections": "Abschnitt wird ignoriert|Abschnitte werden ignoriert",
diff --git a/lang/fr.json b/lang/fr.json
index a0de527220e..1b3a33a5c25 100644
--- a/lang/fr.json
+++ b/lang/fr.json
@@ -601,7 +601,6 @@
     "Icon": "Icône",
     "Icon Set": "Jeu d'icônes",
     "ID": "ID",
-    "ID not found": "ID non trouvée",
     "ID regenerated and Stache cleared": "ID regénéré et Stache effacé",
     "If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser:": "Si vous ne parvenez pas à cliquer sur le bouton \":actionText\", copiez et collez l'URL ci-dessous dans votre navigateur Web :",
     "Ignoring Section|Ignoring Sections": "Ignorer la section|Ignorer les sections",
diff --git a/lang/nl.json b/lang/nl.json
index bdfc7d89a67..405030b35fc 100644
--- a/lang/nl.json
+++ b/lang/nl.json
@@ -585,7 +585,6 @@
     "Icon": "Icoon",
     "Icon Set": "pictogram set",
     "ID": "ID",
-    "ID not found": "ID niet gevonden",
     "ID regenerated and Stache cleared": "ID's opnieuw gegenereerd en Stache geleegd",
     "If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser:": "Als je problemen ondervindt bij het klikken op de knop \":actionText\", kopieer en plak de onderstaande URL dan in je webbrowser:",
     "Image": "Afbeelding",
diff --git a/lang/ru.json b/lang/ru.json
index 3b9a494097a..88c0ab02f9d 100644
--- a/lang/ru.json
+++ b/lang/ru.json
@@ -623,7 +623,6 @@
     "Icon": "Иконка",
     "Icon Set": "Набор иконок",
     "ID": "ID",
-    "ID not found": "ID не найден",
     "ID regenerated and Stache cleared": "ID обновлён, а Stache очищен",
     "If you're having trouble clicking the \":actionText\" button, copy and paste the URL below\ninto your web browser:": "Если у вас возникли проблемы с нажатием кнопки \":actionText\" скопируйте и вставьте URL ниже\nв свой веб-браузер:",
     "Image": "Изображения",
diff --git a/resources/js/components/fieldtypes/assets/Asset.js b/resources/js/components/fieldtypes/assets/Asset.js
index 980a9c9f12c..83440d00cbe 100644
--- a/resources/js/components/fieldtypes/assets/Asset.js
+++ b/resources/js/components/fieldtypes/assets/Asset.js
@@ -50,12 +50,18 @@ export default {
         },
 
         label() {
-            return this.asset.basename;
+            return this.asset.invalid ? this.asset.id : this.asset.basename;
         },
 
         needsAlt() {
+            if (this.asset.invalid) return false;
+
             return (this.asset.isImage || this.asset.isSvg) && !this.asset.values.alt;
         },
+
+        invalidLabel() {
+            return __('messages.relationship_item_unavailable');
+        },
     },
 
     methods: {
@@ -67,6 +73,7 @@ export default {
 
         edit() {
             if (this.readOnly) return;
+            if (this.asset.invalid) return;
 
             this.editing = true;
         },
diff --git a/resources/js/components/fieldtypes/assets/AssetRow.vue b/resources/js/components/fieldtypes/assets/AssetRow.vue
index 8f94e6851e1..2d2f736e445 100644
--- a/resources/js/components/fieldtypes/assets/AssetRow.vue
+++ b/resources/js/components/fieldtypes/assets/AssetRow.vue
@@ -19,16 +19,20 @@
                     :alt="asset.basename"
                     v-if="thumbnail"
                 />
-                <file-icon :extension="asset.extension" v-else class="size-7" />
+                <file-icon :extension="asset.extension ?? 'generic'" v-else class="size-7" />
             </button>
             <button
                 v-if="showFilename"
                 @click="editOrOpen"
-                class="min-w-0 flex-1 truncate text-start text-sm leading-5 text-gray-600 dark:text-gray-400"
-                :title="__('Edit')"
+                class="min-w-0 flex-1 truncate text-start text-sm leading-5"
+                :class="{
+                    'text-gray-600 dark:text-gray-300': !asset.invalid,
+                    'text-gray-500 dark:text-gray-400': asset.invalid
+                }"
+                :title="asset.invalid ? invalidLabel : __('Edit')"
                 :aria-label="__('Edit Asset')"
             >
-                {{ asset.basename }}
+                {{ label }}
             </button>
             <div v-if="readOnly" v-text="asset.size" class="asset-filesize hidden shrink-0 px-2 text-sm leading-5 text-gray-600 dark:text-gray-400 @xs:block" />
         </td>
diff --git a/resources/js/components/fieldtypes/assets/AssetTile.vue b/resources/js/components/fieldtypes/assets/AssetTile.vue
index 08b2a888f7e..b9d584b3174 100644
--- a/resources/js/components/fieldtypes/assets/AssetTile.vue
+++ b/resources/js/components/fieldtypes/assets/AssetTile.vue
@@ -6,7 +6,7 @@
             'is-svg': canShowSvg,
             'is-file': !isImage && !canShowSvg,
         }"
-        :title="label"
+        :title="asset.invalid ? invalidLabel : label"
     >
         <asset-editor
             v-if="editing"
@@ -35,7 +35,7 @@
                     <template v-else>
                         <img :src="thumbnail" v-if="thumbnail" :title="label" class="rounded-md relative"  />
 
-                        <file-icon v-else :extension="asset.extension" class="h-full w-full p-4 relative" />
+                        <file-icon v-else :extension="asset.extension ?? 'generic'" class="h-full w-full p-4 relative" />
                     </template>
                 </template>
 
@@ -66,7 +66,15 @@
         </div>
 
         <div class="flex items-center justify-between w-full px-1" v-if="showFilename">
-            <div class="truncate w-18 text-xs text-gray-600 dark:text-gray-400 flex-1 px-2 py-1" v-tooltip="label" :class="{ 'text-center': !needsAlt }">
+            <div
+                class="truncate w-18 text-xs flex-1 px-2 py-1"
+                :class="{
+                    'text-center': !needsAlt,
+                    'text-gray-600 dark:text-gray-300': !asset.invalid,
+                    'text-gray-500 dark:text-gray-400': asset.invalid,
+                }"
+                v-tooltip="asset.invalid ? invalidLabel : label"
+            >
                 {{ label }}
             </div>
             <ui-badge as="button" size="sm" color="sky"  @click="editOrOpen" v-if="asset.isEditable && showSetAlt && needsAlt" :text="asset.values.alt ? '✅' : __('Set Alt')" />
diff --git a/resources/js/components/inputs/relationship/Item.vue b/resources/js/components/inputs/relationship/Item.vue
index d94bfcf690d..707a589808a 100644
--- a/resources/js/components/inputs/relationship/Item.vue
+++ b/resources/js/components/inputs/relationship/Item.vue
@@ -1,7 +1,6 @@
 <template>
     <div
         class="shadow-ui-sm relative z-(--z-index-above) flex w-full h-full items-center gap-2 rounded-lg border border-gray-300 bg-white px-3 [&:has(.cursor-grab)]:px-1.5 py-1.5 mb-1.5 last:mb-0 text-base dark:border-gray-700 dark:with-contrast:border-gray-500 dark:bg-gray-900"
-        :class="{ invalid: item.invalid }"
     >
         <ui-icon name="handles" class="item-move sortable-handle size-4 cursor-grab text-gray-300 dark:text-gray-700" v-if="sortable" />
         <div class="flex flex-1 items-center line-clamp-1 text-sm text-gray-600 dark:text-gray-300">
@@ -9,9 +8,9 @@
 
             <div
                 v-if="item.invalid"
-                v-tooltip.top="__('ID not found')"
+                v-tooltip.top="__('messages.relationship_item_unavailable')"
                 v-text="__(item.title)"
-                class="line-clamp-1 text-sm text-gray-600 dark:text-gray-300"
+                class="line-clamp-1 text-sm text-gray-500 dark:text-gray-400"
             />
 
             <a