@vendure/dashboard 3.3.6-master-202507050232 → 3.4.0-minor-202506250934

package/src/lib/components/shared/asset/asset-bulk-actions.tsx

@@ -1,94 +0,0 @@
-'use client';
-
-import { Button } from '@/vdb/components/ui/button.js';
-import {
-    DropdownMenu,
-    DropdownMenuContent,
-    DropdownMenuItem,
-    DropdownMenuTrigger,
-} from '@/vdb/components/ui/dropdown-menu.js';
-import { getBulkActions } from '@/vdb/framework/data-table/data-table-extensions.js';
-import { usePageBlock } from '@/vdb/hooks/use-page-block.js';
-import { usePage } from '@/vdb/hooks/use-page.js';
-import { Trans } from '@/vdb/lib/trans.js';
-import { ChevronDown } from 'lucide-react';
-import { Asset } from './asset-gallery.js';
-
-export type AssetBulkActionContext = {
-    selection: Asset[];
-    refetch: () => void;
-};
-
-export type AssetBulkActionComponent = React.FunctionComponent<AssetBulkActionContext>;
-
-export type AssetBulkAction = {
-    order?: number;
-    component: AssetBulkActionComponent;
-};
-
-interface AssetBulkActionsProps {
-    selection: Asset[];
-    bulkActions?: AssetBulkAction[];
-    refetch: () => void;
-}
-
-export function AssetBulkActions({ selection, bulkActions, refetch }: Readonly<AssetBulkActionsProps>) {
-    const { pageId } = usePage();
-    const { blockId } = usePageBlock();
-
-    if (selection.length === 0) {
-        return null;
-    }
-
-    // Get extended bulk actions from the registry
-    const extendedBulkActions = pageId ? getBulkActions(pageId, blockId) : [];
-
-    // Convert DataTable bulk actions to Asset bulk actions
-    const convertedBulkActions: AssetBulkAction[] = extendedBulkActions.map(action => ({
-        order: action.order,
-        component: ({ selection }) => {
-            // Create a mock table context for compatibility
-            const mockTable = {
-                getState: () => ({ rowSelection: {} }),
-                getRow: () => null,
-            } as any;
-
-            const ActionComponent = action.component;
-            return <ActionComponent selection={selection} table={mockTable} />;
-        },
-    }));
-
-    const allBulkActions = [...convertedBulkActions, ...(bulkActions ?? [])];
-    allBulkActions.sort((a, b) => (a.order ?? 10_000) - (b.order ?? 10_000));
-
-    return (
-        <div className="flex items-center gap-2 px-2 py-1 mb-2 bg-muted/50 rounded-md border">
-            <span className="text-sm text-muted-foreground">
-                <Trans>{selection.length} selected</Trans>
-            </span>
-            <DropdownMenu>
-                <DropdownMenuTrigger asChild>
-                    <Button variant="outline" size="sm" className="h-8">
-                        <Trans>With selected...</Trans>
-                        <ChevronDown className="ml-2 h-4 w-4" />
-                    </Button>
-                </DropdownMenuTrigger>
-                <DropdownMenuContent align="start">
-                    {allBulkActions.length > 0 ? (
-                        allBulkActions.map((action, index) => (
-                            <action.component
-                                key={`asset-bulk-action-${index}`}
-                                selection={selection}
-                                refetch={refetch}
-                            />
-                        ))
-                    ) : (
-                        <DropdownMenuItem className="text-muted-foreground" disabled>
-                            <Trans>No actions available</Trans>
-                        </DropdownMenuItem>
-                    )}
-                </DropdownMenuContent>
-            </DropdownMenu>
-        </div>
-    );
-}

package/src/lib/components/shared/assign-to-channel-bulk-action.tsx

