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

package/src/app/routes/_authenticated/_assets/assets_.$id.tsx

@@ -1,42 +1,31 @@
-import { AssetFocalPointEditor } from '@/vdb/components/shared/asset/asset-focal-point-editor.js';
-import { AssetPreviewSelector } from '@/vdb/components/shared/asset/asset-preview-selector.js';
-import { PreviewPreset } from '@/vdb/components/shared/asset/asset-preview.js';
-import { AssetProperties } from '@/vdb/components/shared/asset/asset-properties.js';
-import { Point } from '@/vdb/components/shared/asset/focal-point-control.js';
-import { ErrorPage } from '@/vdb/components/shared/error-page.js';
-import { PermissionGuard } from '@/vdb/components/shared/permission-guard.js';
-import { VendureImage } from '@/vdb/components/shared/vendure-image.js';
-import { Button } from '@/vdb/components/ui/button.js';
-import { Label } from '@/vdb/components/ui/label.js';
-import {
-    CustomFieldsPageBlock,
-    Page,
-    PageActionBar,
-    PageActionBarRight,
-    PageBlock,
-    PageLayout,
-    PageTitle,
-} from '@/vdb/framework/layout-engine/page-layout.js';
-import { detailPageRouteLoader } from '@/vdb/framework/page/detail-page-route-loader.js';
-import { useDetailPage } from '@/vdb/framework/page/use-detail-page.js';
-import { Trans, useLingui } from '@/vdb/lib/trans.js';
-import { createFileRoute } from '@tanstack/react-router';
-import { FocusIcon } from 'lucide-react';
-import { useRef, useState } from 'react';
-import { toast } from 'sonner';
+import { AssetPreview } from '@/components/shared/asset/asset-preview.js'
+import { detailPageRouteLoader } from '@/framework/page/detail-page-route-loader.js';
+import { createFileRoute } from '@tanstack/react-router'
 import { assetDetailDocument, assetUpdateDocument } from './assets.graphql.js';
