Add filtration for local users

src/api/users.js

@@ -16,9 +16,15 @@ export async function toggleUserActivation(nickname) {
 
 export async function searchUsers(query, page = 1) {
   return await request({
-    url: `/api/pleroma/admin/users/search?query=${query}&page=${page}`,
+    url: `/api/pleroma/admin/users?query=${query}&page=${page}`,
+    method: 'get'
+  })
+}
+
+export async function fetchLocalUsers(page = 1) {
+  return await request({
+    url: `/api/pleroma/admin/users?page=${page}&local_only=true`,
     method: 'get'
   })
 }
 
-export default { fetchUsers, toggleUserActivation }

src/store/modules/users.js

@@ -1,4 +1,4 @@
-import { fetchUsers, toggleUserActivation, searchUsers } from '@/api/users'
+import { fetchUsers, toggleUserActivation, searchUsers, fetchLocalUsers } from '@/api/users'
 
 const user = {
   state: {
@@ -6,7 +6,8 @@ const user = {
     loading: true,
     searchQuery: '',
     totalUsersCount: 0,
-    currentPage: 1
+    currentPage: 1,
+    showLocalUsers: false
   },
   mutations: {
     SET_USERS: (state, users) => {
@@ -35,6 +36,9 @@ const user = {
     },
     SET_SEARCH_QUERY: (state, query) => {
       state.searchQuery = query
+    },
+    SET_LOCAL_USERS_FILTER: (state, value) => {
+      state.showLocalUsers = value
     }
   },
   actions: {
@@ -62,6 +66,16 @@ const user = {
 
         loadUsers(commit, page, response.data)
       }
+    },
+    async ToggleLocalUsersFilter({ commit, dispatch }, value) {
+      commit('SET_LOCAL_USERS_FILTER', value)
+
+      if (value) {
+        const response = await fetchLocalUsers()
+        loadUsers(commit, 1, response.data)
+      } else {
+        dispatch('FetchUsers', 1)
+      }
     }
   }
 }

src/views/users/index.vue

@@ -1,7 +1,10 @@
 <template>
   <div class="users-container">
     <h1>Users</h1>
-    <el-input placeholder="Search" class="search" @input="handleDebounceSearchInput"/>
+    <div class="searchContainer">
+      <el-checkbox :value="showLocalUsers" @change="handleLocalUsersCheckbox">Show local users only</el-checkbox>
+      <el-input placeholder="Search" class="search" @input="handleDebounceSearchInput"/>
+    </div>
     <el-table v-loading="loading" :data="users" style="width: 100%">
       <el-table-column prop="id" label="ID" width="180"/>
       <el-table-column prop="nickname" label="Name"/>
@@ -56,6 +59,9 @@ export default {
     },
     currentPage() {
       return this.$store.state.users.currentPage
+    },
+    showLocalUsers() {
+      return this.$store.state.users.showLocalUsers
     }
   },
   created() {
@@ -80,6 +86,9 @@ export default {
     },
     showDeactivatedButton(id) {
       return this.$store.state.user.id !== id
+    },
+    handleLocalUsersCheckbox(e) {
+      this.$store.dispatch('ToggleLocalUsersFilter', e)
     }
   }
 }
@@ -102,5 +111,11 @@ export default {
     margin-right: 15px;
     float: right;
   }
+  .searchContainer {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    margin-left: 15px;
+  }
 }
 </style>