Search HTTP Request Content: Enables pinpointing requests with specific data

resources/js/components/IndexScreen.vue

@@ -33,6 +33,7 @@
 
                 updateEntriesTimeout: null,
                 updateEntriesTimer: 2500,
+                content: '',
             };
         },
 
@@ -46,6 +47,7 @@
             this.familyHash = this.$route.query.family_hash || '';
 
             this.tag = this.$route.query.tag || '';
+            this.content = this.$route.query.content || '';
 
             this.loadEntries((entries) => {
                 this.entries = entries;
@@ -89,6 +91,9 @@
                 if (!this.$route.query.tag) {
                     this.tag = '';
                 }
+                if (!this.$route.query.content) {
+                    this.content = '';
+                }
 
                 this.ready = false;
 
@@ -109,7 +114,8 @@
                         '?tag=' + this.tag +
                         '&before=' + this.lastEntryIndex +
                         '&take=' + this.entriesPerRequest +
-                        '&family_hash=' + this.familyHash
+                        '&family_hash=' + this.familyHash +
+                        '&content=' + this.content 
                 ).then(response => {
                     this.lastEntryIndex = response.data.entries.length ? _.last(response.data.entries).sequence : this.lastEntryIndex;
 
@@ -134,7 +140,9 @@
                     axios.post(Telescope.basePath + '/telescope-api/' + this.resource +
                             '?tag=' + this.tag +
                             '&take=1' +
-                            '&family_hash=' + this.familyHash
+                            '&family_hash=' + this.familyHash +
+                            '&content=' + this.content 
+
                     ).then(response => {
                         if (! this._isDestroyed) {
                             this.recordingStatus = response.data.status;
@@ -180,7 +188,7 @@
 
                     clearTimeout(this.newEntriesTimeout);
 
-                    this.$router.push({query: _.assign({}, this.$route.query, {tag: this.tag})});
+                    this.$router.push({query: _.assign({}, this.$route.query, {tag: this.tag,content:this.content})});
                 });
             },
 
@@ -271,6 +279,17 @@
         <div class="card-header d-flex align-items-center justify-content-between">
             <h2 class="h6 m-0">{{this.title}}</h2>
 
+            <div class="form-control-with-icon w-25" >
+                <div class="icon-wrapper">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" class="icon">
+                        <path fill-rule="evenodd" d="M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z" clip-rule="evenodd" />
+                    </svg>
+                </div>
+                <input type="text" class="form-control w-100"
+                       id="contentInput"
+                       placeholder="Search Content" v-model="content" @input.stop="search">
+            </div>
+
             <div class="form-control-with-icon w-25" v-if="!hideSearch && (tag || entries.length > 0)">
                 <div class="icon-wrapper">
                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" class="icon">

src/Storage/EntryModel.php

@@ -67,6 +67,7 @@ public function scopeWithTelescopeOptions($query, $type, EntryQueryOptions $opti
         $this->whereType($query, $type)
                 ->whereBatchId($query, $options)
                 ->whereTag($query, $options)
+                ->whereContent($query, $options)
                 ->whereFamilyHash($query, $options)
                 ->whereBeforeSequence($query, $options)
                 ->filter($query, $options);
@@ -133,6 +134,26 @@ protected function whereTag($query, EntryQueryOptions $options)
         return $this;
     }
 
+    /**
+     * Scope the query for the given type.
+     *
+     * @param  \Illuminate\Database\Eloquent\Builder  $query
+     * @param  \Laravel\Telescope\Storage\EntryQueryOptions  $options
+     * @return $this
+     */
+    protected function whereContent($query, EntryQueryOptions $options)
+    {
+        $query->when($options->content, function ($query, $content) {
+            if (empty($content)) {
+                return $query;
+            }
+
+            return $query->where('content', 'LIKE', '%'.$content.'%');
+        });
+
+        return $this;
+    }
+
     /**
      * Scope the query for the given type.
      *

src/Storage/EntryQueryOptions.php

@@ -48,6 +48,13 @@ class EntryQueryOptions
      */
     public $limit = 50;
 
+    /**
+     * The number of entries to retrieve.
+     *
+     * @var string
+     */
+    public $content;
+
     /**
      * Create new entry query options from the incoming request.
      *
@@ -62,7 +69,8 @@ public static function fromRequest(Request $request)
                 ->beforeSequence($request->before)
                 ->tag($request->tag)
                 ->familyHash($request->family_hash)
-                ->limit($request->take ?? 50);
+                ->limit($request->take ?? 50)
+                ->content($request->content);
     }
 
     /**
@@ -153,4 +161,17 @@ public function limit(int $limit)
 
         return $this;
     }
+
+    /**
+     * Set the number of entries that should be retrieved.
+     *
+     * @param  string  $content
+     * @return $this
+     */
+    public function content(?string $content)
+    {
+        $this->content = $content;
+
+        return $this;
+    }
 }