Fixes haruncpi#14 - if there's '\n' is present in message, shows the …

…first line and adds button 'Show full stack' + small js fix for filter by type
Katenkka · Sep 30, 2020 · 17b2a25 · 17b2a25
1 parent b1f1a9c
commit 17b2a25
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 13 deletions.
diff --git a/src/LaravelLogReader.php b/src/LaravelLogReader.php
@@ -4,11 +4,11 @@
  * Date: 25/01/2020
  * Website: laravelarticle.com
  */
+
 namespace Haruncpi\LaravelLogReader;
 
 class LaravelLogReader
 {
-    protected $final = [];
     protected $config = [];
 
 
@@ -62,20 +62,22 @@ public function get()
             ]);
         }
 
-
-        $pattern = "/^\[(?<date>.*)\]\s(?<env>\w+)\.(?<type>\w+):(?<message>.*)/m";
-
         $fileName = 'laravel-' . $configDate . '.log';
         $content = file_get_contents(storage_path('logs/' . $fileName));
-        preg_match_all($pattern, $content, $matches, PREG_SET_ORDER, 0);
+
+        // splitting by regexp in order to get the whole message between 2 log entries
+        $chars = preg_split('/\[(?<date>.*)\]\s(?<env>\w+)\.(?<type>\w+):/i', $content, -1,
+            PREG_SPLIT_NO_EMPTY | PREG_SPLIT_DELIM_CAPTURE);
+        // chunking - every chung will contain all needed data
+        $matches = array_chunk($chars, 4, false);
 
         $logs = [];
-        foreach ($matches as $match) {
+        foreach ($matches as [$date, $env, $type, $message]) {
             $logs[] = [
-                'timestamp' => $match['date'],
-                'env' => $match['env'],
-                'type' => $match['type'],
-                'message' => trim($match['message'])
+                'timestamp' => $date,
+                'env' => $env,
+                'type' => $type,
+                'message' => trim($message),
             ];
         }
 

diff --git a/views/index.blade.php b/views/index.blade.php
@@ -129,6 +129,10 @@
             text-transform: uppercase;
         }
 
+        .angular-with-newlines {
+            white-space: pre-wrap;
+        }
+
         @media screen and (max-width: 700px) {
             .top_content {
                 flex-direction: column;
@@ -306,11 +310,19 @@
                 </tr>
                 </thead>
 
-                <tr ng-repeat="log in data.logs |filter: selectedType track by $index">
+                <tr ng-repeat="log in data.logs | filter: {type:selectedType} track by $index">
                     <td>@{{ log.timestamp }}</td>
-                    <td>@{{log.env}}</td>
+                    <td>@{{ log.env }}</td>
                     <td><span class="badge @{{ log.type.toLowerCase() }}">@{{ log.type }}</span></td>
-                    <td>@{{ log.message }}</td>
+                    <td>@{{ log.first_line }}
+                        <input type="button" value="Show Full Stack" ng-hide="!log.message || log.showStackTrace"
+                               ng-click="log.showStackTrace = true"/>
+                        <input type="button" value="Hide Full Stack" ng-show="log.message && log.showStackTrace"
+                               ng-click="log.showStackTrace = false"/>
+                        <div class="angular-with-newlines" ng-show="log.message && log.showStackTrace">@{{ log.message
+                            }}
+                        </div>
+                    </td>
                 </tr>
             </table>
         </div>
@@ -335,6 +347,18 @@
 
                 $http.get(url)
                     .success(function (data) {
+                        data.data.logs.forEach(function (el) {
+                            el.showStackTrace = false;
+                            var firstBreakIndex = el.message.indexOf('\n');
+                            if (firstBreakIndex === -1) {
+                                el.first_line = el.message;
+                                el.message = undefined;
+                            } else {
+                                el.first_line = el.message.substr(0, firstBreakIndex + 1);
+                                el.message = el.message.substr(firstBreakIndex + 1);
+                            }
+                        });
+
                         $scope.response = data;
                         $scope.data = data.data;
                         originalData = data.data;