@@ -1,71 +0,0 @@
-import { LayersIcon } from 'lucide-react';
-import { useState } from 'react';
-
-import { DataTableBulkActionItem } from '@/vdb/components/data-table/data-table-bulk-action-item.js';
-import { AssignToChannelDialog } from '@/vdb/components/shared/assign-to-channel-dialog.js';
-import { usePaginatedList } from '@/vdb/components/shared/paginated-list-data-table.js';
-import { useChannel } from '@/vdb/hooks/use-channel.js';
-import { Trans } from '@/vdb/lib/trans.js';
-
-interface AssignToChannelBulkActionProps {
-    selection: any[];
-    table: any;
-    entityType: string;
-    mutationFn: (variables: any) => Promise<any>;
-    requiredPermissions: string[];
-    buildInput: (channelId: string, additionalData?: Record<string, any>) => Record<string, any>;
-    additionalFields?: React.ReactNode;
-    additionalData?: Record<string, any>;
-    /**
-     * Additional callback to run on success, after the standard refetch and reset
-     */
-    onSuccess?: () => void;
-}
-
-export function AssignToChannelBulkAction({
-    selection,
-    table,
-    entityType,
-    mutationFn,
-    requiredPermissions,
-    buildInput,
-    additionalFields,
-    additionalData = {},
-    onSuccess,
-}: Readonly<AssignToChannelBulkActionProps>) {
-    const { refetchPaginatedList } = usePaginatedList();
-    const { channels } = useChannel();
-    const [dialogOpen, setDialogOpen] = useState(false);
-
-    if (channels.length < 2) {
-        return null;
-    }
-
-    const handleSuccess = () => {
-        refetchPaginatedList();
-        table.resetRowSelection();
-        onSuccess?.();
-    };
-
-    return (
-        <>
-            <DataTableBulkActionItem
-                requiresPermission={requiredPermissions}
-                onClick={() => setDialogOpen(true)}
-                label={<Trans>Assign to channel</Trans>}
-                icon={LayersIcon}
-            />
-            <AssignToChannelDialog
-                open={dialogOpen}
-                onOpenChange={setDialogOpen}
-                entityIds={selection.map(s => s.id)}
-                entityType={entityType}
-                mutationFn={mutationFn}
-                onSuccess={handleSuccess}
-                buildInput={buildInput}
-                additionalFields={additionalFields}
-                additionalData={additionalData}
-            />
-        </>
-    );
-}

package/src/lib/components/shared/assign-to-channel-dialog.tsx

@@ -1,155 +0,0 @@
-import { useMutation } from '@tanstack/react-query';
-import { ReactNode, useState } from 'react';
-import { toast } from 'sonner';
-
-import { ChannelCodeLabel } from '@/vdb/components/shared/channel-code-label.js';
-import { Button } from '@/vdb/components/ui/button.js';
-import {
-    Dialog,
-    DialogContent,
-    DialogDescription,
-    DialogFooter,
-    DialogHeader,
-    DialogTitle,
-} from '@/vdb/components/ui/dialog.js';
-import { Input } from '@/vdb/components/ui/input.js';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/vdb/components/ui/select.js';
-import { ResultOf } from '@/vdb/graphql/graphql.js';
-import { Trans, useLingui } from '@/vdb/lib/trans.js';
-
-import { useChannel } from '@/vdb/hooks/use-channel.js';
-
-interface AssignToChannelDialogProps {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    entityIds: string[];
-    entityType: string;
-    mutationFn: (variables: any) => Promise<ResultOf<any>>;
-    onSuccess?: () => void;
-    /**
-     * Function to build the input object for the mutation
-     * @param channelId - The selected channel ID
-     * @param additionalData - Any additional data (like priceFactor for products)
-     * @returns The input object for the mutation
-     */
-    buildInput: (channelId: string, additionalData?: Record<string, any>) => Record<string, any>;
-    /**
-     * Optional additional form fields to render
-     */
-    additionalFields?: ReactNode;
-    /**
-     * Optional additional data to pass to buildInput
-     */
-    additionalData?: Record<string, any>;
-}
-
-export function AssignToChannelDialog({
-    open,
-    onOpenChange,
-    entityIds,
-    entityType,
-    mutationFn,
-    onSuccess,
-    buildInput,
-    additionalFields,
-    additionalData = {},
-}: Readonly<AssignToChannelDialogProps>) {
-    const { i18n } = useLingui();
-    const [selectedChannelId, setSelectedChannelId] = useState<string>('');
-    const { channels, selectedChannel } = useChannel();
-
-    // Filter out the currently selected channel from available options
-    const availableChannels = channels.filter(channel => channel.id !== selectedChannel?.id);
-
-    const { mutate, isPending } = useMutation({
-        mutationFn,
-        onSuccess: () => {
-            toast.success(i18n.t(`Successfully assigned ${entityIds.length} ${entityType} to channel`));
-            onSuccess?.();
-            onOpenChange(false);
-        },
-        onError: () => {
-            toast.error(`Failed to assign ${entityIds.length} ${entityType} to channel`);
-        },
-    });
-
-    const handleAssign = () => {
-        if (!selectedChannelId) {
-            toast.error('Please select a channel');
-            return;
-        }
-
-        const input = buildInput(selectedChannelId, additionalData);
-        mutate({ input });
-    };
-
-    return (
-        <Dialog open={open} onOpenChange={onOpenChange}>
-            <DialogContent className="sm:max-w-[425px]">
-                <DialogHeader>
-                    <DialogTitle>
-                        <Trans>Assign {entityType} to channel</Trans>
-                    </DialogTitle>
-                    <DialogDescription>
-                        <Trans>
-                            Select a channel to assign {entityIds.length} {entityType} to
-                        </Trans>
-                    </DialogDescription>
-                </DialogHeader>
-                <div className="grid gap-4 py-4">
-                    <div className="grid gap-2">
-                        <label className="text-sm font-medium">
-                            <Trans>Channel</Trans>
-                        </label>
-                        <Select value={selectedChannelId} onValueChange={setSelectedChannelId}>
-                            <SelectTrigger>
-                                <SelectValue placeholder={i18n.t('Select a channel')} />
-                            </SelectTrigger>
-                            <SelectContent>
-                                {availableChannels.map(channel => (
-                                    <SelectItem key={channel.id} value={channel.id}>
-                                        <ChannelCodeLabel code={channel.code} />
-                                    </SelectItem>
-                                ))}
-                            </SelectContent>
-                        </Select>
-                    </div>
-                    {additionalFields}
-                </div>
-                <DialogFooter>
-                    <Button variant="outline" onClick={() => onOpenChange(false)}>
-                        <Trans>Cancel</Trans>
-                    </Button>
-                    <Button onClick={handleAssign} disabled={!selectedChannelId || isPending}>
-                        <Trans>Assign</Trans>
-                    </Button>
-                </DialogFooter>
-            </DialogContent>
-        </Dialog>
-    );
-}
-
-/**
- * Hook for managing price factor state in assign-to-channel dialogs
- */
-export function usePriceFactor() {
-    const [priceFactor, setPriceFactor] = useState<number>(1);
-
-    const priceFactorField = (
-        <div className="grid gap-2">
-            <label className="text-sm font-medium">
-                <Trans>Price conversion factor</Trans>
-            </label>
-            <Input
-                type="number"
-                min="0"
-                max="99999"
-                step="0.01"
-                value={priceFactor}
-                onChange={e => setPriceFactor(parseFloat(e.target.value) || 1)}
-            />
-        </div>
-    );
-
-    return { priceFactor, priceFactorField };
-}

