From 80308b6e8dc00364fd7ecf16d3956c4280321aa1 Mon Sep 17 00:00:00 2001
From: Douglas Barone <douglasvbarone@gmail.com>
Date: Tue, 5 Jan 2021 14:23:28 -0400
Subject: [PATCH] Improved tagging

---
 .../20210105173319_alter_tags/migration.sql   |  2 ++
 server/prisma/schema.prisma                   |  2 +-
 server/src/lib/logger.js                      |  2 +-
 server/src/resolvers/Log.js                   |  4 +--
 server/src/resolvers/Query/logs.js            | 30 +++++++++----------
 web/src/components/Logs.vue                   | 15 +++++++++-
 6 files changed, 34 insertions(+), 21 deletions(-)
 create mode 100644 server/prisma/migrations/20210105173319_alter_tags/migration.sql

diff --git a/server/prisma/migrations/20210105173319_alter_tags/migration.sql b/server/prisma/migrations/20210105173319_alter_tags/migration.sql
new file mode 100644
index 0000000..f2fd0a9
--- /dev/null
+++ b/server/prisma/migrations/20210105173319_alter_tags/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Log" ALTER COLUMN "tags" SET DATA TYPE TEXT;
diff --git a/server/prisma/schema.prisma b/server/prisma/schema.prisma
index fb9a02a..fb36f6d 100644
--- a/server/prisma/schema.prisma
+++ b/server/prisma/schema.prisma
@@ -100,7 +100,7 @@ model Log {
   id        Int      @id @default(autoincrement())
   timestamp DateTime @default(now())
   level     LogLevel @default(LOW)
-  tags      Json?
+  tags      String?
   message   String
   data      Json?
 }
diff --git a/server/src/lib/logger.js b/server/src/lib/logger.js
index d0aded2..15377bf 100644
--- a/server/src/lib/logger.js
+++ b/server/src/lib/logger.js
@@ -26,7 +26,7 @@ async function log({ level, tags = [], message = '', data }, store = true) {
         data: {
           timestamp: now,
           level,
-          tags,
+          tags: tags.toString(),
           message,
           data
         }
diff --git a/server/src/resolvers/Log.js b/server/src/resolvers/Log.js
index dab1cb9..5163e94 100644
--- a/server/src/resolvers/Log.js
+++ b/server/src/resolvers/Log.js
@@ -1,7 +1,7 @@
 const Log = {
+  timestamp: parent => parent.timestamp?.toISOString(),
   data: parent => JSON.stringify(parent.data),
-
-  timestamp: parent => parent.timestamp?.toISOString()
+  tags: parent => parent.tags?.split(',')
 }
 
 export { Log }
diff --git a/server/src/resolvers/Query/logs.js b/server/src/resolvers/Query/logs.js
index 6d1402d..6b7633a 100644
--- a/server/src/resolvers/Query/logs.js
+++ b/server/src/resolvers/Query/logs.js
@@ -2,30 +2,28 @@ import prisma from '../../prisma'
 
 const MAX_RESULT = 5000
 
-export async function logs(parent, { search, dateIn, dateOut, limit }) {
+export async function logs(parent, { search, dateIn, dateOut, limit = 100 }) {
   try {
-    const logs = await prisma.log.findMany({
+    if (search) search = search.trim()
+
+    if (limit > MAX_RESULT) limit = MAX_RESULT
+
+    return prisma.log.findMany({
       where: {
         timestamp: {
           gte: dateIn ? new Date(dateIn) : undefined,
           lte: dateOut ? new Date(dateOut) : undefined
-        }
+        },
+        OR: search
+          ? [
+              { message: { contains: search, mode: 'insensitive' } },
+              { tags: { contains: search, mode: 'insensitive' } }
+            ]
+          : undefined
       },
       orderBy: { timestamp: 'desc' },
-      take: search ? MAX_RESULT : limit
+      take: limit
     })
-
-    if (search) search = search.trim().toLowerCase()
-
-    return search
-      ? logs
-          .filter(
-            log =>
-              log.message.toLowerCase().includes(search) ||
-              log.tags.some(tag => tag.toLowerCase().includes(search))
-          )
-          .slice(0, limit)
-      : logs
   } catch (e) {
     console.error(e.message)
     throw new Error(
diff --git a/web/src/components/Logs.vue b/web/src/components/Logs.vue
index 3ef28c2..9b76803 100644
--- a/web/src/components/Logs.vue
+++ b/web/src/components/Logs.vue
@@ -28,6 +28,7 @@
         </template>
       </v-tooltip>
       <v-spacer />
+
       <DateTimePicker v-model="dateIn" class="ma-2" label="Início" :max="max" />
       <DateTimePicker
         v-model="dateOut"
@@ -48,7 +49,7 @@
       }"
     >
       <template slot="item.timestamp" slot-scope="{ item }">
-        <v-chip dense small>
+        <v-chip dense small outlined>
           {{ item.timestamp | conciseDate }}
         </v-chip>
       </template>
@@ -87,7 +88,18 @@
       </div>
     </v-data-table>
     <v-footer>
+      <v-slider
+        v-model="limit"
+        color="primary"
+        track-color="grey"
+        min="10"
+        max="500"
+        label="Limite"
+        thumb-label
+        hide-details
+      />
       <v-spacer />
+
       <v-switch v-model="polling" label="Atualizar automaticamente" />
     </v-footer>
   </div>
@@ -188,6 +200,7 @@ export default {
   apollo: {
     logs: {
       query: LOGS_QUERY,
+      debounce: 400,
       variables() {
         return {
           search: this.search,