-
-const pageId = 'asset-detail';
-
+import { Trans, useLingui } from '@/lib/trans.js';
+import { ErrorPage } from '@/components/shared/error-page.js';
+import { toast } from 'sonner';
+import { Page, PageTitle, PageActionBar, PageActionBarRight, PageBlock, PageLayout, CustomFieldsPageBlock } from '@/framework/layout-engine/page-layout.js'
+import { useDetailPage } from '@/framework/page/use-detail-page.js';
+import { PermissionGuard } from '@/components/shared/permission-guard.js';
+import { Button } from '@/components/ui/button.js';
+import { VendureImage } from '@/components/shared/vendure-image.js';
+import { useState, useRef } from 'react';
+import { PreviewPreset } from '@/components/shared/asset/asset-preview.js';
+import { AssetPreviewSelector } from '@/components/shared/asset/asset-preview-selector.js';
+import { AssetProperties } from '@/components/shared/asset/asset-properties.js';
+import { AssetFocalPointEditor } from '@/components/shared/asset/asset-focal-point-editor.js';
+import { FocusIcon } from 'lucide-react';
+import { Point } from '@/components/shared/asset/focal-point-control.js';
+import { Label } from '@/components/ui/label.js';
 export const Route = createFileRoute('/_authenticated/_assets/assets_/$id')({
     component: AssetDetailPage,
     loader: detailPageRouteLoader({
-        pageId,
         queryDocument: assetDetailDocument,
         breadcrumb(isNew, entity) {
             return [
                 { path: '/assets', label: 'Assets' },
-                isNew ? <Trans>New asset</Trans> : (entity?.name ?? ''),
+                isNew ? <Trans>New asset</Trans> : entity?.name ?? '',
             ];
         },
     }),
@@ -53,8 +42,7 @@ function AssetDetailPage() {
     const [height, setHeight] = useState(0);
     const [focalPoint, setFocalPoint] = useState<Point | undefined>(undefined);
     const [settingFocalPoint, setSettingFocalPoint] = useState(false);
-    const { form, submitHandler, entity, isPending, resetForm } = useDetailPage({
-        pageId,
+    const { form, submitHandler, entity, isPending } = useDetailPage({
         queryDocument: assetDetailDocument,
         updateDocument: assetUpdateDocument,
         setValuesForUpdate: entity => {
@@ -91,14 +79,17 @@ function AssetDetailPage() {
         return null;
     }
     return (
-        <Page pageId={pageId} form={form} submitHandler={submitHandler} entity={entity}>
+        <Page pageId="asset-detail" form={form} submitHandler={submitHandler}>
             <PageTitle>
                 <Trans>Edit asset</Trans>
             </PageTitle>
             <PageActionBar>
                 <PageActionBarRight>
                     <PermissionGuard requires={['UpdateChannel']}>
-                        <Button type="submit" disabled={!form.formState.isDirty || isPending}>
+                        <Button
+                            type="submit"
+                            disabled={!form.formState.isDirty || isPending}
+                        >
                             <Trans>Update</Trans>
                         </Button>
                     </PermissionGuard>
@@ -112,7 +103,7 @@ function AssetDetailPage() {
                             height={height}
                             settingFocalPoint={settingFocalPoint}
                             focalPoint={form.getValues().focalPoint ?? { x: 0.5, y: 0.5 }}
-                            onFocalPointChange={point => {
+                            onFocalPointChange={(point) => {
                                 form.setValue('focalPoint.x', point.x, { shouldDirty: true });
                                 form.setValue('focalPoint.y', point.y, { shouldDirty: true });
                                 setSettingFocalPoint(false);
@@ -133,7 +124,11 @@ function AssetDetailPage() {
                         </AssetFocalPointEditor>
                     </div>
                 </PageBlock>
-                <CustomFieldsPageBlock column="main" entityType={'Asset'} control={form.control} />
+                <CustomFieldsPageBlock
+                    column="main"
+                    entityType={'Asset'}
+                    control={form.control}
+                />
                 <PageBlock column="side" blockId="asset-properties">
                     <AssetProperties asset={entity} />
                 </PageBlock>
@@ -141,24 +136,15 @@ function AssetDetailPage() {
                     <div className="flex flex-col gap-2">
                         <AssetPreviewSelector size={size} setSize={setSize} width={width} height={height} />
                         <div className="flex items-center gap-2">
-                            <Button
-                                type="button"
-                                variant="outline"
-                                size="icon"
-                                onClick={() => setSettingFocalPoint(true)}
-                            >
+                            <Button type='button' variant="outline" size="icon" onClick={() => setSettingFocalPoint(true)}>
                                 <FocusIcon className="h-4 w-4" />
                             </Button>
                             <div className="text-sm text-muted-foreground">
-                                <Label>
-                                    <Trans>Focal Point</Trans>
-                                </Label>
+                                <Label><Trans>Focal Point</Trans></Label>
                                 <div className="text-sm text-muted-foreground">
-                                    {form.getValues().focalPoint?.x && form.getValues().focalPoint?.y ? (
-                                        `${form.getValues().focalPoint?.x.toFixed(2)}, ${form.getValues().focalPoint?.y.toFixed(2)}`
-                                    ) : (
-                                        <Trans>Not set</Trans>
-                                    )}
+                                    {form.getValues().focalPoint?.x && form.getValues().focalPoint?.y
+                                        ? `${form.getValues().focalPoint?.x.toFixed(2)}, ${form.getValues().focalPoint?.y.toFixed(2)}`
+                                        : <Trans>Not set</Trans>}
                                 </div>
                             </div>
                         </div>
@@ -166,5 +152,5 @@ function AssetDetailPage() {
                 </PageBlock>
             </PageLayout>
         </Page>
-    );
+    )
 }

package/src/app/routes/_authenticated/_channels/channels.graphql.ts

@@ -1,4 +1,4 @@
-import { graphql } from '@/vdb/graphql/graphql.js';
+import { graphql } from '@/graphql/graphql.js';
 
 export const channelItemFragment = graphql(`
     fragment ChannelItem on Channel {
@@ -91,12 +91,3 @@ export const deleteChannelDocument = graphql(`
         }
     }
 `);
-
-export const deleteChannelsDocument = graphql(`
-    mutation DeleteChannels($ids: [ID!]!) {
-        deleteChannels(ids: $ids) {
-            result
-            message
-        }
-    }
-`);

package/src/app/routes/_authenticated/_channels/channels.tsx

@@ -1,15 +1,14 @@
-import { ChannelCodeLabel } from '@/vdb/components/shared/channel-code-label.js';
-import { DetailPageButton } from '@/vdb/components/shared/detail-page-button.js';
-import { PermissionGuard } from '@/vdb/components/shared/permission-guard.js';
-import { Button } from '@/vdb/components/ui/button.js';
-import { PageActionBarRight } from '@/vdb/framework/layout-engine/page-layout.js';
-import { ListPage } from '@/vdb/framework/page/list-page.js';
-import { useLocalFormat } from '@/vdb/hooks/use-local-format.js';
-import { Trans } from '@/vdb/lib/trans.js';
+import { ChannelCodeLabel } from '@/components/shared/channel-code-label.js';
+import { DetailPageButton } from '@/components/shared/detail-page-button.js';
+import { PermissionGuard } from '@/components/shared/permission-guard.js';
+import { Button } from '@/components/ui/button.js';
+import { PageActionBarRight } from '@/framework/layout-engine/page-layout.js';
+import { ListPage } from '@/framework/page/list-page.js';
+import { Trans } from '@/lib/trans.js';
 import { createFileRoute, Link } from '@tanstack/react-router';
 import { PlusIcon } from 'lucide-react';
 import { channelListQuery, deleteChannelDocument } from './channels.graphql.js';
-import { DeleteChannelsBulkAction } from './components/channel-bulk-actions.js';
+import { useLocalFormat } from '@/hooks/use-local-format.js';
 
 export const Route = createFileRoute('/_authenticated/_channels/channels')({
     component: ChannelListPage,
@@ -54,21 +53,15 @@ function ChannelListPage() {
                     header: 'Seller',
                     cell: ({ row }) => {
                         return row.original.seller?.name;
-                    },
+                    }
                 },
                 defaultLanguageCode: {
                     header: 'Default Language',
                     cell: ({ row }) => {
                         return formatLanguageName(row.original.defaultLanguageCode);
-                    },
+                    }
                 },
             }}
-            bulkActions={[
-                {
-                    component: DeleteChannelsBulkAction,
-                    order: 500,
-                },
-            ]}
         >
             <PageActionBarRight>
                 <PermissionGuard requires={['CreateChannel']}>

package/src/app/routes/_authenticated/_channels/channels_.$id.tsx

@@ -1,15 +1,15 @@
-import { ChannelCodeLabel } from '@/vdb/components/shared/channel-code-label.js';
-import { CurrencySelector } from '@/vdb/components/shared/currency-selector.js';
-import { ErrorPage } from '@/vdb/components/shared/error-page.js';
-import { FormFieldWrapper } from '@/vdb/components/shared/form-field-wrapper.js';
-import { LanguageSelector } from '@/vdb/components/shared/language-selector.js';
-import { PermissionGuard } from '@/vdb/components/shared/permission-guard.js';
-import { SellerSelector } from '@/vdb/components/shared/seller-selector.js';
-import { ZoneSelector } from '@/vdb/components/shared/zone-selector.js';
-import { Button } from '@/vdb/components/ui/button.js';
-import { Input } from '@/vdb/components/ui/input.js';
-import { Switch } from '@/vdb/components/ui/switch.js';
-import { DEFAULT_CHANNEL_CODE, NEW_ENTITY_PATH } from '@/vdb/constants.js';
+import { ChannelCodeLabel } from '@/components/shared/channel-code-label.js';
+import { CurrencySelector } from '@/components/shared/currency-selector.js';
+import { ErrorPage } from '@/components/shared/error-page.js';
+import { FormFieldWrapper } from '@/components/shared/form-field-wrapper.js';
+import { LanguageSelector } from '@/components/shared/language-selector.js';
+import { PermissionGuard } from '@/components/shared/permission-guard.js';
+import { SellerSelector } from '@/components/shared/seller-selector.js';
+import { ZoneSelector } from '@/components/shared/zone-selector.js';
+import { Button } from '@/components/ui/button.js';
+import { Input } from '@/components/ui/input.js';
+import { Switch } from '@/components/ui/switch.js';
+import { DEFAULT_CHANNEL_CODE, NEW_ENTITY_PATH } from '@/constants.js';
 import {
     CustomFieldsPageBlock,
     DetailFormGrid,
@@ -19,20 +19,17 @@ import {
     PageBlock,
     PageLayout,
     PageTitle,
-} from '@/vdb/framework/layout-engine/page-layout.js';
-import { detailPageRouteLoader } from '@/vdb/framework/page/detail-page-route-loader.js';
-import { useDetailPage } from '@/vdb/framework/page/use-detail-page.js';
-import { Trans, useLingui } from '@/vdb/lib/trans.js';
+} from '@/framework/layout-engine/page-layout.js';
+import { detailPageRouteLoader } from '@/framework/page/detail-page-route-loader.js';
+import { useDetailPage } from '@/framework/page/use-detail-page.js';
+import { Trans, useLingui } from '@/lib/trans.js';
 import { createFileRoute, useNavigate } from '@tanstack/react-router';
 import { toast } from 'sonner';
 import { channelDetailDocument, createChannelDocument, updateChannelDocument } from './channels.graphql.js';
 
-const pageId = 'channel-detail';
-
 export const Route = createFileRoute('/_authenticated/_channels/channels_/$id')({
     component: ChannelDetailPage,
     loader: detailPageRouteLoader({
-        pageId,
         queryDocument: channelDetailDocument,
         breadcrumb(isNew, entity) {
             return [
@@ -51,7 +48,6 @@ function ChannelDetailPage() {
     const { i18n } = useLingui();
 
     const { form, submitHandler, entity, isPending, resetForm } = useDetailPage({
-        pageId,
         queryDocument: channelDetailDocument,
         createDocument: createChannelDocument,
         updateDocument: updateChannelDocument,
@@ -104,7 +100,7 @@ function ChannelDetailPage() {
     const codeIsDefault = entity?.code === DEFAULT_CHANNEL_CODE;
 
     return (
-        <Page pageId={pageId} form={form} submitHandler={submitHandler} entity={entity}>
+        <Page pageId="channel-detail" form={form} submitHandler={submitHandler}>
             <PageTitle>
                 {creatingNewEntity ? (
                     <Trans>New channel</Trans>

package/src/app/routes/_authenticated/_collections/collections.graphql.ts

@@ -1,10 +1,10 @@
-import { api } from '@/vdb/graphql/api.js';
+import { api } from '@/graphql/api.js';
 import {
     assetFragment,
     configurableOperationDefFragment,
     configurableOperationFragment,
-} from '@/vdb/graphql/fragments.js';
-import { graphql, ResultOf } from '@/vdb/graphql/graphql.js';
+} from '@/graphql/fragments.js';
+import { graphql, ResultOf } from '@/graphql/graphql.js';
 import { DefinedInitialDataOptions, queryOptions } from '@tanstack/react-query';
 
 export const collectionListDocument = graphql(
@@ -131,60 +131,3 @@ export const getCollectionFiltersQueryOptions = queryOptions({
     queryKey: ['getCollectionFilters'],
     queryFn: () => api.query(getCollectionFiltersDocument),
 }) as DefinedInitialDataOptions<ResultOf<typeof getCollectionFiltersDocument>>;
-
-export const assignCollectionToChannelDocument = graphql(`
-    mutation AssignCollectionsToChannel($input: AssignCollectionsToChannelInput!) {
-        assignCollectionsToChannel(input: $input) {
-            id
-        }
-    }
-`);
-
-export const removeCollectionFromChannelDocument = graphql(`
-    mutation RemoveCollectionsFromChannel($input: RemoveCollectionsFromChannelInput!) {
-        removeCollectionsFromChannel(input: $input) {
-            id
-        }
-    }
-`);
-
-export const deleteCollectionsDocument = graphql(`
-    mutation DeleteCollections($ids: [ID!]!) {
-        deleteCollections(ids: $ids) {
-            result
-            message
-        }
-    }
-`);
-
-export const moveCollectionDocument = graphql(`
-    mutation MoveCollection($input: MoveCollectionInput!) {
-        moveCollection(input: $input) {
-            id
-        }
-    }
-`);
-
-export const collectionListForMoveDocument = graphql(`
-    query CollectionListForMove($options: CollectionListOptions) {
-        collections(options: $options) {
-            items {
-                id
-                name
-                slug
-                breadcrumbs {
-                    id
-                    name
-                    slug
-                }
-                children {
-                    id
-                }
-                position
-                isPrivate
-                parentId
-            }
-            totalItems
-        }
-    }
-`);