Select search text on focus (#1201)

src/renderer/components/ft-input/ft-input.js

@@ -27,6 +27,10 @@ export default Vue.extend({
       type: Boolean,
       default: false
     },
+    selectOnFocus: {
+      type: Boolean,
+      default: false
+    },
     disabled: {
       type: Boolean,
       default: false
@@ -130,6 +134,13 @@ export default Vue.extend({
 
     handleInputBlur: function () {
       if (!this.searchState.isPointerInList) { this.searchState.showOptions = false }
+    },
+
+    handleFocus: function(e) {
+      this.searchState.showOptions = true
+      if (this.selectOnFocus) {
+        e.target.select()
+      }
     }
   }
 })

src/renderer/components/ft-input/ft-input.vue

@@ -27,7 +27,7 @@
       :placeholder="placeholder"
       :disabled="disabled"
       @input="e => handleInput(e.target.value)"
-      @focus="searchState.showOptions = true"
+      @focus="handleFocus"
       @blur="handleInputBlur"
       @keydown="e => handleKeyDown(e.keyCode)"
     >

src/renderer/components/top-nav/top-nav.vue

@@ -44,6 +44,7 @@
           :placeholder="$t('Search / Go to URL')"
           class="searchInput"
           :is-search="true"
+          :select-on-focus="true"
           :data-list="searchSuggestionsDataList"
           @input="getSearchSuggestionsDebounce"
           @click="goToSearch"

src/renderer/views/Channel/Channel.vue

@@ -70,6 +70,7 @@
           </div>
           <ft-input
             :placeholder="$t('Channel.Search Channel')"
+            :select-on-focus="true"
             class="channelSearch"
             @click="newSearch"
           />