abstracted mute confirmation dialog into its own component. mutes in status actions work now

src/components/user_card/user_card.vue

@@ -311,51 +311,11 @@
       />
     </div>
     <teleport to="#modal">
-      <confirm-modal
-        v-if="showingConfirmMute"
-        :title="$t('user_card.mute_confirm_title')"
-        :confirm-text="$t('user_card.mute_confirm_accept_button')"
-        :cancel-text="$t('user_card.mute_confirm_cancel_button')"
-        @accepted="doMuteUser"
-        @cancelled="hideConfirmMute"
-      >
-        <i18n-t
-          keypath="user_card.mute_confirm"
-          tag="div"
-        >
-          <template #user>
-            <span
-              v-text="user.screen_name_ui"
-            />
-          </template>
-        </i18n-t>
-        <div
-          class="mute-expiry"
-        >
-          <label>
-            {{ $t('user_card.mute_duration_prompt') }}
-          </label>
-          <input
-            v-model="muteExpiryAmount"
-            type="number"
-            class="expiry-amount hide-number-spinner"
-            :min="0"
-          >
-          <Select
-            v-model="muteExpiryUnit"
-            unstyled="true"
-            class="expiry-unit"
-          >
-            <option
-              v-for="unit in muteExpiryUnits"
-              :key="unit"
-              :value="unit"
-            >
-              {{ $t(`time.${unit}_short`, ['']) }}
-            </option>
-          </Select>
-        </div>
-      </confirm-modal>
+      <mute-confirm
+        type="user"
+        :user="this.user"
+        ref="confirmation"
+      />
     </teleport>
   </div>
 </template>