style: format entire codebase with prettier
This commit is contained in:
@@ -5,190 +5,194 @@ import { wishlists, savedWishlists, users } from '$lib/db/schema';
|
||||
import { eq, and } from 'drizzle-orm';
|
||||
|
||||
export const load: PageServerLoad = async (event) => {
|
||||
const session = await event.locals.auth();
|
||||
const session = await event.locals.auth();
|
||||
|
||||
// Allow anonymous users to access dashboard for local wishlists
|
||||
if (!session?.user?.id) {
|
||||
return {
|
||||
user: null,
|
||||
wishlists: [],
|
||||
savedWishlists: [],
|
||||
isAuthenticated: false
|
||||
};
|
||||
}
|
||||
// Allow anonymous users to access dashboard for local wishlists
|
||||
if (!session?.user?.id) {
|
||||
return {
|
||||
user: null,
|
||||
wishlists: [],
|
||||
savedWishlists: [],
|
||||
isAuthenticated: false
|
||||
};
|
||||
}
|
||||
|
||||
// Fetch user with theme
|
||||
const user = await db.query.users.findFirst({
|
||||
where: eq(users.id, session.user.id)
|
||||
});
|
||||
// Fetch user with theme
|
||||
const user = await db.query.users.findFirst({
|
||||
where: eq(users.id, session.user.id)
|
||||
});
|
||||
|
||||
const userWishlists = await db.query.wishlists.findMany({
|
||||
where: eq(wishlists.userId, session.user.id),
|
||||
with: {
|
||||
items: {
|
||||
orderBy: (items, { asc }) => [asc(items.order)]
|
||||
},
|
||||
user: true
|
||||
},
|
||||
orderBy: (wishlists, { desc }) => [desc(wishlists.createdAt)]
|
||||
});
|
||||
const userWishlists = await db.query.wishlists.findMany({
|
||||
where: eq(wishlists.userId, session.user.id),
|
||||
with: {
|
||||
items: {
|
||||
orderBy: (items, { asc }) => [asc(items.order)]
|
||||
},
|
||||
user: true
|
||||
},
|
||||
orderBy: (wishlists, { desc }) => [desc(wishlists.createdAt)]
|
||||
});
|
||||
|
||||
const saved = await db.query.savedWishlists.findMany({
|
||||
where: eq(savedWishlists.userId, session.user.id),
|
||||
with: {
|
||||
wishlist: {
|
||||
with: {
|
||||
items: {
|
||||
orderBy: (items, { asc }) => [asc(items.order)]
|
||||
},
|
||||
user: true
|
||||
}
|
||||
}
|
||||
},
|
||||
orderBy: (savedWishlists, { desc }) => [desc(savedWishlists.createdAt)]
|
||||
});
|
||||
const saved = await db.query.savedWishlists.findMany({
|
||||
where: eq(savedWishlists.userId, session.user.id),
|
||||
with: {
|
||||
wishlist: {
|
||||
with: {
|
||||
items: {
|
||||
orderBy: (items, { asc }) => [asc(items.order)]
|
||||
},
|
||||
user: true
|
||||
}
|
||||
}
|
||||
},
|
||||
orderBy: (savedWishlists, { desc }) => [desc(savedWishlists.createdAt)]
|
||||
});
|
||||
|
||||
// Map saved wishlists to include ownerToken from savedWishlists table (not from wishlist)
|
||||
// This ensures users only see ownerToken if they claimed via edit link
|
||||
const savedWithAccess = saved.map(s => ({
|
||||
...s,
|
||||
wishlist: s.wishlist ? {
|
||||
...s.wishlist,
|
||||
// Override ownerToken: use the one stored in savedWishlists (which is null for public saves)
|
||||
ownerToken: s.ownerToken,
|
||||
// Keep publicToken as-is for viewing
|
||||
publicToken: s.wishlist.publicToken
|
||||
} : null
|
||||
}));
|
||||
// Map saved wishlists to include ownerToken from savedWishlists table (not from wishlist)
|
||||
// This ensures users only see ownerToken if they claimed via edit link
|
||||
const savedWithAccess = saved.map((s) => ({
|
||||
...s,
|
||||
wishlist: s.wishlist
|
||||
? {
|
||||
...s.wishlist,
|
||||
// Override ownerToken: use the one stored in savedWishlists (which is null for public saves)
|
||||
ownerToken: s.ownerToken,
|
||||
// Keep publicToken as-is for viewing
|
||||
publicToken: s.wishlist.publicToken
|
||||
}
|
||||
: null
|
||||
}));
|
||||
|
||||
return {
|
||||
user: user,
|
||||
wishlists: userWishlists,
|
||||
savedWishlists: savedWithAccess,
|
||||
isAuthenticated: true
|
||||
};
|
||||
return {
|
||||
user: user,
|
||||
wishlists: userWishlists,
|
||||
savedWishlists: savedWithAccess,
|
||||
isAuthenticated: true
|
||||
};
|
||||
};
|
||||
|
||||
export const actions: Actions = {
|
||||
toggleFavorite: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
toggleFavorite: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const wishlistId = formData.get('wishlistId') as string;
|
||||
const isFavorite = formData.get('isFavorite') === 'true';
|
||||
const formData = await request.formData();
|
||||
const wishlistId = formData.get('wishlistId') as string;
|
||||
const isFavorite = formData.get('isFavorite') === 'true';
|
||||
|
||||
if (!wishlistId) {
|
||||
return { success: false, error: 'Wishlist ID is required' };
|
||||
}
|
||||
if (!wishlistId) {
|
||||
return { success: false, error: 'Wishlist ID is required' };
|
||||
}
|
||||
|
||||
await db.update(wishlists)
|
||||
.set({ isFavorite: !isFavorite, updatedAt: new Date() })
|
||||
.where(eq(wishlists.id, wishlistId));
|
||||
await db
|
||||
.update(wishlists)
|
||||
.set({ isFavorite: !isFavorite, updatedAt: new Date() })
|
||||
.where(eq(wishlists.id, wishlistId));
|
||||
|
||||
return { success: true };
|
||||
},
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
toggleSavedFavorite: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
toggleSavedFavorite: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const savedWishlistId = formData.get('savedWishlistId') as string;
|
||||
const isFavorite = formData.get('isFavorite') === 'true';
|
||||
const formData = await request.formData();
|
||||
const savedWishlistId = formData.get('savedWishlistId') as string;
|
||||
const isFavorite = formData.get('isFavorite') === 'true';
|
||||
|
||||
if (!savedWishlistId) {
|
||||
return { success: false, error: 'Saved wishlist ID is required' };
|
||||
}
|
||||
if (!savedWishlistId) {
|
||||
return { success: false, error: 'Saved wishlist ID is required' };
|
||||
}
|
||||
|
||||
await db.update(savedWishlists)
|
||||
.set({ isFavorite: !isFavorite })
|
||||
.where(eq(savedWishlists.id, savedWishlistId));
|
||||
await db
|
||||
.update(savedWishlists)
|
||||
.set({ isFavorite: !isFavorite })
|
||||
.where(eq(savedWishlists.id, savedWishlistId));
|
||||
|
||||
return { success: true };
|
||||
},
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
unsaveWishlist: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
unsaveWishlist: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const savedWishlistId = formData.get('savedWishlistId') as string;
|
||||
const formData = await request.formData();
|
||||
const savedWishlistId = formData.get('savedWishlistId') as string;
|
||||
|
||||
if (!savedWishlistId) {
|
||||
return { success: false, error: 'Saved wishlist ID is required' };
|
||||
}
|
||||
if (!savedWishlistId) {
|
||||
return { success: false, error: 'Saved wishlist ID is required' };
|
||||
}
|
||||
|
||||
await db.delete(savedWishlists)
|
||||
.where(and(
|
||||
eq(savedWishlists.id, savedWishlistId),
|
||||
eq(savedWishlists.userId, session.user.id)
|
||||
));
|
||||
await db
|
||||
.delete(savedWishlists)
|
||||
.where(
|
||||
and(eq(savedWishlists.id, savedWishlistId), eq(savedWishlists.userId, session.user.id))
|
||||
);
|
||||
|
||||
return { success: true };
|
||||
},
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
deleteWishlist: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
deleteWishlist: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const wishlistId = formData.get('wishlistId') as string;
|
||||
const formData = await request.formData();
|
||||
const wishlistId = formData.get('wishlistId') as string;
|
||||
|
||||
if (!wishlistId) {
|
||||
return { success: false, error: 'Wishlist ID is required' };
|
||||
}
|
||||
if (!wishlistId) {
|
||||
return { success: false, error: 'Wishlist ID is required' };
|
||||
}
|
||||
|
||||
await db.delete(wishlists)
|
||||
.where(and(
|
||||
eq(wishlists.id, wishlistId),
|
||||
eq(wishlists.userId, session.user.id)
|
||||
));
|
||||
await db
|
||||
.delete(wishlists)
|
||||
.where(and(eq(wishlists.id, wishlistId), eq(wishlists.userId, session.user.id)));
|
||||
|
||||
return { success: true };
|
||||
},
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
updateDashboardTheme: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
updateDashboardTheme: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const theme = formData.get('theme') as string;
|
||||
const formData = await request.formData();
|
||||
const theme = formData.get('theme') as string;
|
||||
|
||||
if (!theme) {
|
||||
return { success: false, error: 'Theme is required' };
|
||||
}
|
||||
if (!theme) {
|
||||
return { success: false, error: 'Theme is required' };
|
||||
}
|
||||
|
||||
await db.update(users)
|
||||
.set({ dashboardTheme: theme, updatedAt: new Date() })
|
||||
.where(eq(users.id, session.user.id));
|
||||
await db
|
||||
.update(users)
|
||||
.set({ dashboardTheme: theme, updatedAt: new Date() })
|
||||
.where(eq(users.id, session.user.id));
|
||||
|
||||
return { success: true };
|
||||
},
|
||||
return { success: true };
|
||||
},
|
||||
|
||||
updateDashboardColor: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
updateDashboardColor: async ({ request, locals }) => {
|
||||
const session = await locals.auth();
|
||||
if (!session?.user?.id) {
|
||||
throw redirect(303, '/signin');
|
||||
}
|
||||
|
||||
const formData = await request.formData();
|
||||
const color = formData.get('color') as string | null;
|
||||
const formData = await request.formData();
|
||||
const color = formData.get('color') as string | null;
|
||||
|
||||
await db.update(users)
|
||||
.set({ dashboardColor: color, updatedAt: new Date() })
|
||||
.where(eq(users.id, session.user.id));
|
||||
await db
|
||||
.update(users)
|
||||
.set({ dashboardColor: color, updatedAt: new Date() })
|
||||
.where(eq(users.id, session.user.id));
|
||||
|
||||
return { success: true };
|
||||
}
|
||||
return { success: true };
|
||||
}
|
||||
};
|
||||
|
||||
+258
-234
@@ -1,255 +1,279 @@
|
||||
<script lang="ts">
|
||||
import { Button } from '$lib/components/ui/button';
|
||||
import type { PageData } from './$types';
|
||||
import PageContainer from '$lib/components/layout/PageContainer.svelte';
|
||||
import DashboardHeader from '$lib/components/layout/DashboardHeader.svelte';
|
||||
import WishlistSection from '$lib/components/dashboard/WishlistSection.svelte';
|
||||
import LocalWishlistsSection from '$lib/components/dashboard/LocalWishlistsSection.svelte';
|
||||
import { enhance } from '$app/forms';
|
||||
import { Star } from '@lucide/svelte';
|
||||
import { languageStore } from '$lib/stores/language.svelte';
|
||||
import { Button } from '$lib/components/ui/button';
|
||||
import type { PageData } from './$types';
|
||||
import PageContainer from '$lib/components/layout/PageContainer.svelte';
|
||||
import DashboardHeader from '$lib/components/layout/DashboardHeader.svelte';
|
||||
import WishlistSection from '$lib/components/dashboard/WishlistSection.svelte';
|
||||
import LocalWishlistsSection from '$lib/components/dashboard/LocalWishlistsSection.svelte';
|
||||
import { enhance } from '$app/forms';
|
||||
import { Star } from '@lucide/svelte';
|
||||
import { languageStore } from '$lib/stores/language.svelte';
|
||||
|
||||
let { data }: { data: PageData } = $props();
|
||||
let { data }: { data: PageData } = $props();
|
||||
|
||||
function getInitialTheme() {
|
||||
if (data.isAuthenticated) {
|
||||
return data.user?.dashboardTheme || 'none';
|
||||
} else {
|
||||
if (typeof window !== 'undefined') {
|
||||
return localStorage.getItem('dashboardTheme') || 'none';
|
||||
}
|
||||
return 'none';
|
||||
}
|
||||
}
|
||||
function getInitialTheme() {
|
||||
if (data.isAuthenticated) {
|
||||
return data.user?.dashboardTheme || 'none';
|
||||
} else {
|
||||
if (typeof window !== 'undefined') {
|
||||
return localStorage.getItem('dashboardTheme') || 'none';
|
||||
}
|
||||
return 'none';
|
||||
}
|
||||
}
|
||||
|
||||
function getInitialColor() {
|
||||
if (data.isAuthenticated) {
|
||||
return data.user?.dashboardColor || null;
|
||||
} else {
|
||||
if (typeof window !== 'undefined') {
|
||||
return localStorage.getItem('dashboardColor') || null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
function getInitialColor() {
|
||||
if (data.isAuthenticated) {
|
||||
return data.user?.dashboardColor || null;
|
||||
} else {
|
||||
if (typeof window !== 'undefined') {
|
||||
return localStorage.getItem('dashboardColor') || null;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
let currentTheme = $state(getInitialTheme());
|
||||
let currentColor = $state(getInitialColor());
|
||||
let currentTheme = $state(getInitialTheme());
|
||||
let currentColor = $state(getInitialColor());
|
||||
|
||||
function handleThemeUpdate(theme: string | null) {
|
||||
currentTheme = theme || 'none';
|
||||
function handleThemeUpdate(theme: string | null) {
|
||||
currentTheme = theme || 'none';
|
||||
|
||||
if (!data.isAuthenticated && typeof window !== 'undefined') {
|
||||
localStorage.setItem('dashboardTheme', currentTheme);
|
||||
}
|
||||
}
|
||||
if (!data.isAuthenticated && typeof window !== 'undefined') {
|
||||
localStorage.setItem('dashboardTheme', currentTheme);
|
||||
}
|
||||
}
|
||||
|
||||
function handleColorUpdate(color: string | null) {
|
||||
currentColor = color;
|
||||
function handleColorUpdate(color: string | null) {
|
||||
currentColor = color;
|
||||
|
||||
if (!data.isAuthenticated && typeof window !== 'undefined') {
|
||||
if (color) {
|
||||
localStorage.setItem('dashboardColor', color);
|
||||
} else {
|
||||
localStorage.removeItem('dashboardColor');
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!data.isAuthenticated && typeof window !== 'undefined') {
|
||||
if (color) {
|
||||
localStorage.setItem('dashboardColor', color);
|
||||
} else {
|
||||
localStorage.removeItem('dashboardColor');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const t = $derived(languageStore.t);
|
||||
const t = $derived(languageStore.t);
|
||||
|
||||
const myWishlists = $derived(() => data.wishlists || []);
|
||||
const myWishlists = $derived(() => data.wishlists || []);
|
||||
|
||||
const claimedWishlists = $derived(() => {
|
||||
return (data.savedWishlists || [])
|
||||
.filter(saved => saved.wishlist?.ownerToken)
|
||||
.map(saved => ({
|
||||
...saved.wishlist,
|
||||
isFavorite: saved.isFavorite,
|
||||
isClaimed: true,
|
||||
savedId: saved.id
|
||||
}));
|
||||
});
|
||||
const claimedWishlists = $derived(() => {
|
||||
return (data.savedWishlists || [])
|
||||
.filter((saved) => saved.wishlist?.ownerToken)
|
||||
.map((saved) => ({
|
||||
...saved.wishlist,
|
||||
isFavorite: saved.isFavorite,
|
||||
isClaimed: true,
|
||||
savedId: saved.id
|
||||
}));
|
||||
});
|
||||
|
||||
const savedWishlists = $derived(() => {
|
||||
return (data.savedWishlists || []).filter(saved => !saved.wishlist?.ownerToken);
|
||||
});
|
||||
const savedWishlists = $derived(() => {
|
||||
return (data.savedWishlists || []).filter((saved) => !saved.wishlist?.ownerToken);
|
||||
});
|
||||
</script>
|
||||
|
||||
<PageContainer theme={currentTheme} themeColor={currentColor}>
|
||||
<DashboardHeader
|
||||
userName={data.user?.name}
|
||||
userEmail={data.user?.email}
|
||||
dashboardTheme={currentTheme}
|
||||
dashboardColor={currentColor}
|
||||
isAuthenticated={data.isAuthenticated}
|
||||
onThemeUpdate={handleThemeUpdate}
|
||||
onColorUpdate={handleColorUpdate}
|
||||
/>
|
||||
<DashboardHeader
|
||||
userName={data.user?.name}
|
||||
userEmail={data.user?.email}
|
||||
dashboardTheme={currentTheme}
|
||||
dashboardColor={currentColor}
|
||||
isAuthenticated={data.isAuthenticated}
|
||||
onThemeUpdate={handleThemeUpdate}
|
||||
onColorUpdate={handleColorUpdate}
|
||||
/>
|
||||
|
||||
{#if data.isAuthenticated}
|
||||
<WishlistSection
|
||||
title={t.dashboard.myWishlists}
|
||||
description={t.dashboard.myWishlistsDescription}
|
||||
items={myWishlists()}
|
||||
emptyMessage={t.dashboard.emptyWishlists}
|
||||
emptyActionLabel={t.dashboard.emptyWishlistsAction}
|
||||
emptyActionHref="/"
|
||||
showCreateButton={true}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
>
|
||||
{#snippet actions(wishlist, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form method="POST" action="?/toggleFavorite" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="wishlistId" value={wishlist.id} />
|
||||
<input type="hidden" name="isFavorite" value={wishlist.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={wishlist.isFavorite ? "fill-yellow-500 text-yellow-500" : ""} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${wishlist.ownerToken}/edit`)}
|
||||
>
|
||||
{t.dashboard.manage}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onclick={() => {
|
||||
navigator.clipboard.writeText(
|
||||
`${window.location.origin}/wishlist/${wishlist.publicToken}`
|
||||
);
|
||||
}}
|
||||
>
|
||||
{t.dashboard.copyLink}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form method="POST" action="?/deleteWishlist" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="wishlistId" value={wishlist.id} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.delete}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
{#if data.isAuthenticated}
|
||||
<WishlistSection
|
||||
title={t.dashboard.myWishlists}
|
||||
description={t.dashboard.myWishlistsDescription}
|
||||
items={myWishlists()}
|
||||
emptyMessage={t.dashboard.emptyWishlists}
|
||||
emptyActionLabel={t.dashboard.emptyWishlistsAction}
|
||||
emptyActionHref="/"
|
||||
showCreateButton={true}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
>
|
||||
{#snippet actions(wishlist, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/toggleFavorite"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="wishlistId" value={wishlist.id} />
|
||||
<input type="hidden" name="isFavorite" value={wishlist.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={wishlist.isFavorite ? 'fill-yellow-500 text-yellow-500' : ''} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${wishlist.ownerToken}/edit`)}
|
||||
>
|
||||
{t.dashboard.manage}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onclick={() => {
|
||||
navigator.clipboard.writeText(
|
||||
`${window.location.origin}/wishlist/${wishlist.publicToken}`
|
||||
);
|
||||
}}
|
||||
>
|
||||
{t.dashboard.copyLink}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form
|
||||
method="POST"
|
||||
action="?/deleteWishlist"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="wishlistId" value={wishlist.id} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.delete}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
|
||||
<LocalWishlistsSection
|
||||
isAuthenticated={data.isAuthenticated}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
/>
|
||||
<LocalWishlistsSection
|
||||
isAuthenticated={data.isAuthenticated}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
/>
|
||||
|
||||
<WishlistSection
|
||||
title={t.dashboard.claimedWishlists}
|
||||
description={t.dashboard.claimedWishlistsDescription}
|
||||
items={claimedWishlists()}
|
||||
emptyMessage={t.dashboard.emptyClaimedWishlists}
|
||||
emptyDescription={t.dashboard.emptyClaimedWishlistsDescription}
|
||||
hideIfEmpty={true}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
>
|
||||
{#snippet actions(wishlist, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form method="POST" action="?/toggleSavedFavorite" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="savedWishlistId" value={wishlist.savedId} />
|
||||
<input type="hidden" name="isFavorite" value={wishlist.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={wishlist.isFavorite ? "fill-yellow-500 text-yellow-500" : ""} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${wishlist.ownerToken}/edit`)}
|
||||
>
|
||||
{t.dashboard.manage}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onclick={() => {
|
||||
navigator.clipboard.writeText(
|
||||
`${window.location.origin}/wishlist/${wishlist.publicToken}`
|
||||
);
|
||||
}}
|
||||
>
|
||||
{t.dashboard.copyLink}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form method="POST" action="?/unsaveWishlist" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="savedWishlistId" value={wishlist.savedId} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.unclaim}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
<WishlistSection
|
||||
title={t.dashboard.claimedWishlists}
|
||||
description={t.dashboard.claimedWishlistsDescription}
|
||||
items={claimedWishlists()}
|
||||
emptyMessage={t.dashboard.emptyClaimedWishlists}
|
||||
emptyDescription={t.dashboard.emptyClaimedWishlistsDescription}
|
||||
hideIfEmpty={true}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
>
|
||||
{#snippet actions(wishlist, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/toggleSavedFavorite"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="savedWishlistId" value={wishlist.savedId} />
|
||||
<input type="hidden" name="isFavorite" value={wishlist.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={wishlist.isFavorite ? 'fill-yellow-500 text-yellow-500' : ''} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${wishlist.ownerToken}/edit`)}
|
||||
>
|
||||
{t.dashboard.manage}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
onclick={() => {
|
||||
navigator.clipboard.writeText(
|
||||
`${window.location.origin}/wishlist/${wishlist.publicToken}`
|
||||
);
|
||||
}}
|
||||
>
|
||||
{t.dashboard.copyLink}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form
|
||||
method="POST"
|
||||
action="?/unsaveWishlist"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="savedWishlistId" value={wishlist.savedId} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.unclaim}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
|
||||
<WishlistSection
|
||||
title={t.dashboard.savedWishlists}
|
||||
description={t.dashboard.savedWishlistsDescription}
|
||||
items={savedWishlists()}
|
||||
emptyMessage={t.dashboard.emptySavedWishlists}
|
||||
emptyDescription={t.dashboard.emptySavedWishlistsDescription}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
hideIfEmpty={true}
|
||||
>
|
||||
{#snippet actions(saved, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form method="POST" action="?/toggleSavedFavorite" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="savedWishlistId" value={saved.id} />
|
||||
<input type="hidden" name="isFavorite" value={saved.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={saved.isFavorite ? "fill-yellow-500 text-yellow-500" : ""} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${saved.wishlist.publicToken}`)}
|
||||
>
|
||||
{t.dashboard.viewWishlist}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form method="POST" action="?/unsaveWishlist" use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}>
|
||||
<input type="hidden" name="savedWishlistId" value={saved.id} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.unsave}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
{/if}
|
||||
<WishlistSection
|
||||
title={t.dashboard.savedWishlists}
|
||||
description={t.dashboard.savedWishlistsDescription}
|
||||
items={savedWishlists()}
|
||||
emptyMessage={t.dashboard.emptySavedWishlists}
|
||||
emptyDescription={t.dashboard.emptySavedWishlistsDescription}
|
||||
fallbackColor={currentColor}
|
||||
fallbackTheme={currentTheme}
|
||||
hideIfEmpty={true}
|
||||
>
|
||||
{#snippet actions(saved, unlocked)}
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
<form
|
||||
method="POST"
|
||||
action="?/toggleSavedFavorite"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="savedWishlistId" value={saved.id} />
|
||||
<input type="hidden" name="isFavorite" value={saved.isFavorite} />
|
||||
<Button type="submit" size="sm" variant="outline">
|
||||
<Star class={saved.isFavorite ? 'fill-yellow-500 text-yellow-500' : ''} />
|
||||
</Button>
|
||||
</form>
|
||||
<Button
|
||||
size="sm"
|
||||
onclick={() => (window.location.href = `/wishlist/${saved.wishlist.publicToken}`)}
|
||||
>
|
||||
{t.dashboard.viewWishlist}
|
||||
</Button>
|
||||
{#if unlocked}
|
||||
<form
|
||||
method="POST"
|
||||
action="?/unsaveWishlist"
|
||||
use:enhance={() => {
|
||||
return async ({ update }) => {
|
||||
await update({ reset: false });
|
||||
};
|
||||
}}
|
||||
>
|
||||
<input type="hidden" name="savedWishlistId" value={saved.id} />
|
||||
<Button type="submit" size="sm" variant="destructive">
|
||||
{t.dashboard.unsave}
|
||||
</Button>
|
||||
</form>
|
||||
{/if}
|
||||
</div>
|
||||
{/snippet}
|
||||
</WishlistSection>
|
||||
{/if}
|
||||
</PageContainer>
|
||||
|
||||
Reference in New Issue
Block a user