diff --git a/CHANGELOG.rst b/CHANGELOG.rst index d0912639bb3c66b0bdd52f6b9ef486b8a39c48a1..2b1fdba16ea390c857c3107bafc3fbdcc571d7aa 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -13,6 +13,14 @@ Changes ~~~~~~~ * The frontend is now able to display headings in the main toolbar. +Fixed +~~~~~ + +* Default translations from vuetify were not loaded. +* 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. + `3.0`_ - 2022-05-11 ------------------- diff --git a/aleksis/core/frontend/components/app/SideNav.vue b/aleksis/core/frontend/components/app/SideNav.vue index 0975c580cda88d03fd8a5d34b2fb16425ece69ee..7d486ad7e2aba6cfdb325130710beb9cd39db106 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"> @@ -94,6 +94,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: { @@ -106,6 +108,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/index.js b/aleksis/core/frontend/index.js index 312dcdb29115b5c89dabdaf8650161f21c0ffbe1..11d1a1db0fe3b51703f63a6a668d96aac02f8374 100644 --- a/aleksis/core/frontend/index.js +++ b/aleksis/core/frontend/index.js @@ -46,6 +46,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, }); @@ -71,6 +72,7 @@ const app = new Vue({ invalidation: false, snackbarItems: [], toolbarTitle: "AlekSIS®", + permissions: [], }), computed: { matchedComponents() { @@ -90,5 +92,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 d2f17f8cd1a856376acfc91f089986569fc2311d..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 = {}; @@ -142,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. * diff --git a/aleksis/core/frontend/routes.js b/aleksis/core/frontend/routes.js index 516c7710f588fc26095c08f383ef74570471ffe6..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", }, }, { @@ -958,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"),