package/src/lib/components/shared/remove-from-channel-bulk-action.tsx

@@ -1,90 +0,0 @@
-import { useMutation } from '@tanstack/react-query';
-import { LayersIcon } from 'lucide-react';
-import { toast } from 'sonner';
-
-import { DataTableBulkActionItem } from '@/vdb/components/data-table/data-table-bulk-action-item.js';
-import { usePaginatedList } from '@/vdb/components/shared/paginated-list-data-table.js';
-import { ResultOf } from '@/vdb/graphql/graphql.js';
-import { useChannel } from '@/vdb/hooks/use-channel.js';
-import { Trans, useLingui } from '@/vdb/lib/trans.js';
-
-interface RemoveFromChannelBulkActionProps {
-    selection: any[];
-    table: any;
-    entityType: string;
-    mutationFn: (variables: any) => Promise<ResultOf<any>>;
-    requiredPermissions: string[];
-    buildInput: () => Record<string, any>;
-    /**
-     * Additional callback to run on success, after the standard refetch and reset
-     * @param result - The result from the mutation
-     */
-    onSuccess?: (result?: ResultOf<any>) => void;
-    /**
-     * Custom success message. If not provided, a default message will be used.
-     */
-    successMessage?: string;
-    /**
-     * Custom error message. If not provided, a default message will be used.
-     */
-    errorMessage?: string;
-}
-
-export function RemoveFromChannelBulkAction({
-    selection,
-    table,
-    entityType,
-    mutationFn,
-    requiredPermissions,
-    buildInput,
-    onSuccess,
-    successMessage,
-    errorMessage,
-}: Readonly<RemoveFromChannelBulkActionProps>) {
-    const { refetchPaginatedList } = usePaginatedList();
-    const { selectedChannel } = useChannel();
-    const { i18n } = useLingui();
-    const { mutate } = useMutation({
-        mutationFn,
-        onSuccess: result => {
-            const message =
-                successMessage ||
-                i18n.t(`Successfully removed ${selection.length} ${entityType} from channel`);
-            toast.success(message);
-            refetchPaginatedList();
-            table.resetRowSelection();
-            onSuccess?.(result);
-        },
-        onError: error => {
-            const message =
-                errorMessage ||
-                `Failed to remove ${selection.length} ${entityType} from channel: ${error.message}`;
-            toast.error(message);
-        },
-    });
-
-    if (!selectedChannel) {
-        return null;
-    }
-
-    const handleRemove = () => {
-        mutate({
-            input: buildInput(),
-        });
-    };
-
-    return (
-        <DataTableBulkActionItem
-            requiresPermission={requiredPermissions}
-            onClick={handleRemove}
-            label={<Trans>Remove from current channel</Trans>}
-            confirmationText={
-                <Trans>
-                    Are you sure you want to remove {selection.length} {entityType} from the current channel?
-                </Trans>
-            }
-            icon={LayersIcon}
-            className="text-warning"
-        />
-    );
-}

