add more responsiveness when updating self admin

This commit is contained in:
bytedream 2023-08-28 18:46:41 +02:00
parent 90cb1fea87
commit 6d4ad29379
5 changed files with 51 additions and 29 deletions
src
lib
components/Input
server
routes/admin/admin

@ -4,7 +4,7 @@
export let id: string | null = null; export let id: string | null = null;
export let name: string | null = null; export let name: string | null = null;
export let disabled = true; export let disabled = false;
export let available: string[] | { [key: string]: T } = {}; export let available: string[] | { [key: string]: T } = {};
export let value: T[] = []; export let value: T[] = [];
</script> </script>
@ -37,14 +37,17 @@
<div class="flex flow flex-wrap gap-2"> <div class="flex flow flex-wrap gap-2">
{#each value as badge, i} {#each value as badge, i}
{#if Object.values(available).indexOf(badge) !== -1} {#if Object.values(available).indexOf(badge) !== -1}
<div class="badge badge-outline gap-1"> <div class="badge badge-outline gap-1" class:brightness-[60%]={disabled}>
<span class:cursor-not-allowed={disabled}>
<button <button
{disabled} {disabled}
class:pointer-events-none={disabled}
on:click={() => { on:click={() => {
value.splice(i, 1); value.splice(i, 1);
value = value; value = value;
}}>✕</button }}>✕</button
> >
</span>
{Object.keys(available)[Object.values(available).indexOf(badge)]} {Object.keys(available)[Object.values(available).indexOf(badge)]}
</div> </div>
{/if} {/if}

@ -55,7 +55,7 @@ export class Admin extends Model {
@BeforeCreate @BeforeCreate
@BeforeUpdate @BeforeUpdate
static hashPassword(instance: Admin) { static hashPassword(instance: Admin) {
if (instance.password != null) { if ((instance.changed() || []).indexOf('password') != -1) {
instance.password = bcrypt.hashSync(instance.password, 10); instance.password = bcrypt.hashSync(instance.password, 10);
} }
} }

@ -9,8 +9,15 @@ export const load: PageServerLoad = async ({ cookies }) => {
admins = await Admin.findAll({ attributes: { exclude: ['password'] } }); admins = await Admin.findAll({ attributes: { exclude: ['password'] } });
} }
const session = getSession(cookies);
return { return {
admins: JSON.parse(JSON.stringify(admins)), admins: admins.map((v) => {
permissions: getSession(cookies.get('session') || '')!.permissions.value const vv = JSON.parse(JSON.stringify(v));
vv.permissions = v.permissions.asArray();
return vv;
}) as (Admin & { [key: string]: any })[],
id: session?.userId,
permissions: session?.permissions.value || 0
}; };
}; };

@ -7,6 +7,7 @@
import { env } from '$env/dynamic/public'; import { env } from '$env/dynamic/public';
import ErrorToast from '$lib/components/Toast/ErrorToast.svelte'; import ErrorToast from '$lib/components/Toast/ErrorToast.svelte';
import { buttonTriggeredRequest } from '$lib/components/utils'; import { buttonTriggeredRequest } from '$lib/components/utils';
import { goto } from '$app/navigation';
let allPermissionBadges = { let allPermissionBadges = {
'Admin Read': Permissions.AdminRead, 'Admin Read': Permissions.AdminRead,
@ -40,7 +41,7 @@
id: number, id: number,
username: string | null, username: string | null,
password: string | null, password: string | null,
permissions: Permissions | null updatePermissions: Permissions | null
) { ) {
const response = await fetch(`${env.PUBLIC_BASE_PATH}/admin/admin`, { const response = await fetch(`${env.PUBLIC_BASE_PATH}/admin/admin`, {
method: 'PATCH', method: 'PATCH',
@ -48,10 +49,14 @@
id: id, id: id,
username: username, username: username,
password: password, password: password,
permissions: permissions?.value permissions: updatePermissions?.value
}) })
}); });
if (!response.ok) { if (response.ok) {
if (id === data.id && updatePermissions) {
permissions = updatePermissions;
}
} else {
throw new Error(); throw new Error();
} }
} }
@ -64,11 +69,15 @@
}) })
}); });
if (response.ok) { if (response.ok) {
if (id === data.id) {
await goto(`${env.PUBLIC_BASE_PATH}/`);
} else {
data.admins.splice( data.admins.splice(
data.admins.find((v: typeof data.admins) => v.id == id), data.admins.findIndex((v) => v.id == id),
1 1
); );
data.admins = data.admins; data.admins = data.admins;
}
} else { } else {
throw new Error(); throw new Error();
} }
@ -104,20 +113,21 @@
<td <td
><Input ><Input
type="text" type="text"
value={admin.username} bind:value={admin.username}
disabled={!permissions.adminWrite() || !admin.edit} disabled={!permissions.adminWrite() || !admin.edit}
/></td /></td
> >
<td <td
><Input ><Input
type="password" type="password"
bind:value={admin.password}
placeholder="Neues Passwort..." placeholder="Neues Passwort..."
disabled={!permissions.adminWrite() || !admin.edit} disabled={!permissions.adminWrite() || !admin.edit}
/></td /></td
> >
<td <td
><Badges ><Badges
value={new Permissions(admin.permissions).asArray()} bind:value={admin.permissions}
available={allPermissionBadges} available={allPermissionBadges}
disabled={!permissions.adminWrite() || !admin.edit} disabled={!permissions.adminWrite() || !admin.edit}
/></td /></td
@ -139,6 +149,7 @@
new Permissions(admin.permissions) new Permissions(admin.permissions)
) )
); );
admin.password = '';
admin.edit = false; admin.edit = false;
}} }}
> >
@ -151,6 +162,7 @@
disabled={!permissions.adminWrite()} disabled={!permissions.adminWrite()}
on:click={() => { on:click={() => {
admin.username = admin.before.username; admin.username = admin.before.username;
admin.password = admin.before.password;
admin.permissions = admin.before.permissions; admin.permissions = admin.before.permissions;
admin.edit = false; admin.edit = false;
}} }}
@ -167,6 +179,7 @@
admin.edit = true; admin.edit = true;
admin.before = { admin.before = {
username: admin.username, username: admin.username,
password: admin.password,
permissions: admin.permissions permissions: admin.permissions
}; };
}} }}

@ -55,18 +55,17 @@ export const PATCH = (async ({ request, cookies }) => {
}); });
} }
const updatePayload: { [key: string]: any } = {}; const user = await Admin.findOne({ where: { id: id } });
if (data['username']) updatePayload.username = data['username'];
if (data['password']) updatePayload.password = data['password'];
if (data['permissions']) updatePayload.permissions = new Permissions(data['permissions']);
let user = await Admin.findOne({ where: { id: id } });
if (!user) { if (!user) {
return new Response(null, { return new Response(null, {
status: 400 status: 400
}); });
} }
user = await user.update(updatePayload);
if (data['username']) user.username = data['username'];
if (data['password']) user.password = data['password'];
if (data['permissions']) user.permissions = new Permissions(data['permissions']);
await user.save();
updateAllUserSessions(user.id, { permissions: user.permissions }); updateAllUserSessions(user.id, { permissions: user.permissions });