From df3f792aa373d7d3e9af6ec88306d4d6b5b7f35c Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Fri, 26 Jul 2024 21:11:33 +0000
Subject: [PATCH 1/6] Clean up table and text formatting, add filter options

---
 turbinia/workers/__init__.py          |   2 +-
 web/package-lock.json                 | 779 +++++++++++++++-----------
 web/package.json                      |  18 +-
 web/src/App.vue                       |  30 +-
 web/src/components/RequestDetails.vue | 139 +++++
 web/src/components/RequestList.vue    | 162 ++++--
 web/src/components/TaskDetails.vue    |  14 +-
 web/src/components/TaskList.vue       |  55 +-
 web/src/utils/RestApiClient.js        |  10 +
 web/vite.config.js                    |   2 +-
 10 files changed, 804 insertions(+), 407 deletions(-)
 create mode 100644 web/src/components/RequestDetails.vue

diff --git a/turbinia/workers/__init__.py b/turbinia/workers/__init__.py
index dcb460d6d..2cbd8bd72 100644
--- a/turbinia/workers/__init__.py
+++ b/turbinia/workers/__init__.py
@@ -452,7 +452,7 @@ class TurbiniaTask:
 
   # The list of attributes that we will persist into storage
   STORED_ATTRIBUTES = [
-      'id', 'job_id', 'start_time', 'last_update', 'name', 'evidence_name',
+      'id', 'job_id', 'job_name', 'start_time', 'last_update', 'name', 'evidence_name',
       'evidence_id', 'request_id', 'requester', 'group_name', 'reason',
       'group_id'
   ]
diff --git a/web/package-lock.json b/web/package-lock.json
index 94a08668d..01dba5fc5 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -8,23 +8,23 @@
       "name": "turbinia-web",
       "version": "1.0.0",
       "dependencies": {
-        "@mdi/font": "7.0.96",
-        "axios": "^1.6.5",
+        "@mdi/font": "7.4.47",
+        "axios": "^1.7.2",
         "streamsaver": "^2.0.6",
-        "vue": "^3.2.0",
-        "vuetify": "^3.0.0"
+        "vue": "^3.4.34",
+        "vuetify": "^3.6.13"
       },
       "devDependencies": {
-        "@vitejs/plugin-vue": "^4.0.0",
-        "unplugin-fonts": "^1.0.3",
-        "vite": "^4.5.3",
-        "vite-plugin-vuetify": "^1.0.0"
+        "@vitejs/plugin-vue": "^5.1.0",
+        "unplugin-fonts": "^1.1.1",
+        "vite": "^5.3.4",
+        "vite-plugin-vuetify": "^2.0.3"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.7.tgz",
-      "integrity": "sha512-9uUYRm6OqQrCqQdG1iCBwBPZgN8ciDBro2nIOFaiRz1/BCxaI7CNvQbDHvsArAC7Tw9Hda/B3U+6ui9u4HWXPw==",
+      "version": "7.24.8",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.8.tgz",
+      "integrity": "sha512-WzfbgXOkGzZiXXCqk43kKwZjzwx4oulxZi3nq2TYL9mOjQv6kYwul9mz6ID36njuL7Xkp6nJEfok848Zj10j/w==",
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -32,10 +32,25 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.18.20.tgz",
-      "integrity": "sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
+      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
       "cpu": [
         "arm"
       ],
@@ -48,9 +63,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz",
-      "integrity": "sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
+      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
       "cpu": [
         "arm64"
       ],
@@ -63,9 +78,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.18.20.tgz",
-      "integrity": "sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
+      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
       "cpu": [
         "x64"
       ],
@@ -78,9 +93,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz",
-      "integrity": "sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
+      "integrity": "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==",
       "cpu": [
         "arm64"
       ],
@@ -93,9 +108,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz",
-      "integrity": "sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
+      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
       "cpu": [
         "x64"
       ],
@@ -108,9 +123,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz",
-      "integrity": "sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
+      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
       "cpu": [
         "arm64"
       ],
@@ -123,9 +138,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz",
-      "integrity": "sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
+      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
       "cpu": [
         "x64"
       ],
@@ -138,9 +153,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz",
-      "integrity": "sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
+      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
       "cpu": [
         "arm"
       ],
@@ -153,9 +168,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz",
-      "integrity": "sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
+      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
       "cpu": [
         "arm64"
       ],
@@ -168,9 +183,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz",
-      "integrity": "sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
+      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
       "cpu": [
         "ia32"
       ],
@@ -183,9 +198,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz",
-      "integrity": "sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
+      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
       "cpu": [
         "loong64"
       ],
@@ -198,9 +213,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz",
-      "integrity": "sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
+      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
       "cpu": [
         "mips64el"
       ],
@@ -213,9 +228,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz",
-      "integrity": "sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
       "cpu": [
         "ppc64"
       ],
@@ -228,9 +243,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz",
-      "integrity": "sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
+      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
       "cpu": [
         "riscv64"
       ],
@@ -243,9 +258,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz",
-      "integrity": "sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
+      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
       "cpu": [
         "s390x"
       ],
@@ -258,9 +273,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz",
-      "integrity": "sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
+      "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==",
       "cpu": [
         "x64"
       ],
@@ -273,9 +288,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz",
-      "integrity": "sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
       "cpu": [
         "x64"
       ],
@@ -288,9 +303,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz",
-      "integrity": "sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
       "cpu": [
         "x64"
       ],
@@ -303,9 +318,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz",
-      "integrity": "sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
+      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
       "cpu": [
         "x64"
       ],
@@ -318,9 +333,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz",
-      "integrity": "sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
+      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
       "cpu": [
         "arm64"
       ],
@@ -333,9 +348,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz",
-      "integrity": "sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
+      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
       "cpu": [
         "ia32"
       ],
@@ -348,9 +363,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz",
-      "integrity": "sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
+      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
       "cpu": [
         "x64"
       ],
@@ -363,14 +378,14 @@
       }
     },
     "node_modules/@jridgewell/sourcemap-codec": {
-      "version": "1.4.15",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
-      "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
+      "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
     },
     "node_modules/@mdi/font": {
-      "version": "7.0.96",
-      "resolved": "https://registry.npmjs.org/@mdi/font/-/font-7.0.96.tgz",
-      "integrity": "sha512-rzlxTfR64hqY8yiBzDjmANfcd8rv+T5C0Yedv/TWk2QyAQYdc66e0kaN1ipmnYU3RukHRTRcBARHzzm+tIhL7w=="
+      "version": "7.4.47",
+      "resolved": "https://registry.npmjs.org/@mdi/font/-/font-7.4.47.tgz",
+      "integrity": "sha512-43MtGpd585SNzHZPcYowu/84Vz2a2g31TvPMTm9uTiCSWzaheQySUcSyUH/46fPnuPQWof2yd0pGBtzee/IQWw=="
     },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
