wip, added popovers and dialogs for user options, made modal timeline a little bit less painful to look at

src/components/confirm_modal/generic_confirm.js

@@ -3,10 +3,6 @@ import ConfirmModal from './confirm_modal.vue'
 
 export default {
   props: {
-    action: {
-      type: Function,
-      require: true
-    },
     title: {
       type: String
     },
@@ -17,7 +13,7 @@ export default {
       type: String
     }
   },
-  emits: ['hide', 'show'],
+  emits: ['hide', 'show', 'action'],
   data: () => ({
     showing: false
   }),
@@ -34,7 +30,7 @@ export default {
       this.$emit('hide')
     },
     doGeneric () {
-      this.action()
+      this.$emit('action')
       this.hide()
     }
   }

src/components/settings_modal/admin_tabs/admin_card.js

@@ -222,19 +222,19 @@ const AdminCard = {
       const res = store.dispatch('adminListStatuses', { user: u,  opts: { pageSize: opts.pageSize, godmode: true, withReblogs: true}})
       return res.then(r => r.activities)
     },
-    /**
-     * ...
-     */
     confirmAction (box) {
       this.$refs[box].show()
       this.$refs.dropdownuser.hidePopover()
     },
-    /**
+    userActionConfirmed (action) {
-     * ...
-     */
-    actionConfirmed (action) {
-      console.log(action)
       this.$store.dispatch(action, this.$store.getters.findUser(this.userDetails.id))
+    },
+    statusActionConfirmed (action, opts) {
+      const s = this.$refs.statusList.getSelected()
+      s.forEach(p => {
+        this.$store.dispatch(action, { id: p.id, ...(opts || {})})
+      })
+      this.reset()
     }
   }
 }

src/components/settings_modal/admin_tabs/admin_card.vue

@@ -56,7 +56,10 @@
             </button>
           </template>
           <template #content>
-            <div class="dropdown-menu">
+            <div
+              v-if="!isActivated"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -66,7 +69,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="isActivated"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -86,7 +92,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+                v-if="!isAdmin"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -96,7 +105,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="isAdmin"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -106,7 +118,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="!isModerator"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -116,7 +131,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="isModerator"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -126,7 +144,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="isApproved"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -136,7 +157,10 @@
                 </button>
               </div>
             </div>
-            <div class="dropdown-menu">
+            <div
+              v-if="isConfirmed"
+              class="dropdown-menu"
+            >
               <div class="menu-item dropdown-item">
                 <button
                   class="main-button"
@@ -186,10 +210,60 @@
           :no-background="false"
           @backdrop-clicked="() => { detailsExpanded = false }"
         >
-          <div style="background-color: rgb(0 0 0 / 50%)">
+          <div style="background-color: rgb(80 80 80 / 100%); width: 80%; height: 60%; overflow-y: auto;">
-            <ul class="setting-list">
+            <PageList
-              <li> show statuses </li>
+              ref="timelineList"
-            </ul>
+              :refresh="true"
+              :get-key="i => i"
+              :box-only="true"
+              :page-size="20"
+              :single-page="true"
+              :fetch-page="(store, opts) => fetchStatuses(store, opts)"
+            >
+              <template #header>
+                <p> add options to sort statuses </p>
+                <Popover
+                  ref="dropdownstatus"
+                  trigger="click"
+                  placement="top"
+                >
+                  <template #trigger>
+                    <button
+                      class="button button-default btn"
+                    >
+                      {{ $t('admin_dash.user.title_actions') }}
+                    </button>
+                  </template>
+                  <template #content>
+                    <div class="dropdown-menu">
+                      <div class="menu-item dropdown-item">
+                        <button
+                          class="main-button"
+                          @click="confirmAction('confirmDeleteStatus')"
+                        >
+                          {{ $t('admin_dash.users.delete_status') }}
+                        </button>
+                      </div>
+                      <p> set sensitive </p>
+                      <p> unset sensitive </p>
+                      <p> make public </p>
+                      <p> make unlisted </p>
+                      <p> make private </p>
+                      <p> make direct </p>
+                    </div>
+                  </template>
+                </Popover>
+              </template>
+              <template #item="{item}">
+                <AdminStatusCard :status-details="item" />
+              </template>
+              <template #empty>
+                <p> {{ $t('admin_dash.users.user_has_no_posts') }} </p>
+              </template>
+              <template #load>
+                <p> {{ $t('admin_dash.users.loading') }} </p>
+              </template>
+            </PageList>
           </div>
           <!--
           <ul class="setting-list">
