diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index 788739fd1e7913c572f8da84023eb319f3f31129..13a7f30ed26b178a23796cc8963ff7324fd77414 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -9,10 +9,20 @@ and this project adheres to `Semantic Versioning`_.
Unreleased
----------
+Changes
+~~~~~~~
+
+* The frontend is now able to display headings in the main toolbar.
+
Fixed
~~~~~
+* Default translations from vuetify were not loaded.
* Browser locale was not the default locale in the entire frontend.
+* In some cases, some items in the sidenav menu were not shown due to its height being higher than the visible page area.
+* The search bar in the sidenav menu is shown even though the user has no permission to see it.
+* Add permission check to accept invitation menu point in order to hide it when this feature is disabled.
+* Metrics endpoint for Prometheus was at the wrong URL.
`3.0`_ - 2022-05-11
-------------------
diff --git a/aleksis/core/frontend/components/app/App.vue b/aleksis/core/frontend/components/app/App.vue
index b6919fbe8353c305cc88141e0bbcdd095bd4231c..6fcf3986af676dd2faab228e2eb3b1349625aed5 100644
--- a/aleksis/core/frontend/components/app/App.vue
+++ b/aleksis/core/frontend/components/app/App.vue
@@ -25,7 +25,7 @@
class="white--text text-decoration-none"
@click="$router.push({ name: 'dashboard' })"
>
- {{ systemProperties.sitePreferences.generalTitle }}
+ {{ $root.toolbarTitle }}
</v-toolbar-title>
<v-progress-linear
diff --git a/aleksis/core/frontend/components/app/SideNav.vue b/aleksis/core/frontend/components/app/SideNav.vue
index bba811884c9f97d0b57985f0133ac6863eb4b880..af34c3b5ee1e74f1587d9aa275952a2f77a0468e 100644
--- a/aleksis/core/frontend/components/app/SideNav.vue
+++ b/aleksis/core/frontend/components/app/SideNav.vue
@@ -1,5 +1,5 @@
<template>
- <v-navigation-drawer app :value="value" @input="$emit('input', $event)">
+ <v-navigation-drawer app :value="value" height="100dvh" @input="$emit('input', $event)">
<v-list nav dense shaped>
<v-list-item class="logo">
<a
@@ -10,7 +10,7 @@
<brand-logo :site-preferences="systemProperties.sitePreferences" />
</a>
</v-list-item>
- <v-list-item class="search">
+ <v-list-item v-if="checkPermission('core.search_rule')" class="search">
<sidenav-search />
</v-list-item>
<v-list-item-group :value="$route.name" v-if="sideNavMenu">
@@ -95,6 +95,8 @@ import BrandLogo from "./BrandLogo.vue";
import LanguageForm from "./LanguageForm.vue";
import SidenavSearch from "./SidenavSearch.vue";
+import permissionsMixin from "../../mixins/permissions.js";
+
export default {
name: "SideNav",
components: {
@@ -107,6 +109,10 @@ export default {
systemProperties: { type: Object, required: true },
value: { type: Boolean, required: true },
},
+ mixins: [permissionsMixin],
+ mounted() {
+ this.fetchPermissions(["core.search_rule"]);
+ },
};
</script>
diff --git a/aleksis/core/frontend/components/app/permissions.graphql b/aleksis/core/frontend/components/app/permissions.graphql
new file mode 100644
index 0000000000000000000000000000000000000000..fcb6133e0afdb78e9a2fb750e1972d64aa0968e7
--- /dev/null
+++ b/aleksis/core/frontend/components/app/permissions.graphql
@@ -0,0 +1,8 @@
+query gqlPermissions($permissions: [String]!) {
+ whoAmI {
+ permissions: globalPermissionsByName(permissions: $permissions) {
+ name
+ result
+ }
+ }
+}
diff --git a/aleksis/core/frontend/components/app/whoAmI.graphql b/aleksis/core/frontend/components/app/whoAmI.graphql
index 0b2877bd2cf15b5134c8e70978fb6b2218414e3a..57e0292d37ea4d221c9f263621647bfdabe38b6f 100644
--- a/aleksis/core/frontend/components/app/whoAmI.graphql
+++ b/aleksis/core/frontend/components/app/whoAmI.graphql
@@ -1,4 +1,4 @@
-query ($permissions: [String]!) {
+query whoAmI {
whoAmI {
username
isAuthenticated
@@ -12,9 +12,5 @@ query ($permissions: [String]!) {
avatarUrl
isDummy
}
- permissions: globalPermissionsByName(permissions: $permissions) {
- name
- result
- }
}
}
diff --git a/aleksis/core/frontend/components/authorized_oauth_applications/AuthorizedApplications.vue b/aleksis/core/frontend/components/authorized_oauth_applications/AuthorizedApplications.vue
index bbf35c8e7f3c2f9e71479c03feb86799b3328d7f..55e100ddf773e342033a7f691089c6e5d7940936 100644
--- a/aleksis/core/frontend/components/authorized_oauth_applications/AuthorizedApplications.vue
+++ b/aleksis/core/frontend/components/authorized_oauth_applications/AuthorizedApplications.vue
@@ -1,6 +1,5 @@
<template>
<div>
- <h1 class="mb-4">{{ $t("oauth.authorized_application.title") }}</h1>
<div v-if="$apollo.queries.accessTokens.loading">
<v-skeleton-loader type="card"></v-skeleton-loader>
</div>
diff --git a/aleksis/core/frontend/components/two_factor/TwoFactor.vue b/aleksis/core/frontend/components/two_factor/TwoFactor.vue
index b6c023a55ffa3d9cf467d88109b46d78cf630ab0..96df63ebd882fa413538abb4ae3f68b5445aa966 100644
--- a/aleksis/core/frontend/components/two_factor/TwoFactor.vue
+++ b/aleksis/core/frontend/components/two_factor/TwoFactor.vue
@@ -1,6 +1,5 @@
<template>
<div>
- <h1 class="mb-4">{{ $t("accounts.two_factor.title") }}</h1>
<div v-if="$apollo.queries.twoFactor.loading">
<v-skeleton-loader type="card,card"></v-skeleton-loader>
</div>
diff --git a/aleksis/core/frontend/index.js b/aleksis/core/frontend/index.js
index 72bf942a71faf76275490599846000df749e6eab..baa4366fe9df4ef849aee0424cd2c916b3eda468 100644
--- a/aleksis/core/frontend/index.js
+++ b/aleksis/core/frontend/index.js
@@ -44,6 +44,7 @@ const vuetify = new Vuetify({
current: Vue.$cookies.get("django_language")
? Vue.$cookies.get("django_language")
: "en",
+ t: (key, ...params) => i18n.t(key, params),
},
...vuetifyOpts,
});
@@ -68,6 +69,8 @@ const app = new Vue({
backgroundActive: true,
invalidation: false,
snackbarItems: [],
+ toolbarTitle: "AlekSIS®",
+ permissions: [],
}),
computed: {
matchedComponents() {
@@ -87,5 +90,6 @@ const app = new Vue({
});
// Late setup for some plugins handed off to out ALeksisVue plugin
+app.$loadVuetifyMessages();
app.$loadAppMessages();
app.$setupNavigationGuards();
diff --git a/aleksis/core/frontend/mixins/menus.js b/aleksis/core/frontend/mixins/menus.js
index 9ba58bcaa84e72917e3057614fca6058df39af3a..7b6317a5aa3f625501bd51119d0fc4c6f633b379 100644
--- a/aleksis/core/frontend/mixins/menus.js
+++ b/aleksis/core/frontend/mixins/menus.js
@@ -1,15 +1,17 @@
import gqlCustomMenu from "../components/app/customMenu.graphql";
+import permissionsMixin from "./permissions.js";
+
/**
* Vue mixin containing menu generation code.
*
* Only used by main App component, but factored out for readability.
*/
const menusMixin = {
+ mixins: [permissionsMixin],
data() {
return {
footerMenu: null,
- permissionNames: [],
sideNavMenu: null,
accountMenu: null,
};
@@ -35,8 +37,7 @@ const menusMixin = {
}
}
- this.permissionNames = permArray;
- this.$apollo.queries.whoAmI.refetch();
+ this.fetchPermissions(permArray);
},
buildMenu(routes, menuKey) {
let menu = {};
@@ -99,14 +100,6 @@ const menusMixin = {
return Object.values(menu);
},
- checkPermission(permissionName) {
- return (
- this.whoAmI &&
- this.whoAmI.permissions &&
- this.whoAmI.permissions.find((p) => p.name === permissionName) &&
- this.whoAmI.permissions.find((p) => p.name === permissionName).result
- );
- },
checkValidators(validators) {
for (const validator of validators) {
if (!validator(this.whoAmI)) {
@@ -118,14 +111,9 @@ const menusMixin = {
buildMenus() {
this.accountMenu = this.buildMenu(
this.$router.getRoutes(),
- "inAccountMenu",
- this.whoAmI ? this.whoAmI.permissions : []
- );
- this.sideNavMenu = this.buildMenu(
- this.$router.getRoutes(),
- "inMenu",
- this.whoAmI ? this.whoAmI.permissions : []
+ "inAccountMenu"
);
+ this.sideNavMenu = this.buildMenu(this.$router.getRoutes(), "inMenu");
},
},
apollo: {
diff --git a/aleksis/core/frontend/mixins/permissions.js b/aleksis/core/frontend/mixins/permissions.js
new file mode 100644
index 0000000000000000000000000000000000000000..55bc94f30a39e6712a6e74863b045707c3ae3bba
--- /dev/null
+++ b/aleksis/core/frontend/mixins/permissions.js
@@ -0,0 +1,55 @@
+import gqlPermissions from "../components/app/permissions.graphql";
+
+/**
+ * Vue mixin containing permission checking code.
+ */
+
+const permissionsMixin = {
+ apollo: {
+ permissions: {
+ query: gqlPermissions,
+ update(data) {
+ this.$root.permissions = data.whoAmI.permissions;
+ },
+ variables: {
+ permissions: [],
+ },
+ },
+ },
+ methods: {
+ checkPermission(permissionName) {
+ return (
+ this.$root.permissions &&
+ this.$root.permissions.find((p) => p.name === permissionName) &&
+ this.$root.permissions.find((p) => p.name === permissionName).result
+ );
+ },
+ fetchPermissions(permissionNames) {
+ this.$apollo.queries.permissions.fetchMore({
+ variables: {
+ permissions: permissionNames,
+ },
+ updateQuery: (previousResult, { fetchMoreResult }) => {
+ const oldPermissions = previousResult.whoAmI.permissions;
+ const newPermissions = fetchMoreResult.whoAmI.permissions;
+
+ const keepPermissions = oldPermissions.filter(
+ (oldPermission) =>
+ !newPermissions.find(
+ (newPermission) => newPermission.name === oldPermission.name
+ )
+ );
+
+ return {
+ whoAmI: {
+ __typename: previousResult.whoAmI.__typename,
+ permissions: [...keepPermissions, ...newPermissions],
+ },
+ };
+ },
+ });
+ },
+ },
+};
+
+export default permissionsMixin;
diff --git a/aleksis/core/frontend/plugins/aleksis.js b/aleksis/core/frontend/plugins/aleksis.js
index c35b9127f78f6c26c3e5c052cc5732322f509090..c129aac331c51c1135203ed633a6fd3fccbc942f 100644
--- a/aleksis/core/frontend/plugins/aleksis.js
+++ b/aleksis/core/frontend/plugins/aleksis.js
@@ -5,6 +5,7 @@
// aleksisAppImporter is a virtual module defined in Vite config
import { appMessages } from "aleksisAppImporter";
import aleksisMixin from "../mixins/aleksis.js";
+import * as langs from "@/vuetify/src/locale";
console.debug("Defining AleksisVue plugin");
const AleksisVue = {};
@@ -104,6 +105,33 @@ AleksisVue.install = function (Vue) {
document.title = newTitle;
};
+ /**
+ * Set the toolbar title visible on the page.
+ *
+ * This will automatically add the base title discovered at app loading time.
+ *
+ * @param {string} title Specific title to set, or null.
+ * @param {Object} route Route to discover title from, or null.
+ */
+ Vue.prototype.$setToolBarTitle = function (title, route) {
+ let newTitle;
+
+ if (title) {
+ newTitle = title;
+ } else {
+ if (!route) {
+ route = this.$route;
+ }
+ if (route.meta.toolbarTitle) {
+ newTitle = this.$t(route.meta.toolbarTitle);
+ }
+ }
+
+ newTitle = newTitle || Vue.$pageBaseTitle;
+ console.debug(`Setting toolbar title: ${newTitle}`);
+ this.$root.toolbarTitle = newTitle;
+ };
+
/**
* Load i18n messages from all known AlekSIS apps.
*/
@@ -115,6 +143,15 @@ AleksisVue.install = function (Vue) {
}
};
+ /**
+ * Load vuetifys built-in translations
+ */
+ Vue.prototype.$loadVuetifyMessages = function () {
+ for (const [locale, messages] of Object.entries(langs)) {
+ this.$i18n.mergeLocaleMessage(locale, { $vuetify: messages });
+ }
+ };
+
/**
* Invalidate state and force reload from server.
*
@@ -150,6 +187,7 @@ AleksisVue.install = function (Vue) {
this.$router.afterEach((to, from, next) => {
console.debug("Setting new page title due to route change");
vm.$setPageTitle(null, to);
+ vm.$setToolBarTitle(null, to);
});
// eslint-disable-next-line no-unused-vars
diff --git a/aleksis/core/frontend/routes.js b/aleksis/core/frontend/routes.js
index aa84f36c4aa9f634f081edb9338f8f264dc9c2fe..2af742809548f5f2f70e9c13a1b7091e6d8145c5 100644
--- a/aleksis/core/frontend/routes.js
+++ b/aleksis/core/frontend/routes.js
@@ -54,6 +54,7 @@ const routes = [
icon: "mdi-key-outline",
titleKey: "accounts.invitation.accept_invitation.menu_title",
validators: [notLoggedInValidator],
+ permission: "core.invite_enabled",
},
},
{
@@ -734,6 +735,7 @@ const routes = [
meta: {
inAccountMenu: true,
titleKey: "accounts.two_factor.menu_title",
+ toolbarTitle: "accounts.two_factor.title",
icon: "mdi-two-factor-authentication",
permission: "core.manage_2fa_rule",
},
@@ -928,6 +930,7 @@ const routes = [
meta: {
inAccountMenu: true,
titleKey: "oauth.authorized_application.menu_title",
+ toolbarTitle: "oauth.authorized_application.title",
icon: "mdi-gesture-tap-hold",
permission: "core.manage_authorized_tokens_rule",
},
@@ -956,14 +959,6 @@ const routes = [
invalidate: "leave",
},
},
- {
- path: "/invitations/code/enter",
- component: () => import("./components/LegacyBaseTemplate.vue"),
- props: {
- byTheGreatnessOfTheAlmightyAleksolotlISwearIAmWorthyOfUsingTheLegacyBaseTemplate: true,
- },
- name: "core.enter_invitation_code",
- },
{
path: "/invitations/code/generate",
component: () => import("./components/LegacyBaseTemplate.vue"),
diff --git a/aleksis/core/settings.py b/aleksis/core/settings.py
index fbe25a785c289e415445b6cf52bc9ff43bfeb477..bf6f4ffde3d7274371a2acd1d8bfb78d2d53357b 100644
--- a/aleksis/core/settings.py
+++ b/aleksis/core/settings.py
@@ -576,7 +576,7 @@ YARN_INSTALLED_APPS = [
"@fontsource/roboto@^4.5.5",
"jquery@^3.6.0",
"@materializecss/materialize@~1.0.0",
- "material-design-icons-iconfont@^6.6.0",
+ "material-design-icons-iconfont@^6.7.0",
"select2-materialize@^0.1.8",
"paper-css@^0.4.1",
"jquery-sortablejs@^1.0.1",
@@ -585,7 +585,7 @@ YARN_INSTALLED_APPS = [
"luxon@^2.3.2",
"@iconify/iconify@^2.2.1",
"@iconify/json@^2.1.30",
- "@mdi/font@^6.9.96",
+ "@mdi/font@^7.2.96",
"apollo-boost@^0.4.9",
"apollo-link-retry@^2.2.16",
"apollo3-cache-persist@^0.14.1",
diff --git a/aleksis/core/urls.py b/aleksis/core/urls.py
index 9792fcb75cd1e7197cda1f1e6707c3eb42ed1d3e..cc5d954523b331e02b02082014a911d76640ec00 100644
--- a/aleksis/core/urls.py
+++ b/aleksis/core/urls.py
@@ -42,11 +42,11 @@ urlpatterns = [
),
path("oauth/", include("oauth2_provider.urls", namespace="oauth2_provider")),
path("system_status/", views.SystemStatusAPIView.as_view(), name="system_status_api"),
+ path("", include("django_prometheus.urls")),
path(
"django/",
include(
[
- path("", include("django_prometheus.urls")),
path("account/login/", views.LoginView.as_view(), name="login"),
path(
"accounts/signup/", views.AccountRegisterView.as_view(), name="account_signup"