@@ -407,127 +422,325 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.19.0.tgz",
+      "integrity": "sha512-JlPfZ/C7yn5S5p0yKk7uhHTTnFlvTgLetl2VxqE518QgyM7C9bSfFTYvB/Q/ftkq0RIPY4ySxTz+/wKJ/dXC0w==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.19.0.tgz",
+      "integrity": "sha512-RDxUSY8D1tWYfn00DDi5myxKgOk6RvWPxhmWexcICt/MEC6yEMr4HNCu1sXXYLw8iAsg0D44NuU+qNq7zVWCrw==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.19.0.tgz",
+      "integrity": "sha512-emvKHL4B15x6nlNTBMtIaC9tLPRpeA5jMvRLXVbl/W9Ie7HhkrE7KQjvgS9uxgatL1HmHWDXk5TTS4IaNJxbAA==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.19.0.tgz",
+      "integrity": "sha512-fO28cWA1dC57qCd+D0rfLC4VPbh6EOJXrreBmFLWPGI9dpMlER2YwSPZzSGfq11XgcEpPukPTfEVFtw2q2nYJg==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.19.0.tgz",
+      "integrity": "sha512-2Rn36Ubxdv32NUcfm0wB1tgKqkQuft00PtM23VqLuCUR4N5jcNWDoV5iBC9jeGdgS38WK66ElncprqgMUOyomw==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.19.0.tgz",
+      "integrity": "sha512-gJuzIVdq/X1ZA2bHeCGCISe0VWqCoNT8BvkQ+BfsixXwTOndhtLUpOg0A1Fcx/+eA6ei6rMBzlOz4JzmiDw7JQ==",
+      "cpu": [
+        "arm"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.19.0.tgz",
+      "integrity": "sha512-0EkX2HYPkSADo9cfeGFoQ7R0/wTKb7q6DdwI4Yn/ULFE1wuRRCHybxpl2goQrx4c/yzK3I8OlgtBu4xvted0ug==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.19.0.tgz",
+      "integrity": "sha512-GlIQRj9px52ISomIOEUq/IojLZqzkvRpdP3cLgIE1wUWaiU5Takwlzpz002q0Nxxr1y2ZgxC2obWxjr13lvxNQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.19.0.tgz",
+      "integrity": "sha512-N6cFJzssruDLUOKfEKeovCKiHcdwVYOT1Hs6dovDQ61+Y9n3Ek4zXvtghPPelt6U0AH4aDGnDLb83uiJMkWYzQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.19.0.tgz",
+      "integrity": "sha512-2DnD3mkS2uuam/alF+I7M84koGwvn3ZVD7uG+LEWpyzo/bq8+kKnus2EVCkcvh6PlNB8QPNFOz6fWd5N8o1CYg==",
+      "cpu": [
+        "riscv64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.19.0.tgz",
+      "integrity": "sha512-D6pkaF7OpE7lzlTOFCB2m3Ngzu2ykw40Nka9WmKGUOTS3xcIieHe82slQlNq69sVB04ch73thKYIWz/Ian8DUA==",
+      "cpu": [
+        "s390x"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.19.0.tgz",
+      "integrity": "sha512-HBndjQLP8OsdJNSxpNIN0einbDmRFg9+UQeZV1eiYupIRuZsDEoeGU43NQsS34Pp166DtwQOnpcbV/zQxM+rWA==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.19.0.tgz",
+      "integrity": "sha512-HxfbvfCKJe/RMYJJn0a12eiOI9OOtAUF4G6ozrFUK95BNyoJaSiBjIOHjZskTUffUrB84IPKkFG9H9nEvJGW6A==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.19.0.tgz",
+      "integrity": "sha512-HxDMKIhmcguGTiP5TsLNolwBUK3nGGUEoV/BO9ldUBoMLBssvh4J0X8pf11i1fTV7WShWItB1bKAKjX4RQeYmg==",
+      "cpu": [
+        "arm64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.19.0.tgz",
+      "integrity": "sha512-xItlIAZZaiG/u0wooGzRsx11rokP4qyc/79LkAOdznGRAbOFc+SfEdfUOszG1odsHNgwippUJavag/+W/Etc6Q==",
+      "cpu": [
+        "ia32"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.19.0.tgz",
+      "integrity": "sha512-xNo5fV5ycvCCKqiZcpB65VMR11NJB+StnxHz20jdqRAktfdfzhgjTiJ2doTDQE/7dqGaV5I7ZGqKpgph6lCIag==",
+      "cpu": [
+        "x64"
+      ],
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
+      "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
+      "devOptional": true
+    },
     "node_modules/@vitejs/plugin-vue": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-4.6.2.tgz",
-      "integrity": "sha512-kqf7SGFoG+80aZG6Pf+gsZIVvGSCKE98JbiWqcCV9cThtg91Jav0yvYFC9Zb+jKetNGF6ZKeoaxgZfND21fWKw==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.1.0.tgz",
+      "integrity": "sha512-QMRxARyrdiwi1mj3AW4fLByoHTavreXq0itdEW696EihXglf1MB3D4C2gBvE0jMPH29ZjC3iK8aIaUMLf4EOGA==",
       "dev": true,
       "engines": {
-        "node": "^14.18.0 || >=16.0.0"
+        "node": "^18.0.0 || >=20.0.0"
       },
       "peerDependencies": {
-        "vite": "^4.0.0 || ^5.0.0",
+        "vite": "^5.0.0",
         "vue": "^3.2.25"
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.27.tgz",
-      "integrity": "sha512-E+RyqY24KnyDXsCuQrI+mlcdW3ALND6U7Gqa/+bVwbcpcR3BRRIckFoz7Qyd4TTlnugtwuI7YgjbvsLmxb+yvg==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.34.tgz",
+      "integrity": "sha512-Z0izUf32+wAnQewjHu+pQf1yw00EGOmevl1kE+ljjjMe7oEfpQ+BI3/JNK7yMB4IrUsqLDmPecUrpj3mCP+yJQ==",
       "dependencies": {
-        "@babel/parser": "^7.24.4",
-        "@vue/shared": "3.4.27",
+        "@babel/parser": "^7.24.7",
+        "@vue/shared": "3.4.34",
         "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.0"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.27.tgz",
-      "integrity": "sha512-kUTvochG/oVgE1w5ViSr3KUBh9X7CWirebA3bezTbB5ZKBQZwR2Mwj9uoSKRMFcz4gSMzzLXBPD6KpCLb9nvWw==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.34.tgz",
+      "integrity": "sha512-3PUOTS1h5cskdOJMExCu2TInXuM0j60DRPpSCJDqOCupCfUZCJoyQmKtRmA8EgDNZ5kcEE7vketamRZfrEuVDw==",
       "dependencies": {
-        "@vue/compiler-core": "3.4.27",
-        "@vue/shared": "3.4.27"
+        "@vue/compiler-core": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.27.tgz",
-      "integrity": "sha512-nDwntUEADssW8e0rrmE0+OrONwmRlegDA1pD6QhVeXxjIytV03yDqTey9SBDiALsvAd5U4ZrEKbMyVXhX6mCGA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.34.tgz",
+      "integrity": "sha512-x6lm0UrM03jjDXTPZgD9Ad8bIVD1ifWNit2EaWQIZB5CULr46+FbLQ5RpK7AXtDHGjx9rmvC7QRCTjsiGkAwRw==",
       "dependencies": {
-        "@babel/parser": "^7.24.4",
-        "@vue/compiler-core": "3.4.27",
-        "@vue/compiler-dom": "3.4.27",
-        "@vue/compiler-ssr": "3.4.27",
-        "@vue/shared": "3.4.27",
+        "@babel/parser": "^7.24.7",
+        "@vue/compiler-core": "3.4.34",
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/compiler-ssr": "3.4.34",
+        "@vue/shared": "3.4.34",
         "estree-walker": "^2.0.2",
         "magic-string": "^0.30.10",
-        "postcss": "^8.4.38",
+        "postcss": "^8.4.39",
         "source-map-js": "^1.2.0"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.27.tgz",
-      "integrity": "sha512-CVRzSJIltzMG5FcidsW0jKNQnNRYC8bT21VegyMMtHmhW3UOI7knmUehzswXLrExDLE6lQCZdrhD4ogI7c+vuw==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.34.tgz",
+      "integrity": "sha512-8TDBcLaTrFm5rnF+Qm4BlliaopJgqJ28Nsrc80qazynm5aJO+Emu7y0RWw34L8dNnTRdcVBpWzJxhGYzsoVu4g==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.27",
-        "@vue/shared": "3.4.27"
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.27.tgz",
-      "integrity": "sha512-kK0g4NknW6JX2yySLpsm2jlunZJl2/RJGZ0H9ddHdfBVHcNzxmQ0sS0b09ipmBoQpY8JM2KmUw+a6sO8Zo+zIA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.34.tgz",
+      "integrity": "sha512-ua+Lo+wBRlBEX9TtgPOShE2JwIO7p6BTZ7t1KZVPoaBRfqbC7N3c8Mpzicx173fXxx5VXeU6ykiHo7WgLzJQDA==",
       "dependencies": {
-        "@vue/shared": "3.4.27"
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.27.tgz",
-      "integrity": "sha512-7aYA9GEbOOdviqVvcuweTLe5Za4qBZkUY7SvET6vE8kyypxVgaT1ixHLg4urtOlrApdgcdgHoTZCUuTGap/5WA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.34.tgz",
+      "integrity": "sha512-PXhkiRPwcPGJ1BnyBZFI96GfInCVskd0HPNIAZn7i3YOmLbtbTZpB7/kDTwC1W7IqdGPkTVC63IS7J2nZs4Ebg==",
       "dependencies": {
-        "@vue/reactivity": "3.4.27",
-        "@vue/shared": "3.4.27"
+        "@vue/reactivity": "3.4.34",
+        "@vue/shared": "3.4.34"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.27.tgz",
-      "integrity": "sha512-ScOmP70/3NPM+TW9hvVAz6VWWtZJqkbdf7w6ySsws+EsqtHvkhxaWLecrTorFxsawelM5Ys9FnDEMt6BPBDS0Q==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.34.tgz",
+      "integrity": "sha512-dXqIe+RqFAK2Euak4UsvbIupalrhc67OuQKpD7HJ3W2fv8jlqvI7szfBCsAEcE8o/wyNpkloxB6J8viuF/E3gw==",
       "dependencies": {
-        "@vue/runtime-core": "3.4.27",
-        "@vue/shared": "3.4.27",
+        "@vue/reactivity": "3.4.34",
+        "@vue/runtime-core": "3.4.34",
+        "@vue/shared": "3.4.34",
         "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.27.tgz",
-      "integrity": "sha512-dlAMEuvmeA3rJsOMJ2J1kXU7o7pOxgsNHVr9K8hB3ImIkSuBrIdy0vF66h8gf8Tuinf1TK3mPAz2+2sqyf3KzA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.34.tgz",
+      "integrity": "sha512-GeyEUfMVRZMD/mZcNONEqg7MiU10QQ1DB3O/Qr6+8uXpbwdlmVgQ5Qs1/ZUAFX1X2UUtqMoGrDRbxdWfOJFT7Q==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.4.27",
-        "@vue/shared": "3.4.27"
+        "@vue/compiler-ssr": "3.4.34",
+        "@vue/shared": "3.4.34"
       },
       "peerDependencies": {
-        "vue": "3.4.27"
+        "vue": "3.4.34"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.27.tgz",
-      "integrity": "sha512-DL3NmY2OFlqmYYrzp39yi3LDkKxa5vZVwxWdQ3rG0ekuWscHraeIbnI8t+aZK7qhYqEqWKTUdijadunb9pnrgA=="
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.34.tgz",
+      "integrity": "sha512-x5LmiRLpRsd9KTjAB8MPKf0CDPMcuItjP0gbNqFCIgL1I8iYp4zglhj9w9FPCdIbHG2M91RVeIbArFfFTz9I3A=="
     },
     "node_modules/@vuetify/loader-shared": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/@vuetify/loader-shared/-/loader-shared-1.7.1.tgz",
-      "integrity": "sha512-kLUvuAed6RCvkeeTNJzuy14pqnkur8lTuner7v7pNE/kVhPR97TuyXwBSBMR1cJeiLiOfu6SF5XlCYbXByEx1g==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@vuetify/loader-shared/-/loader-shared-2.0.3.tgz",
+      "integrity": "sha512-Ss3GC7eJYkp2SF6xVzsT7FAruEmdihmn4OCk2+UocREerlXKWgOKKzTN5PN3ZVN5q05jHHrsNhTuWbhN61Bpdg==",
       "devOptional": true,
       "dependencies": {
-        "find-cache-dir": "^3.3.2",
         "upath": "^2.0.1"
       },
       "peerDependencies": {
         "vue": "^3.0.0",
-        "vuetify": "^3.0.0-beta.4"
+        "vuetify": "^3.0.0"
       }
     },
     "node_modules/acorn": {
-      "version": "8.11.3",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
-      "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
+      "version": "8.12.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
+      "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "dev": true,
       "bin": {
         "acorn": "bin/acorn"
@@ -623,12 +836,6 @@
         "node": ">= 0.8"
       }
     },
-    "node_modules/commondir": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
-      "integrity": "sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==",
-      "devOptional": true
-    },
     "node_modules/csstype": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
@@ -671,9 +878,9 @@
       }
     },
     "node_modules/esbuild": {
-      "version": "0.18.20",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.18.20.tgz",
-      "integrity": "sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==",
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
+      "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==",
       "devOptional": true,
       "hasInstallScript": true,
       "bin": {
@@ -683,28 +890,29 @@
         "node": ">=12"
       },
       "optionalDependencies": {
-        "@esbuild/android-arm": "0.18.20",
-        "@esbuild/android-arm64": "0.18.20",
-        "@esbuild/android-x64": "0.18.20",
-        "@esbuild/darwin-arm64": "0.18.20",
-        "@esbuild/darwin-x64": "0.18.20",
-        "@esbuild/freebsd-arm64": "0.18.20",
-        "@esbuild/freebsd-x64": "0.18.20",
-        "@esbuild/linux-arm": "0.18.20",
-        "@esbuild/linux-arm64": "0.18.20",
-        "@esbuild/linux-ia32": "0.18.20",
-        "@esbuild/linux-loong64": "0.18.20",
-        "@esbuild/linux-mips64el": "0.18.20",
-        "@esbuild/linux-ppc64": "0.18.20",
-        "@esbuild/linux-riscv64": "0.18.20",
-        "@esbuild/linux-s390x": "0.18.20",
-        "@esbuild/linux-x64": "0.18.20",
-        "@esbuild/netbsd-x64": "0.18.20",
-        "@esbuild/openbsd-x64": "0.18.20",
-        "@esbuild/sunos-x64": "0.18.20",
-        "@esbuild/win32-arm64": "0.18.20",
-        "@esbuild/win32-ia32": "0.18.20",
-        "@esbuild/win32-x64": "0.18.20"
+        "@esbuild/aix-ppc64": "0.21.5",
+        "@esbuild/android-arm": "0.21.5",
+        "@esbuild/android-arm64": "0.21.5",
+        "@esbuild/android-x64": "0.21.5",
+        "@esbuild/darwin-arm64": "0.21.5",
+        "@esbuild/darwin-x64": "0.21.5",
+        "@esbuild/freebsd-arm64": "0.21.5",
+        "@esbuild/freebsd-x64": "0.21.5",
+        "@esbuild/linux-arm": "0.21.5",
+        "@esbuild/linux-arm64": "0.21.5",
+        "@esbuild/linux-ia32": "0.21.5",
+        "@esbuild/linux-loong64": "0.21.5",
+        "@esbuild/linux-mips64el": "0.21.5",
+        "@esbuild/linux-ppc64": "0.21.5",
+        "@esbuild/linux-riscv64": "0.21.5",
+        "@esbuild/linux-s390x": "0.21.5",
+        "@esbuild/linux-x64": "0.21.5",
+        "@esbuild/netbsd-x64": "0.21.5",
+        "@esbuild/openbsd-x64": "0.21.5",
+        "@esbuild/sunos-x64": "0.21.5",
+        "@esbuild/win32-arm64": "0.21.5",
+        "@esbuild/win32-ia32": "0.21.5",
+        "@esbuild/win32-x64": "0.21.5"
       }
     },
     "node_modules/estree-walker": {
@@ -749,36 +957,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/find-cache-dir": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/find-cache-dir/-/find-cache-dir-3.3.2.tgz",
-      "integrity": "sha512-wXZV5emFEjrridIgED11OoUKLxiYjAcqot/NJdAkOhlJ+vGzwhOAfcG5OX1jP+S0PcjEn8bdMJv+g2jwQ3Onig==",
-      "devOptional": true,
-      "dependencies": {
-        "commondir": "^1.0.1",
-        "make-dir": "^3.0.2",
-        "pkg-dir": "^4.1.0"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/avajs/find-cache-dir?sponsor=1"
-      }
-    },
-    "node_modules/find-up": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
-      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
-      "devOptional": true,
-      "dependencies": {
-        "locate-path": "^5.0.0",
-        "path-exists": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/follow-redirects": {
       "version": "1.15.6",
       "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
@@ -878,18 +1056,6 @@
         "node": ">=0.12.0"
       }
     },
-    "node_modules/locate-path": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
-      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
-      "devOptional": true,
-      "dependencies": {
-        "p-locate": "^4.1.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/magic-string": {
       "version": "0.30.10",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
@@ -898,21 +1064,6 @@
         "@jridgewell/sourcemap-codec": "^1.4.15"
       }
     },
-    "node_modules/make-dir": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
-      "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
-      "devOptional": true,
-      "dependencies": {
-        "semver": "^6.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -986,51 +1137,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/p-limit": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
-      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
-      "devOptional": true,
-      "dependencies": {
-        "p-try": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/p-locate": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
-      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
-      "devOptional": true,
-      "dependencies": {
-        "p-limit": "^2.2.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/p-try": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
-      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
-      "devOptional": true,
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/path-exists": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
-      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
-      "devOptional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/picocolors": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
@@ -1048,22 +1154,10 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "node_modules/pkg-dir": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
-      "integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==",
-      "devOptional": true,
-      "dependencies": {
-        "find-up": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/postcss": {
-      "version": "8.4.38",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
-      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
+      "version": "8.4.39",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.39.tgz",
+      "integrity": "sha512-0vzE+lAiG7hZl1/9I8yzKLx3aR9Xbof3fBHKunvMfOCYAtMhrsnccJY2iTURb9EZd5+pLuiNV9/c/GZJOHsgIw==",
       "funding": [
         {
           "type": "opencollective",
@@ -1080,7 +1174,7 @@
       ],
       "dependencies": {
         "nanoid": "^3.3.7",
-        "picocolors": "^1.0.0",
+        "picocolors": "^1.0.1",
         "source-map-js": "^1.2.0"
       },
       "engines": {
@@ -1135,18 +1229,37 @@
       }
     },
     "node_modules/rollup": {
-      "version": "3.29.4",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz",
-      "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==",
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.19.0.tgz",
+      "integrity": "sha512-5r7EYSQIowHsK4eTZ0Y81qpZuJz+MUuYeqmmYmRMl1nwhdmbiYqt5jwzf6u7wyOzJgYqtCRMtVRKOtHANBz7rA==",
       "devOptional": true,
+      "dependencies": {
+        "@types/estree": "1.0.5"
+      },
       "bin": {
         "rollup": "dist/bin/rollup"
       },
       "engines": {
-        "node": ">=14.18.0",
+        "node": ">=18.0.0",
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.19.0",
+        "@rollup/rollup-android-arm64": "4.19.0",
+        "@rollup/rollup-darwin-arm64": "4.19.0",
+        "@rollup/rollup-darwin-x64": "4.19.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.19.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.19.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.19.0",
+        "@rollup/rollup-linux-arm64-musl": "4.19.0",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.19.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.19.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.19.0",
+        "@rollup/rollup-linux-x64-gnu": "4.19.0",
+        "@rollup/rollup-linux-x64-musl": "4.19.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.19.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.19.0",
+        "@rollup/rollup-win32-x64-msvc": "4.19.0",
         "fsevents": "~2.3.2"
       }
     },
@@ -1173,15 +1286,6 @@
         "queue-microtask": "^1.2.2"
       }
     },
-    "node_modules/semver": {
-      "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
-      "devOptional": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      }
-    },
     "node_modules/source-map-js": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
@@ -1214,15 +1318,15 @@
       }
     },
     "node_modules/unplugin": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.10.1.tgz",
-      "integrity": "sha512-d6Mhq8RJeGA8UfKCu54Um4lFA0eSaRa3XxdAJg8tIdxbu1ubW0hBCZUL7yI2uGyYCRndvbK8FLHzqy2XKfeMsg==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/unplugin/-/unplugin-1.12.0.tgz",
+      "integrity": "sha512-KeczzHl2sATPQUx1gzo+EnUkmN4VmGBYRRVOZSGvGITE9rGHRDGqft6ONceP3vgXcyJ2XjX5axG5jMWUwNCYLw==",
       "dev": true,
       "dependencies": {
-        "acorn": "^8.11.3",
+        "acorn": "^8.12.1",
         "chokidar": "^3.6.0",
         "webpack-sources": "^3.2.3",
-        "webpack-virtual-modules": "^0.6.1"
+        "webpack-virtual-modules": "^0.6.2"
       },
       "engines": {
         "node": ">=14.0.0"
@@ -1258,29 +1362,29 @@
       }
     },
     "node_modules/vite": {
-      "version": "4.5.3",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
-      "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
+      "version": "5.3.4",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.3.4.tgz",
+      "integrity": "sha512-Cw+7zL3ZG9/NZBB8C+8QbQZmR54GwqIz+WMI4b3JgdYJvX+ny9AjJXqkGQlDXSXRP9rP0B4tbciRMOVEKulVOA==",
       "devOptional": true,
       "dependencies": {
-        "esbuild": "^0.18.10",
-        "postcss": "^8.4.27",
-        "rollup": "^3.27.1"
+        "esbuild": "^0.21.3",
+        "postcss": "^8.4.39",
+        "rollup": "^4.13.0"
       },
       "bin": {
         "vite": "bin/vite.js"
       },
       "engines": {
-        "node": "^14.18.0 || >=16.0.0"
+        "node": "^18.0.0 || >=20.0.0"
       },
       "funding": {
         "url": "https://github.com/vitejs/vite?sponsor=1"
       },
       "optionalDependencies": {
-        "fsevents": "~2.3.2"
+        "fsevents": "~2.3.3"
       },
       "peerDependencies": {
-        "@types/node": ">= 14",
+        "@types/node": "^18.0.0 || >=20.0.0",
         "less": "*",
         "lightningcss": "^1.21.0",
         "sass": "*",
@@ -1313,33 +1417,34 @@
       }
     },
     "node_modules/vite-plugin-vuetify": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/vite-plugin-vuetify/-/vite-plugin-vuetify-1.0.2.tgz",
-      "integrity": "sha512-MubIcKD33O8wtgQXlbEXE7ccTEpHZ8nPpe77y9Wy3my2MWw/PgehP9VqTp92BLqr0R1dSL970Lynvisx3UxBFw==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/vite-plugin-vuetify/-/vite-plugin-vuetify-2.0.3.tgz",
+      "integrity": "sha512-HbYajgGgb/noaVKNRhnnXIiQZrNXfNIeanUGAwXgOxL6h/KULS40Uf51Kyz8hNmdegF+DwjgXXI/8J1PNS83xw==",
       "devOptional": true,
       "dependencies": {
-        "@vuetify/loader-shared": "^1.7.1",
+        "@vuetify/loader-shared": "^2.0.3",
         "debug": "^4.3.3",
         "upath": "^2.0.1"
       },
       "engines": {
-        "node": ">=12"
+        "node": "^18.0.0 || >=20.0.0"
       },
       "peerDependencies": {
-        "vite": "^2.7.0 || ^3.0.0 || ^4.0.0",
-        "vuetify": "^3.0.0-beta.4"
+        "vite": ">=5",
+        "vue": "^3.0.0",
+        "vuetify": "^3.0.0"
       }
     },
     "node_modules/vue": {
-      "version": "3.4.27",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.27.tgz",
-      "integrity": "sha512-8s/56uK6r01r1icG/aEOHqyMVxd1bkYcSe9j8HcKtr/xTOFWvnzIVTehNW+5Yt89f+DLBe4A569pnZLS5HzAMA==",
+      "version": "3.4.34",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.34.tgz",
+      "integrity": "sha512-VZze05HWlA3ItreQ/ka7Sx7PoD0/3St8FEiSlSTVgb6l4hL+RjtP2/8g5WQBzZgyf8WG2f+g1bXzC7zggLhAJA==",
       "dependencies": {
-        "@vue/compiler-dom": "3.4.27",
-        "@vue/compiler-sfc": "3.4.27",
-        "@vue/runtime-dom": "3.4.27",
-        "@vue/server-renderer": "3.4.27",
-        "@vue/shared": "3.4.27"
+        "@vue/compiler-dom": "3.4.34",
+        "@vue/compiler-sfc": "3.4.34",
+        "@vue/runtime-dom": "3.4.34",
+        "@vue/server-renderer": "3.4.34",
+        "@vue/shared": "3.4.34"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -1351,9 +1456,9 @@
       }
     },
     "node_modules/vuetify": {
-      "version": "3.6.9",
-      "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.6.9.tgz",
-      "integrity": "sha512-LVIZL0OCwzg3Aw2F8nT1rK/renpTPOcDEPe5E002Vj+VjXwsCNqwwxNteGfrcNlp0vgIJ8WusMvaxp69UJ3NJg==",
+      "version": "3.6.13",
+      "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.6.13.tgz",
+      "integrity": "sha512-Gz7jxXAkmff2m6CM0EUWOo/72TM322/3I6aDna++k1nPOW1/hNx4td1MZG4u75fzdn3r+uIe0dbF7SWuhu6DWA==",
       "engines": {
         "node": "^12.20 || >=14.13"
       },
diff --git a/web/package.json b/web/package.json
index 69901d572..d35398a1f 100644
--- a/web/package.json
+++ b/web/package.json
@@ -7,16 +7,16 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@mdi/font": "7.0.96",
-    "axios": "^1.6.5",
+    "@mdi/font": "7.4.47",
+    "axios": "^1.7.2",
     "streamsaver": "^2.0.6",
-    "vue": "^3.2.0",
-    "vuetify": "^3.0.0"
+    "vue": "^3.4.34",
+    "vuetify": "^3.6.13"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^4.0.0",
-    "unplugin-fonts": "^1.0.3",
-    "vite": "^4.5.3",
-    "vite-plugin-vuetify": "^1.0.0"
+    "@vitejs/plugin-vue": "^5.1.0",
+    "unplugin-fonts": "^1.1.1",
+    "vite": "^5.3.4",
+    "vite-plugin-vuetify": "^2.0.3"
   }
-}
+}
\ No newline at end of file
diff --git a/web/src/App.vue b/web/src/App.vue
index 0945dc4ea..fe4d758e1 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -44,9 +44,12 @@ limitations under the License.
             <v-card rounded v-if="Object.keys(taskDetails).length">
               <task-details :taskDetails="taskDetails"></task-details>
             </v-card>
