@vendure/dashboard 3.5.0-minor-202510161257 → 3.5.0

package/src/app/routes/_authenticated/_collections/components/collection-contents-preview-table.tsx

@@ -3,6 +3,7 @@ import { Alert, AlertDescription, AlertTitle } from '@/vdb/components/ui/alert.j
 import { Button } from '@/vdb/components/ui/button.js';
 import { addCustomFields } from '@/vdb/framework/document-introspection/add-custom-fields.js';
 import { graphql } from '@/vdb/graphql/graphql.js';
+import { Trans } from '@lingui/react/macro';
 import { useQuery } from '@tanstack/react-query';
 import { Link } from '@tanstack/react-router';
 import { ColumnFiltersState, SortingState } from '@tanstack/react-table';
@@ -52,7 +53,15 @@ export function CollectionContentsPreviewTable({
         for (const arg of filterDef.args) {
             const argPair = f.arguments.find(a => a.name === arg.name);
             const argValue = argPair?.value ?? arg.defaultValue;
-            if (arg.required && argValue == null) {
+            let isValidValue = true;
+            if (arg.list) {
+                try {
+                    JSON.parse(argValue);
+                } catch (e) {
+                    isValidValue = false;
+                }
+            }
+            if (!isValidValue || (arg.required && argValue == null)) {
                 return false;
             }
         }
@@ -61,66 +70,84 @@ export function CollectionContentsPreviewTable({
 
     return (
         <div>
-            <Alert className="mb-4">
-                <Eye className="h-4 w-4" />
-                <AlertTitle>Preview</AlertTitle>
-                <AlertDescription>
-                    This is a preview of the collection contents based on the current filter settings. Once
-                    you save the collection, the contents will be updated to reflect the new filter settings.
-                </AlertDescription>
-            </Alert>
-
-            <PaginatedListDataTable
-                listQuery={addCustomFields(previewCollectionContentsDocument)}
-                transformQueryKey={queryKey => {
-                    return [...queryKey, JSON.stringify(effectiveFilters), inheritFilters];
-                }}
-                transformVariables={variables => {
-                    return {
-                        options: variables.options,
-                        input: {
-                            parentId,
-                            filters: effectiveFilters,
-                            inheritFilters,
-                        },
-                    };
-                }}
-                customizeColumns={{
-                    name: {
-                        header: 'Variant name',
-                        cell: ({ row }) => {
-                            return (
-                                <Button asChild variant="ghost">
-                                    <Link to={`../../product-variants/${row.original.id}`}>
-                                        {row.original.name}{' '}
-                                    </Link>
-                                </Button>
-                            );
-                        },
-                    },
-                }}
-                page={page}
-                itemsPerPage={pageSize}
-                sorting={sorting}
-                columnFilters={filters}
-                onPageChange={(_, page, perPage) => {
-                    setPage(page);
-                    setPageSize(perPage);
-                }}
-                onSortChange={(_, sorting) => {
-                    setSorting(sorting);
-                }}
-                onFilterChange={(_, filters) => {
-                    setFilters(filters);
-                }}
-                onSearchTermChange={searchTerm => {
-                    return {
-                        name: {
-                            contains: searchTerm,
-                        },
-                    };
-                }}
-            />
+            {effectiveFilters.length === 0 ? (
+                <Alert className="mb-4">
+                    <Eye className="h-4 w-4" />
+                    <AlertTitle>
+                        <Trans>Preview</Trans>
+                    </AlertTitle>
+                    <AlertDescription>
+                        <Trans>Add filters to preview the collection contents.</Trans>
+                    </AlertDescription>
+                </Alert>
+            ) : (
+                <>
+                    <Alert className="mb-4">
+                        <Eye className="h-4 w-4" />
+                        <AlertTitle>
+                            <Trans>Preview</Trans>
+                        </AlertTitle>
+                        <AlertDescription>
+                            <Trans>
+                                This is a preview of the collection contents based on the current filter
+                                settings. Once you save the collection, the contents will be updated to
+                                reflect the new filter settings.
+                            </Trans>
+                        </AlertDescription>
+                    </Alert>
+                    <PaginatedListDataTable
+                        listQuery={addCustomFields(previewCollectionContentsDocument)}
+                        transformQueryKey={queryKey => {
+                            return [...queryKey, JSON.stringify(effectiveFilters), inheritFilters];
+                        }}
+                        transformVariables={variables => {
+                            return {
+                                options: variables.options,
+                                input: {
+                                    parentId,
+                                    filters: effectiveFilters,
+                                    inheritFilters,
+                                },
+                            };
+                        }}
+                        customizeColumns={{
+                            name: {
+                                header: 'Variant name',
+                                cell: ({ row }) => {
+                                    return (
+                                        <Button asChild variant="ghost">
+                                            <Link to={`../../product-variants/${row.original.id}`}>
+                                                {row.original.name}{' '}
+                                            </Link>
+                                        </Button>
+                                    );
+                                },
+                            },
+                        }}
+                        page={page}
+                        itemsPerPage={pageSize}
+                        sorting={sorting}
+                        columnFilters={filters}
+                        onPageChange={(_, page, perPage) => {
+                            setPage(page);
+                            setPageSize(perPage);
+                        }}
+                        onSortChange={(_, sorting) => {
+                            setSorting(sorting);
+                        }}
+                        onFilterChange={(_, filters) => {
+                            setFilters(filters);
+                        }}
+                        onSearchTermChange={searchTerm => {
+                            return {
+                                name: {
+                                    contains: searchTerm,
+                                },
+                            };
+                        }}
+                    />
+                </>
+            )}
         </div>
     );
 }

package/src/app/routes/_authenticated/_collections/components/move-collections-dialog.tsx

@@ -14,7 +14,6 @@ import {
     DialogTitle,
 } from '@/vdb/components/ui/dialog.js';
 import { Input } from '@/vdb/components/ui/input.js';
-import { ScrollArea } from '@/vdb/components/ui/scroll-area.js';
 import { api } from '@/vdb/graphql/api.js';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { ChevronRight, Folder, FolderOpen, Search } from 'lucide-react';
@@ -68,7 +67,7 @@ function TargetAlert({
     collectionNameCache,
 }: Readonly<TargetAlertProps>) {
     return (
-        <Alert className={selectedCollectionId ? 'border-blue-200 bg-blue-50' : ''}>
+        <Alert className={selectedCollectionId ? 'border-blue-200 bg-blue-50' : 'opacity-50'}>
             <Folder className="h-4 w-4" />
             <AlertDescription>
                 {selectedCollectionId ? (
@@ -330,8 +329,8 @@ export function MoveCollectionsDialog({
 
     return (
         <Dialog open={open} onOpenChange={onOpenChange}>
-            <DialogContent className="sm:max-w-[600px] max-h-[80vh]">
-                <DialogHeader>
+            <DialogContent className="sm:max-w-[600px] h-[90vh] flex flex-col p-0 gap-0">
+                <DialogHeader className="px-6 pt-6 pb-4">
                     <DialogTitle>
                         <Trans>Move Collections</Trans>
                     </DialogTitle>
@@ -345,7 +344,7 @@ export function MoveCollectionsDialog({
                         </Trans>
                     </DialogDescription>
                 </DialogHeader>
-                <div className="px-6 py-3 bg-muted/50 border-b">
+                <div className="px-6 py-3 bg-muted/50 border-y shrink-0">
                     <div className="flex flex-wrap gap-2">
                         {collectionsToMove.map(collection => (
                             <div
@@ -358,9 +357,9 @@ export function MoveCollectionsDialog({
                         ))}
                     </div>
                 </div>
-                <div className="py-4">
-                    <div className="px-6 pb-3">
-                        <div className="relative mb-3">
+                <div className="flex-1 min-h-0 overflow-auto px-6 py-4">
+                    <div className="h-full flex flex-col gap-3">
+                        <div className="relative shrink-0">
                             <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" />
                             <Input
                                 placeholder={t`Filter by collection name`}
@@ -369,47 +368,47 @@ export function MoveCollectionsDialog({
                                 className="pl-10"
                             />
                         </div>
-                        <ScrollArea className="h-[400px]">
-                            <div className="space-y-1">
-                                {isLoading ? (
-                                    <div className="flex items-center justify-center py-8">
-                                        <Trans>Loading collections...</Trans>
-                                    </div>
-                                ) : (
-                                    <>
-                                        {!debouncedSearchTerm && !selectionHasTopLevelParent && (
-                                            <MoveToTopLevel
-                                                selectedCollectionId={selectedCollectionId}
-                                                topLevelCollectionId={topLevelCollectionId}
-                                                onSelect={setSelectedCollectionId}
-                                            />
-                                        )}
-                                        {collections.map((collection: Collection) => (
-                                            <CollectionTreeNode
-                                                key={collection.id}
-                                                collection={collection}
-                                                depth={0}
-                                                expanded={expanded}
-                                                onToggleExpanded={handleToggleExpanded}
-                                                onSelect={handleSelect}
-                                                selectedCollectionId={selectedCollectionId}
-                                                collectionsToMove={collectionsToMove}
-                                                childCollectionsByParentId={childCollectionsByParentId}
-                                            />
-                                        ))}
-                                    </>
-                                )}
-                            </div>
-                        </ScrollArea>
-                        <TargetAlert
-                            selectedCollectionId={selectedCollectionId}
-                            collectionsToMove={collectionsToMove}
-                            topLevelCollectionId={topLevelCollectionId}
-                            collectionNameCache={collectionNameCache}
-                        />
+                        <div className="space-y-1">
+                            {isLoading ? (
+                                <div className="flex items-center justify-center py-8">
+                                    <Trans>Loading collections...</Trans>
+                                </div>
+                            ) : (
+                                <>
+                                    {!debouncedSearchTerm && !selectionHasTopLevelParent && (
+                                        <MoveToTopLevel
+                                            selectedCollectionId={selectedCollectionId}
+                                            topLevelCollectionId={topLevelCollectionId}
+                                            onSelect={setSelectedCollectionId}
+                                        />
+                                    )}
+                                    {collections.map((collection: Collection) => (
+                                        <CollectionTreeNode
+                                            key={collection.id}
+                                            collection={collection}
+                                            depth={0}
+                                            expanded={expanded}
+                                            onToggleExpanded={handleToggleExpanded}
+                                            onSelect={handleSelect}
+                                            selectedCollectionId={selectedCollectionId}
+                                            collectionsToMove={collectionsToMove}
+                                            childCollectionsByParentId={childCollectionsByParentId}
+                                        />
+                                    ))}
+                                </>
+                            )}
+                        </div>
+                        <div className="shrink-0">
+                            <TargetAlert
+                                selectedCollectionId={selectedCollectionId}
+                                collectionsToMove={collectionsToMove}
+                                topLevelCollectionId={topLevelCollectionId}
+                                collectionNameCache={collectionNameCache}
+                            />
+                        </div>
                     </div>
                 </div>
-                <DialogFooter>
+                <DialogFooter className="px-6 pb-6 pt-4 shrink-0">
                     <Button variant="outline" onClick={() => onOpenChange(false)}>
                         <Trans>Cancel</Trans>
                     </Button>

package/src/app/routes/_authenticated/_orders/orders.tsx

@@ -61,9 +61,11 @@ function OrderListPage() {
             route={Route}
             customizeColumns={{
                 total: {
+                    meta: { dependencies: ['currencyCode'] },
                     cell: OrderMoneyCell,
                 },
                 totalWithTax: {
+                    meta: { dependencies: ['currencyCode'] },
                     cell: OrderMoneyCell,
                 },
                 state: {

package/src/app/routes/_authenticated/_product-variants/product-variants.tsx

@@ -61,11 +61,13 @@ function ProductListPage() {
                     cell: ({ row: { original } }) => formatCurrencyName(original.currencyCode, 'full'),
                 },
                 price: {
+                    meta: { dependencies: ['currencyCode'] },
                     cell: ({ row: { original } }) => (
                         <Money value={original.price} currency={original.currencyCode} />
                     ),
                 },
                 priceWithTax: {
+                    meta: { dependencies: ['currencyCode'] },
                     cell: ({ row: { original } }) => (
                         <Money value={original.priceWithTax} currency={original.currencyCode} />
                     ),
@@ -75,8 +77,19 @@ function ProductListPage() {
                 },
             }}
             onSearchTermChange={searchTerm => {
+                return searchTerm
+                    ? {
+                          name: { contains: searchTerm },
+                          sku: { contains: searchTerm },
+                      }
+                    : {};
+            }}
+            transformVariables={variables => {
                 return {
-                    name: { contains: searchTerm },
+                    options: {
+                        ...variables.options,
+                        filterOperator: 'OR',
+                    },
                 };
             }}
             route={Route}

package/src/app/routes/_authenticated/_product-variants/product-variants_.$id.tsx

@@ -1,6 +1,7 @@
 import { MoneyInput } from '@/vdb/components/data-input/money-input.js';
 import { NumberInput } from '@/vdb/components/data-input/number-input.js';
 import { AssignedFacetValues } from '@/vdb/components/shared/assigned-facet-values.js';
+import { DetailPageButton } from '@/vdb/components/shared/detail-page-button.js';
 import { EntityAssets } from '@/vdb/components/shared/entity-assets.js';
 import { ErrorPage } from '@/vdb/components/shared/error-page.js';
 import { FormFieldWrapper } from '@/vdb/components/shared/form-field-wrapper.js';
@@ -234,7 +235,7 @@ function ProductVariantDetailPage() {
                         <TranslatableFormFieldWrapper
                             control={form.control}
                             name="name"
-                            label={<Trans>Product name</Trans>}
+                            label={<Trans>Variant name</Trans>}
                             render={({ field }) => <Input {...field} />}
                         />
 
@@ -422,21 +423,25 @@ function ProductVariantDetailPage() {
                     />
                 </PageBlock>
 
-                <PageBlock column="side" blockId="facet-values">
+                <PageBlock column="side" blockId="facet-values" title={<Trans>Facet Values</Trans>}>
                     <FormFieldWrapper
                         control={form.control}
                         name="facetValueIds"
-                        label={<Trans>Facet values</Trans>}
                         render={({ field }) => (
                             <AssignedFacetValues facetValues={entity?.facetValues ?? []} {...field} />
                         )}
                     />
                 </PageBlock>
-                <PageBlock column="side" blockId="assets">
+
+                <PageBlock column="side" blockId="parent-product" title={<Trans>Parent product</Trans>}>
+                    <DetailPageButton
+                        label={entity?.product.name}
+                        href={`/products/${entity?.product.id}`}
+                        className="border"
+                    />
+                </PageBlock>
+                <PageBlock column="side" blockId="assets" title={<Trans>Assets</Trans>}>
                     <FormItem>
-                        <FormLabel>
-                            <Trans>Assets</Trans>
-                        </FormLabel>
                         <FormControl>
                             <EntityAssets
                                 assets={entity?.assets}

package/src/app/routes/_authenticated/_products/products.tsx

@@ -54,8 +54,20 @@ function ProductListPage() {
                 },
             }}
             onSearchTermChange={searchTerm => {
+                return searchTerm
+                    ? {
+                          name: { contains: searchTerm },
+                          slug: { contains: searchTerm },
+                          sku: { contains: searchTerm },
+                      }
+                    : {};
+            }}
+            transformVariables={variables => {
                 return {
-                    name: { contains: searchTerm },
+                    options: {
+                        ...variables.options,
+                        filterOperator: 'OR',
+                    },
                 };
             }}
             defaultVisibility={{

package/src/app/routes/_authenticated/_shipping-methods/shipping-methods_.$id.tsx

@@ -121,7 +121,13 @@ function ShippingMethodDetailPage() {
                     <PermissionGuard requires={['UpdateShippingMethod']}>
                         <Button
                             type="submit"
-                            disabled={!form.formState.isDirty || !form.formState.isValid || isPending}
+                            disabled={
+                                !form.formState.isDirty ||
+                                !form.formState.isValid ||
+                                isPending ||
+                                !checker?.code ||
+                                !calculator?.code
+                            }
                         >
                             {creatingNewEntity ? <Trans>Create</Trans> : <Trans>Update</Trans>}
                         </Button>
@@ -163,7 +169,7 @@ function ShippingMethodDetailPage() {
                         />
                     </DetailFormGrid>
                 </PageBlock>
-                <CustomFieldsPageBlock column="main" entityType="Promotion" control={form.control} />
+                <CustomFieldsPageBlock column="main" entityType="ShippingMethod" control={form.control} />
                 <PageBlock column="main" blockId="conditions" title={<Trans>Conditions</Trans>}>
                     <FormFieldWrapper
                         control={form.control}

package/src/app/routes/_authenticated/_tax-categories/tax-categories_.$id.tsx

@@ -58,6 +58,7 @@ function TaxCategoryDetailPage() {
             return {
                 id: entity.id,
                 name: entity.name,
+                isDefault: entity.isDefault,
                 customFields: entity.customFields,
             };
         },