logging

.github/workflows/publish.yml

@@ -24,6 +24,7 @@ jobs:
           echo TABSETS_PWA_URL="https://pwa.tabsets.net" >> .env
           echo SENTRY_PROJECT_NAME="tabsets" >> .env
           echo SENTRY_DSN="${{ secrets.SENTRY_DNS }}" >> .env
+          echo HOST="chrome.extension" >> .env
       - name: Build
         run: |
           yarn install

package.json

@@ -61,6 +61,7 @@
     "@types/lodash": "^4.17.7",
     "@types/pngjs": "^6.0.5",
     "@types/sanitize-html": "^2.13.0",
+    "axios": "^1.7.7",
     "buffer": "^6.0.3",
     "cheerio": "^1.0.0",
     "date-fns": "^3.6.0",

quasar.config.js

@@ -30,6 +30,7 @@ module.exports = configure(function (ctx) {
     // --> boot files are part of "main.js"
     // https://v2.quasar.dev/quasar-cli-vite/boot-files
     boot: [
+      'axios',
       'errorhandling',
       'i18n',
       'constants'
@@ -87,6 +88,7 @@ module.exports = configure(function (ctx) {
       env: {
         BUILD_TIMESTAMP: new Date().toISOString().split('T')[0],
         BACKEND_URL: process.env.BACKEND_URL,
+        HOST: process.env.HOST,
 
         TABSETS_PWA_URL: process.env.TABSETS_PWA_URL,
         TABSETS_STAGE: process.env.STAGE,
@@ -128,6 +130,7 @@ module.exports = configure(function (ctx) {
         [require('@sentry/vite-plugin').sentryVitePlugin,{
             authToken: process.env.SENTRY_AUTH_TOKEN,
             org: "skysail-dk",
+            disable: ctx.dev,
             project: "tabsets"
         }]
       ]

src/boot/axios.ts

@@ -0,0 +1,20 @@
+import { boot } from 'quasar/wrappers'
+import axios from 'axios'
+
+const api = axios.create({ baseURL: 'https://api.example.com' })
+
+export default boot(({ app }) => {
+  // for use inside Vue files (Options API) through this.$axios and this.$api
+
+  app.config.globalProperties.$axios = axios
+  // ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form)
+  //       so you won't necessarily have to import axios in each vue file
+
+  app.config.globalProperties.$api = api
+  // ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
+  //       so you can easily perform requests against your app's API
+
+
+})
+
+export { axios, api }

src/services/Logger.ts

@@ -1,20 +1,27 @@
+import {api} from "boot/axios";
+
 const version = import.meta.env.PACKAGE_VERSION
 
-function log(msg: string, level:number) {
+let graylogErrorLogged = false
+
+function log(msg: string, level: number) {
   const gelfMessage = {
     "version": "1.1",
-    "host": "browser.local",
+    "host": process.env.HOST,
     "short_message": msg,
-    "level":level,
+    "level": level,
     _mode: process.env.MODE,
     _version: version,
     _stage: process.env.TABSETS_STAGE
   }
-  // api.post("http://graylog.backend:12201/gelf", gelfMessage, {headers: {
-  //     "Content-Type": "application/json"}
-  // }).catch((err) => {
-  //   console.log("error with logging server")
-  // })
+  api.post("http://graylog.tabsets.net:12201/gelf", gelfMessage, {headers: {"Content-Type": "application/json"}})
+    .catch((err: any) => {
+      if (!graylogErrorLogged) {
+        graylogErrorLogged = true
+        console.warn("could not log to graylog")
+      }
+    })
+
 }
 
 export function useLogger() {

yarn.lock

@@ -3771,6 +3771,15 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.13.2.tgz#0aa167216965ac9474ccfa83892cfb6b3e1e52ef"
   integrity sha512-lHe62zvbTB5eEABUVi/AwVh0ZKY9rMMDhmm+eeyuuUQbQ3+J+fONVQOZyj+DdrvD4BY33uYniyRJ4UJIaSKAfw==
 
+axios@^1.7.7:
+  version "1.7.7"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-1.7.7.tgz#2f554296f9892a72ac8d8e4c5b79c14a91d0a47f"
+  integrity sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==
+  dependencies:
+    follow-redirects "^1.15.6"
+    form-data "^4.0.0"
+    proxy-from-env "^1.1.0"
+
 b4a@^1.6.4, b4a@^1.6.6:
   version "1.6.6"
   resolved "https://registry.yarnpkg.com/b4a/-/b4a-1.6.6.tgz#a4cc349a3851987c3c4ac2d7785c18744f6da9ba"
@@ -4430,7 +4439,7 @@ color-support@^1.1.2:
   resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
   integrity sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==
 
-combined-stream@^1.0.6, combined-stream@~1.0.6:
+combined-stream@^1.0.6, combined-stream@^1.0.8, combined-stream@~1.0.6:
   version "1.0.8"
   resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
   integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==
@@ -6353,6 +6362,11 @@ focus-trap@^7.5.4:
   dependencies:
     tabbable "^6.2.0"
 
+follow-redirects@^1.15.6:
+  version "1.15.9"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.9.tgz#a604fa10e443bf98ca94228d9eebcc2e8a2c8ee1"
+  integrity sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==
+
 foreground-child@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/foreground-child/-/foreground-child-2.0.0.tgz#71b32800c9f15aa8f2f83f4a6bd9bff35d861a53"
@@ -6379,6 +6393,15 @@ form-data-encoder@^2.1.2:
   resolved "https://registry.yarnpkg.com/form-data-encoder/-/form-data-encoder-2.1.4.tgz#261ea35d2a70d48d30ec7a9603130fa5515e9cd5"
   integrity sha512-yDYSgNMraqvnxiEXO4hi88+YZxaHC6QKzb5N84iRCTDeRO7ZALpir/lVmf/uXUhnwUr2O4HU8s/n6x+yNjQkHw==
 
+form-data@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452"
+  integrity sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==
+  dependencies:
+    asynckit "^0.4.0"
+    combined-stream "^1.0.8"
+    mime-types "^2.1.12"
+
 form-data@~2.3.2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6"