includio-cms 0.14.6 → 0.15.0

package/dist/admin/client/shop/shop-order-detail-page.svelte

@@ -0,0 +1,332 @@
+<script lang="ts">
+	import { page } from '$app/state';
+	import { getRemotes } from '../../../sveltekit/index.js';
+	import { Button } from '../../../components/ui/button/index.js';
+	import MailIcon from '@tabler/icons-svelte/icons/mail';
+
+	const remotes = getRemotes();
+
+	const orderId = $derived(page.params.id ?? '');
+	const query = $derived(remotes.getOrderForAdmin(orderId));
+
+	type OrderStatus =
+		| 'new'
+		| 'awaitingPayment'
+		| 'paid'
+		| 'preparing'
+		| 'sent'
+		| 'done'
+		| 'cancelled'
+		| 'paymentRejected';
+
+	const STATUSES: Array<{ value: OrderStatus; label: string }> = [
+		{ value: 'new', label: 'Nowe' },
+		{ value: 'awaitingPayment', label: 'Oczekuje na płatność' },
+		{ value: 'paid', label: 'Opłacone' },
+		{ value: 'preparing', label: 'W przygotowaniu' },
+		{ value: 'sent', label: 'Wysłane' },
+		{ value: 'done', label: 'Zrealizowane' },
+		{ value: 'cancelled', label: 'Anulowane' },
+		{ value: 'paymentRejected', label: 'Płatność odrzucona' }
+	];
+
+	const STATUS_STYLES: Record<string, string> = {
+		new: 'bg-blue-100 text-blue-800',
+		awaitingPayment: 'bg-yellow-100 text-yellow-800',
+		paid: 'bg-green-100 text-green-800',
+		preparing: 'bg-purple-100 text-purple-800',
+		sent: 'bg-indigo-100 text-indigo-800',
+		done: 'bg-gray-100 text-gray-800',
+		cancelled: 'bg-red-100 text-red-800',
+		paymentRejected: 'bg-red-100 text-red-800'
+	};
+
+	let newStatus = $state<OrderStatus | ''>('');
+	let note = $state('');
+	let saving = $state(false);
+	let resending = $state(false);
+	let errorMessage = $state<string | null>(null);
+	let successMessage = $state<string | null>(null);
+
+	function statusLabel(s: string) {
+		return STATUSES.find((x) => x.value === s)?.label ?? s;
+	}
+
+	function formatPrice(cents: number, currency: string) {
+		return new Intl.NumberFormat('pl-PL', {
+			style: 'currency',
+			currency,
+			minimumFractionDigits: 2
+		}).format(cents / 100);
+	}
+
+	function formatDate(d: Date | string) {
+		return new Intl.DateTimeFormat('pl-PL', {
+			dateStyle: 'short',
+			timeStyle: 'short'
+		}).format(new Date(d));
+	}
+
+	async function changeStatus() {
+		if (!newStatus) return;
+		saving = true;
+		errorMessage = null;
+		successMessage = null;
+		try {
+			await remotes.updateOrderStatusCmd({
+				orderId,
+				status: newStatus,
+				note: note.trim() || undefined
+			});
+			await query.refresh();
+			note = '';
+			newStatus = '';
+			successMessage = 'Status zaktualizowany. Email wysłany do klienta.';
+		} catch (err) {
+			errorMessage = err instanceof Error ? err.message : 'Nie udało się zmienić statusu';
+		} finally {
+			saving = false;
+		}
+	}
+
+	async function resendEmail(status: OrderStatus) {
+		resending = true;
+		errorMessage = null;
+		successMessage = null;
+		try {
+			await remotes.resendOrderEmailCmd({ orderId, status });
+			successMessage = `Email (${statusLabel(status)}) został ponownie wysłany.`;
+		} catch (err) {
+			errorMessage = err instanceof Error ? err.message : 'Nie udało się wysłać emaila';
+		} finally {
+			resending = false;
+		}
+	}
+</script>
+
+{#if !query.ready}
+	<div class="text-muted-foreground p-6">Ładowanie…</div>
+{:else if !query.current}
+	<div class="p-6">
+		<p class="mb-4">Zamówienie nie zostało znalezione.</p>
+		<Button href="/admin/shop/orders" variant="outline">← Wróć do listy</Button>
+	</div>
+{:else}
+	{@const { order, items, history } = query.current}
+	{@const address = order.shippingAddress as Record<string, string> | null}
+	{@const consents = order.consents as Array<{ id: string; accepted: boolean; label: string }> | null}
+
+	<div class="space-y-6 p-6">
+		<div class="flex items-start justify-between gap-4">
+			<div>
+				<h1 class="text-2xl font-extrabold tracking-tight">
+					<span class="font-mono">{order.number}</span>
+				</h1>
+				<p class="text-muted-foreground text-sm">
+					{formatDate(order.createdAt)} · <a
+						href="/admin/shop/orders"
+						class="hover:underline">← Lista</a
+					>
+				</p>
+			</div>
+			<span
+				class="inline-flex rounded-full px-3 py-1 text-xs font-semibold {STATUS_STYLES[order.status] ?? 'bg-gray-100 text-gray-800'}"
+			>
+				{statusLabel(order.status)}
+			</span>
+		</div>
+
+		{#if errorMessage}
+			<div class="rounded-lg bg-red-50 p-3 text-sm text-red-800">{errorMessage}</div>
+		{/if}
+		{#if successMessage}
+			<div class="rounded-lg bg-green-50 p-3 text-sm text-green-800">{successMessage}</div>
+		{/if}
+
+		<div class="grid grid-cols-1 gap-6 lg:grid-cols-[2fr_1fr]">
+			<div class="space-y-6">
+				<section class="border-border bg-card space-y-3 rounded-xl border p-5">
+					<h2 class="text-base font-bold">Pozycje</h2>
+					<table class="w-full text-sm">
+						<thead class="text-muted-foreground text-left text-xs uppercase">
+							<tr>
+								<th class="pb-2 font-semibold">Nazwa</th>
+								<th class="pb-2 font-semibold">SKU</th>
+								<th class="pb-2 text-center font-semibold">Ilość</th>
+								<th class="pb-2 text-right font-semibold">Brutto / szt.</th>
+								<th class="pb-2 text-right font-semibold">VAT</th>
+								<th class="pb-2 text-right font-semibold">Suma</th>
+							</tr>
+						</thead>
+						<tbody>
+							{#each items as item (item.id)}
+								{@const name = (item.nameSnapshot as { product?: string; variant?: string }) ?? {}}
+								<tr class="border-border border-t">
+									<td class="py-2">
+										<div class="font-medium">{name.product ?? '—'}</div>
+										{#if name.variant}
+											<div class="text-muted-foreground text-xs">{name.variant}</div>
+										{/if}
+									</td>
+									<td class="text-muted-foreground py-2 font-mono text-xs">{item.skuSnapshot ?? '—'}</td>
+									<td class="py-2 text-center">{item.qty}</td>
+									<td class="py-2 text-right tabular-nums">{formatPrice(item.priceGrossSnapshot, order.currency)}</td>
+									<td class="text-muted-foreground py-2 text-right">{item.vatRate}%</td>
+									<td class="py-2 text-right font-semibold tabular-nums">
+										{formatPrice(item.priceGrossSnapshot * item.qty, order.currency)}
+									</td>
+								</tr>
+							{/each}
+						</tbody>
+						<tfoot class="border-border border-t-2">
+							<tr>
+								<td colspan="5" class="pt-3 text-right text-sm">Wysyłka (brutto):</td>
+								<td class="pt-3 text-right tabular-nums">{formatPrice(order.shippingGross, order.currency)}</td>
+							</tr>
+							<tr>
+								<td colspan="5" class="text-right text-sm">Razem netto:</td>
+								<td class="text-muted-foreground text-right tabular-nums">
+									{formatPrice(order.totalNet, order.currency)}
+								</td>
+							</tr>
+							<tr>
+								<td colspan="5" class="text-right text-sm">VAT:</td>
+								<td class="text-muted-foreground text-right tabular-nums">
+									{formatPrice(order.vatAmount, order.currency)}
+								</td>
+							</tr>
+							<tr>
+								<td colspan="5" class="pb-1 text-right text-base font-bold">Razem brutto:</td>
+								<td class="text-primary pb-1 text-right text-base font-extrabold tabular-nums">
+									{formatPrice(order.totalGross, order.currency)}
+								</td>
+							</tr>
+						</tfoot>
+					</table>
+				</section>
+
+				<section class="border-border bg-card space-y-3 rounded-xl border p-5">
+					<h2 class="text-base font-bold">Historia statusów</h2>
+					<ol class="space-y-2 text-sm">
+						{#each history as h (h.id)}
+							<li class="flex items-start gap-3">
+								<span
+									class="mt-0.5 inline-flex shrink-0 rounded-full px-2 py-0.5 text-xs {STATUS_STYLES[h.status] ?? 'bg-gray-100 text-gray-800'}"
+								>
+									{statusLabel(h.status)}
+								</span>
+								<div class="flex-1">
+									<div class="text-muted-foreground text-xs">
+										{formatDate(h.changedAt)} · {h.changedBy ?? '—'}
+									</div>
+									{#if h.note}
+										<div class="text-sm">{h.note}</div>
+									{/if}
+								</div>
+								<Button
+									type="button"
+									variant="ghost"
+									size="sm"
+									disabled={resending}
+									onclick={() => resendEmail(h.status as OrderStatus)}
+									title="Wyślij ponownie email dla tego statusu"
+								>
+									<MailIcon class="size-4" />
+								</Button>
+							</li>
+						{/each}
+					</ol>
+				</section>
+			</div>
+
+			<div class="space-y-6">
+				<section class="border-border bg-card space-y-3 rounded-xl border p-5">
+					<h2 class="text-base font-bold">Zmień status</h2>
+					<label class="block">
+						<span class="text-muted-foreground mb-1 block text-xs font-semibold">Nowy status</span>
+						<select
+							bind:value={newStatus}
+							class="border-border w-full rounded-lg border px-3 py-2 text-sm"
+						>
+							<option value="">— wybierz —</option>
+							{#each STATUSES as s (s.value)}
+								<option value={s.value} disabled={s.value === order.status}>{s.label}</option>
+							{/each}
+						</select>
+					</label>
+					<label class="block">
+						<span class="text-muted-foreground mb-1 block text-xs font-semibold">Notatka (opcjonalna)</span>
+						<textarea
+							bind:value={note}
+							rows="2"
+							class="border-border w-full rounded-lg border px-3 py-2 text-sm"
+							placeholder="np. nr listu przewozowego"
+						></textarea>
+					</label>
+					<Button onclick={changeStatus} disabled={saving || !newStatus} class="w-full">
+						{saving ? 'Zapisywanie…' : 'Zmień status + wyślij email'}
+					</Button>
+				</section>
+
+				<section class="border-border bg-card space-y-2 rounded-xl border p-5 text-sm">
+					<h2 class="text-base font-bold">Klient</h2>
+					<div>
+						<div class="font-medium">{order.customerName ?? '—'}</div>
+						<div class="text-muted-foreground text-xs">{order.customerEmail}</div>
+						{#if order.customerPhone}
+							<div class="text-muted-foreground text-xs">{order.customerPhone}</div>
+						{/if}
+					</div>
+				</section>
+
+				{#if address}
+					<section class="border-border bg-card space-y-1 rounded-xl border p-5 text-sm">
+						<h2 class="text-base font-bold">Adres</h2>
+						{#if address.street}<div>{address.street}</div>{/if}
+						{#if address.postcode || address.city}
+							<div>{address.postcode ?? ''} {address.city ?? ''}</div>
+						{/if}
+						{#if order.carrierRef}
+							<div class="text-muted-foreground text-xs">Paczkomat: {order.carrierRef}</div>
+						{/if}
+						{#if address.invoiceCompany}
+							<div class="border-border mt-2 border-t pt-2">
+								<div class="text-muted-foreground text-xs font-semibold">Faktura</div>
+								<div>{address.invoiceCompany}</div>
+								{#if address.invoiceNip}<div class="text-muted-foreground text-xs">NIP: {address.invoiceNip}</div>{/if}
+								{#if address.invoiceStreet}<div class="text-xs">{address.invoiceStreet}</div>{/if}
+								{#if address.invoicePostcode || address.invoiceCity}
+									<div class="text-xs">{address.invoicePostcode ?? ''} {address.invoiceCity ?? ''}</div>
+								{/if}
+							</div>
+						{/if}
+					</section>
+				{/if}
+
+				{#if consents && consents.length > 0}
+					<section class="border-border bg-card space-y-2 rounded-xl border p-5 text-sm">
+						<h2 class="text-base font-bold">Zgody</h2>
+						{#each consents as c (c.id)}
+							<div class="flex items-start gap-2">
+								<span class="text-xs {c.accepted ? 'text-green-700' : 'text-red-700'}">
+									{c.accepted ? '✓' : '✗'}
+								</span>
+								<div>
+									<div class="text-muted-foreground font-mono text-xs">{c.id}</div>
+									<div class="text-xs">{c.label}</div>
+								</div>
+							</div>
+						{/each}
+					</section>
+				{/if}
+
+				{#if order.notes}
+					<section class="border-border bg-card space-y-1 rounded-xl border p-5 text-sm">
+						<h2 class="text-base font-bold">Uwagi klienta</h2>
+						<p class="whitespace-pre-wrap text-xs">{order.notes}</p>
+					</section>
+				{/if}
+			</div>
+		</div>
+	</div>
+{/if}

package/dist/admin/client/shop/shop-order-detail-page.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const ShopOrderDetailPage: import("svelte").Component<Record<string, never>, {}, "">;
+type ShopOrderDetailPage = ReturnType<typeof ShopOrderDetailPage>;
+export default ShopOrderDetailPage;

package/dist/admin/client/shop/shop-orders-list-page.svelte

@@ -0,0 +1,150 @@
+<script lang="ts">
+	import { getRemotes } from '../../../sveltekit/index.js';
+
+	const remotes = getRemotes();
+
+	const STATUSES = [
+		{ value: 'all', label: 'Wszystkie' },
+		{ value: 'new', label: 'Nowe' },
+		{ value: 'awaitingPayment', label: 'Oczekują na płatność' },
+		{ value: 'paid', label: 'Opłacone' },
+		{ value: 'preparing', label: 'W przygotowaniu' },
+		{ value: 'sent', label: 'Wysłane' },
+		{ value: 'done', label: 'Zrealizowane' },
+		{ value: 'cancelled', label: 'Anulowane' },
+		{ value: 'paymentRejected', label: 'Płatność odrzucona' }
+	] as const;
+
+	let statusFilter = $state<(typeof STATUSES)[number]['value']>('all');
+	let emailFilter = $state('');
+	let appliedEmail = $state('');
+
+	const query = $derived(
+		remotes.listOrdersAdmin({
+			status: statusFilter === 'all' ? undefined : statusFilter,
+			email: appliedEmail || undefined,
+			limit: 200
+		})
+	);
+
+	const STATUS_STYLES: Record<string, string> = {
+		new: 'bg-blue-100 text-blue-800',
+		awaitingPayment: 'bg-yellow-100 text-yellow-800',
+		paid: 'bg-green-100 text-green-800',
+		preparing: 'bg-purple-100 text-purple-800',
+		sent: 'bg-indigo-100 text-indigo-800',
+		done: 'bg-gray-100 text-gray-800',
+		cancelled: 'bg-red-100 text-red-800',
+		paymentRejected: 'bg-red-100 text-red-800'
+	};
+
+	function formatPrice(smallest: number, currency: string) {
+		return new Intl.NumberFormat('pl-PL', {
+			style: 'currency',
+			currency,
+			minimumFractionDigits: 2
+		}).format(smallest / 100);
+	}
+
+	function formatDate(d: Date | string) {
+		return new Intl.DateTimeFormat('pl-PL', {
+			dateStyle: 'short',
+			timeStyle: 'short'
+		}).format(new Date(d));
+	}
+
+	function applyEmailFilter() {
+		appliedEmail = emailFilter.trim();
+	}
+</script>
+
+<div class="flex flex-wrap items-end justify-between gap-4 p-6">
+	<div>
+		<h1 class="text-2xl font-extrabold tracking-tight">Zamówienia</h1>
+		<p class="text-muted-foreground text-sm">
+			{#if query.ready}
+				{query.current?.length ?? 0}
+				{(query.current?.length ?? 0) === 1 ? 'zamówienie' : 'zamówień'}
+			{:else}
+				Ładowanie…
+			{/if}
+		</p>
+	</div>
+	<div class="flex flex-wrap items-end gap-3">
+		<label class="block">
+			<span class="text-muted-foreground mb-1 block text-xs font-semibold">Status</span>
+			<select
+				bind:value={statusFilter}
+				class="border-border h-9 rounded-lg border px-3 text-sm"
+			>
+				{#each STATUSES as s (s.value)}
+					<option value={s.value}>{s.label}</option>
+				{/each}
+			</select>
+		</label>
+		<label class="block">
+			<span class="text-muted-foreground mb-1 block text-xs font-semibold">Email klienta</span>
+			<input
+				type="email"
+				bind:value={emailFilter}
+				onchange={applyEmailFilter}
+				onblur={applyEmailFilter}
+				placeholder="filtruj po email"
+				class="border-border h-9 rounded-lg border px-3 text-sm"
+			/>
+		</label>
+	</div>
+</div>
+
+<div class="px-6 pb-12">
+	{#if !query.ready}
+		<div class="text-muted-foreground">Ładowanie…</div>
+	{:else if (query.current?.length ?? 0) === 0}
+		<div class="bg-lavender-lighter/40 border-border rounded-xl border p-8 text-center text-sm">
+			<p class="mb-2 font-semibold">Brak zamówień</p>
+			<p class="text-muted-foreground">
+				Gdy klient złoży zamówienie, pojawi się tutaj.
+			</p>
+		</div>
+	{:else}
+		<div class="border-border overflow-hidden rounded-xl border">
+			<table class="w-full text-sm">
+				<thead class="bg-muted/50 text-left text-xs uppercase tracking-wide">
+					<tr>
+						<th class="px-4 py-3 font-semibold">Numer</th>
+						<th class="px-4 py-3 font-semibold">Data</th>
+						<th class="px-4 py-3 font-semibold">Klient</th>
+						<th class="px-4 py-3 font-semibold">Suma (brutto)</th>
+						<th class="px-4 py-3 font-semibold">Płatność</th>
+						<th class="px-4 py-3 font-semibold">Status</th>
+					</tr>
+				</thead>
+				<tbody>
+					{#each query.current ?? [] as o (o.id)}
+						<tr class="border-border hover:bg-muted/30 border-t">
+							<td class="px-4 py-3 font-mono text-xs">
+								<a href={`/admin/shop/orders/${o.id}`} class="text-primary hover:underline">
+									{o.number}
+								</a>
+							</td>
+							<td class="text-muted-foreground px-4 py-3 text-xs">{formatDate(o.createdAt)}</td>
+							<td class="px-4 py-3">
+								<div class="font-medium">{o.customerName ?? '—'}</div>
+								<div class="text-muted-foreground text-xs">{o.customerEmail}</div>
+							</td>
+							<td class="px-4 py-3 tabular-nums">{formatPrice(o.totalGross, o.currency)}</td>
+							<td class="text-muted-foreground px-4 py-3 text-xs">{o.paymentMethod ?? '—'}</td>
+							<td class="px-4 py-3">
+								<span
+									class="inline-flex rounded-full px-2 py-0.5 text-xs {STATUS_STYLES[o.status] ?? 'bg-gray-100 text-gray-800'}"
+								>
+									{STATUSES.find((s) => s.value === o.status)?.label ?? o.status}
+								</span>
+							</td>
+						</tr>
+					{/each}
+				</tbody>
+			</table>
+		</div>
+	{/if}
+</div>

package/dist/admin/client/shop/shop-orders-list-page.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const ShopOrdersListPage: import("svelte").Component<Record<string, never>, {}, "">;
+type ShopOrdersListPage = ReturnType<typeof ShopOrdersListPage>;
+export default ShopOrdersListPage;

package/dist/admin/client/shop/shop-products-list-page.svelte

@@ -0,0 +1,157 @@
+<script lang="ts">
+	import { getRemotes } from '../../../sveltekit/index.js';
+	import { useInterfaceLanguage } from '../../state/interface-language.svelte.js';
+	import { getLocalizedLabel } from '../../utils/collectionLabel.js';
+	import { Button } from '../../../components/ui/button/index.js';
+	import * as DropdownMenu from '../../../components/ui/dropdown-menu/index.js';
+	import PlusIcon from '@tabler/icons-svelte/icons/plus';
+	import ChevronDownIcon from '@tabler/icons-svelte/icons/chevron-down';
+
+	const remotes = getRemotes();
+	const interfaceLanguage = useInterfaceLanguage();
+
+	const entriesQuery = $derived(remotes.listShopProductEntries());
+	const collectionsQuery = $derived(remotes.listShopableCollections());
+
+	function formatPrice(smallest: number) {
+		return new Intl.NumberFormat('pl-PL', {
+			style: 'currency',
+			currency: 'PLN',
+			minimumFractionDigits: 2
+		}).format(smallest / 100);
+	}
+
+	function resolveTitle(data: Record<string, unknown> | null, fallback: string): string {
+		if (!data) return fallback;
+		for (const key of ['name', 'title', 'adminTitle']) {
+			const v = data[key];
+			if (typeof v === 'string' && v.length > 0) return v;
+		}
+		return fallback;
+	}
+
+	async function createInCollection(slug: string) {
+		try {
+			const newEntry = await remotes.createEntry({ type: 'collection', slug });
+			window.location.href = `/admin/entries/${newEntry.id}`;
+		} catch (err) {
+			alert(err instanceof Error ? err.message : 'Nie udało się utworzyć wpisu');
+		}
+	}
+</script>
+
+<div class="flex items-center justify-between gap-4 p-6">
+	<div>
+		<h1 class="text-2xl font-extrabold tracking-tight">Produkty</h1>
+		<p class="text-muted-foreground text-sm">
+			{#if entriesQuery.ready}
+				{entriesQuery.current?.length ?? 0}
+				{(entriesQuery.current?.length ?? 0) === 1 ? 'produkt' : 'produktów'}
+			{:else}
+				Ładowanie…
+			{/if}
+		</p>
+	</div>
+	{#if collectionsQuery.ready && collectionsQuery.current && collectionsQuery.current.length > 0}
+		{#if collectionsQuery.current.length === 1}
+			{@const only = collectionsQuery.current[0]}
+			<Button onclick={() => createInCollection(only.slug)}>
+				<PlusIcon class="mr-1 size-4" />
+				Dodaj produkt
+			</Button>
+		{:else}
+			<DropdownMenu.Root>
+				<DropdownMenu.Trigger>
+					{#snippet child({ props })}
+						<Button {...props}>
+							<PlusIcon class="mr-1 size-4" />
+							Dodaj produkt
+							<ChevronDownIcon class="ml-1 size-4" />
+						</Button>
+					{/snippet}
+				</DropdownMenu.Trigger>
+				<DropdownMenu.Content>
+					{#each collectionsQuery.current as c (c.slug)}
+						<DropdownMenu.Item onclick={() => createInCollection(c.slug)}>
+							{getLocalizedLabel(c.labels?.singular, interfaceLanguage.current) ?? c.slug}
+						</DropdownMenu.Item>
+					{/each}
+				</DropdownMenu.Content>
+			</DropdownMenu.Root>
+		{/if}
+	{/if}
+</div>
+
+<div class="px-6 pb-12">
+	{#if !entriesQuery.ready}
+		<div class="text-muted-foreground">Ładowanie…</div>
+	{:else if (entriesQuery.current?.length ?? 0) === 0}
+		<div class="bg-lavender-lighter/40 border-border rounded-xl border p-8 text-center text-sm">
+			<p class="mb-2 font-semibold">Brak produktów</p>
+			<p class="text-muted-foreground">
+				Dodaj pole <code class="text-primary">&lbrace; type: 'shop' &rbrace;</code> do kolekcji,
+				a następnie utwórz wpis i wypełnij sekcję „Sklep".
+			</p>
+		</div>
+	{:else}
+		<div class="border-border overflow-hidden rounded-xl border">
+			<table class="w-full text-sm">
+				<thead class="bg-muted/50 text-left text-xs uppercase tracking-wide">
+					<tr>
+						<th class="px-4 py-3 font-semibold">Nazwa</th>
+						<th class="px-4 py-3 font-semibold">Kolekcja</th>
+						<th class="px-4 py-3 font-semibold">Cena bazowa</th>
+						<th class="px-4 py-3 font-semibold">VAT</th>
+						<th class="px-4 py-3 font-semibold">Warianty</th>
+						<th class="px-4 py-3 font-semibold">Magazyn</th>
+						<th class="px-4 py-3 font-semibold">Status</th>
+					</tr>
+				</thead>
+				<tbody>
+					{#each entriesQuery.current ?? [] as row (row.entryId)}
+						{@const title = resolveTitle(row.publishedData ?? row.draftData, row.collectionSlug)}
+						<tr class="border-border hover:bg-muted/30 border-t">
+							<td class="px-4 py-3">
+								<a
+									href={`/admin/entries/${row.entryId}`}
+									class="text-primary hover:underline"
+								>
+									{title}
+								</a>
+							</td>
+							<td class="text-muted-foreground px-4 py-3 font-mono text-xs">{row.collectionSlug}</td>
+							<td class="px-4 py-3">{formatPrice(row.basePrice)}</td>
+							<td class="px-4 py-3">{row.vatRate}%</td>
+							<td class="px-4 py-3">{row.variantCount}</td>
+							<td class="px-4 py-3">
+								{#if row.totalStock == null}
+									<span class="text-muted-foreground text-xs">nieograniczony</span>
+								{:else}
+									{row.totalStock}
+								{/if}
+							</td>
+							<td class="px-4 py-3">
+								<div class="flex gap-1.5">
+									{#if row.published}
+										<span class="inline-flex rounded-full bg-green-100 px-2 py-0.5 text-xs text-green-800"
+											>Opublikowany</span
+										>
+									{:else}
+										<span class="inline-flex rounded-full bg-yellow-100 px-2 py-0.5 text-xs text-yellow-800"
+											>Szkic</span
+										>
+									{/if}
+									{#if !row.isActive}
+										<span class="inline-flex rounded-full bg-gray-100 px-2 py-0.5 text-xs text-gray-800"
+											>Nieaktywny</span
+										>
+									{/if}
+								</div>
+							</td>
+						</tr>
+					{/each}
+				</tbody>
+			</table>
+		</div>
+	{/if}
+</div>

package/dist/admin/client/shop/shop-products-list-page.svelte.d.ts

@@ -0,0 +1,3 @@
+declare const ShopProductsListPage: import("svelte").Component<Record<string, never>, {}, "">;
+type ShopProductsListPage = ReturnType<typeof ShopProductsListPage>;
+export default ShopProductsListPage;

package/dist/admin/components/fields/field-renderer.svelte

@@ -38,8 +38,8 @@
 	// Cast to any: runtime types enforced by child components via $bindable
 	const { value } = formFieldProxy(form, path) as { value: import('svelte/store').Writable<any> };
 
-	const fieldsWithNoDescription: FieldType[] = ['boolean', 'object', 'blocks', 'seo'];
-	const fieldsWithNoLabel: FieldType[] = ['boolean', 'object', 'blocks', 'seo'];
+	const fieldsWithNoDescription: FieldType[] = ['boolean', 'object', 'blocks', 'seo', 'shop'];
+	const fieldsWithNoLabel: FieldType[] = ['boolean', 'object', 'blocks', 'seo', 'shop'];
 
 	const fieldsWithAlternativeDescription: FieldType[] = ['media', 'object', 'blocks'];
 
@@ -145,6 +145,8 @@
 						<NumberField {field} bind:value={$value} />
 					{:else if field.type === 'seo'}
 						<LazyField loader={() => import('./seo-field.svelte')} props={{ field, form, path }} skeletonClass="h-16" />
+					{:else if field.type === 'shop'}
+						<LazyField loader={() => import('./shop-field.svelte')} props={{ field }} skeletonClass="h-40" />
 					{:else if field.type === 'url'}
 						<UrlFieldWrapper {field} {form} {path} />
 					{:else if field.type === 'relation'}