+            <v-card rounded v-else-if="Object.keys(requestDetails).length">
+              <request-details :requestDetails="requestDetails"></request-details>
+            </v-card>
             <v-card rounded v-else>
-              <v-card-title> Task Details </v-card-title>
-              <v-card-subtitle> No Task Selected. Please click on a Task ID to see its details. </v-card-subtitle>
+              <v-card-title> Request or Task Details </v-card-title>
+              <v-card-subtitle> Please click on a Request ID or Task ID to see its details. </v-card-subtitle>
             </v-card>
           </v-col>
         </v-row>
@@ -57,6 +60,7 @@ limitations under the License.
 
 <script>
 import RequestList from './components/RequestList.vue'
+import RequestDetails from './components/RequestDetails.vue';
 import TaskDetails from './components/TaskDetails.vue'
 import ApiClient from './utils/RestApiClient.js'
 
@@ -70,15 +74,17 @@ export function truncate(text, length, suffix) {
 
 export default {
   name: 'app',
-  components: { RequestList, TaskDetails },
+  components: { RequestList, RequestDetails, TaskDetails },
   provide() {
     return {
       getTaskDetails: this.getTaskDetails,
+      getRequestDetails: this.getRequestDetails,
     }
   },
   data() {
     return {
       taskDetails: {},
+      requestDetails: {},
     }
   },
   methods: {
@@ -86,6 +92,17 @@ export default {
       ApiClient.getTaskDetails(task_id)
         .then((response) => {
           this.taskDetails = response.data
+          this.requestDetails = {}
+        })
+        .catch((e) => {
+          console.error(e)
+        })
+    },
+    getRequestDetails: function (request_id) {
+      ApiClient.getRequestDetails(request_id)
+        .then((response) => {
+          this.requestDetails = response.data
+          this.taskDetails = {}
         })
         .catch((e) => {
           console.error(e)
@@ -112,4 +129,11 @@ body {
   overflow: auto;
   font-family: 'Roboto';
 }
+
+.v-table__wrapper {
+  overflow: hidden;
+  word-break: break-all;
+  text-overflow: ellipsis
+}
+
 </style>
diff --git a/web/src/components/RequestDetails.vue b/web/src/components/RequestDetails.vue
new file mode 100644
index 000000000..80c8b13c2
--- /dev/null
+++ b/web/src/components/RequestDetails.vue
@@ -0,0 +1,139 @@
+<!--
+Copyright 2024 Google Inc. All rights reserved.
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+    http://www.apache.org/licenses/LICENSE-2.0
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<template>
+    <div>
+      <v-card-title>
+          Request Details
+          <v-snackbar timeout="5000" color="primary" location="top" height="55">
+          Request output is <strong>downloading in the background</strong>, please wait
+          <v-progress-circular color="white" indeterminate></v-progress-circular>
+          <template v-slot:activator="{ props: snackbar }">
+            <v-tooltip top text="Download request output">
+              <template v-slot:activator="{ props: tooltip }">
+                <v-btn icon="mdi-folder-arrow-down-outline" variant="text" v-bind="mergeProps(snackbar, tooltip)"
+                  @click="getRequestOutput(requestDetails.request_id)">
+                </v-btn>
+              </template>
+            </v-tooltip>
+          </template>
+        </v-snackbar>
+      </v-card-title>
+      <v-alert v-if="requestDetails.status === 'success'" type="success" prominent>
+          Request <strong>{{ requestDetails.request_id }}</strong> completed successfully.
+      </v-alert>
+      <v-alert v-else-if="requestDetails.status === 'running'" type="info" prominent>
+          Request <strong>{{ requestDetails.request_id }}</strong> has <strong>{{ requestDetails.task_count - requestDetails.successful_tasks - requestDetails.failed_tasks }}</strong> Tasks remaining.
+      </v-alert>
+      <v-alert v-else-if="requestDetails.status === 'completed_with_errors'" type="warning" prominent>
+          Request <strong>{{ requestDetails.request_id }}</strong> completed with <strong>{{ requestDetails.failed_tasks }}</strong> failed Tasks.
+      </v-alert>
+      <v-alert v-else type="error" prominent>
+          Request <strong>{{ requestDetails.request_id }}</strong> was not successful.
+      </v-alert>
+      <v-card>
+          <v-list density="compact" v-model:opened="openGroups">
+            <v-list-group value="ids">
+              <template v-slot:activator="{ props }">
+                <v-list-item v-bind="props" title="Associated IDs"></v-list-item>
+              </template>
+              <v-list-item title="Request ID:">
+                  {{ requestDetails.request_id }}
+              </v-list-item>
+              <v-list-item title="Evidence ID:">
+                  {{ requestDetails.evidence_id }}
+              </v-list-item>
+              <v-list-item title="Reason:">
+                  {{ requestDetails.reason }}
+              </v-list-item>
+            </v-list-group>
+            <v-list-group value="details">
+              <template v-slot:activator="{ props }">
+                <v-list-item v-bind="props" title="Processing Details"></v-list-item>
+              </template>
+              <v-list-item title="Evidence Name:">
+                  {{ requestDetails.evidence_name }}
+              </v-list-item>
+              <v-list-item title="Last Update:">
+                  {{ requestDetails.last_task_update_time }}
+              </v-list-item>
+              <v-list-item title="Requester:">
+                  {{ requestDetails.requester }}
+              </v-list-item>
+              <v-list-item title="Status:">
+                  {{ requestDetails.status }}
+              </v-list-item>
+              <v-list-item title="Total:">
+                  {{ requestDetails.task_count }} Tasks
+              </v-list-item>
+              <v-list-item title="Running:">
+                  {{ requestDetails.running_tasks }} Tasks
+              </v-list-item>
+              <v-list-item title="Queued:">
+                  {{ requestDetails.queued_tasks }} Tasks
+              </v-list-item>
+              <v-list-item title="Successful:">
+                  {{ requestDetails.successful_tasks }} Tasks
+              </v-list-item>
+              <v-list-item title="Failed:">
+                  {{ requestDetails.failed_tasks }} Tasks
+              </v-list-item>
+            </v-list-group>
+          </v-list>
+      </v-card>
+    </div>
+  </template>
+  
+  <script>
+  import ApiClient from '../utils/RestApiClient.js'
+  import { mergeProps } from 'vue'
+
+  export default {
+    props: ['requestDetails'],
+    data() {
+      return {
+        openGroups: ['ids', 'details']
+      }
+    },
+    methods: {
+        mergeProps,
+        getRequestOutput: function (request_id) {
+          ApiClient.getRequestOutput(request_id)
+            .then(({ data }) => {
+              const downloadObj = window.URL.createObjectURL(new Blob([data]))
+              const link = document.createElement('a')
+              link.href = downloadObj
+              link.setAttribute('download', request_id + '.tgz')
+              document.body.appendChild(link)
+              link.click()
+              link.remove()
+            })
+            .catch((e) => {
+              console.error(e)
+            })
+        },
+    }
+  }
+  </script>
+  
+  <style scoped>
+  .v-list-item {
+    font-size: 12px;
+  }
+  
+  .v-list-item__action {
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index 965ddc618..389aedda8 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -13,27 +13,83 @@ limitations under the License.
 
 <template>
   <section>
-    <v-card>
-      <v-card-title>
-        Request List
-        <v-spacer></v-spacer>
-        <v-text-field v-model="search" append-icon="mdi-magnify" label="Search" single-line hide-details>
-          <template v-slot:append>
-            <v-tooltip right>
+    <template>
+      <div class="text-center pa-4">
+        <v-dialog v-model="openDialog" width="auto">
+          <v-card max-width="400" prepend-icon="mdi-filter-menu"
+            text="You may filter by Job Name either including or excluding Jobs."
+            title="Filter by Job Name">
+            <v-form @submit.prevent>
+              <v-radio-group v-model="radioFilter">
+                <v-radio label="Including Jobs" :value="true"></v-radio>
+                <v-radio label="Excluding Jobs" :value="false"></v-radio>
+              </v-radio-group>
+              <v-select clearable chips label="Select" :items="this.availableJobs" v-model="filterJobs" multiple></v-select>
+            </v-form>
+            <template v-slot:actions>
+              <v-btn type="submit" @click="filterSelectedJobs" class="ms-auto" text="Submit"></v-btn>
+              <v-btn type="close" text="Close" @click="openDialog = false"></v-btn>
+            </template>
+          </v-card>
+        </v-dialog>
+      </div>
+    </template>
+    <v-card title="Request List">
+      <template v-slot:append>
+        <v-tooltip right>
+          <template v-slot:activator="{ props }">
+            <v-btn icon="mdi-refresh" color="blue lighten-2" @click="getRequestList()" v-bind="props" class="justify-left">
+            </v-btn>
+          </template>
+          Refresh Request List
+        </v-tooltip>
+      </template>
+      <v-spacer></v-spacer>
+      <v-text-field v-model="search" append-icon="mdi-magnify" label="Search" single-line hide-details>
+        <template v-slot:append>
+          <v-chip-group v-model="filterChips" column multiple>
+            <v-tooltip location="top">
               <template v-slot:activator="{ props }">
-                <v-btn icon="mdi-refresh" color="blue lighten-2" @click="getRequestList()" v-bind="props"
-                  location="bottom">
-                </v-btn>
+                <v-chip v-bind="props" text="Running" filter @click="this.filterRunning = !this.filterRunning">
+                </v-chip>
               </template>
-              Refresh Request List
+              Filter by running or queued Tasks
             </v-tooltip>
-          </template>
-        </v-text-field>
-        <v-spacer></v-spacer>
-      </v-card-title>
+            <v-tooltip location="top">
+              <template v-slot:activator="{ props }">
+                <v-chip v-bind="props" text="Successful" filter @click="this.filterSuccess = !this.filterSuccess">
+                </v-chip>
+              </template>
+              Filter by successful Tasks
+            </v-tooltip>
+            <v-tooltip location="top">
+              <template v-slot:activator="{ props }">
+                <v-chip v-bind="props" text="Failed" filter @click="this.filterFailed = !this.filterFailed">
+                </v-chip> 
+              </template>
+              Filter by failed Tasks
+            </v-tooltip>
+          </v-chip-group>
+          <v-tooltip location="right">
+            <template v-slot:activator="{ props }">
+              <v-btn v-bind="props" variant="text" icon="mdi-filter" @click="openDialog = true"
+              selected-class="activated" :class="{ activated: jobFilterActive == true }">
+              </v-btn>
+            </template>
+            Filter by Job Name
+          </v-tooltip>
+        </template>
+      </v-text-field>
+      <v-spacer></v-spacer>
       <v-data-table :headers="headers" :items="requestSummary" :search="search" density="compact"
         item-value="request_id" :footer-props="{ itemsPerPageOptions: [10, 20, 40, -1] }" :loading="isLoading"
-        :sort-by="sortBy" show-expand hover>
+        :sort-by="sortBy" multi-sort show-expand hover>
+        <template v-slot:[`item.request_id`]="{ item }">
+          <v-btn variant="text" :ripple="true" :key="item.request_id" 
+          @click="getRequestDetails(item.request_id)">
+            {{ item.request_id }}
+          </v-btn>
+        </template>
         <template v-slot:[`item.status`]="{ item }">
           <div v-if="item.status === 'successful'">
             <v-tooltip text="Completed successfully">
@@ -70,25 +126,13 @@ limitations under the License.
         <template v-slot:expanded-row="{ columns, item }">
           <tr>
             <td :colspan="columns.length">
-              <task-list :request-id="item.request_id" :key="item.request_id"> </task-list>
+              <task-list :request-id="item.request_id" :key="item.request_id" 
+              :filterRunning="this.filterRunning" :filterFailed="this.filterFailed" 
+              :filterSuccess="this.filterSuccess" :filterJobs="this.filterJobs" :radioFilter="this.radioFilter"> 
+              </task-list>
             </td>
           </tr>
         </template>
-        <template v-slot:[`item.request_results`]="{ item }">
-          <v-snackbar timeout="5000" color="primary" location="top" height="55">
-            Request output is <strong>downloading in the background</strong>, please wait
-            <v-progress-circular color="white" indeterminate></v-progress-circular>
-            <template v-slot:activator="{ props: snackbar }">
-              <v-tooltip top text="Download request output">
-                <template v-slot:activator="{ props: tooltip }">
-                  <v-btn icon="mdi-folder-arrow-down-outline" variant="text" v-bind="mergeProps(snackbar, tooltip)"
-                    @click="getRequestOutput(item.request_id)">
-                  </v-btn>
-                </template>
-              </v-tooltip>
-            </template>
-          </v-snackbar>
-        </template>
       </v-data-table>
     </v-card>
   </section>
@@ -102,25 +146,36 @@ import { truncate } from '../App.vue'
 
 export default {
   components: { TaskList },
+  inject: ['getRequestDetails'],
+  provide() {
+    return {
+      selectActiveStatusReq: this.selectActiveStatusReq,
+    }
+  },
   data() {
     return {
       search: '',
       isLoading: false,
       headers: [
-        { title: 'Request', key: 'request_id' },
-        { title: 'Last Task Update Time', key: 'last_task_update_time', sortable: true },
-        { title: 'Evidence Name', key: 'evidence_name' },
-        { title: 'Requester', key: 'requester' },
-        { title: 'Reason', key: 'request_id_reason' },
-        { title: 'Total Tasks', key: 'total_tasks' },
-        { title: 'Running Tasks', key: 'running_tasks' },
-        { title: 'Successful Tasks', key: 'successful_tasks' },
-        { title: 'Failed Tasks', key: 'failed_tasks' },
-        { title: 'Status', key: 'status' },
-        { title: 'Results', key: 'request_results' },
+        { title: '', key: 'data-table-expand', width: '1%' },
+        { title: 'Request', key: 'request_id', width: '15%' },
+        { title: 'Last Task Update Time', key: 'last_task_update_time', width:'20%' },
+        { title: 'Evidence Name', key: 'evidence_name', width: '25%'},
+        { title: 'Requester', key: 'requester', width: '12%' },
+        { title: 'Reason', key: 'request_id_reason', width: '10%' },
+        { title: 'Status', key: 'status', width: '8%' },
       ],
       requestSummary: [],
       sortBy: [{ key: 'last_task_update_time', order: 'desc' }],
+      availableJobs: [],
+      filterChips: [],
+      filterJobs: [],
+      jobFilterActive: false,
+      filterRunning: false,
+      filterFailed: false,
+      filterSuccess: false,
+      openDialog: false,
+      radioFilter: true,
     }
   },
   methods: {
@@ -178,9 +233,30 @@ export default {
           console.error(e)
         })
     },
+   getAvailableJobs: function() {
+    ApiClient.getAvailableJobs()
+      .then((response) => {
+        let available = response.data
+        this.availableJobs = available.sort()
+      })
+      .catch((e) => {
+        console.error(e)
+      })
+   },
+   filterSelectedJobs: function() {
+    console.log(this.filterJobs)
+    console.log(this.radioFilter)
+    if (this.filterJobs.length > 0) {
+      this.jobFilterActive = true
+    } else {
+      this.jobFilterActive = false
+    }
+    this.openDialog = false
+   },
   },
   mounted() {
     this.getRequestList()
+    this.getAvailableJobs()
   },
 }
 </script>
diff --git a/web/src/components/TaskDetails.vue b/web/src/components/TaskDetails.vue
index 2a306361c..f5af86519 100644
--- a/web/src/components/TaskDetails.vue
+++ b/web/src/components/TaskDetails.vue
@@ -14,7 +14,7 @@ limitations under the License.
 <template>
   <div>
     <v-card-title>
-      {{ taskDetails.name }}
+      Task Details
       <v-snackbar timeout="5000" color="primary" location="top" height="55">
         Task output is <strong>downloading in the background</strong>, please wait
         <v-progress-circular color="white" indeterminate></v-progress-circular>
@@ -79,6 +79,18 @@ limitations under the License.
           <template v-slot:activator="{ props }">
             <v-list-item v-bind="props" title="Processing Details"></v-list-item>
           </template>
+          <v-list-item title="Task Name:">
+            <div v-if="taskDetails.name">
+              {{ taskDetails.name }}
+            </div>
+            <div v-else>N/A</div>
+          </v-list-item>
+          <v-list-item title="Job Name:">
+            <div v-if="taskDetails.job_name">
+              {{ taskDetails.job_name }}
+            </div>
+            <div v-else>N/A</div>
+          </v-list-item>
           <v-list-item title="Evidence Name:">
             <div v-if="taskDetails.evidence_name">
               {{ taskDetails.evidence_name }}
diff --git a/web/src/components/TaskList.vue b/web/src/components/TaskList.vue
index 66fb99971..8bdd2895d 100644
--- a/web/src/components/TaskList.vue
+++ b/web/src/components/TaskList.vue
@@ -14,7 +14,7 @@ limitations under the License.
 <template>
   <div>
     <v-list density="compact">
-      <v-virtual-scroll :items="taskList" :item-height="40" :height="400" :width="auto">
+      <v-virtual-scroll :items="taskList" :item-height="40" :height="400">
         <template v-slot:default="{ item }">
           <v-list-item :key="item.task_id" v-slot:prepend>
             <div v-if="item.task_success">
@@ -37,7 +37,7 @@ limitations under the License.
                 </v-btn>
               </v-list-item-action>
             </div>
-            <v-list-item>
+            <v-list-item :max-width="800">
               {{ item.task_name }} {{ $filters.truncate(item.task_status, 128, '...') }}
             </v-list-item>
           </v-list-item>
@@ -52,7 +52,7 @@ limitations under the License.
 import ApiClient from '../utils/RestApiClient.js'
 
 export default {
-  props: ['requestId'],
+  props: ['requestId', 'filterFailed', 'filterSuccess', 'filterRunning', 'filterJobs', 'radioFilter'],
   inject: ['getTaskDetails'],
   data() {
     return {
@@ -72,15 +72,46 @@ export default {
           let data = response.data['tasks']
           for (const task in data) {
             let task_dict = data[task]
-            taskList.push({
-              task_name: task_dict.name,
-              task_id: task_dict.id,
-              task_status: task_dict.status,
-              task_success: task_dict.successful,
-              evidence_name: task_dict.evidence_name,
-              evidence_id: task_dict.evidence_id,
-              evidence_size: task_dict.evidence_size,
-            })
+            let taskStatusTemp = task_dict.status
+            // As queued status requests show as null
+            if (taskStatusTemp === null) {
+              taskStatusTemp = 'queued'
+            }
+            if (this.filterJobs.length > 0) {
+              let jobName = task_dict.job_name.toLowerCase()
+              console.log(this.radioFilter)
+              if ( this.radioFilter && !this.filterJobs.includes(jobName)) {
+                continue;
+              } else if ( !this.radioFilter && this.filterJobs.includes(jobName)) {
+                continue
+              }
+            }
+            let taskListTemp = {
+                job_name: task_dict.job_name,
+                task_name: task_dict.name,
+                task_id: task_dict.id,
+                task_status: taskStatusTemp,
+                task_success: task_dict.successful,
+                evidence_name: task_dict.evidence_name,
+                evidence_id: task_dict.evidence_id,
+                evidence_size: task_dict.evidence_size,
+              }
+            // When Failed filter chip is applied
+            if (task_dict.successful === false && this.filterFailed) {
+              taskList.push(taskListTemp)
+            }
+            // When Success filter chip is applied
+            if (task_dict.successful && this.filterSuccess) {
+              taskList.push(taskListTemp)
+            }
+            // When Running filter chip is applied
+            if (task_dict.successful === null && this.filterRunning) {
+              taskList.push(taskListTemp)
+            }
+            // When no filter chip is applied
+            if (!this.filterRunning && !this.filterSuccess && !this.filterFailed) {
+              taskList.push(taskListTemp)
+            }
           }
           this.taskList = taskList
         })
diff --git a/web/src/utils/RestApiClient.js b/web/src/utils/RestApiClient.js
index 97057b11b..f19022350 100644
--- a/web/src/utils/RestApiClient.js
+++ b/web/src/utils/RestApiClient.js
@@ -32,6 +32,11 @@ export default {
     return RestApiClient.get('/api/request/summary')
   },
 
+  // Request Details
+  getRequestDetails(request_id) {
+    return RestApiClient.get('/api/request/' + request_id)
+  },
+
   // Request Output
   getRequestOutput(request_id) {
     return RestApiClient.get('/api/result/request/' + request_id, { responseType: 'blob' })
@@ -51,4 +56,9 @@ export default {
   getTaskOutput(task_id) {
     return RestApiClient.get('/api/result/task/' + task_id, { responseType: 'blob' })
   },
+
+  // Jobs List
+  getAvailableJobs() {
+    return RestApiClient.get('/api/jobs/')
+  },
 }
diff --git a/web/vite.config.js b/web/vite.config.js
index aef2b7373..a6c771a9b 100644
--- a/web/vite.config.js
+++ b/web/vite.config.js
@@ -35,7 +35,7 @@ export default defineConfig({
   server: {
     port: 3000,
     proxy: {
-      '/web': {
+      '/api': {
         target: 'http://localhost:8000',
         changeOrigin: true,
       },

From f73f8374bd4dbf90dbf9400f70f094b6a5546f9c Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Fri, 26 Jul 2024 21:19:39 +0000
Subject: [PATCH 2/6] yapf fixes

---
 turbinia/workers/__init__.py | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/turbinia/workers/__init__.py b/turbinia/workers/__init__.py
index 2cbd8bd72..f9de035bc 100644
--- a/turbinia/workers/__init__.py
+++ b/turbinia/workers/__init__.py
@@ -452,9 +452,9 @@ class TurbiniaTask:
 
   # The list of attributes that we will persist into storage
   STORED_ATTRIBUTES = [
-      'id', 'job_id', 'job_name', 'start_time', 'last_update', 'name', 'evidence_name',
-      'evidence_id', 'request_id', 'requester', 'group_name', 'reason',
-      'group_id'
+      'id', 'job_id', 'job_name', 'start_time', 'last_update', 'name',
+      'evidence_name', 'evidence_id', 'request_id', 'requester', 'group_name',
+      'reason', 'group_id'
   ]
 
   # The list of evidence states that are required by a Task in order to run.

From d8c6c1aee711ab9f81a443b430b6d45f07486de8 Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Mon, 29 Jul 2024 17:05:38 +0000
Subject: [PATCH 3/6] Sort by task name

---
 web/src/components/RequestList.vue | 2 --
 web/src/components/TaskList.vue    | 2 ++
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index 389aedda8..1bd5e75f1 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -244,8 +244,6 @@ export default {
       })
    },
    filterSelectedJobs: function() {
-    console.log(this.filterJobs)
-    console.log(this.radioFilter)
     if (this.filterJobs.length > 0) {
       this.jobFilterActive = true
     } else {
diff --git a/web/src/components/TaskList.vue b/web/src/components/TaskList.vue
index 8bdd2895d..422ce4102 100644
--- a/web/src/components/TaskList.vue
+++ b/web/src/components/TaskList.vue
@@ -113,6 +113,8 @@ export default {
               taskList.push(taskListTemp)
             }
           }
+          // Sort by task name
+          taskList = taskList.sort((a, b) => (a.task_name > b.task_name ? 1 : -1))
           this.taskList = taskList
         })
         .catch((e) => {

From 9dae84eff4da70b4082e9df62bb2fc0135291302 Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Mon, 29 Jul 2024 23:19:17 +0000
Subject: [PATCH 4/6] Fix row select between request id and task id, as well as
 dynamic filter updating

---
 web/src/components/RequestList.vue | 24 +++++++++++++++++++-----
 web/src/components/TaskList.vue    | 18 ++++++++----------
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index 1bd5e75f1..c85be7b31 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -86,7 +86,8 @@ limitations under the License.
         :sort-by="sortBy" multi-sort show-expand hover>
         <template v-slot:[`item.request_id`]="{ item }">
           <v-btn variant="text" :ripple="true" :key="item.request_id" 
-          @click="getRequestDetails(item.request_id)">
+          @click="getRequestDetails(item.request_id) + selectActiveRow(item.request_id)"
+          selected-class="activated" :class="{ activated: isActiveRow == item.request_id }">
             {{ item.request_id }}
           </v-btn>
         </template>
@@ -126,9 +127,9 @@ limitations under the License.
         <template v-slot:expanded-row="{ columns, item }">
           <tr>
             <td :colspan="columns.length">
-              <task-list :request-id="item.request_id" :key="item.request_id" 
-              :filterRunning="this.filterRunning" :filterFailed="this.filterFailed" 
-              :filterSuccess="this.filterSuccess" :filterJobs="this.filterJobs" :radioFilter="this.radioFilter"> 
+              <task-list :request-id="item.request_id" :key="this.filterJobs + this.filterRunning + this.filterFailed + this.filterSuccess"
+              :filterRunning="this.filterRunning" :filterFailed="this.filterFailed" :filterSuccess="this.filterSuccess" :filterJobs="this.filterJobs" 
+              :radioFilter="this.radioFilter" :isActiveRow="this.isActiveRow"> 
               </task-list>
             </td>
           </tr>
@@ -149,7 +150,7 @@ export default {
   inject: ['getRequestDetails'],
   provide() {
     return {
-      selectActiveStatusReq: this.selectActiveStatusReq,
+      selectActiveRow: this.selectActiveRow,
     }
   },
   data() {
@@ -176,6 +177,7 @@ export default {
       filterSuccess: false,
       openDialog: false,
       radioFilter: true,
+      isActiveRow: null,
     }
   },
   methods: {
@@ -251,6 +253,10 @@ export default {
     }
     this.openDialog = false
    },
+   selectActiveRow: function(id) {
+    // Accepts Request ID or Task ID
+    this.isActiveRow = id
+   }
   },
   mounted() {
     this.getRequestList()
@@ -258,3 +264,11 @@ export default {
   },
 }
 </script>
+
+<style scoped>
+
+.activated {
+  background-color: rgba(128, 128, 128, 0.4);
+}
+
+</style>
\ No newline at end of file
diff --git a/web/src/components/TaskList.vue b/web/src/components/TaskList.vue
index 422ce4102..11d547967 100644
--- a/web/src/components/TaskList.vue
+++ b/web/src/components/TaskList.vue
@@ -14,7 +14,10 @@ limitations under the License.
 <template>
   <div>
     <v-list density="compact">
-      <v-virtual-scroll :items="taskList" :item-height="40" :height="400">
+      <v-empty-state v-if="taskList.length === 0"
+        text="No Tasks are available. Try adjusting your filters."
+      </v-empty-state>
+      <v-virtual-scroll :items="taskList" :item-height="40" :height="400" v-else>
         <template v-slot:default="{ item }">
           <v-list-item :key="item.task_id" v-slot:prepend>
             <div v-if="item.task_success">
@@ -31,8 +34,8 @@ limitations under the License.
             <div>
               <v-list-item-action>
                 <v-btn variant="text" :ripple="true" :key="item.task_id" selected-class="activated"
-                  :class="{ activated: isActive == item.task_id }"
-                  @click="getTaskDetails(item.task_id) + selectActiveStatus(item.task_id)">
+                  :class="{ activated: isActiveRow == item.task_id }"
+                  @click="getTaskDetails(item.task_id) + selectActiveRow(item.task_id)">
                   {{ item.task_id }}
                 </v-btn>
               </v-list-item-action>
@@ -52,8 +55,8 @@ limitations under the License.
 import ApiClient from '../utils/RestApiClient.js'
 
 export default {
-  props: ['requestId', 'filterFailed', 'filterSuccess', 'filterRunning', 'filterJobs', 'radioFilter'],
-  inject: ['getTaskDetails'],
+  props: ['requestId', 'filterFailed', 'filterSuccess', 'filterRunning', 'filterJobs', 'radioFilter', 'isActiveRow'],
+  inject: ['getTaskDetails', 'selectActiveRow'],
   data() {
     return {
       headers: [
@@ -61,7 +64,6 @@ export default {
         { text: 'Status', value: 'task_status' },
       ],
       taskList: [],
-      isActive: false,
     }
   },
   methods: {
@@ -79,7 +81,6 @@ export default {
             }
             if (this.filterJobs.length > 0) {
               let jobName = task_dict.job_name.toLowerCase()
-              console.log(this.radioFilter)
               if ( this.radioFilter && !this.filterJobs.includes(jobName)) {
                 continue;
               } else if ( !this.radioFilter && this.filterJobs.includes(jobName)) {
@@ -121,9 +122,6 @@ export default {
           console.error(e)
         })
     },
-    selectActiveStatus: function (task_id) {
-      this.isActive = task_id
-    },
   },
   created() {
     this.getTaskList(this.requestId)

From 302eaeca18737e4406c88873bdd7897e68e4cda3 Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Tue, 30 Jul 2024 17:02:56 +0000
Subject: [PATCH 5/6] Fix status spacing

---
 web/src/components/RequestList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index c85be7b31..194fabdf5 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -164,7 +164,7 @@ export default {
         { title: 'Evidence Name', key: 'evidence_name', width: '25%'},
         { title: 'Requester', key: 'requester', width: '12%' },
         { title: 'Reason', key: 'request_id_reason', width: '10%' },
-        { title: 'Status', key: 'status', width: '8%' },
+        { title: 'Status', key: 'status', width: '10%' },
       ],
       requestSummary: [],
       sortBy: [{ key: 'last_task_update_time', order: 'desc' }],

From fe4caada1e04106834bbe8c4d36a964719cfa03b Mon Sep 17 00:00:00 2001
From: wajihyassine <wajihyassine@gmail.com>
Date: Wed, 31 Jul 2024 16:11:16 +0000
Subject: [PATCH 6/6] Address review comments

---
 web/src/App.vue                       | 10 ++++++++--
 web/src/components/RequestDetails.vue |  2 +-
 web/src/components/RequestList.vue    |  2 +-
 web/src/components/TaskList.vue       |  6 +++---
 4 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/web/src/App.vue b/web/src/App.vue
index fe4d758e1..6bbbca105 100644
--- a/web/src/App.vue
+++ b/web/src/App.vue
@@ -101,7 +101,13 @@ export default {
     getRequestDetails: function (request_id) {
       ApiClient.getRequestDetails(request_id)
         .then((response) => {
-          this.requestDetails = response.data
+          let data = response.data
+          Object.keys(data).forEach(function(key) {
+            if(data[key] === "") {
+                data[key] = 'N/A';
+              }
+          })
+          this.requestDetails = data
           this.taskDetails = {}
         })
         .catch((e) => {
@@ -129,7 +135,7 @@ body {
   overflow: auto;
   font-family: 'Roboto';
 }
-
+/* Fix text overflow from tables */
 .v-table__wrapper {
   overflow: hidden;
   word-break: break-all;
diff --git a/web/src/components/RequestDetails.vue b/web/src/components/RequestDetails.vue
index 80c8b13c2..f367a2261 100644
--- a/web/src/components/RequestDetails.vue
+++ b/web/src/components/RequestDetails.vue
@@ -79,7 +79,7 @@ limitations under the License.
               <v-list-item title="Running:">
                   {{ requestDetails.running_tasks }} Tasks
               </v-list-item>
-              <v-list-item title="Queued:">
+              <v-list-item title="Pending:">
                   {{ requestDetails.queued_tasks }} Tasks
               </v-list-item>
               <v-list-item title="Successful:">
diff --git a/web/src/components/RequestList.vue b/web/src/components/RequestList.vue
index 194fabdf5..c3f5ad430 100644
--- a/web/src/components/RequestList.vue
+++ b/web/src/components/RequestList.vue
@@ -53,7 +53,7 @@ limitations under the License.
                 <v-chip v-bind="props" text="Running" filter @click="this.filterRunning = !this.filterRunning">
                 </v-chip>
               </template>
-              Filter by running or queued Tasks
+              Filter by running or pending Tasks
             </v-tooltip>
             <v-tooltip location="top">
               <template v-slot:activator="{ props }">
diff --git a/web/src/components/TaskList.vue b/web/src/components/TaskList.vue
index 11d547967..480ed4139 100644
--- a/web/src/components/TaskList.vue
+++ b/web/src/components/TaskList.vue
@@ -75,9 +75,9 @@ export default {
           for (const task in data) {
             let task_dict = data[task]
             let taskStatusTemp = task_dict.status
-            // As queued status requests show as null
-            if (taskStatusTemp === null) {
-              taskStatusTemp = 'queued'
+            // As pending status requests show as null or pending
+            if (taskStatusTemp === null || taskStatusTemp === "pending") {
+              taskStatusTemp = 'pending on server.'
             }
             if (this.filterJobs.length > 0) {
               let jobName = task_dict.job_name.toLowerCase()