Browser - Add optional note into the Browser modal (via the Browser F…

…ield)
area17 · Apr 28, 2021 · b4cb5b8 · b4cb5b8
1 parent 389be6b
commit b4cb5b8
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 1 deletion.
diff --git a/frontend/js/components/Browser.vue b/frontend/js/components/Browser.vue
@@ -12,7 +12,11 @@
                        @change="changeBrowserSource"/>
         </div>
         <div class="browser__search">
-          <a17-filter @submit="submitFilter"/>
+          <a17-filter @submit="submitFilter">
+            <div slot="additional-actions">
+              {{ browserNote }}
+            </div>
+          </a17-filter>
         </div>
       </div>
       <div class="browser__inner">
@@ -89,6 +93,7 @@
         endpointName: state => state.browser.endpointName,
         endpoints: state => state.browser.endpoints,
         browserTitle: state => state.browser.title,
+        browserNote: state => state.browser.note,
         selected: state => state.browser.selected
       })
     },

diff --git a/frontend/js/components/BrowserField.vue b/frontend/js/components/BrowserField.vue
@@ -45,6 +45,10 @@
         type: String,
         default: ''
       },
+      browserNote: {
+        type: String,
+        default: ''
+      },
       itemLabel: {
         type: String,
         default: 'Item'
@@ -143,6 +147,7 @@
         }
         this.$store.commit(BROWSER.UPDATE_BROWSER_MAX, this.max)
         this.$store.commit(BROWSER.UPDATE_BROWSER_TITLE, this.browserTitle)
+        this.$store.commit(BROWSER.UPDATE_BROWSER_NOTE, this.browserNote)
 
         if (this.wide) {
           this.$root.$refs.browserWide.open(this.endpoints.length <= 0)

diff --git a/frontend/js/store/modules/browser.js b/frontend/js/store/modules/browser.js
@@ -4,6 +4,7 @@ import { BROWSER } from '../mutations'
 const state = {
   connector: null,
   title: 'Attach related resources',
+  note: '',
   endpoint: '',
   endpointName: '',
   endpoints: [],
@@ -67,6 +68,9 @@ const mutations = {
   [BROWSER.UPDATE_BROWSER_TITLE] (state, newValue) {
     if (newValue && newValue !== '') state.title = newValue
   },
+  [BROWSER.UPDATE_BROWSER_NOTE] (state, newValue) {
+    state.note = newValue
+  },
   [BROWSER.DESTROY_BROWSER_CONNECTOR] (state) {
     state.connector = null
   },

diff --git a/frontend/js/store/mutations/browser.js b/frontend/js/store/mutations/browser.js
@@ -5,6 +5,7 @@ export const DESTROY_ITEM = 'destroySelectedItem'
 export const REORDER_ITEMS = 'reorderSelectedItems'
 export const UPDATE_BROWSER_MAX = 'updateBrowserMax'
 export const UPDATE_BROWSER_TITLE = 'updateBrowserTitle'
+export const UPDATE_BROWSER_NOTE = 'updateBrowserNote'
 export const UPDATE_BROWSER_CONNECTOR = 'updateBrowserConnector'
 export const DESTROY_BROWSER_CONNECTOR = 'destroyBrowserConnector'
 export const UPDATE_BROWSER_ENDPOINT = 'updateBrowserEndpoint'
@@ -19,6 +20,7 @@ export default {
   REORDER_ITEMS,
   UPDATE_BROWSER_MAX,
   UPDATE_BROWSER_TITLE,
+  UPDATE_BROWSER_NOTE,
   UPDATE_BROWSER_CONNECTOR,
   DESTROY_BROWSER_CONNECTOR,
   UPDATE_BROWSER_ENDPOINT,

diff --git a/views/partials/form/_browser.blade.php b/views/partials/form/_browser.blade.php
@@ -20,6 +20,7 @@
     $sortable = $sortable ?? true;
     $wide = $wide ?? false;
     $buttonOnTop = $buttonOnTop ?? false;
+    $browserNote = $browserNote ?? '';
 @endphp
 
 <a17-inputframe label="{{ $label }}" name="browsers.{{ $name }}" note="{{ $fieldNote }}">
@@ -32,6 +33,7 @@
         :endpoints="{{ json_encode($endpoints) }}"
         modal-title="{{ twillTrans('twill::lang.fields.browser.attach') . ' ' . strtolower($label) }}"
         :draggable="{{ json_encode($sortable) }}"
+        browser-note="{{ $browserNote }}"
         @if ($buttonOnTop) :button-on-top="true" @endif
     >{{ $note }}</a17-browserfield>
 </a17-inputframe>