Convert Users settings page to use new component

This commit moves the Users settings page to use the new Settings
Content component. Similar to the Libraries page, this one is already a
component. I mimiced the behavior of the existing libraries component to
get the same functionality needed here

client/components/tables/UsersTable.vue

@@ -1,12 +1,5 @@
 <template>
-  <div class="bg-bg rounded-md shadow-lg border border-white border-opacity-5 p-4 mb-8">
-    <div class="flex items-center mb-2">
-      <h1 class="text-xl">{{ $strings.HeaderUsers }}</h1>
-      <div class="mx-2 w-7 h-7 flex items-center justify-center rounded-full cursor-pointer hover:bg-white hover:bg-opacity-10 text-center" @click="clickAddUser">
-        <span class="material-icons" style="font-size: 1.4rem">add</span>
-      </div>
-    </div>
-
+  <div>
     <div class="text-center">
       <table id="accounts">
         <tr>

client/pages/config/users/index.vue

@@ -1,16 +1,27 @@
 <template>
   <div>
-    <tables-users-table />
+    <app-settings-content :headerText="$strings.HeaderUsers" showAddButton=true @clicked="setShowUserModal">
+      <tables-users-table />
+    </app-settings-content>
+    <modals-account-modal ref="accountModal" v-model="showAccountModal" :account="selectedAccount" />
   </div>
 </template>
 
 <script>
 export default {
   data() {
-    return {}
+    return {
+      selectedAccount: null,
+      showAccountModal: false,
+    }
   },
   computed: {},
-  methods: {},
+  methods: {
+    setShowUserModal(selectedAccount) {
+      this.selectedAccount = selectedAccount
+      this.showAccountModal = true
+    }
+  },
   mounted() {}
 }
 </script>