@@ -380,67 +454,100 @@
     </div>
     <GenericConfirm
       ref="confirmActivate"
+      style="z-index: 10000;"
       :title="$t('admin_dash.users.bulk_actions.activate')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      :action="() => actionConfirmed('adminActivateUser')"
+      @action="userActionConfirmed('adminActivateUser')"
     />
     <GenericConfirm
       ref="confirmDeactivate"
+      style="z-index: 10000;"
       :title="$t('admin_dash.users.bulk_actions.deactivate')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      :action="() => actionConfirmed('adminDeactivateUser')"
+      @action="userActionConfirmed('adminDeactivateUser')"
-    />
-    <!--<GenericConfirm
-      ref="confirmDelete"
-      :title="$t('admin_dash.users.bulk_actions.activate')"
-      :cancel-text="$t('admin_dash.users.bulk_actions.no')"
-      :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminDeleteStatus')"
     />
     <GenericConfirm
-      ref="confirmSetSensitive"
+      ref="confirmDeleteUser"
-      :title="$t('admin_dash.users.bulk_actions.change_sensitivity')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.delete_user')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { sensitive: true })"
+      @action="userActionConfirmed('adminDeleteUser')"
     />
     <GenericConfirm
-      ref="confirmUnsetSensitive"
+      ref="confirmGrantAdmin"
-      :title="$t('admin_dash.users.bulk_actions.unmark_as_sensitive')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.grant_moderator')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { sensitive: false })"
+      @action="userActionConfirmed('adminAddUserToAdminGroup')"
     />
     <GenericConfirm
-      ref="confirmSetPublic"
+      ref="confirmRevokeAdmin"
-      :title="$t('admin_dash.users.bulk_actions.mark_as_public')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.revoke_admin')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { visiblity: 'public' })"
+      @action="userActionConfirmed('adminRemoveUserFromAdminGroup')"
     />
     <GenericConfirm
-      ref="confirmSetUnlisted"
+      ref="confirmGrantModerator"
-      :title="$t('admin_dash.users.bulk_actions.mark_as_unlisted')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.grant_moderator')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { visiblity: 'unlisted' })"
+      @action="userActionConfirmed('adminAddUserToModeratorGroup')"
     />
     <GenericConfirm
-      ref="confirmSetPrivate"
+      ref="confirmRevokeModerator"
-      :title="$t('admin_dash.users.bulk_actions.mark_as_private')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.revoke_moderator')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { visiblity: 'private' })"
+      @action="userActionConfirmed('adminRemoveUserFromModeratorGroup')"
     />
     <GenericConfirm
-      ref="confirmSetDirect"
+      ref="confirmApprove"
-      :title="$t('admin_dash.users.bulk_actions.mark_as_direct')"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.approve')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminChangeStatusScope', { visiblity: 'direct' })"
+      @action="userActionConfirmed('adminApproveUser')"
-    />-->
+    />
+    <GenericConfirm
+      ref="confirmConfirm"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.confirm')"
+      :cancel-text="$t('admin_dash.users.bulk_actions.no')"
+      :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
+      @action="userActionConfirmed('adminConfirmUser')"
+    />
+    <GenericConfirm
+      ref="confirmResendConfirmationEmail"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.resend_confirmation_email')"
+      :cancel-text="$t('admin_dash.users.bulk_actions.no')"
+      :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
+      @action="userActionConfirmed('adminResendConfirmationEmail')"
+    />
+    <GenericConfirm
+      ref="confirmRequirePasswordChange"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.require_password_change')"
+      :cancel-text="$t('admin_dash.users.bulk_actions.no')"
+      :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
+      @action="userActionConfirmed('adminRequirePasswordChange')"
+    />
+    <GenericConfirm
+      ref="confirmDisableMFA"
+      style="z-index: 10000;"
+      :title="$t('admin_dash.users.bulk_actions.disable_mfa')"
+      :cancel-text="$t('admin_dash.users.bulk_actions.no')"
+      :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
+      @action="userActionConfirmed('adminDisableMFA')"
+    />
   </div>
 </template>
 