package/src/lib/framework/data-table/data-table-extensions.ts

@@ -1,35 +0,0 @@
-import { BulkAction } from '@/vdb/framework/extension-api/types/index.js';
-import { DocumentNode } from 'graphql';
-
-import { globalRegistry } from '../registry/global-registry.js';
-
-globalRegistry.register('bulkActionsRegistry', new Map<string, BulkAction[]>());
-globalRegistry.register('listQueryDocumentRegistry', new Map<string, DocumentNode[]>());
-
-export function getBulkActions(pageId: string, blockId = 'list-table'): BulkAction[] {
-    const key = createKey(pageId, blockId);
-    return globalRegistry.get('bulkActionsRegistry').get(key) || [];
-}
-
-export function addBulkAction(pageId: string, blockId: string | undefined, action: BulkAction) {
-    const bulkActionsRegistry = globalRegistry.get('bulkActionsRegistry');
-    const key = createKey(pageId, blockId);
-    const existingActions = bulkActionsRegistry.get(key) || [];
-    bulkActionsRegistry.set(key, [...existingActions, action]);
-}
-
-export function getListQueryDocuments(pageId: string, blockId = 'list-table'): DocumentNode[] {
-    const key = createKey(pageId, blockId);
-    return globalRegistry.get('listQueryDocumentRegistry').get(key) || [];
-}
-
-export function addListQueryDocument(pageId: string, blockId: string | undefined, document: DocumentNode) {
-    const listQueryDocumentRegistry = globalRegistry.get('listQueryDocumentRegistry');
-    const key = createKey(pageId, blockId);
-    const existingDocuments = listQueryDocumentRegistry.get(key) || [];
-    listQueryDocumentRegistry.set(key, [...existingDocuments, document]);
-}
-
-function createKey(pageId: string, blockId: string | undefined): string {
-    return `${pageId}__${blockId ?? 'list-table'}`;
-}

package/src/lib/framework/document-extension/extend-detail-form-query.ts

@@ -1,50 +0,0 @@
-import { extendDocument } from '@/vdb/framework/document-extension/extend-document.js';
-import { getDetailQueryDocuments } from '@/vdb/framework/form-engine/custom-form-component-extensions.js';
-import { DocumentNode } from 'graphql';
-
-/**
- * @description
- * Extends a detail page query document with any registered extensions provided by
- * the `extendDetailDocument` function for the given page.
- */
-export function extendDetailFormQuery<T extends DocumentNode>(
-    detailQuery: T,
-    pageId?: string,
-): {
-    extendedQuery: T;
-    errorMessage?: string | null;
-} {
-    let result: T = detailQuery;
-    let errorMessage: string | null = null;
-
-    if (!pageId) {
-        // If no pageId is provided, return the original query without any extensions
-        return { extendedQuery: detailQuery };
-    }
-
-    const detailQueryExtensions = getDetailQueryDocuments(pageId);
-
-    try {
-        result = detailQueryExtensions.reduce(
-            (acc, extension) => extendDocument(acc, extension),
-            detailQuery,
-        ) as T;
-    } catch (err) {
-        errorMessage = err instanceof Error ? err.message : String(err);
-        // Continue with the original query instead of the extended one
-        result = detailQuery;
-    }
-
-    // Store error for useEffect to handle
-    if (errorMessage) {
-        // Log the error and continue with the original query
-        // eslint-disable-next-line no-console
-        console.warn(`${errorMessage}. Continuing with original query.`, {
-            pageId,
-            extensionsCount: detailQueryExtensions.length,
-            error: errorMessage,
-        });
-    }
-
-    return { extendedQuery: result, errorMessage };
-}