.eslintrc.js

@@ -17,11 +17,11 @@ module.exports = {
     project: resolve(__dirname, './tsconfig.json'),
     tsconfigRootDir: __dirname,
     ecmaVersion: 2019, // Allows for the parsing of modern ECMAScript features
-    sourceType: 'module', // Allows for the use of imports
+    sourceType: 'module' // Allows for the use of imports
   },
 
   env: {
-    browser: true,
+    browser: true
   },
 
   // Rules order is important, please avoid shuffling them
@@ -44,7 +44,7 @@ module.exports = {
 
     // https://github.com/prettier/eslint-config-prettier#installation
     // usage with Prettier, provided by 'eslint-config-prettier'.
-    'plugin:prettier/recommended',
+    'prettier', //'plugin:prettier/recommended'
   ],
 
   plugins: [
@@ -54,6 +54,10 @@ module.exports = {
     // https://eslint.vuejs.org/user-guide/#why-doesn-t-it-work-on-vue-file
     // required to lint *.vue files
     'vue',
+
+    // https://github.com/typescript-eslint/typescript-eslint/issues/389#issuecomment-509292674
+    // Prettier has not been included as plugin to avoid performance impact
+    // add it as an extension for your IDE
   ],
 
   // add your custom rules here
@@ -62,8 +66,10 @@ module.exports = {
 
     // TypeScript
     quotes: ['warn', 'single', { avoidEscape: true }],
+    '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
 
     // allow debugger during development only
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
-  },
+  }
-};
+}

.npmignore

@@ -1,3 +0,0 @@
-yarn-error.log
-.woodpecker/
-

.woodpecker/deploy.yml

@@ -1,14 +0,0 @@
-pipeline:
-  deploy:
-    when:
-      event: tag
-      tag: v*
-    image: node:lts-alpine
-    commands:
-      - echo "//registry.npmjs.org/:_authToken=$NODE_AUTH_TOKEN" > .npmrc
-      - yarn publish --non-interactive
-    secrets: [ node_auth_token ]
-
-depends_on:
-  - lint
-

.woodpecker/lint.yml

@@ -1,9 +0,0 @@
-pipeline:
-  lint:
-    when:
-      branch: [main, develop]
-    image: node:lts-alpine
-    commands:
-      - yarn install
-      - yarn lint
-

README.md

@@ -1,5 +1,4 @@
 # Flaschengeist `users` fontend-plugin