src/components/settings_modal/admin_tabs/admin_status_card.vue

@@ -27,6 +27,8 @@
           @interacted="false"
         />
       </li>
+      <p> action dropdown thingy </p>
+      <!--
       <li>
         <button
           class="button button-default btn"
@@ -74,7 +76,9 @@
       <li>
         <a :href="statusDetails.url"> {{ $t('admin_dash.users.link_source') }} </a>
       </li>
+      -->
     </ul>
+    <!--
     <div v-if="!jsonExpanded">
       <button
         class="button button-default btn"
@@ -95,6 +99,7 @@
       <h2> {{ $t('admin_dash.users.title_details') }} </h2>
       <pre> {{ JSON.stringify(statusDetails, null, 2) }} </pre>
     </div>
+    -->
   </div>
 </template>
 

src/components/settings_modal/admin_tabs/users_tab.vue

@@ -243,84 +243,84 @@
       :title="$t('admin_dash.users.bulk_actions.activate')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminActivateUser')"
+      @action="selectionConfirmed('adminActivateUser')"
     />
     <GenericConfirm
       ref="confirmDeactivate"
       :title="$t('admin_dash.users.bulk_actions.deactivate')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminDeactivateUser')"
+      @action="selectionConfirmed('adminDeactivateUser')"
     />
     <GenericConfirm
       ref="confirmDelete"
       :title="$t('admin_dash.users.bulk_actions.delete')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminDeleteUser')"
+      @action="selectionConfirmed('adminDeleteUser')"
     />
     <GenericConfirm
       ref="confirmGrantAdmin"
       :title="$t('admin_dash.users.bulk_actions.grant_admin')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminAddUserToAdminGroup')"
+      @action="selectionConfirmed('adminAddUserToAdminGroup')"
     />
     <GenericConfirm
       ref="confirmRevokeAdmin"
       :title="$t('admin_dash.users.bulk_actions.revoke_admin')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminRemoveUserFromAdminGroup')"
+      @action="selectionConfirmed('adminRemoveUserFromAdminGroup')"
     />
     <GenericConfirm
       ref="confirmGrantModerator"
       :title="$t('admin_dash.users.bulk_actions.grant_moderator')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminAddUserToModeratorGroup')"
+      @action="selectionConfirmed('adminAddUserToModeratorGroup')"
     />
     <GenericConfirm
       ref="confirmRevokeModerator"
       :title="$t('admin_dash.users.bulk_actions.revoke_moderator')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminRemoveUserFromModeratorGroup')"
+      @action="selectionConfirmed('adminRemoveUserFromModeratorGroup')"
     />
     <GenericConfirm
       ref="confirmApprove"
       :title="$t('admin_dash.users.bulk_actions.approve')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminApproveUser')"
+      @action="selectionConfirmed('adminApproveUser')"
     />
     <GenericConfirm
       ref="confirmConfirm"
       :title="$t('admin_dash.users.bulk_actions.confirm')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminConfirmUser')"
+      @action="selectionConfirmed('adminConfirmUser')"
     />
     <GenericConfirm
       ref="confirmResendEmail"
       :title="$t('admin_dash.users.bulk_actions.resend_confirmation_email')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminResendConfirmationEmail')"
+      @action="selectionConfirmed('adminResendConfirmationEmail')"
     />
     <GenericConfirm
       ref="confirmRequirePasswordChange"
       :title="$t('admin_dash.users.bulk_actions.require_password_change')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminRequirePasswordChange')"
+      @action="selectionConfirmed('adminRequirePasswordChange')"
     />
     <GenericConfirm
       ref="confirmDisableMFA"
       :title="$t('admin_dash.users.bulk_actions.disable_mfa')"
       :cancel-text="$t('admin_dash.users.bulk_actions.no')"
       :confirm-text="$t('admin_dash.users.bulk_actions.yes')"
-      @callback="selectionConfirmed('adminDisableMFA')"
+      @action="selectionConfirmed('adminDisableMFA')"
     />
   </div>
 </template>

