47 lines
1.1 KiB
Vue
47 lines
1.1 KiB
Vue
<template>
|
|
<BaseModal
|
|
:show="!!user"
|
|
aria-labelledby="delete-user-title"
|
|
@close="$emit('close')"
|
|
>
|
|
<div
|
|
v-if="user"
|
|
class="kestrel-card-modal w-full max-w-sm p-4"
|
|
>
|
|
<h3
|
|
id="delete-user-title"
|
|
class="mb-2 text-sm font-medium text-kestrel-text"
|
|
>
|
|
Delete user?
|
|
</h3>
|
|
<p class="mb-4 text-sm text-kestrel-muted">
|
|
Are you sure you want to delete <strong class="text-kestrel-text">{{ user.identifier }}</strong>? They will not be able to sign in again.
|
|
</p>
|
|
<div class="flex justify-end gap-2">
|
|
<button
|
|
type="button"
|
|
class="kestrel-btn-secondary"
|
|
@click="$emit('close')"
|
|
>
|
|
Cancel
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="rounded border border-red-500/60 bg-red-500/10 px-3 py-1.5 text-sm text-red-400 hover:bg-red-500/20"
|
|
@click="$emit('confirm')"
|
|
>
|
|
Delete
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</BaseModal>
|
|
</template>
|
|
|
|
<script setup>
|
|
defineProps({
|
|
user: { type: Object, default: null },
|
|
})
|
|
|
|
defineEmits(['close', 'confirm'])
|
|
</script>
|