-![status-badge](https://ci.os-sc.org/api/badges/Flaschengeist/flaschengeist-users/status.svg)
 
 This package provides the [Flaschengeist](https://flaschengeist.dev/Flaschengeist/flaschengeist) frontend for the users plugin (user management, account settings etc).
 

package.json

@@ -1,6 +1,6 @@
 {
     "license": "MIT",
-  "version": "1.1.0",
+    "version": "1.0.0-alpha.2",
     "name": "@flaschengeist/users",
     "author": "Ferdinand Thiessen <rpm@fthiessen.de>",
     "homepage": "https://flaschengeist.dev/Flaschengeist",
@@ -14,27 +14,23 @@
     },
     "main": "src/index.ts",
     "scripts": {
-    "format": "prettier --config ./package.json  --write '{,!(node_modules|.*)/**/}*.{js,ts,vue}'",
+      "pretty": "prettier --config ./package.json  --write '{,!(node_modules)/**/}*.{ts,vue}'",
       "lint": "eslint --ext .js,.ts,.vue ./src"
     },
     "devDependencies": {
-    "@flaschengeist/api": "^1.0.0",
+      "@flaschengeist/types": "^1.0.0-alpha.9",
-    "@flaschengeist/types": "^1.0.0",
+      "@quasar/app": "^3.2.3",
-    "@quasar/app-webpack": "^3.7.2",
+      "@typescript-eslint/eslint-plugin": "^5.4.0",
-    "@typescript-eslint/eslint-plugin": "^5.8.0",
+      "@typescript-eslint/parser": "^5.4.0",
-    "@typescript-eslint/parser": "^5.8.0",
+      "eslint": "^8.3.0",
-    "axios": "^0.24.0",
-    "eslint": "^8.5.0",
       "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-prettier": "^4.0.0",
+      "eslint-plugin-vue": "^8.1.1",
-    "eslint-plugin-vue": "^8.2.0",
+      "prettier": "^2.5.0",
-    "pinia": "^2.0.8",
+      "quasar": "^2.3.3",
-    "prettier": "^2.5.1",
+      "typescript": "^4.5.2"
-    "quasar": "^2.11.10",
-    "typescript": "^4.5.4"
     },
     "peerDependencies": {
-    "@flaschengeist/api": "^1.0.0"
+      "@flaschengeist/api": "^1.0.0-alpha.6"
     },
     "prettier": {
       "singleQuote": true,

src/components/NewUser.vue

@@ -23,7 +23,6 @@ export default defineComponent({
     const emptyUser = {
       userid: '',
       display_name: '',
-      deleted: false,
       firstname: '',
       lastname: '',
       mail: '',

src/components/SettingWidget.vue

@@ -1,66 +0,0 @@
-<template>
-  <q-card>
-    <q-card-section class="text-h6"> Einstellungen Benutzer </q-card-section>
-    <q-card-section>
-      <q-select
-        v-model="displayNameMode"
-        :options="options"
-        label="Anzeige des Namens"
-        emit-value
-        map-options
-        input-debounce="0"
-        filled
-      />
-    </q-card-section>
-  </q-card>
-</template>
-<script lang="ts">
-import { defineComponent, onBeforeMount, computed } from 'vue';
-import { useUserStore } from '@flaschengeist/api';
-import { DisplayNameMode } from '../models';
-export default defineComponent({
-  name: 'SettingWidget',
-  setup() {
-    const store = useUserStore();
-    onBeforeMount(() => {
-      void store.getDisplayNameModeSetting(true);
-    });
-
-    const displayNameMode = computed({
-      get: () => store.userSettings.display_name || DisplayNameMode.DISPLAYNAME,
-      set: (val) => {
-        console.log('set', val);
-        void store.setDisplayNameModeSetting(val);
-      },
-    });
-
-    const options = [
-      {
-        label: 'Anzeigename',
-        value: DisplayNameMode.DISPLAYNAME,
-      },
-      {
-        label: 'Vorname',
-        value: DisplayNameMode.FIRSTNAME,
-      },
-      {
-        label: 'Nachname',
-        value: DisplayNameMode.LASTNAME,
-      },
-      {
-        label: 'Vor- und Nachname',
-        value: DisplayNameMode.FIRSTNAME_LASTNAME,
-      },
-      {
-        label: 'Nachname, Vorname',
-        value: DisplayNameMode.LASTNAME_FIRSTNAME,
-      },
-    ];
-
-    return {
-      displayNameMode,
-      options,
-    };
-  },
-});
-</script>

src/components/UpdateUser.vue

@@ -6,23 +6,16 @@
         <UserSelector v-model="user" />
       </div>
     </q-card-section>
-    <MainUserSettings
+    <MainUserSettings :user="user" @update:user="updateUser" />
-      :user="user"
-      :removeable="canDelete && !isCurrentUser"
-      @update:user="updateUser"
-      @remove="remove"
-    />
   </q-card>
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, ref, onMounted } from 'vue';
+import { defineComponent, ref, onMounted } from 'vue';
-import { hasPermission, useMainStore, useUserStore } from '@flaschengeist/api';
-import { Notify } from 'quasar';
-import { PERMISSIONS } from '../permissions';
-
 import MainUserSettings from './settings/MainUserSettings.vue';
 import UserSelector from './UserSelector.vue';
+import { useMainStore, useUserStore } from '@flaschengeist/api';
+import { Notify } from 'quasar';
 
 export default defineComponent({
   name: 'UpdateUser',
@@ -30,10 +23,7 @@ export default defineComponent({
   setup() {
     const mainStore = useMainStore();
     const userStore = useUserStore();
-
     const user = ref(mainStore.currentUser);
-    const canDelete = computed(() => hasPermission(PERMISSIONS.DELETE));
-    const isCurrentUser = computed(() => user.value.userid === mainStore.currentUser.userid);
 
     onMounted(() => {
       void userStore.getUsers(true);
@@ -52,15 +42,7 @@ export default defineComponent({
       });
     }
 
-    async function remove() {
-      await userStore.deleteUser(user.value);
-      user.value = mainStore.currentUser;
-    }
-
     return {
-      canDelete,
-      isCurrentUser,
-      remove,
       user,
       updateUser,
     };

src/components/UserSelector.vue

@@ -4,19 +4,15 @@
     filled
     :label="label"
     :options="users"
-    :option-label="showName"
+    option-label="display_name"
     option-value="userid"
     map-options
-    use-input
-    input-debounce="0"
-    @filter="filterFn"
   />
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, PropType, onBeforeMount, ref } from 'vue';
+import { computed, defineComponent, PropType, onBeforeMount } from 'vue';
 import { useUserStore } from '@flaschengeist/api';
-import { DisplayNameMode } from '../models';
 
 export default defineComponent({
   name: 'UserSelector',
@@ -30,64 +26,17 @@ export default defineComponent({
 
     onBeforeMount(() => {
       void userStore.getUsers(false);
-      void userStore.getDisplayNameModeSetting(true);
     });
 
-    const users = computed(() =>
+    const users = computed(() => userStore.users);
-      userStore.users.filter((user) => {
-        let names = filter.value.toLowerCase().split(' ');
-        if (names.length < 1) {
-          return true;
-        }
-        if (names.length === 1) {
-          let name = names[0];
-          return (
-            user.lastname.toLowerCase().includes(name) ||
-            user.firstname.toLowerCase().includes(name)
-          );
-        }
-        if (names.length === 2) {
-          let name1 = names[0];
-          let name2 = names[1];
-          return (
-            (user.lastname.toLowerCase().includes(name1) &&
-              user.firstname.toLowerCase().includes(name2)) ||
-            (user.lastname.toLowerCase().includes(name2) &&
-              user.firstname.toLowerCase().includes(name1))
-          );
-        }
-        return true;
-      })
-    );
-    const filter = ref<string>('');
-    const filterFn = (val: string, update: () => void) => {
-      filter.value = val;
-      update();
-    };
     const selected = computed({
       get: () => props.modelValue,
       set: (value: FG.User | undefined) => (value ? emit('update:modelValue', value) : undefined),
     });
-    function showName(user: FG.User) {
-      switch (userStore.userSettings.display_name) {
-        case DisplayNameMode.DISPLAYNAME:
-          return user.display_name;
-        case DisplayNameMode.FIRSTNAME:
-          return user.firstname;
-        case DisplayNameMode.LASTNAME:
-          return user.lastname;
-        case DisplayNameMode.FIRSTNAME_LASTNAME:
-          return `${user.firstname} ${user.lastname}`;
-        case DisplayNameMode.LASTNAME_FIRSTNAME:
-          return `${user.lastname}, ${user.firstname}`;
-      }
-    }
 
     return {
       selected,
       users,
-      filterFn,
-      showName,
     };
   },
 });

src/components/settings/MainUserSettings.vue

@@ -103,10 +103,7 @@
       </q-file>
     </q-card-section>
     <q-separator v-if="!newUser" />
-    <q-card-section
+    <q-card-section v-if="!newUser" class="fit row justify-start content-center items-center">
-      v-if="!newUser"
-      class="fit row justify-start content-center items-center q-gutter-y-md"
-    >
       <PasswordInput
         v-if="isCurrentUser"
         v-model="password"
@@ -125,12 +122,9 @@
         class="col-xs-12 col-sm-6 q-pa-sm"
       />
     </q-card-section>
-    <q-card-actions :align="removeable ? 'between' : 'right'">
+    <q-card-actions align="right">
-      <q-btn v-if="removeable" label="Löschen" color="negative" @click="remove" />
+      <q-btn label="Reset" type="reset" />
-      <div>
+      <q-btn color="primary" type="submit" label="Speichern" />
-        <q-btn label="Reset" type="reset" style="margin-right: 0.5em" />
-        <q-btn label="Speichern" type="submit" color="primary" />
-      </div>
     </q-card-actions>
   </q-form>
 </template>
@@ -154,10 +148,6 @@ export default defineComponent({
   name: 'MainUserSettings',
   components: { IsoDateInput, PasswordInput },
   props: {
-    removeable: {
-      type: Boolean,
-      default: false,
-    },
     user: {
       required: true,
       type: Object as PropType<FG.User>,
@@ -166,7 +156,6 @@ export default defineComponent({
   },
   emits: {
     'update:user': (payload: FG.User) => !!payload,
-    remove: () => true,
   },
   setup(props, { emit }) {
     const userStore = useUserStore();
@@ -247,7 +236,7 @@ export default defineComponent({
         hasAvatar.value = true;
       } else if (deleteAvatar.value) {
         await userStore.deleteAvatar(changed);
-        hasAvatar.value = false;
+        hasAvatar.value = false
       }
       password.value = '';
     }
@@ -293,7 +282,6 @@ export default defineComponent({
       onAvatarRejected,
       password,
       preview,
-      remove: () => emit('remove'),
       reset,
       save,
       userModel,

src/components/settings/RoleSettings.vue

@@ -17,7 +17,7 @@
             map-options
             clearable
             @new-value="createRole"
-            @update:model-value="updateRole"
+            @update:modelValue="updateRole"
             @clear="removeRole"
           />
         </q-card-section>
@@ -30,7 +30,7 @@
               :options="permissions"
               color="primary"
               type="checkbox"
-              @update:model-value="updatePermissions"
+              @update:modelValue="updatePermissions"
             />
           </q-scroll-area>
         </q-card-section>

src/components/settings/Session.vue

@@ -15,11 +15,7 @@
           <div class="col">Plattform:</div>
           <div class="col">
             <q-icon :name="getPlatformIcon(modelValue.platform)" size="24px" />
-            <q-icon
+            <q-icon v-if="!modelValue.browser" :name="getOS(modelValue.platform)" size="24px" />
-              v-if="getOS(modelValue.platform)"
-              :name="getOS(modelValue.platform)"
-              size="24px"
-            />
           </div>
         </div>
       </div>
@@ -58,7 +54,7 @@ import { useMainStore, useSessionStore } from '@flaschengeist/api';
 import { date } from 'quasar';
 
 export default defineComponent({
-  name: 'UserSession',
+  name: 'Session',
   props: {
     modelValue: {
       required: true,
@@ -82,46 +78,38 @@ export default defineComponent({
     const options = ref(['Minuten', 'Stunden', 'Tage']);
     const option = ref<string>(options.value[0]);
     const lifetime = ref(0);
-    function getBrowserIcon(br: string) {
+    function getBrowserIcon(browser: string) {
-      const browser = br.toLowerCase();
+      console.log('browser', browser);
-      return browser.includes('firefox')
+      return browser == 'firefox'
         ? 'mdi-firefox'
-        : browser.includes('chrome')
+        : browser == 'chrome'
         ? 'mdi-google-chrome'
-        : browser.includes('safari')
+        : browser == 'safari'
         ? 'mdi-apple-safari'
-        : browser.includes('edge')
-        ? 'mdi-microsoft-edge'
-        : browser.includes('opera')
-        ? 'mdi-opera'
-        : browser.includes('ie')
-        ? 'mdi-internet-explorer'
         : 'mdi-help';
     }
 
-    function getPlatformIcon(pl: string) {
+    function getPlatformIcon(platform: string) {
-      const platform = pl.toLowerCase();
       console.log('platform', platform);
-      return platform.includes('linux')
+      return platform == 'linux'
         ? 'mdi-linux'
-        : platform.includes('windows')
+        : platform == 'windows'
         ? 'mdi-microsoft-windows'
-        : platform.includes('mac')
+        : platform == 'macos'
         ? 'mdi-apple'
-        : platform.includes('ios')
+        : platform == 'iphone'
         ? 'mdi-cellphone'
-        : platform.includes('android')
+        : platform == 'android'
         ? 'mdi-cellphone'
         : 'mdi-help';
     }
 
-    function getOS(pl: string) {
+    function getOS(platform: string) {
-      const platform = pl.toLowerCase();
+      return platform == 'iphone'
-      return platform.includes('ios')
         ? 'mdi-apple'
-        : platform.includes('android')
+        : platform == 'android'
         ? 'mdi-android'
-        : false;
+        : 'mdi-help';
     }
 
     async function deleteSession(token: string) {

src/index.ts

@@ -1,7 +1,6 @@
 import { FG_Plugin } from '@flaschengeist/types';
 import { defineAsyncComponent } from 'vue';
 import routes from './routes';
-import { DisplayNameMode } from './models';
 
 const plugin: FG_Plugin.Plugin = {
   id: 'users',
@@ -17,15 +16,6 @@ const plugin: FG_Plugin.Plugin = {
       widget: defineAsyncComponent(() => import('./components/Widget.vue')),
     },
   ],
-  settingWidgets: [
-    {
-      priority: 1,
-      name: 'userSettings',
-      permissions: [],
-      widget: defineAsyncComponent(() => import('./components/SettingWidget.vue')),
-    },
-  ],
 };
 
 export default plugin;
-export { DisplayNameMode };

src/models.ts

@@ -12,12 +12,3 @@ export interface LoginResponse {
 export interface CurrentUserResponse extends FG.User {
   permissions: FG.Permission[];
 }
-
-export enum DisplayNameMode {
-  FIRSTNAME = 'firstname',
-  LASTNAME = 'lastname',
-  FULLNAME = 'fullname',
-  DISPLAYNAME = 'display_name',
-  FIRSTNAME_LASTNAME = 'firstname_lastname',
-  LASTNAME_FIRSTNAME = 'lastname_firstname',
-}

src/pages/AdminSettings.vue

@@ -45,24 +45,18 @@
 
 <script lang="ts">
 import { Screen } from 'quasar';
-import { useRoute, useRouter } from 'vue-router';
-import { onBeforeMount, watch } from 'vue';
 import { PERMISSIONS } from '../permissions';
 import NewUser from '../components/NewUser.vue';
 import { hasPermission } from '@flaschengeist/api';
 import { computed, defineComponent, ref } from 'vue';
 import UpdateUser from '../components/UpdateUser.vue';
 import RoleSettings from '../components/settings/RoleSettings.vue';
-import { useUserStore } from '@flaschengeist/api';
 
 export default defineComponent({
   name: 'AdminSettings',
   components: { RoleSettings, UpdateUser, NewUser },
   setup() {
     const canEditRoles = computed(() => hasPermission(PERMISSIONS.ROLES_EDIT));
-    const route = useRoute();
-    const router = useRouter();
-    const userStore = useUserStore();
 
     interface Tab {
       name: string;
@@ -80,17 +74,6 @@ export default defineComponent({
       { name: 'roles', label: 'Rollen', permissions: [PERMISSIONS.ROLES_EDIT] },
     ];
 
-    onBeforeMount(async () => {
-      if (
-        route.query.keys?.length === 0 ||
-        !tabs.some((value) => value.name == route.query.q_tab)
-      ) {
-        await router.replace({ query: { q_tab: 'user' } });
-      }
-      tab.value = route.query.q_tab as string;
-      void userStore.getUsers(true);
-    });
-
     const _tabs = computed(() =>
       tabs.filter((tab) => {
         return tab.permissions.every((permission) => hasPermission(permission));
@@ -110,10 +93,6 @@ export default defineComponent({
 
     const tab = ref<string>('user');
 
-    watch(tab, async (val) => {
-      await router.replace({ query: { q_tab: val } });
-    });
-
     return {
       canEditRoles,
       showDrawer,

src/pages/Members.vue

@@ -1,153 +0,0 @@
-<template>
-  <q-page>
-    <q-table
-      :columns="cols"
-      :rows="users"
-      :filter="filter"
-      :grid="grid"
-      :pagination="initialPagination"
-    >
-      <template v-slot:body-cell-avatar="props">
-        <q-td :key="props.key" :props="props">
-          <user-avatar v-model="props.row" />
-        </q-td>
-      </template>
-      <template v-slot:top-right="props">
-        <q-input v-model="filter" filled dense debounce="300" placeholder="Suche">
-          <template v-slot:append>
-            <q-icon name="mdi-magnify" />
-          </template>
-        </q-input>
-        <q-btn
-          flat
-          round
-          dense
-          :icon="grid ? 'mdi-land-rows-horizontal' : 'mdi-card-account-details'"
-          @click="grid = !grid"
-        />
-      </template>
-      <template v-slot:item="props">
-        <div class="q-pa-xs col-xs-12 col-sm-6 col-md-4">
-          <q-card bordered>
-            <div class="row justify-center">
-              <q-img :src="avatarURL(props.row.userid)">
-                <template #error>
-                  <div
-                    class="row fit justify-center items-center"
-                    style="background-color: transparent"
-                  >
-                    <img src="no-image.svg" style="object-fit: contain; height: 100%" />
-                  </div>
-                </template>
-              </q-img>
-            </div>
-            <q-card-section>
-              <div class="text-h6">{{ props.row.firstname }} {{ props.row.lastname }}</div>
-              <div class="text-caption">{{ props.row.display_name }}</div>
-            </q-card-section>
-            <q-card-section>
-              <div class="row items-center">
-                <q-btn
-                  flat
-                  dense
-                  icon="mdi-email"
-                  :href="'mailto:' + props.row.mail"
-                  class="q-mr-xs"
-                  no-caps
-                />
-                <div class="text-caption">{{ props.row.mail }}</div>
-              </div>
-              <div class="row items-center">
-                <q-btn
-                  flat
-                  dense
-                  icon="mdi-calendar"
-                  class="q-mr-xs"
-                  no-caps
-                  v-if="props.row.birthday"
-                />
-                <div class="text-caption" v-if="props.row.birthday">
-                  {{ props.row.birthday.toLocaleDateString() }}
-                </div>
-              </div>
-            </q-card-section>
-          </q-card>
-        </div>
-      </template>
-    </q-table>
-  </q-page>
-</template>
-<script lang="ts">
-import { defineComponent, onBeforeMount, computed, ref } from 'vue';
-import { useUserStore, avatarURL } from '@flaschengeist/api';
-import { UserAvatar } from '@flaschengeist/api/components';
-
-const cols = [
-  {
-    name: 'avatar',
-    label: 'Profilbild',
-    sortable: false,
-  },
-  {
-    name: 'firstName',
-    label: 'Vorname',
-    field: 'firstname',
-    sortable: true,
-  },
-  {
-    name: 'lastName',
-    label: 'Nachname',
-    field: 'lastname',
-    sortable: true,
-  },
-  {
-    name: 'displayName',
-    label: 'Anzeigename',
-    field: 'display_name',
-    sortable: true,
-  },
-  {
-    name: 'mail',
-    label: 'E-Mail',
-    field: 'mail',
-    sortable: true,
-  },
-  {
-    name: 'birthday',
-    label: 'Geburtstag',
-    field: 'birthday',
-    sortable: true,
-    format: (val: Date | undefined) => {
-      return val?.toLocaleDateString();
-    },
-  },
-];
-
-export default defineComponent({
-  components: { UserAvatar },
-  setup() {
-    const userStore = useUserStore();
-    onBeforeMount(() => {
-      void userStore.getUsers(true);
-    });
-    const filter = ref('');
-
-    const users = computed(() => userStore.users);
-    const grid = ref(false);
-    return {
-      users,
-      cols,
-      filter,
-      grid,
-      avatarURL,
-      initialPagination: {
-        sortBy: 'lastName',
-        descending: false,
-        page: 1,
-        rowsPerPage: 0,
-        // rowsNumber: xx if getting data from a server
-      },
-    };
-  },
-});
-</script>

src/pages/Settings.vue

@@ -7,32 +7,27 @@
         </q-card-section>
         <MainUserSettings :user="currentUser" @update:user="updateUser" />
       </q-card>
-      <div v-for="(item, index) in widgets" :key="index" class="full-height col-12">
-        <component :is="item.widget" />
-      </div>
       <div class="col-12 text-left text-h6">Aktive Sessions:</div>
-      <user-session
+      <Session
         v-for="(session, index) in sessions"
         :key="'session' + index"
         v-model="sessions[index]"
         @delete="removeSession(session)"
       />
-      <q-btn label="List Widgets" @click="listWidgets" />
     </q-page>
   </div>
 </template>
 
 <script lang="ts">
-import { useMainStore, useUserStore, useSessionStore, hasPermissions } from '@flaschengeist/api';
+import { useMainStore, useUserStore, useSessionStore } from '@flaschengeist/api';
 import MainUserSettings from '../components/settings/MainUserSettings.vue';
-import { defineComponent, onBeforeMount, ref, computed, inject } from 'vue';
+import { defineComponent, onBeforeMount, ref } from 'vue';
-import UserSession from '../components/settings/UserSession.vue';
+import Session from '../components/settings/Session.vue';
-import { FG_Plugin } from '@flaschengeist/types';
 import { Notify } from 'quasar';
 
 export default defineComponent({
   name: 'UserSettings',
-  components: { MainUserSettings, UserSession },
+  components: { Session, MainUserSettings },
   setup() {
     const mainStore = useMainStore();
     const sessionStore = useSessionStore();
@@ -52,29 +47,17 @@ export default defineComponent({
         progress: true,
         actions: [{ icon: 'mdi-close', color: 'white' }],
       });
-      console.log(widgets);
     }
 
     function removeSession(s: FG.Session) {
       sessions.value = sessions.value.filter((ss) => ss.token !== s.token);
     }
 
-    const flaschengeist = inject<FG_Plugin.Flaschengeist>('flaschengeist');
-    const widgets = computed(() =>
-      flaschengeist?.settingWidgets.filter((widget) => hasPermissions(widget.permissions))
-    );
-
-    function listWidgets() {
-      console.log(widgets);
-    }
-
     return {
       currentUser,
       sessions,
       updateUser,
       removeSession,
-      widgets,
-      listWidgets,
     };
   },
 });

src/permissions.ts

@@ -1,17 +1,12 @@
 export const PERMISSIONS = {
-  /* User permissions */
+  // Kann andere Nutzer bearbeiten
-  // Can edit other users
   EDIT_OTHER: 'users_edit_other',
-  // Can assign roles to users
+  // Kann Rollen von Nutzern setzen
   SET_ROLES: 'users_set_roles',
-  // Can delete users
+  // Kann Nutzer löschen
-  DELETE: 'users_delete',
+  DELETE: 'users_delete_other',
-  // Can register new users
+  // Kann neue Nutzer hinzufügen
   REGISTER: 'users_register',
-
+  // Kann Rollen löschen oder bearbeiten, z.b. Rechte hinzufügen etc
-  /* Role permissions */
-  // Can edit roles, assign permissions to roles and change names
   ROLES_EDIT: 'roles_edit',
-  // Can delete roles
-  ROLES_DELETE: 'roles_delete',
 };

src/routes/index.ts

@@ -10,16 +10,6 @@ const mainRoutes: FG_Plugin.MenuRoute[] = [
     permissions: ['user'],
     route: { path: 'user', name: 'user', redirect: { name: 'user-settings' } },
     children: [
-      {
-        title: 'Mitglieder',
-        icon: 'mdi-account-multiple',
-        shortcut: true,
-        route: {
-          path: 'members',
-          name: 'user-members',
-          component: () => import('../pages/Members.vue'),
-        },
-      },
       {
         title: 'Einstellungen',
         icon: 'mdi-account-edit',

tsconfig.json

@@ -1,5 +1,5 @@
 {
-  "extends": "@quasar/app-webpack/tsconfig-preset",
+  "extends": "@quasar/app/tsconfig-preset",
   "target": "esnext",
   "compilerOptions": {
     "baseUrl": "src",