Repository: mealie-recipes/mealie
Pull request: Fix Issue#1317
<!--
  This template provides some ideas of things to include in your PR description.
  To start, try providing a short summary of your changes in the Title above.
  If a section of the PR template does not apply to this PR, then delete that section.
 -->

## What type of PR is this?


<!--
  Delete any of the following that do not apply:
 -->

- feature

## What this PR does / why we need it:

Currently, one can delete their own admin account without getting any warning text and lock themselves out from the system. This PR aims to solve this problem by providing the user with some warning text if they try to delete their own account, and this feature will prevent the user from accidentally deleting their own account. 

Screenshot Example: 

![Screen Shot 2022-11-22 at 9 42 13 PM](https://user-images.githubusercontent.com/26856199/203417211-5b39ec47-bc40-4a78-8e40-c4a9c153edf2.png)


<!--
  What goal is this change working towards?
  Provide a bullet pointed summary of how each file was changed.
  Briefly explain any decisions you made with respect to the changes.
  Include anything here that you didn't include in *Release Notes*
  above, such as changes to CI or changes to internal methods.
-->

## Which issue(s) this PR fixes:

_(REQUIRED)_

<!--
If this PR fixes one of more issues, list them here.
One line each, like so:
Fixes #123
Fixes #39
-->

Fixes #1317

## Special notes for your reviewer:

- the warning text will appear only for the user's own account whenever they try to delete it

## Testing

<!--
  Describe how you tested this change.
-->

I manually tested this feature on Chrome and Mozilla browsers. 

## Release Notes

_(REQUIRED)_
<!--
  If this PR makes user facing changes, please describe them here. This
  description will be copied into the release notes/changelog, whenever the
  next version is released. Keep this section short, and focus on high level
  changes.
  Put your text between the block. To omit notes, use NONE within the block.
-->

```release-note
- the additional warning text will be prompted if the user attempts to delete their own account.
```


Problem statement:
[v1.0.0b] - You can delete your own admin account while logged in
### First Check

- [X] This is not a feature request
- [X] I added a very descriptive title to this issue.
- [X] I used the GitHub search to find a similar issue and didn't find it.
- [X] I searched the Mealie documentation, with the integrated search.
- [X] I already read the docs and didn't find an answer.

### What is the issue you are experiencing?

You can delete your own account if you are admin, thus locking yourself out of the system. 
I did this on the demo site and it worked perfectly without any issues. 

You should implement a prompt to confirm this request. 
You should disallow the account to be deleted unless there is at least another admin account. 

### Deployment

Docker (Linux)

### Deployment Details

_No response_

Hints from issue discussion:
> You should implement a prompt to confirm this request.

There is a confirmation for deleting a user

> You should disallow the account to be deleted unless there is at least another admin account.

I'm not going to implement this. This page isn't user facing and the implication of administering your own application would be that you can manage users and not delete yourself. 

I'll leave this issue open for a while to see if anyone else wants to implement this. 
That's a fair point but the code does check for demoting one's own admin account (https://github.com/hay-kot/mealie/blob/mealie-next/mealie/routes/admin/admin_management_users.py#L52), seems like a guardrail against deleting it wouldn't be a stretch.
> That's a fair point but the code does check for demoting one's own admin account (https://github.com/hay-kot/mealie/blob/mealie-next/mealie/routes/admin/admin_management_users.py#L52), seems like a guardrail against deleting it wouldn't be a stretch.

As I said. 

> I'll leave this issue open for a while to see if anyone else wants to implement this.

There is already a confirmation screen when deleting a user. Anyone here is welcome to submit a PR to add more safety around this, but I won't be doing it. 


Is there a way to re-create an admin account? I migrated from the previous version and don't seem to have admin access now.

Commit message: add the alert component on User Management

Patch to review:
diff --git a/frontend/pages/admin/manage/users/index.vue b/frontend/pages/admin/manage/users/index.vue
index 28dbf21d874..42221ad8202 100644
--- a/frontend/pages/admin/manage/users/index.vue
+++ b/frontend/pages/admin/manage/users/index.vue
@@ -2,9 +2,21 @@
   <v-container fluid>
     <BaseDialog v-model="deleteDialog" :title="$t('general.confirm')" color="error" @confirm="deleteUser(deleteTarget)">
       <template #activator> </template>
-      <v-card-text>
+
+      <v-card-text
+        v-if="isUserOwnAccount === true">
+        <v-alert
+        text
+        outlined
+        color="deep-orange"
+        >⚠️ Please note that you are trying to delete your own admin account!
+          This action cannot be undone and will permanently delete your account.<br/>
+        </v-alert>
         {{ $t("general.confirm-delete-generic") }}
       </v-card-text>
+      <v-card-text v-else>
+          {{ $t("general.confirm-delete-generic") }}
+      </v-card-text>
     </BaseDialog>
 
     <BaseCardSectionTitle title="User Management"> </BaseCardSectionTitle>
@@ -51,7 +63,8 @@
             @click.stop="
               deleteDialog = true;
               deleteTarget = item.id;
-            "
+              isUserOwnAccount = item.id === user.id ? true : false;
+              "
           >
             <v-icon>
               {{ $globals.icons.delete }}
@@ -65,7 +78,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref, toRefs, useContext, useRouter } from "@nuxtjs/composition-api";
+import { defineComponent, reactive, ref, toRefs, useContext, useRouter, computed } from "@nuxtjs/composition-api";
 import { useAdminApi } from "~/composables/api";
 import { alert } from "~/composables/use-toast";
 import { useUser, useAllUsers } from "~/composables/use-user";
@@ -76,6 +89,9 @@ export default defineComponent({
   setup() {
     const api = useAdminApi();
     const refUserDialog = ref();
+    const { $auth } = useContext();
+
+    const user = computed(() => $auth.user);
 
     const { i18n } = useContext();
 
@@ -84,6 +100,7 @@ export default defineComponent({
     const state = reactive({
       deleteDialog: false,
       deleteTarget: 0,
+      isUserOwnAccount: false,
       search: "",
     });
 
@@ -130,6 +147,7 @@ export default defineComponent({
       loading,
       refUserDialog,
       users,
+      user,
       handleRowClick,
     };
   },


Code review comments:
diff_hunk: @@ -2,9 +2,21 @@
   <v-container fluid>
     <BaseDialog v-model="deleteDialog" :title="$t('general.confirm')" color="error" @confirm="deleteUser(deleteTarget)">
       <template #activator> </template>
-      <v-card-text>
+
+      <v-card-text
+        v-if="isUserOwnAccount === true">
+        <v-alert
+        text
+        outlined
+        color="deep-orange"
+        >⚠️ Please note that you are trying to delete your own admin account!
path: frontend/pages/admin/manage/users/index.vue
text: @user1:
Should put this inside a language file so it's more easily translatable

@author:
Thanks for the feedback! I put the text inside the language file.