From 709d26735bdceb87036a09434cac878f3e4e8bc9 Mon Sep 17 00:00:00 2001
From: Thomas Citharel
Date: Thu, 16 Dec 2021 16:48:50 +0100
Subject: [PATCH] Provide analytics on Front-end
Signed-off-by: Thomas Citharel
---
js/package.json | 6 +-
js/src/App.vue | 10 +
js/src/components/Error.vue | 158 +++++++-
js/src/graphql/config.ts | 9 +
js/src/i18n/en_US.json | 11 +-
js/src/services/statistics/index.ts | 50 +++
js/src/services/statistics/matomo.ts | 14 +
js/src/services/statistics/plausible.ts | 11 +
js/src/services/statistics/sentry.ts | 54 +++
js/src/types/analytics/sentry.model.ts | 7 +
js/src/types/config.model.ts | 13 +
js/src/typings/matomo.d.ts | 1 +
js/yarn.lock | 370 ++++++++++++-------
lib/graphql/resolvers/config.ex | 4 +-
lib/graphql/schema/config.ex | 26 ++
lib/service/front_end_analytics/analytics.ex | 53 +++
lib/service/front_end_analytics/matomo.ex | 30 ++
lib/service/front_end_analytics/plausible.ex | 31 ++
lib/service/front_end_analytics/sentry.ex | 31 ++
19 files changed, 733 insertions(+), 156 deletions(-)
create mode 100644 js/src/services/statistics/index.ts
create mode 100644 js/src/services/statistics/matomo.ts
create mode 100644 js/src/services/statistics/plausible.ts
create mode 100644 js/src/services/statistics/sentry.ts
create mode 100644 js/src/types/analytics/sentry.model.ts
create mode 100644 js/src/typings/matomo.d.ts
create mode 100644 lib/service/front_end_analytics/analytics.ex
create mode 100644 lib/service/front_end_analytics/matomo.ex
create mode 100644 lib/service/front_end_analytics/plausible.ex
create mode 100644 lib/service/front_end_analytics/sentry.ex
diff --git a/js/package.json b/js/package.json
index 7eabe74f5..28348350e 100644
--- a/js/package.json
+++ b/js/package.json
@@ -8,7 +8,7 @@
"test:unit": "LANG=en_US.UTF-8 LANGUAGE=en_US:en LC_ALL=en_US.UTF-8 TZ=UTC vue-cli-service test:unit",
"test:e2e": "vue-cli-service test:e2e",
"lint": "vue-cli-service lint",
- "build:assets": "vue-cli-service build",
+ "build:assets": "vue-cli-service build --report",
"build:pictures": "bash ./scripts/build/pictures.sh"
},
"dependencies": {
@@ -17,6 +17,8 @@
"@apollo/client": "^3.3.16",
"@mdi/font": "^6.1.95",
"@tailwindcss/line-clamp": "^0.3.0",
+ "@sentry/tracing": "^6.16.1",
+ "@sentry/vue": "^6.16.1",
"@tiptap/core": "^2.0.0-beta.41",
"@tiptap/extension-blockquote": "^2.0.0-beta.25",
"@tiptap/extension-bold": "^2.0.0-beta.24",
@@ -69,7 +71,9 @@
"vue": "^2.6.11",
"vue-class-component": "^7.2.3",
"vue-i18n": "^8.14.0",
+ "vue-matomo": "^4.1.0",
"vue-meta": "^2.3.1",
+ "vue-plausible": "^1.3.1",
"vue-property-decorator": "^9.0.0",
"vue-router": "^3.1.6",
"vue-scrollto": "^2.17.1",
diff --git a/js/src/App.vue b/js/src/App.vue
index c67807e88..309331248 100644
--- a/js/src/App.vue
+++ b/js/src/App.vue
@@ -203,6 +203,16 @@ export default class App extends Vue {
this.interval = undefined;
}
+ @Watch("config")
+ async initializeStatistics(config: IConfig) {
+ if (config) {
+ const { statistics } = (await import("./services/statistics")) as {
+ statistics: (config: IConfig, environment: Record) => void;
+ };
+ statistics(config, { router: this.$router, version: config.version });
+ }
+ }
+
@Watch("$route", { immediate: true })
updateAnnouncement(route: Route): void {
const pageTitle = this.extractPageTitleFromRoute(route);
diff --git a/js/src/components/Error.vue b/js/src/components/Error.vue
index 752938f06..e10a22775 100644
--- a/js/src/components/Error.vue
+++ b/js/src/components/Error.vue
@@ -48,13 +48,75 @@
$t("Mobilizon")
}}
- {{
- $t(
- "We improve this software thanks to your feedback. To let us know about this issue, two possibilities (both unfortunately require user account creation):"
- )
- }}
+
+ {{
+ $t(
+ "We collect your feedback and the error information in order to improve this service."
+ )
+ }}
+
+ {{
+ $t(
+ "We improve this software thanks to your feedback. To let us know about this issue, two possibilities (both unfortunately require user account creation):"
+ )
+ }}
+
-
+
+
+
+ {{
+ $t(
+ "Sorry, we wen't able to save your feedback. Don't worry, we'll try to fix this issue anyway."
+ )
+ }}
+
+
+
+ {{
+ $t("return to the homepage")
+ }}
+
+
+
+
+ {{ $t("Thanks a lot, your feedback was submitted!") }}
+
+
+ {{
+ $t("return to the homepage")
+ }}
+
+
+
+
+
{{ $t("You may also:") }}
-
+
{{
$t(
"Please add as many details as possible to help identify the problem."
@@ -89,14 +151,14 @@
{{ $t("Error stacktrace") }}
{{ error.stack }}
-
+
{{
$t(
"The technical details of the error can help developers solve the problem more easily. Please add them to your feedback."
)
}}
-