diff --git a/src/components/mod_modal/mod_modal_content.js b/src/components/mod_modal/mod_modal_content.js
index e0ba6259..f1637e73 100644
--- a/src/components/mod_modal/mod_modal_content.js
+++ b/src/components/mod_modal/mod_modal_content.js
@@ -2,7 +2,7 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import ReportsTab from './tabs/reports_tab/reports_tab.vue'
// import StatusesTab from './tabs/statuses_tab.vue'
-// import UsersTab from './tabs/users_tab.vue'
+import UsersTab from './tabs/users_tab/users_tab.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@@ -21,9 +21,9 @@ const ModModalContent = {
components: {
TabSwitcher,
- ReportsTab
+ ReportsTab,
// StatusesTab,
- // UsersTab
+ UsersTab
},
computed: {
open () {
diff --git a/src/components/mod_modal/mod_modal_content.vue b/src/components/mod_modal/mod_modal_content.vue
index 6fa32be1..c4b964b9 100644
--- a/src/components/mod_modal/mod_modal_content.vue
+++ b/src/components/mod_modal/mod_modal_content.vue
@@ -13,6 +13,13 @@
>
+
+
+
diff --git a/src/components/mod_modal/tabs/users_tab/users_tab.js b/src/components/mod_modal/tabs/users_tab/users_tab.js
new file mode 100644
index 00000000..025334e2
--- /dev/null
+++ b/src/components/mod_modal/tabs/users_tab/users_tab.js
@@ -0,0 +1,70 @@
+import Popover from 'src/components/popover/popover.vue'
+
+import { forEach } from 'lodash'
+
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+ faFilter,
+ faSearch
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+ faFilter,
+ faSearch
+)
+
+const UsersTab = {
+ data () {
+ return {
+ accountType: {
+ local: true,
+ external: false,
+ all: false
+ },
+ status: {
+ active: true,
+ deactivated: false,
+ pending: false,
+ unconfirmed: false,
+ all: false
+ },
+ actorType: {
+ person: true,
+ bot: true,
+ application: true,
+ all: true
+ }
+ }
+ },
+ components: {
+ Popover
+ },
+ methods: {
+ setAccountType (type) {
+ if (type === 'all') {
+ forEach(this.accountType, (k, v) => { this.accountType[v] = true })
+ } else {
+ forEach(this.accountType, (k, v) => { this.accountType[v] = false })
+ this.accountType[type] = true
+ }
+ },
+ setStatus (status) {
+ if (status === 'all') {
+ forEach(this.status, (k, v) => { this.status[v] = true })
+ } else {
+ forEach(this.status, (k, v) => { this.status[v] = false })
+ this.status[status] = true
+ }
+ },
+ setActorType (type) {
+ if (type === 'all') {
+ forEach(this.actorType, (k, v) => { this.actorType[v] = true })
+ } else {
+ forEach(this.actorType, (k, v) => { this.actorType[v] = false })
+ this.actorType[type] = true
+ }
+ }
+ }
+}
+
+export default UsersTab
diff --git a/src/components/mod_modal/tabs/users_tab/users_tab.scss b/src/components/mod_modal/tabs/users_tab/users_tab.scss
new file mode 100644
index 00000000..09a323ee
--- /dev/null
+++ b/src/components/mod_modal/tabs/users_tab/users_tab.scss
@@ -0,0 +1,25 @@
+@import '../../../../_variables.scss';
+
+.reports-header .right-side {
+ display: flex;
+ align-items: center;
+
+ .search-input-container {
+ padding: 0.8rem;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .search-input {
+ width: 100%;
+ line-height: 1.125rem;
+ font-size: 1rem;
+ padding: 0.5rem;
+ box-sizing: border-box;
+ }
+
+ .search-icon {
+ margin-right: 0.3em;
+ }
+ }
+}
diff --git a/src/components/mod_modal/tabs/users_tab/users_tab.vue b/src/components/mod_modal/tabs/users_tab/users_tab.vue
new file mode 100644
index 00000000..b540fb00
--- /dev/null
+++ b/src/components/mod_modal/tabs/users_tab/users_tab.vue
@@ -0,0 +1,170 @@
+
+
+
+
+
+
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 534f1c1c..fb4cf9e3 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -294,7 +294,20 @@
"tags": "Set post restrictions"
},
"statuses": "Posts",
- "users": "Users"
+ "users": {
+ "users": "Users",
+ "filter": {
+ "active": "Active",
+ "all": "All accounts",
+ "application": "Application",
+ "bot": "Bot",
+ "deactivated": "Deactivated",
+ "external": "External",
+ "local": "Local",
+ "pending": "Pending Approval",
+ "person": "Person",
+ "unconfirmed": "Unconfirmed"
+ }
},
"nav": {
"about": "About",