Add local users filter

src/api/users.js

@@ -1,8 +1,8 @@
 import request from '@/utils/request'
 
-export async function fetchUsers(page = 1) {
+export async function fetchUsers(page = 1, showLocalUsers) {
   return await request({
-    url: `/api/pleroma/admin/users?page=${page}`,
+    url: `/api/pleroma/admin/users?page=${page}&local_only=${showLocalUsers}`,
     method: 'get'
   })
 }
@@ -14,11 +14,10 @@ export async function toggleUserActivation(nickname) {
   })
 }
 
-export async function searchUsers(query, page = 1) {
+export async function searchUsers(query, page = 1, showLocalUsers) {
   return await request({
-    url: `/api/pleroma/admin/users/search?query=${query}&page=${page}`,
+    url: `/api/pleroma/admin/users?query=${query}&page=${page}&local_only=${showLocalUsers}`,
     method: 'get'
   })
 }
 
-export default { fetchUsers, toggleUserActivation }

src/store/modules/users.js

@@ -6,7 +6,8 @@ const user = {
     loading: true,
     searchQuery: '',
     totalUsersCount: 0,
-    currentPage: 1
+    currentPage: 1,
+    showLocalUsers: false
   },
   mutations: {
     SET_USERS: (state, users) => {
@@ -35,11 +36,14 @@ const user = {
     },
     SET_SEARCH_QUERY: (state, query) => {
       state.searchQuery = query
+    },
+    SET_LOCAL_USERS_FILTER: (state, value) => {
+      state.showLocalUsers = value
     }
   },
   actions: {
-    async FetchUsers({ commit }, { page }) {
-      const response = await fetchUsers(page)
+    async FetchUsers({ commit, state }, { page }) {
+      const response = await fetchUsers(page, state.showLocalUsers)
 
       commit('SET_LOADING', true)
 
@@ -50,7 +54,7 @@ const user = {
 
       commit('SWAP_USER', response.data)
     },
-    async SearchUsers({ commit, dispatch }, { query, page }) {
+    async SearchUsers({ commit, dispatch, state }, { query, page }) {
       if (query.length === 0) {
         commit('SET_SEARCH_QUERY', query)
         dispatch('FetchUsers', page)
@@ -58,10 +62,14 @@ const user = {
         commit('SET_LOADING', true)
         commit('SET_SEARCH_QUERY', query)
 
-        const response = await searchUsers(query, page)
+        const response = await searchUsers(query, page, state.showLocalUsers)
 
         loadUsers(commit, page, response.data)
       }
+    },
+    async ToggleLocalUsersFilter({ commit, dispatch, state }, value) {
+      commit('SET_LOCAL_USERS_FILTER', value)
+      dispatch('SearchUsers', { query: state.searchQuery, page: 1 })
     }
   }
 }

src/views/users/index.vue

@@ -1,7 +1,10 @@
 <template>
   <div class="users-container">
     <h1>Users</h1>
+    <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>