src/i18n/en.json

@@ -1172,13 +1172,67 @@
       "only_unapproved": "Unapproved Only",
       "only_unconfirmed": "Unconfirmed Only",
       "refresh": "Refresh",
+
+      "actions": {
+        "button": {
+          "title": "Actions",
+          "yes": "Confirm",
+          "no": "Abort",
+          "activate": "Activate",
+          "deactivate": "Deactivate",
+          "delete_user": "Delete",
+          "delete_status": "Delete",
+          "grant_admin": "Grant Admin",
+          "revoke_admin": "Revoke Admin",
+          "grant_moderator": "Grant Moderator",
+          "revoke_moderator": "Revoke Moderator",
+          "approve": "Approve",
+          "confirm": "Confirm",
+          "require_password_change": "Require Password Change",
+          "resend_confirmation_email": "Resend Confirmation Email",
+          "disable_mfa": "Disable MFA"
+        },
+        "confirm_single": {
+          "activate": "Activate User?",
+          "deactivate": "Deactivate User?",
+          "delete_user": "Delete User?",
+          "delete_status": "Delete Status?",
+          "grant_admin": "Grant Admin Privileges?",
+          "revoke_admin": "Revoke Admin Privileges?",
+          "grant_moderator": "Grant Moderator Privileges?",
+          "revoke_moderator": "Revoke Moderator Privileges?",
+          "approve": "Approve User?",
+          "confirm": "Confirm User?",
+          "require_password_change": "Require Password Change?",
+          "resend_confirmation_email": "Resend Confirmation Email?",
+          "disable_mfa": "Disable MFA?"
+        },
+        "confirm_multi": {
+          "activate": "Actiate Selected Users?",
+          "deactivate": "Deactivate Selected Users?",
+          "delete_user": "Delete Selected Users?",
+          "delete_status": "Delete Selected Statuses?",
+          "grant_admin": "Grant Admin Privileges For Selected Users?",
+          "revoke_admin": "Revoke Admin Privileges For Selected Users?",
+          "grant_moderator": "Grant Moderator Privileges For Selected Users?",
+          "revoke_moderator": "Revoke Moderator Privileges For Selected Users?",
+          "approve": "Approve Selected Users?",
+          "confirm": "Confirm Selected Users?",
+          "require_password_change": "Require Password Change For Selected Users?",
+          "resend_confirmation_email": "Resend Confirmation Email For Selected Users?",
+          "disable_mfa": "Disable MFA For Selected Users?"
+
+        }
+      },
+
       "bulk_actions": {
         "title": "Bulk Actions",
         "yes": "Yes",
         "no": "No",
         "activate": "Activate Selected Users?",
         "deactivate": "Deactivate Selected Users?",
-        "delete": "Delete Selected Users?",
+        "delete_user": "Delete Selected Users?",
+        "delete_status": "Delete Selected Statuses?",
         "grant_admin": "Grant Admin Privileges To Selected Users?",
         "revoke_admin": "Revoke Admin Privileges From Selected Users?",
         "grant_moderator": "Grant Moderator Privileges To Selected Users?",
@@ -1189,8 +1243,9 @@
         "resend_confirmation_email": "Resend Confirmation Email For Selected Users?",
         "disable_mfa": "Disable MFA For Selected Users?"
       },
-      "activate": "Activate",
+      "activate": "Activate?",
-      "deactivate": "Deactivate",
+      "deactivate": "Deactivate?",
+      "delete_user": "Delete User?",
       "resend_confirmation_email": "Resend confirmation email",
       "approve": "Approve",
       "grant_admin": "Grant Admin",

src/modules/adminSettings.js

@@ -71,7 +71,7 @@ const adminSettingsStorage = {
     },
     adminRemoveUserFromAdminGroup (store, user) {
        // prevent revokation of own rights
-       if (user.id !== store.state.users.currentUser.id) {
+       if (user.id !== store.rootState.users.currentUser.id) {
           return store.rootState.api.backendInteractor.adminRemoveUserFromAdminGroup({ user })
              .then(res => store.commit('updateRight', { user, right: 'admin', value: res.is_admin }))
        }