feat: enhance product editing functionality with improved form handling and caching

Author: gustaavik

src/lib/server/api/commercify.ts

@@ -42,6 +42,7 @@ import {
 	type DiscountDTO,
 	type UserLoginResponse,
 	type CreateProductRequest,
+	type UpdateProductRequest,
 	type CategoryDTO,
 	type CreateCategoryRequest,
 	type UpdateCategoryRequest,
@@ -62,6 +63,7 @@ import type {
 } from '$lib/types/checkout';
 import type { CreateDiscount, Discount } from '$lib/types/discount';
 import type { CommercifyUser } from '$lib/types/user';
+import { boolean } from 'zod/v4';
 
 export class CommercifyClient {
 	private baseUrl: string;
@@ -506,6 +508,7 @@ export class CommercifyClient {
 		if (params.page) searchParams.append('page', params.page.toString());
 		if (params.page_size) searchParams.append('page_size', params.page_size.toString());
 		if (params.currency) searchParams.append('currency', params.currency);
+		searchParams.append('active', 'all');
 
 		const endpoint = `/admin/products?${searchParams.toString()}`;
 
@@ -671,10 +674,34 @@ export class CommercifyClient {
 				error: 'No product ID provided'
 			};
 		}
+
+		console.log('Editing product:', { productId, data });
+
+		// Transform data to match API expectations
+		const apiData: UpdateProductRequest = {
+			name: data.name,
+			description: data.description,
+			currency: data.currency,
+			category_id: data.categoryId ? parseInt(data.categoryId) : undefined,
+			images: data.images,
+			active: data.isActive,
+			variants: data.variants?.map((variant) => ({
+				sku: variant.sku,
+				price: variant.price,
+				stock: variant.stock,
+				weight: variant.weight,
+				attributes: variant.attributes
+					? Object.entries(variant.attributes).map(([name, value]) => ({ name, value }))
+					: undefined,
+				images: variant.images,
+				is_default: variant.isDefault
+			}))
+		};
+
 		try {
 			const response = await this.request<ResponseDTO<ProductDTO>>(`/admin/products/${productId}`, {
 				method: 'PUT',
-				body: JSON.stringify(data)
+				body: JSON.stringify(apiData)
 			});
 			if (response.success && response.data) {
 				return {
@@ -1796,8 +1823,6 @@ export class CommercifyClient {
 		try {
 			const response = await this.request<ListResponseDTO<CategoryDTO>>('/categories');
 
-			console.log('Categories response:', response);
-
 			if (!response.success || !response.data) {
 				return {
 					success: false,

src/lib/types/product.ts

@@ -39,15 +39,6 @@ export interface Currency {
 	updatedAt: string | null;
 }
 
-export interface UpdateProductVariantInput {
-	sku?: string;
-	price?: number /* float64 */;
-	stock?: number /* int */;
-	attributes?: { [key: string]: string };
-	images?: string[];
-	isDefault?: boolean;
-}
-
 export interface CreateProductVariantInput {
 	sku: string;
 	price: number /* float64 */;
@@ -68,15 +59,6 @@ export interface CreateProductInput {
 	variants?: CreateProductVariantInput[];
 }
 
-export interface UpdateProductInput {
-	name?: string;
-	description?: string;
-	currency?: string;
-	categoryId?: string;
-	images?: string[];
-	isActive?: boolean;
-}
-
 export interface Category {
 	id: string;
 	name: string;
@@ -97,3 +79,6 @@ export interface UpdateCategoryInput {
 	description?: string;
 	parentId?: string | null;
 }
+
+export type UpdateProductInput = Partial<CreateProductInput>;
+export type UpdateProductVariantInput = Partial<CreateProductVariantInput>;

src/routes/admin/products/[id]/edit/+page.server.ts

@@ -2,8 +2,7 @@ import type { Actions } from '@sveltejs/kit';
 import { fail, redirect } from '@sveltejs/kit';
 import { superValidate } from 'sveltekit-superforms';
 import { zod } from 'sveltekit-superforms/adapters';
-import { productSchema, productVariantSchema } from '$lib/schemas/product.schema';
-import type { CreateProductVariantInput } from '$lib/types/product.js';
+import { productSchema } from '$lib/schemas/product.schema';
 
 export const load = async ({ params, locals }) => {
 	const productId = params.id;
@@ -110,65 +109,9 @@ export const actions: Actions = {
 		}
 
 		console.log('Product updated successfully:', result.data);
+		
+		// Invalidate all cached data to ensure fresh product data is loaded
+		// This will refresh the product list, product details, and any other cached data
 		redirect(303, '/admin/products');
-	},
-	removeVariant: async ({ request, params, locals }) => {
-		const productId = params.id;
-		if (!productId) {
-			return fail(400, { error: 'Product ID is required' });
-		}
-		const { commercify } = locals;
-		const formData = await request.formData();
-		const variantId = formData.get('variantId') as string;
-		if (!variantId) {
-			return fail(400, { error: 'Variant ID is required' });
-		}
-		try {
-			const result = await commercify.deleteProductVariant(productId, variantId);
-			if (!result.success) {
-				console.error('Error removing product variant:', result.error);
-				return fail(400, {
-					error: result.error || 'Failed to remove product variant'
-				});
-			}
-			console.log('Product variant removed successfully:', result.data);
-			redirect(303, `/admin/products/${productId}/edit`);
-		} catch (error) {
-			console.error('Error removing product variant:', error);
-			return fail(500, { error: 'Failed to remove product variant' });
-		}
-	},
-	addVariant: async ({ request, params, locals }) => {
-		const productId = params.id;
-		if (!productId) {
-			return fail(400, { error: 'Product ID is required' });
-		}
-		const { commercify } = locals;
-		const form = await superValidate(request, zod(productVariantSchema));
-		if (!form.valid) {
-			return fail(400, { form });
-		}
-		console.log('Adding product variant with data:', form.data);
-
-		const input: CreateProductVariantInput = {
-			sku: form.data.sku,
-			price: form.data.price,
-			stock: form.data.stock || 0,
-			weight: form.data.weight || 0,
-			attributes: form.data.attributes || {},
-			images: form.data.images || [],
-			isDefault: form.data.isDefault || false
-		};
-
-		const result = await commercify.addProductVariant(productId, input);
-		if (!result.success) {
-			console.error('Error adding product variant:', result.error);
-			return fail(400, {
-				form,
-				error: result.error || 'Failed to add product variant'
-			});
-		}
-		console.log('Product variant added successfully:', result.data);
-		redirect(303, `/admin/products/${productId}/edit`);
 	}
 };