switch to use:enchance for all forms, split overview into its own file
This commit is contained in:
parent
365c43c501
commit
f47d113a01
5 changed files with 367 additions and 81 deletions
|
|
@ -14,18 +14,25 @@
|
|||
import Button, { buttonVariants } from './ui/button/button.svelte';
|
||||
import User from './extra/User.svelte';
|
||||
import type { SessionValidationResult } from '$lib/server/auth';
|
||||
import { Status, statuses, type OverviewData, type OverviewUser } from '$lib';
|
||||
import { Status, type OverviewData, type OverviewUser } from '$lib';
|
||||
import Label from './ui/label/label.svelte';
|
||||
import { toast } from 'svelte-sonner';
|
||||
import { enhance } from '$app/forms';
|
||||
import { invalidateAll } from '$app/navigation';
|
||||
import { fill_overview_data } from '$lib/state.svelte';
|
||||
import type { PageServerLoad } from '../../routes/app/$types';
|
||||
|
||||
let {
|
||||
currentPage = $bindable<string | null>(),
|
||||
subPage = $bindable<string | null>(),
|
||||
data,
|
||||
psd,
|
||||
user,
|
||||
...restProps
|
||||
}: {
|
||||
currentPage: string | null;
|
||||
subPage: string | null;
|
||||
psd: PageServerLoad;
|
||||
data: OverviewData;
|
||||
user: SessionValidationResult['user'];
|
||||
} = $props();
|
||||
|
|
@ -65,7 +72,27 @@
|
|||
</Dialog.Header>
|
||||
|
||||
<!-- input to add a new friend -->
|
||||
<form method="POST" action="?/addFriend" class="mb-4">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/addFriend"
|
||||
class="mb-4"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Friend request sent successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not send friend request: ' + (result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Input name="username" placeholder="username" required class="mb-2" />
|
||||
<Dialog.Footer>
|
||||
<Dialog.Close class={buttonVariants({ variant: 'outline' })}>Cancel</Dialog.Close>
|
||||
|
|
@ -93,7 +120,27 @@
|
|||
<Card.Description>Request sent</Card.Description>
|
||||
</Card.Header>
|
||||
<Card.Footer>
|
||||
<form method="POST" action="?/cancelFriendRequest">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/cancelFriendRequest"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Cancelled friend request successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not cancel friend request: ' +
|
||||
(result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="requestId" value={request.id} />
|
||||
<Button type="submit" variant="outline" size="sm">Cancel</Button>
|
||||
</form>
|
||||
|
|
@ -116,12 +163,52 @@
|
|||
</Card.Header>
|
||||
<Card.Footer class="flex gap-2">
|
||||
<!-- accept friend -->
|
||||
<form method="POST" action="?/addFriend">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/addFriend"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Accepted friend request successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not accept friend request: ' +
|
||||
(result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="userId" value={request.fromUser} />
|
||||
<Button type="submit" size="sm">Accept</Button>
|
||||
</form>
|
||||
<!-- decline friend -->
|
||||
<form method="POST" action="?/cancelFriendRequest">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/cancelFriendRequest"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Cancelled friend request successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not cancel friend request: ' +
|
||||
(result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="requestId" value={request.id} />
|
||||
<Button type="submit" variant="outline" size="sm">Decline</Button>
|
||||
</form>
|
||||
|
|
@ -141,7 +228,27 @@
|
|||
<Card.Description>Currently your friend</Card.Description>
|
||||
</Card.Header>
|
||||
<Card.Footer>
|
||||
<form method="POST" action="?/removeFriend">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/removeFriend"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Removed friend successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not remove friend: ' +
|
||||
(result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="userId" value={friend.id} />
|
||||
<Button type="submit" variant="destructive" size="sm">
|
||||
Remove Friend
|
||||
|
|
@ -164,7 +271,26 @@
|
|||
</Dialog.Trigger>
|
||||
|
||||
<Dialog.Content class="sm:max-w-106.25">
|
||||
<form method="POST" action="?/createGroup">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/createGroup"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Created group successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not create group: ' + (result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Dialog.Header>
|
||||
<Dialog.Title>Create a group</Dialog.Title>
|
||||
<Dialog.Description>Add friends into your group!</Dialog.Description>
|
||||
|
|
@ -193,7 +319,25 @@
|
|||
</Dialog.Trigger>
|
||||
|
||||
<Dialog.Content class="sm:max-w-106.25">
|
||||
<form method="POST" action="?/joinServer">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/joinServer"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
console.log(result);
|
||||
if (result.type == 'success') {
|
||||
toast.success('Joined server successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error('Could not join server: ' + (result.error || result.data?.error));
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Dialog.Header>
|
||||
<Dialog.Title>Join a server</Dialog.Title>
|
||||
<Dialog.Description>Enter an invite link.</Dialog.Description>
|
||||
|
|
@ -217,7 +361,26 @@
|
|||
</Dialog.Trigger>
|
||||
|
||||
<Dialog.Content class="sm:max-w-106.25">
|
||||
<form method="POST" action="?/createServer">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/createServer"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Created server successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error(
|
||||
'Could not create server: ' + (result.error || result.data?.error)
|
||||
);
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Dialog.Header>
|
||||
<Dialog.Title>Create a server</Dialog.Title>
|
||||
<Dialog.Description>Name your new server.</Dialog.Description>
|
||||
|
|
@ -358,7 +521,24 @@
|
|||
</Dialog.Trigger>
|
||||
|
||||
<Dialog.Content>
|
||||
<form method="POST" action="?/updateProfile">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/updateProfile"
|
||||
use:enhance={() => {
|
||||
return async ({ result }) => {
|
||||
if (result.type == 'success') {
|
||||
toast.success('Edited profile successfully');
|
||||
}
|
||||
|
||||
if (result.type == 'error' || result.type == 'failure') {
|
||||
toast.error('Could not edit profile: ' + (result.error || result.data?.error));
|
||||
}
|
||||
|
||||
await invalidateAll();
|
||||
await fill_overview_data(psd);
|
||||
};
|
||||
}}
|
||||
>
|
||||
<Dialog.Header>
|
||||
<Dialog.Title>Edit profile</Dialog.Title>
|
||||
<Dialog.Description>Update how others see you.</Dialog.Description>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue