From a8eb5c1e31b503fd057e351a18348f16ca4eab80 Mon Sep 17 00:00:00 2001
From: Mateus Machado Luna <mateus.m.luna@gmail.com>
Date: Thu, 5 Jul 2018 11:15:17 -0300
Subject: [PATCH] Adds placeholder and smaller icons to relationship
 auto-complete. Adds placeholder image when thumbnail not available in
 relationship autocomplete.

---
 src/admin/tainacan-admin-i18n.php                      | 1 +
 src/classes/filter-types/autocomplete/Autocomplete.vue | 6 ++++--
 src/classes/filter-types/filter-types-mixin.js         | 7 ++++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/admin/tainacan-admin-i18n.php b/src/admin/tainacan-admin-i18n.php
index 60919bc77..44d784de0 100644
--- a/src/admin/tainacan-admin-i18n.php
+++ b/src/admin/tainacan-admin-i18n.php
@@ -346,6 +346,7 @@ return apply_filters( 'tainacan-admin-i18n', [
 	'info_updated_at'                            => __( 'Updated at', 'tainacan' ),
 	'info_editing_metadata_values'               => __( 'Editing metadata values...', 'tainacan' ),
 	'info_updating_metadata_values'              => __( 'Updating metadata values...', 'tainacan' ),
+	'info_type_to_search'			             => __( 'Type to search...', 'tainacan' ),
 
 	// Tainacan Metadatum Types
 	'tainacan-text'                              => __( 'Text', 'tainacan' ),
diff --git a/src/classes/filter-types/autocomplete/Autocomplete.vue b/src/classes/filter-types/autocomplete/Autocomplete.vue
index 70905da49..b9048c65f 100644
--- a/src/classes/filter-types/autocomplete/Autocomplete.vue
+++ b/src/classes/filter-types/autocomplete/Autocomplete.vue
@@ -6,17 +6,19 @@
                 :id="id"
                 v-model="selected"
                 :data="options"
+                expanded
                 @input="search"
                 :loading="isLoading"
                 field="label"
-                @select="option => setResults(option) ">
+                @select="option => setResults(option) "
+                :placeholder="$i18n.get('info_type_to_search')">
             <template slot-scope="props">
                 <div class="media">
                     <div
                             class="media-left"
                             v-if="props.option.img">
                         <img
-                                width="32"
+                                width="24"
                                 :src="`${props.option.img}`">
                     </div>
                     <div class="media-content">
diff --git a/src/classes/filter-types/filter-types-mixin.js b/src/classes/filter-types/filter-types-mixin.js
index a82e0a079..8ee4f7de5 100644
--- a/src/classes/filter-types/filter-types-mixin.js
+++ b/src/classes/filter-types/filter-types-mixin.js
@@ -1,6 +1,11 @@
 import { tainacan as axios } from '../../js/axios/axios';
 
 export const filter_type_mixin = {
+    data () {
+        return {
+            thumbPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_square.png'
+        }
+    },
     props: {
         filter: {
             type: Object // concentrate all attributes metadatum id and type
@@ -51,7 +56,7 @@ export const filter_type_mixin = {
                 .then(res => {
                     if (res.data.length > 0) {
                         for (let item of res.data) {
-                            this.options.push({label: item.title, value: item.id, img: item.thumbnail.thumb });
+                            this.options.push({label: item.title, value: item.id, img: ( item.thumbnail.thumb ? item.thumbnail.thumb : this.thumbPlaceholderPath ) });
                         }
                     }
                 })