Merge branch 'dev'

.env

@@ -3,3 +3,5 @@ VITE_BACKEND_URL=https://ws.spraakbanken.gu.se/ws/mink/
 VITE_AUTH_URL=https://sp.spraakbanken.gu.se/auth/
 VITE_KORP_URL=https://spraakbanken.gu.se/korp/
 VITE_STRIX_URL=https://spraakbanken.gu.se/strix/
+VITE_MATOMO_URL=https://spraakbanken.gu.se/stats
+# VITE_MATOMO_ID= # Do not report to the real backend when developing

package.json

@@ -33,6 +33,7 @@
     "vite-plugin-rewrite-all": "^1.0.1",
     "vue": "^3.2.6",
     "vue-i18n": "9",
+    "vue-matomo": "^4.2.0",
     "vue-router": "4"
   },
   "devDependencies": {

src/App.vue

@@ -16,6 +16,7 @@
       </div>
 
       <div class="flex items-center gap-4">
+        <Spinner v-if="isAuthenticating" />
         <div class="self-stretch flex flex-col">
           <div class="w-56 flex-1">
             <a href="https://spraakbanken.gu.se/">
@@ -74,12 +75,15 @@ import MessageToasts from "@/message/MessageToasts.vue";
 // Asset path transformation doesn't work in <source srcset> like in <img src>
 import logoMinkLight from "@/assets/mink-light.svg";
 import logoSbxLight from "@/assets/sbx1r-light.svg";
-import usePageTitle from "./title.composable";
-import Breadcrumb from "./Breadcrumb.vue";
+import usePageTitle from "@/page/title.composable";
+import Breadcrumb from "@/page/Breadcrumb.vue";
+import Spinner from "@/spin/Spinner.vue";
 
-const { refreshJwt, payload, canUserWrite } = useAuth();
+const { refreshJwt, isAuthenticating, payload, canUserWrite } = useAuth();
 useLocale();
+// The `title` ref is automatically updated from route meta.
 const { title } = usePageTitle();
+// Activate automatic updates of the HTML page title.
 useTitle(title, { titleTemplate: "%s | Mink" });
 
 // Fetch JWT and use it for all API requests.

src/auth/AccessDenied.vue

@@ -1,12 +1,5 @@
 <template>
   <div>
-    <div
-      class="bg-amber-300 shadow shadow-amber-600 text-amber-900 p-2 px-4 mb-4"
-    >
-      <strong>{{ $t("devnotice.title") }}</strong>
-      {{ $t("devnotice.description") }}
-    </div>
-
     <h1>{{ $t("accessdenied") }}</h1>
     <p>{{ $t("accessdenied.contact") }}</p>
     <router-link to="/">{{ $t("home") }}</router-link>

src/auth/auth.composable.js

@@ -26,7 +26,7 @@ const jwt = ref(null);
 export function useAuth() {
   const router = useRouter();
   const route = useRoute();
-  const { spin } = useSpin();
+  const { spin, pending } = useSpin();
   const { t } = useI18n();
 
   const isAuthenticated = computed(() => !!jwt.value);
@@ -37,20 +37,22 @@ export function useAuth() {
   const canUserWrite = computed(
     () => payload.value && canWrite(payload.value, "other", "mink-app")
   );
+  /** Indicates whether a jwt request is currently loading. */
+  const isAuthenticating = computed(() => pending.value.includes("jwt"));
 
   /** If not authenticated, redirect to the login page. */
   async function requireAuthentication(callback) {
+    // First, ensure the jwt has been fetched.
     if (!jwt.value) {
       await refreshJwt();
     }
+    // If still no jwt, it means the user hasn't authenticated. Show our login page.
     if (!jwt.value) {
+      // By passing current page as destination param, the user will then be redirected back to where they first attempted to go.
       router.push(`/login?destination=${route.fullPath}`);
       return;
     }
-    if (!canUserWrite.value) {
-      router.push("/access-denied");
-      return;
-    }
+    // When calling `requireAuthentication`, you can optionally specify what should happen upon success.
     callback?.();
   }
 
@@ -80,6 +82,7 @@ export function useAuth() {
   }
 
   return {
+    isAuthenticating,
     isAuthenticated,
     payload,
     canUserAdmin,

src/corpus/exports/Exports.vue

@@ -1,7 +1,7 @@
 <template>
   <PendingContent
     :on="`corpus/${corpusId}/exports`"
-    class="grid grid-cols-2 gap-4"
+    class="xl:grid grid-cols-2 gap-4"
   >
     <div>
       <h3 class="text-lg uppercase">
@@ -11,7 +11,7 @@
 
       <div class="flex gap-2 my-2 justify-between items-baseline">
         <div>
-          <h3 class="text-lg uppercase">Korp</h3>
+          <h3 class="font-bold">Korp</h3>
           <p class="text-sm text-gray-500 dark:text-gray-400">
             {{ $t("exports.tools.help.korp") }}
             <a :href="$t('exports.tools.help.korp.manual.url')">
@@ -55,7 +55,7 @@
 
       <div class="flex gap-2 my-2 justify-between items-baseline">
         <div>
-          <h3 class="text-lg uppercase">Strix</h3>
+          <h3 class="font-bold">Strix</h3>
           <p class="text-sm text-gray-500 dark:text-gray-400">
             {{ $t("exports.tools.help.strix") }}
           </p>

src/home/news.yaml

@@ -1,7 +1,9 @@
-- date: 2023-01-31
-  title:
-    en: Released for testing
-    sv: Släppt för testning
-  body:
-    en: During the first half of 2023, Mink is being progressively rolled out for testing. If you are interested in participating, please contact Språkbanken Text at [email protected]. A public release is scheduled for September, 2023.
-    sv: Under våren 2023 rullas Mink gradvis ut för testning. Om du är intresserad av att delta är du välkommen att kontakta Språkbanken Text på [email protected]. Ett öppet släpp planeras till september 2023.
+[]
+# Template:
+# - date: 2023-01-31
+#   title:
+#     en: Released for testing
+#     sv: Släppt för testning
+#   body:
+#     en: During the first half of 2023, Mink is being progressively rolled out for testing. If you are interested in participating, please contact Språkbanken Text at [email protected]. A public release is scheduled for September, 2023.
+#     sv: Under våren 2023 rullas Mink gradvis ut för testning. Om du är intresserad av att delta är du välkommen att kontakta Språkbanken Text på [email protected]. Ett öppet släpp planeras till september 2023.

src/i18n/locales/en.yaml

@@ -194,9 +194,7 @@ annotations.info: |
     <a href="https://spraakbanken.gu.se/sparv/#/user-manual/available-analyses">Sparv documentation</a>.
   </p>
 accessdenied: Access denied
-accessdenied.contact: If you want access to Mink, please contact sb-info{'@'}svenska.gu.se
+accessdenied.contact: If you have questions, or you want to report a bug, please contact sb-info{'@'}svenska.gu.se. Thank you!
 notfound: Page not found
 notfound.description: Something went wrong, and there is nothing to see at this address.
 notfound.contact: If you have questions, or you want to report a bug, please contact sb-info{'@'}svenska.gu.se. Thank you!
-devnotice.title: Under construction
-devnotice.description: Please note that Mink is still in an early development stage, and access to it is thus currently restricted to Språkbanken Text employees.

src/i18n/locales/sv.yaml

@@ -84,7 +84,7 @@ jwt.refreshing: Uppdaterar konto
 tools: Utforska
 exports.loading: Hämtar resultatlista
 exports.tools.help: Använd den här datan i Språkbankens korpusverktyg. Din data visas bara för dig, i ett särskilt Mink-läge.
-exports.tools.help.korp: I Korp finns konkordanssökning, detaljerade sökfrågor, frekvensstatistik m m.
+exports.tools.help.korp: I Korp finns konkordanssökning, detaljerade sökfrågor, frekvensstatistik med mera.
 exports.tools.help.korp.manual.url: https://spraakbanken.gu.se/verktyg/korp/anvandarhandledning
 exports.tools.help.korp.manual.text: Användarhandledning
 exports.tools.help.strix: I Strix kan de berikade texterna undersökas i sin helhet.
@@ -196,9 +196,7 @@ annotations.info: |
     <a href="https://spraakbanken.gu.se/sparv/#/user-manual/available-analyses">Sparvs dokumentation</a>.
   </p>
 accessdenied: Åtkomst nekad
-accessdenied.contact: Om du vill få tillgång till Mink, hör av dig till sb-info{'@'}svenska.gu.se
+accessdenied.contact: Om du har frågor eller vill rapportera en bugg, kontakta gärna sb-info{'@'}svenska.gu.se. Tack!
 notfound: Sidan kan inte hittas
 notfound.description: Något har gått fel, och det finns ingenting att visa på den här adressen.
 notfound.contact: Om du har frågor eller vill rapportera en bugg, kontakta gärna sb-info{'@'}svenska.gu.se. Tack!
-devnotice.title: Under konstruktion
-devnotice.description: Observera att Mink är inne i en testfas, och tillgången är för närvarande begränsad till anställda på Språkbanken Text.

src/main.js

@@ -5,14 +5,25 @@ import { createPinia } from "pinia";
 import i18n from "./i18n/i18n";
 import { formkit, formkitConfig } from "./formkit";
 import { FontAwesomeIcon } from "./fontawesome";
+import matomo from "vue-matomo";
 import "./index.css";
 
 const pinia = createPinia();
 
-createApp(App) //
+const app = createApp(App) //
   .use(router)
   .use(pinia)
   .use(i18n)
   .use(formkit, formkitConfig)
-  .component("icon", FontAwesomeIcon)
-  .mount("#app");
+  .component("icon", FontAwesomeIcon);
+
+// Use the Matomo plugin only if configured in env.
+if (import.meta.env.VITE_MATOMO_URL && import.meta.env.VITE_MATOMO_ID) {
+  app.use(matomo, {
+    host: import.meta.env.VITE_MATOMO_URL,
+    siteId: import.meta.env.VITE_MATOMO_ID,
+    router: router,
+  });
+}
+
+app.mount("#app");

src/title.composable.js → src/page/title.composable.js

@@ -1,10 +1,10 @@
 import { computed } from "vue";
 import { useRoute } from "vue-router";
 import { useI18n } from "vue-i18n";
-import useLocale from "./i18n/locale.composable";
-import { useCorpusStore } from "./store/corpus.store";
+import useLocale from "../i18n/locale.composable";
+import { useCorpusStore } from "../store/corpus.store";
 
-/** Handle the custom title/createTitle route meta options. */
+/** Handle the custom title/createTitle route meta options. */
 export default function usePageTitle() {
   const route = useRoute();
   const { t } = useI18n();

src/router.js

@@ -14,7 +14,7 @@ import CorpusDelete from "@/corpus/CorpusDelete.vue";
 import Source from "@/corpus/sources/Source.vue";
 import User from "@/user/User.vue";
 import AccessDenied from "@/auth/AccessDenied.vue";
-import NotFound from "@/NotFound.vue";
+import NotFound from "@/page/NotFound.vue";
 
 const routes = [
   {

yarn.lock

@@ -2302,6 +2302,11 @@ vue-i18n@9:
     "@intlify/vue-devtools" "9.2.2"
     "@vue/devtools-api" "^6.2.1"
 
+vue-matomo@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/vue-matomo/-/vue-matomo-4.2.0.tgz#d65e369e4ead1d95ef790bef3627512cac3d25e9"
+  integrity sha512-m5hCw7LH3wPDcERaF4sp/ojR9sEx7Rl8TpOyH/4jjQxMF2DuY/q5pO+i9o5Dx+BXLSa9+IQ0qhAbWYRyESQXmA==
+
 vue-router@4:
   version "4.1.6"
   resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.1.6.tgz#b70303737e12b4814578d21d68d21618469375a1"
@@ -2391,9 +2396,9 @@ which@^2.0.1:
     isexe "^2.0.0"
 
 word-wrap@^1.2.3:
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c"
-  integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ==
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.4.tgz#cb4b50ec9aca570abd1f52f33cd45b6c61739a9f"
+  integrity sha512-2V81OA4ugVo5pRo46hAoD2ivUJx8jXmWXfUkY4KFNw0hEptvN0QfH3K4nHiwzGeKl5rFKedV48QVoqYavy4YpA==
 
 wrap-ansi@^7.0.0:
   version "7.0.0"