@haus-tech/product-import-export-plugin 3.0.27-4 → 3.0.28-0

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 3.0.27-4
+
+This was a version bump only for product-import-export-plugin to align it with other projects, there were no code changes.
+
 ## 3.0.27-3
 
 This was a version bump only for product-import-export-plugin to align it with other projects, there were no code changes.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haus-tech/product-import-export-plugin",
-  "version": "3.0.27-4",
+  "version": "3.0.28-0",
   "description": "A Vendure plugin for importing and exporting products using a CSV file",
   "author": "Haus Tech",
   "repository": {

package/src/dashboard/export.tsx

@@ -0,0 +1,337 @@
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Input,
+  Label,
+  RadioGroup,
+  RadioGroupItem,
+  DataTableBulkActionItem,
+} from '@vendure/dashboard'
+import { DownloadIcon } from 'lucide-react'
+import { useState, useEffect } from 'react'
+import { toast } from 'sonner'
+import {
+  getServerLocation,
+  getChannelHeader,
+  type PluginInitOptions,
+  type ExportFields,
+  type ProductFields,
+  type VariantFields,
+} from './utils'
+
+// Export Dialog Component
+function ExportDialog({
+  open,
+  onOpenChange,
+  productIds,
+}: {
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  productIds: string[]
+}) {
+  const [fileName, setFileName] = useState('')
+  const [customFields, setCustomFields] = useState<string[]>([])
+  const [selectedFields, setSelectedFields] = useState<string[]>([])
+  const [exportAssetsAs, setExportAssetsAs] = useState<'url' | 'json'>('url')
+  const [selectedExportFields, setSelectedExportFields] = useState<ExportFields>([])
+  const [availableExportFields] = useState<ExportFields>([
+    'productId',
+    'name',
+    'slug',
+    'description',
+    'assets',
+    'facets',
+    'optionGroups',
+    'sku',
+    'optionValues',
+    'price',
+    'taxCategory',
+    'stockOnHand',
+    'trackInventory',
+    'variantAssets',
+    'variantFacets',
+    'enabled',
+  ])
+  const [config, setConfig] = useState<PluginInitOptions['exportOptions'] | null>(null)
+  const [toggleAllChecked, setToggleAllChecked] = useState(false)
+
+  useEffect(() => {
+    const fetchConfig = async () => {
+      try {
+        const serverPath = getServerLocation()
+        const [configRes, customFieldsRes] = await Promise.all([
+          fetch(`${serverPath}/product-import-export/config`, {
+            method: 'GET',
+            headers: {
+              'Content-Type': 'application/json',
+              ...getChannelHeader(),
+            },
+            credentials: 'include',
+          }),
+          fetch(`${serverPath}/product-export/custom-fields`, {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+              ...getChannelHeader(),
+            },
+            credentials: 'include',
+            body: JSON.stringify(productIds),
+          }),
+        ])
+
+        const configData = await configRes.json()
+        const customFieldsData = await customFieldsRes.json()
+        setConfig(configData.exportOptions)
+        setCustomFields(customFieldsData.map((field: { name: string }) => field.name))
+        setSelectedFields([...customFieldsData.map((field: { name: string }) => field.name)])
+        setExportAssetsAs(
+          configData.exportOptions?.defaultExportAssetsAs ||
+            configData.exportOptions?.exportAssetsAsOptions?.[0] ||
+            'url',
+        )
+        if (
+          configData.exportOptions?.defaultExportFields ||
+          configData.exportOptions?.requiredExportFields
+        ) {
+          setSelectedExportFields([
+            ...(configData.exportOptions.defaultExportFields || []),
+            ...(configData.exportOptions.requiredExportFields || []),
+          ])
+        }
+      } catch (error) {
+        console.error('Failed to fetch config:', error)
+      }
+    }
+
+    if (open && productIds.length > 0) {
+      fetchConfig()
+    }
+  }, [open, productIds])
+
+  const toggleFieldSelection = (fieldName: string) => {
+    setSelectedFields((prev) =>
+      prev.includes(fieldName) ? prev.filter((f) => f !== fieldName) : [...prev, fieldName],
+    )
+  }
+
+  const toggleExportFieldSelection = (fieldName: ProductFields | VariantFields) => {
+    setSelectedExportFields((prev) =>
+      prev.includes(fieldName) ? prev.filter((f) => f !== fieldName) : [...prev, fieldName],
+    )
+  }
+
+  const toggleSelectAll = (checked: boolean) => {
+    setToggleAllChecked(checked)
+    if (checked) {
+      setSelectedExportFields([...availableExportFields])
+      setSelectedFields([...customFields])
+    } else {
+      setSelectedExportFields([...(config?.requiredExportFields || [])])
+      setSelectedFields([])
+    }
+  }
+
+  const handleExport = async () => {
+    const trimmedFileName = fileName.trim()
+    const finalFileName = trimmedFileName || config?.defaultFileName || 'products_export.csv'
+
+    toast.info(`Exporting ${productIds.length} products to ${finalFileName}`)
+
+    try {
+      const serverPath = getServerLocation()
+      const res = await fetch(
+        `${serverPath}/product-export/export?fileName=${encodeURIComponent(finalFileName)}&customFields=${encodeURIComponent(selectedFields.join(','))}&exportAssetsAs=${exportAssetsAs}&selectedExportFields=${encodeURIComponent(selectedExportFields.join(','))}`,
+        {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            ...getChannelHeader(),
+          },
+          credentials: 'include',
+          body: JSON.stringify(productIds),
+        },
+      )
+
+      if (!res.ok) {
+        const json = await res.json()
+        throw new Error(json?.message || 'Export failed')
+      }
+
+      console.log('res', res)
+      const header = res.headers.get('Content-Disposition')
+
+      const parts = header!.split(';')
+      const filename = parts[1].split('=')[1]
+      const blob = await res.blob()
+
+      const blobUrl = window.URL.createObjectURL(blob)
+      const a = document.createElement('a')
+      document.body.appendChild(a)
+      a.setAttribute('hidden', 'true')
+      a.href = blobUrl
+      a.download = filename
+      a.setAttribute('target', '_blank')
+      a.click()
+
+      onOpenChange(false)
+      toast.success('Products exported successfully')
+    } catch (error: any) {
+      console.error(error)
+      toast.error(error.message || 'Failed to export products')
+    }
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-2xl max-h-[80vh] overflow-y-auto">
+        <DialogHeader>
+          <DialogTitle>Export products to CSV</DialogTitle>
+          <DialogDescription>Configure export options</DialogDescription>
+        </DialogHeader>
+
+        <div className="space-y-4">
+          <div>
+            <Label htmlFor="file-name">File name (optional)</Label>
+            <Input
+              id="file-name"
+              value={fileName}
+              onChange={(e) => setFileName(e.target.value)}
+              placeholder={config?.defaultFileName || 'products_export.csv'}
+              className="mt-1"
+            />
+          </div>
+
+          <div className="flex items-center space-x-2">
+            <input
+              type="checkbox"
+              id="select-all"
+              checked={toggleAllChecked}
+              onChange={(e) => toggleSelectAll(e.target.checked)}
+            />
+            <Label htmlFor="select-all" className="font-normal">
+              Select all
+            </Label>
+          </div>
+
+          <div>
+            <Label>Fields to export</Label>
+            <div className="grid grid-cols-2 gap-2 mt-2">
+              {availableExportFields.map((field) => (
+                <div key={field} className="flex items-center space-x-2">
+                  <input
+                    type="checkbox"
+                    id={`field-${field}`}
+                    checked={selectedExportFields.includes(field)}
+                    onChange={() => toggleExportFieldSelection(field)}
+                    disabled={config?.requiredExportFields?.includes(field)}
+                  />
+                  <Label htmlFor={`field-${field}`} className="font-normal">
+                    {field}
+                  </Label>
+                </div>
+              ))}
+            </div>
+          </div>
+
+          {customFields.length > 0 && (
+            <div>
+              <Label>Custom fields to include in the export</Label>
+              <div className="grid grid-cols-2 gap-2 mt-2">
+                {customFields.map((field) => (
+                  <div key={field} className="flex items-center space-x-2">
+                    <input
+                      type="checkbox"
+                      id={`custom-${field}`}
+                      checked={selectedFields.includes(field)}
+                      onChange={() => toggleFieldSelection(field)}
+                    />
+                    <Label htmlFor={`custom-${field}`} className="font-normal">
+                      {field}
+                    </Label>
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+
+          <div>
+            <Label>Export assets as:</Label>
+            <RadioGroup
+              value={exportAssetsAs}
+              onValueChange={(val) => setExportAssetsAs(val as 'url' | 'json')}
+            >
+              {config?.exportAssetsAsOptions?.includes('url') && (
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="url" id="assets-url" />
+                  <Label htmlFor="assets-url" className="font-normal">
+                    URL
+                  </Label>
+                </div>
+              )}
+              {config?.exportAssetsAsOptions?.includes('json') && (
+                <div className="flex items-center space-x-2">
+                  <RadioGroupItem value="json" id="assets-json" />
+                  <Label htmlFor="assets-json" className="font-normal">
+                    JSON
+                  </Label>
+                </div>
+              )}
+            </RadioGroup>
+          </div>
+        </div>
+
+        <DialogFooter>
+          <Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
+            Cancel
+          </Button>
+          <Button type="button" onClick={handleExport}>
+            Export
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}
+
+// Export Bulk Action Component for Product List
+export function ExportProductsBulkAction({
+  selection,
+  table,
+}: {
+  selection: Array<{ id: string }>
+  table: any
+}) {
+  const [dialogOpen, setDialogOpen] = useState(false)
+  const productIds = selection.map((product) => product.id)
+
+  const handleClose = () => {
+    setDialogOpen(false)
+    table.resetRowSelection()
+  }
+
+  return (
+    <>
+      <DataTableBulkActionItem
+        onClick={() => setDialogOpen(true)}
+        label="Export products to CSV"
+        icon={DownloadIcon}
+      />
+      <ExportDialog
+        open={dialogOpen}
+        onOpenChange={(open) => {
+          if (open) {
+            setDialogOpen(true)
+          } else {
+            handleClose()
+          }
+        }}
+        productIds={productIds}
+      />
+    </>
+  )
+}

package/src/dashboard/import.tsx

@@ -0,0 +1,634 @@
+import {
+  Button,
+  DashboardRouteDefinition,
+  Page,
+  PageTitle,
+  PageLayout,
+  PageBlock,
+  Switch,
+  Label,
+  RadioGroup,
+  RadioGroupItem,
+} from '@vendure/dashboard'
+import { UploadIcon } from 'lucide-react'
+import { useState, useRef, useEffect } from 'react'
+import { toast } from 'sonner'
+import type { LanguageCode, Channel } from '@vendure/core'
+import { size, startsWith, endsWith, uniq } from 'lodash'
+import {
+  getServerLocation,
+  getChannelHeader,
+  type UpdatingStrategy,
+  type ValidateReturnType,
+  type PluginInitOptions,
+} from './utils'
+
+// Import page component
+function ProductImportPage() {
+  const fileInputRef = useRef<HTMLInputElement>(null)
+  const [selectedFile, setSelectedFile] = useState<File | null>(null)
+  const [validateFile, setValidateFile] = useState<File | null>(null)
+  const [updateProductSlug, setUpdateProductSlug] = useState(true)
+  const [selectedMainLanguage, setSelectedMainLanguage] = useState<LanguageCode | undefined>()
+  const [availableLanguages, setAvailableLanguages] = useState<LanguageCode[]>([])
+  const [updatingStrategy, setUpdatingStrategy] = useState<UpdatingStrategy>('merge')
+  const [config, setConfig] = useState<PluginInitOptions | null>(null)
+  const [currentChannel, setCurrentChannel] = useState<Channel | null>(null)
+
+  useEffect(() => {
+    const fetchConfig = async () => {
+      try {
+        const serverPath = getServerLocation()
+        const [configRes, channelRes] = await Promise.all([
+          fetch(`${serverPath}/product-import-export/config`, {
+            method: 'GET',
+            headers: {
+              'Content-Type': 'application/json',
+              ...getChannelHeader(),
+            },
+            credentials: 'include',
+          }),
+          fetch(`${serverPath}/product-import-export/channel`, {
+            method: 'GET',
+            headers: {
+              'Content-Type': 'application/json',
+              ...getChannelHeader(),
+            },
+            credentials: 'include',
+          }),
+        ])
+
+        const configData = await configRes.json()
+        const channelData = await channelRes.json()
+        setConfig(configData.importOptions)
+        setCurrentChannel(channelData)
+        if (configData.importOptions?.defaultOptions?.updateProductSlug !== undefined) {
+          setUpdateProductSlug(configData.importOptions.defaultOptions.updateProductSlug)
+        }
+      } catch (error) {
+        console.error('Failed to fetch config:', error)
+      }
+    }
+
+    fetchConfig()
+  }, [])
+
+  const splitLines = (text: string): string[] => {
+    return text.split(/,(?=(?:(?:[^"]*"){2})*[^"]*$)/)
+  }
+
+  const checkifJson = (
+    text: string,
+  ): {
+    startsWithJson: boolean
+    endsWithJson: boolean
+    startChar: string
+    endChar: string
+    isJson?: boolean
+  } => {
+    // Replace starting and ending double quotes if exists
+    const trimmedText = text.trim().replace(/^"/, '').replace(/"$/, '')
+
+    return {
+      startsWithJson: startsWith(trimmedText, '{') || startsWith(trimmedText, '['),
+      endsWithJson: endsWith(trimmedText, '}') || endsWith(trimmedText, ']'),
+      startChar: trimmedText.charAt(0),
+      endChar: trimmedText.charAt(trimmedText.length - 1),
+      isJson:
+        startsWith(trimmedText, '{') ||
+        startsWith(trimmedText, '[') ||
+        endsWith(trimmedText, '}') ||
+        endsWith(trimmedText, ']'),
+    }
+  }
+
+  const checkTranslatabeColumns = (
+    lines: string[],
+    columns: string[],
+    header: string[],
+    languageCodes: (string | undefined)[],
+    mainLanguage?: LanguageCode,
+  ): { errorRows: number[]; errorColumns: string[] } => {
+    const errorRows: number[] = []
+    const errorColumns: string[] = []
+
+    if (size(languageCodes) < 2 || !mainLanguage) {
+      return { errorRows, errorColumns }
+    }
+
+    for (let i = 1; i < lines.length; i++) {
+      const row = splitLines(lines[i]).map((col) => col.trim())
+      for (const baseColumn of columns) {
+        const mainLanguageColumn = `${baseColumn}:${mainLanguage}`
+        const colIndex = header.indexOf(mainLanguageColumn)
+        const mainLanguageValue = row[colIndex]
+        const mainLanguageHasValue = mainLanguageValue !== undefined && mainLanguageValue !== ''
+
+        if (mainLanguageHasValue) {
+          continue
+        }
+        for (const lang of languageCodes) {
+          if (lang) {
+            // Check if lang is defined
+            const langSpecificColumn = `${baseColumn}:${lang}`
+            const langColIndex = header.indexOf(langSpecificColumn)
+            const colValue = row[langColIndex]
+            const colHasValue = colValue !== undefined && colValue !== ''
+
+            if (!mainLanguageHasValue && colHasValue) {
+              errorRows.push(i + 1)
+              errorColumns.push(langSpecificColumn)
+            }
+          }
+        }
+      }
+    }
+
+    return { errorRows, errorColumns }
+  }
+
+  const validateCsvStructure = async (file: File): Promise<ValidateReturnType> => {
+    const baseColumns = ['sku']
+    const optionalColumns = [
+      'assets',
+      'price',
+      'taxCategory',
+      'stockOnHand',
+      'trackInventory',
+      'variantAssets',
+    ]
+    const translatableBaseColumns = ['name']
+    const translatableColumns = [
+      'slug',
+      'description',
+      'facets',
+      'optionGroups',
+      'optionValues',
+      'variantFacets',
+    ]
+
+    return new Promise<ValidateReturnType>((resolve) => {
+      const reader = new FileReader()
+      reader.onload = async (e) => {
+        const text = e.target?.result as string
+        const lines = text.split('\n').filter((line) => line.trim() !== '')
+
+        if (lines.length === 0) {
+          toast.error('The file is empty.')
+          resolve({ isValid: false })
+          return
+        }
+
+        const headerLength = splitLines(lines[0]).length
+        const inconsistentLines = lines.filter((line) => splitLines(line).length !== headerLength)
+
+        if (inconsistentLines.length > 0) {
+          toast.error(
+            'The columns in the file are inconsistent. Please ensure all rows have the same number of columns.',
+          )
+          resolve({ isValid: false })
+          return
+        }
+
+        const header = splitLines(lines[0]).map((col) => col.trim())
+
+        // Fetch channel if not already loaded (matches Angular implementation)
+        let channel = currentChannel
+        if (!channel) {
+          try {
+            const serverPath = getServerLocation()
+            const channelRes = await fetch(`${serverPath}/product-import-export/channel`, {
+              method: 'GET',
+              headers: {
+                'Content-Type': 'application/json',
+                ...getChannelHeader(),
+              },
+              credentials: 'include',
+            })
+            channel = await channelRes.json()
+            // Update state for next time
+            setCurrentChannel(channel)
+          } catch (error) {
+            console.error('Failed to fetch channel:', error)
+            toast.error('Failed to fetch channel information.')
+            resolve({ isValid: false })
+            return
+          }
+        }
+
+        const availableLanguages = channel?.availableLanguageCodes || []
+
+        const languageCodes = header
+          .map((col) => col.match(/:(\w{2})$/)?.[1])
+          .filter((code, index, self) => code && self.indexOf(code) === index)
+
+        let validationLanguage = languageCodes.length === 0 ? undefined : selectedMainLanguage
+
+        if (!selectedMainLanguage && languageCodes.length < 2) {
+          validationLanguage = (languageCodes as LanguageCode[])?.[0]
+        }
+
+        if (!selectedMainLanguage && languageCodes.length > 1) {
+          resolve({ isValid: true, langCodes: languageCodes, clearFile: false })
+          return
+        }
+
+        if (!selectedMainLanguage && languageCodes.length === 0) {
+          // No language codes in CSV, return channel languages so user can select
+          resolve({
+            isValid: true,
+            langCodes: availableLanguages.map((lang) => lang) as (string | undefined)[],
+            clearFile: false,
+          })
+          return
+        }
+
+        const missingLanguages = (languageCodes as LanguageCode[]).filter(
+          (code) => !availableLanguages.includes(code),
+        )
+        if (missingLanguages.length > 0) {
+          toast.error(
+            `Your CSV file contains languages that are not available in this channel. Please add the languages to the channel or remove the languages that are not used and try again. Missing: ${missingLanguages.join(', ')}`,
+          )
+          resolve({ isValid: false })
+          return
+        }
+
+        const missingBaseColumns = baseColumns.filter((col) => !header.includes(col))
+        const missingTranslatableBaseColumns = translatableBaseColumns.filter(
+          (col) => !header.includes(validationLanguage ? `${col}:${validationLanguage}` : col),
+        )
+
+        const combinedMissingBaseColumns = [
+          ...missingBaseColumns,
+          ...missingTranslatableBaseColumns,
+        ]
+        if (combinedMissingBaseColumns.length > 0) {
+          toast.error(`Some columns are missing: ${combinedMissingBaseColumns.join(', ')}`)
+          resolve({ isValid: false })
+          return
+        }
+
+        const nameColumn = validationLanguage ? `name:${validationLanguage}` : 'name'
+
+        // Get optionGroups and optionValues columns for the main language
+        const optionGroupsColumn = validationLanguage
+          ? `optionGroups:${validationLanguage}`
+          : 'optionGroups'
+        const optionValuesColumn = validationLanguage
+          ? `optionValues:${validationLanguage}`
+          : 'optionValues'
+
+        const optionGroupsIndex = header.indexOf(optionGroupsColumn)
+        const optionValuesIndex = header.indexOf(optionValuesColumn)
+
+        // Loop through each row to validate the option values
+        let currentOptionGroupCount = 0
+
+        for (let i = 1; i < lines.length; i++) {
+          const row = splitLines(lines[i]).map((col) => col.trim())
+
+          // Check if it's a product row (it has a 'name' field)
+          const isProductRow = row[header.indexOf(nameColumn)]
+
+          if (isProductRow) {
+            // It's a new product row, get the option groups
+            const optionGroups = (row[optionGroupsIndex]?.split('|') ?? []).filter(
+              (group) => group !== '',
+            )
+            const optionValues = (row[optionValuesIndex]?.split('|') ?? []).filter(
+              (value) => value !== '',
+            )
+            currentOptionGroupCount = optionGroups.length
+
+            // Validate that the number of option values matches the number of option groups
+            if (optionValues.length !== currentOptionGroupCount) {
+              toast.error(
+                `Some product variants are missing product options. Please fill in all options: Row: ${i + 1}. Expected ${currentOptionGroupCount} option values but got ${optionValues.length}.`,
+              )
+              resolve({ isValid: false })
+              return
+            }
+          } else {
+            // It's a variant row, validate the option values
+            const optionValues = (row[optionValuesIndex]?.split('|') ?? []).filter(
+              (value) => value !== '',
+            )
+
+            // Validate that the number of option values matches the product's option groups
+            if (optionValues.length !== currentOptionGroupCount) {
+              toast.error(
+                `Some product variants are missing product options. Please fill in all options: Row: ${i + 1}. Expected ${currentOptionGroupCount} option values but got ${optionValues.length}.`,
+              )
+              resolve({ isValid: false })
+              return
+            }
+          }
+        }
+
+        // Check if a row contains JSON, if so check if it is valid. This should be done for all columns, not just translatable ones.
+        for (let i = 1; i < lines.length; i++) {
+          const row = splitLines(lines[i]).map((col) => col.trim())
+          for (const col of header) {
+            const colIndex = header.indexOf(col)
+            if (colIndex !== -1 && row[colIndex]) {
+              try {
+                const { isJson } = checkifJson(row[colIndex])
+                if (isJson) {
+                  JSON.parse(
+                    row[colIndex]
+                      .trim()
+                      .replace(/^"/, '')
+                      .replace(/"$/, '')
+                      .replace(/'/g, '"')
+                      .replace(/\s+/g, ' ')
+                      .replace(/,\s*'/g, ", '"),
+                  )
+                }
+              } catch (error) {
+                toast.error(
+                  `Invalid JSON structure. Please upload a correct JSON file. Column: ${col}, Row: ${i + 1}`,
+                )
+                resolve({ isValid: false })
+                return
+              }
+            }
+          }
+        }
+
+        // Check for missing translation values in translatable base columns
+        const { errorRows: missingBaseTranslatableValuesRows } = checkTranslatabeColumns(
+          lines,
+          translatableBaseColumns,
+          header,
+          languageCodes,
+          selectedMainLanguage,
+        )
+
+        if (missingBaseTranslatableValuesRows.length > 0) {
+          toast.error(
+            `Main language is missing for name. Please add the main language and try again. Rows: ${uniq(missingBaseTranslatableValuesRows).join(', ')}`,
+          )
+          resolve({ isValid: false })
+          return
+        }
+
+        // Check if all translatable columns have values for the main language
+        const { errorRows, errorColumns } = checkTranslatabeColumns(
+          lines,
+          translatableColumns,
+          header,
+          languageCodes,
+          selectedMainLanguage,
+        )
+
+        if (errorRows.length > 0) {
+          toast.warning(
+            `Some fields are missing translations for the main language that exist in other languages. These will not be imported. Rows: ${uniq(errorRows).join(', ')} Columns: ${uniq(errorColumns).join(', ')}`,
+          )
+        }
+
+        resolve({ isValid: true, langCodes: languageCodes })
+      }
+
+      reader.onerror = (error) => {
+        console.error('FileReader error:', error)
+        toast.error('An error occurred while reading the file.')
+        resolve({ isValid: false })
+      }
+
+      reader.readAsText(file)
+    })
+  }
+
+  const doValidation = async (file: File) => {
+    const { isValid, langCodes, clearFile = true } = await validateCsvStructure(file)
+    if (isValid) {
+      setSelectedFile(file)
+    } else if (clearFile) {
+      clearFileHandler()
+      return
+    } else {
+      // File is valid but needs language selection
+      setSelectedFile(file)
+    }
+
+    // Set available languages - either from CSV or from channel
+    if (langCodes && langCodes.length > 0) {
+      const filteredLangCodes = langCodes.filter((code) => code) as LanguageCode[]
+      setAvailableLanguages(filteredLangCodes)
+      if (!selectedMainLanguage) {
+        setSelectedMainLanguage(filteredLangCodes.length === 1 ? filteredLangCodes[0] : undefined)
+      }
+    } else if (
+      currentChannel?.availableLanguageCodes &&
+      currentChannel.availableLanguageCodes.length > 0
+    ) {
+      // No languages in CSV headers, use channel languages as fallback
+      setAvailableLanguages(currentChannel.availableLanguageCodes)
+      if (!selectedMainLanguage) {
+        setSelectedMainLanguage(
+          currentChannel.availableLanguageCodes.length === 1
+            ? currentChannel.availableLanguageCodes[0]
+            : undefined,
+        )
+      }
+    }
+  }
+
+  const onFileSelected = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const input = event.target
+    if (input.files && input.files.length > 0) {
+      const file = input.files[0]
+      if (file.type !== 'text/csv') {
+        toast.error('Invalid file type. Please upload a CSV file.')
+        clearFileHandler()
+        return
+      }
+
+      setValidateFile(file)
+      doValidation(file)
+    }
+  }
+
+  const clearFileHandler = () => {
+    if (fileInputRef.current) {
+      fileInputRef.current.value = ''
+    }
+    setSelectedFile(null)
+    setValidateFile(null)
+    setSelectedMainLanguage(undefined)
+    setUpdatingStrategy('merge')
+  }
+
+  const onMainLanguageChange = (lang: LanguageCode) => {
+    setSelectedMainLanguage(lang)
+    if (validateFile) {
+      doValidation(validateFile)
+    }
+  }
+
+  const uploadFile = async () => {
+    if (selectedFile && selectedMainLanguage && updatingStrategy) {
+      const formData = new FormData()
+      formData.append('file', selectedFile)
+      formData.append('updateProductSlug', updateProductSlug.toString())
+      formData.append('mainLanguage', selectedMainLanguage)
+      formData.append('updatingStrategy', updatingStrategy)
+
+      try {
+        const serverPath = getServerLocation()
+        const res = await fetch(`${serverPath}/product-import/upload`, {
+          method: 'POST',
+          body: formData,
+          headers: {
+            ...getChannelHeader(),
+          },
+          credentials: 'include',
+        })
+
+        if (res.ok) {
+          clearFileHandler()
+          toast.success('The file was uploaded and has been added to the import queue.')
+        } else {
+          toast.error('An error occurred while uploading the file.')
+        }
+      } catch (error) {
+        toast.error('An error occurred while uploading the file.')
+      }
+    } else {
+      toast.error('No file selected or main language not selected.')
+    }
+  }
+
+  return (
+    <Page pageId="product-import">
+      <PageTitle>Import Products</PageTitle>
+      <PageLayout>
+        <PageBlock column="main" blockId="main-form" title="Import products from CSV">
+          <div className="space-y-6">
+            <div>
+              <Label htmlFor="file-upload">Choose a CSV file to import products from</Label>
+              <div className="flex items-center gap-2 mt-2">
+                <input
+                  ref={fileInputRef}
+                  type="file"
+                  id="file-upload"
+                  accept=".csv"
+                  onChange={onFileSelected}
+                  className="hidden"
+                />
+                {selectedFile ? (
+                  <>
+                    <Button
+                      type="button"
+                      variant="outline"
+                      onClick={() => fileInputRef.current?.click()}
+                    >
+                      <UploadIcon className="mr-2 h-4 w-4" />
+                      {selectedFile.name}
+                    </Button>
+                    <Button type="button" onClick={uploadFile} disabled={!selectedMainLanguage}>
+                      Upload file
+                    </Button>
+                  </>
+                ) : (
+                  <Button
+                    type="button"
+                    variant="default"
+                    onClick={() => fileInputRef.current?.click()}
+                  >
+                    <UploadIcon className="mr-2 h-4 w-4" />
+                    Select file
+                  </Button>
+                )}
+              </div>
+            </div>
+
+            {selectedFile && (
+              <div className="space-y-4 pt-4 border-t">
+                {config?.visibleOptions?.includes('updateProductSlug') && (
+                  <div className="flex items-center space-x-2">
+                    <Switch
+                      id="update-slug"
+                      checked={updateProductSlug}
+                      onCheckedChange={setUpdateProductSlug}
+                    />
+                    <Label htmlFor="update-slug">Update product slugs based on name</Label>
+                  </div>
+                )}
+
+                <div>
+                  <Label>Select main language:</Label>
+                  <div className="flex flex-col gap-2 mt-2">
+                    {availableLanguages.map((lang) => (
+                      <div key={lang} className="flex items-center space-x-2">
+                        <input
+                          type="radio"
+                          id={`lang-${lang}`}
+                          name="selectedMainLanguage"
+                          value={lang}
+                          checked={selectedMainLanguage === lang}
+                          onChange={() => onMainLanguageChange(lang)}
+                        />
+                        <Label htmlFor={`lang-${lang}`} className="font-normal">
+                          {lang}
+                        </Label>
+                      </div>
+                    ))}
+                  </div>
+                  <p className="text-sm text-muted-foreground mt-2 italic">
+                    The main language is used as a fallback when translations are missing. It is
+                    recommended to select the language that is used the most in your system.
+                  </p>
+                </div>
+
+                <div>
+                  <Label>Updating strategy for facets and assets:</Label>
+                  <RadioGroup
+                    value={updatingStrategy}
+                    onValueChange={(val) => setUpdatingStrategy(val as UpdatingStrategy)}
+                  >
+                    <div className="flex items-center space-x-2">
+                      <RadioGroupItem value="merge" id="merge" />
+                      <Label htmlFor="merge" className="font-normal">
+                        Merge
+                      </Label>
+                    </div>
+                    <div className="flex items-center space-x-2">
+                      <RadioGroupItem value="replace" id="replace" />
+                      <Label htmlFor="replace" className="font-normal">
+                        Overwrite
+                      </Label>
+                    </div>
+                  </RadioGroup>
+                  {updatingStrategy === 'replace' && (
+                    <p className="text-sm text-red-600 mt-2">
+                      Warning: This will remove existing facets and assets from products and
+                      variants.
+                    </p>
+                  )}
+                </div>
+              </div>
+            )}
+          </div>
+        </PageBlock>
+      </PageLayout>
+    </Page>
+  )
+}
+
+// Import route definition
+export const productImportRoute: DashboardRouteDefinition = {
+  navMenuItem: {
+    sectionId: 'catalog',
+    id: 'product-importer',
+    url: '/product-importer',
+    title: 'Import Products',
+  },
+  path: '/product-importer',
+  loader: () => ({
+    breadcrumb: 'Import Products',
+  }),
+  component: () => <ProductImportPage />,
+}

package/src/dashboard/index.tsx

@@ -0,0 +1,17 @@
+import { defineDashboardExtension } from '@vendure/dashboard'
+import { productImportRoute } from './import'
+import { ExportProductsBulkAction } from './export'
+
+defineDashboardExtension({
+  routes: [productImportRoute],
+  dataTables: [
+    {
+      pageId: 'product-list',
+      bulkActions: [
+        {
+          component: ExportProductsBulkAction,
+        },
+      ],
+    },
+  ],
+})

package/src/dashboard/locales/en.json

@@ -0,0 +1,41 @@
+{
+  "product-import.import-products": "Import products",
+  "product-import.card.title": "Import products from CSV",
+  "product-import.card.description": "Choose a CSV file to import products from",
+  "product-import.card.button-select": "Select file",
+  "product-import.card.button-upload": "Upload file",
+  "product-import.card.update-product-slugs": "Update product slugs based on name",
+  "product-import.card.select-main-language": "Select main language:",
+  "product-import.card.updating-strategy": "Updating strategy for facets and assets:",
+  "product-import.card.overwrite": "Overwrite",
+  "product-import.card.overwrite-warning": "Warning: This will remove existing facets and assets from products and variants.",
+  "product-import.card.merge": "Merge",
+  "product-import.card.main-language-info": "The main language is used as a fallback when translations are missing. It is recommended to select the language that is used the most in your system. The main language will be used to create products, the other languages will be used to fill in translations.",
+  "product-import.notifications.invalid-file-type": "Invalid file type. Please upload a CSV file.",
+  "product-import.notifications.invalid-file-structure": "Invalid file structure. Please upload a correct CSV file.",
+  "product-import.notifications.upload-success": "The file was uploaded and has been added to the import queue.",
+  "product-import.notifications.upload-error": "An error occurred while uploading the file.",
+  "product-import.notifications.no-file-selected": "No file selected.",
+  "product-import.notifications.mismatched-values": "Some fields are missing language specifications. Please fill in all languages:",
+  "product-import.notifications.missing-base-columns": "Some columns are missing:",
+  "product-import.notifications.missing-column": "Column is missing:",
+  "product-import.notifications.no-lines-in-file": "The file is empty.",
+  "product-import.notifications.file-read-error": "An error occurred while reading the file.",
+  "product-import.notifications.invalid-json": "Invalid JSON structure. Please upload a correct JSON file.",
+  "product-import.notifications.missing-languages": "Your CSV file contains languages that are not available in the system. Please add the languages to the system or remove the languages that are not used and try again.",
+  "product-import.notifications.mismatched-option-values": "Some product variants are missing product options. Please fill in all options:",
+  "product-import.notifications.missing-main-language-name": "Main language is missing for name. Please add the main language and try again.",
+  "product-import.notifications.missing-translation-values": "Some fields are missing translations for the main language that exist in other languages. These will not be imported:",
+  "product-import.notifications.inconsistent-columns": "The columns in the file are inconsistent. Please ensure all rows have the same number of columns.",
+  "product-export.action": "Export products to CSV",
+  "product-export.dialog.title": "Export products to CSV",
+  "product-export.dialog.label": "File name (optional)",
+  "product-export.dialog.export": "Export",
+  "product-export.dialog.cancel": "Cancel",
+  "product-export.dialog.customFieldsLabel": "Custom fields to include in the export",
+  "product-export.dialog.exportAssetsAs": "Export assets as:",
+  "product-export.dialog.exportAssetsAsOptions.url": "URL",
+  "product-export.dialog.exportAssetsAsOptions.json": "JSON",
+  "product-export.dialog.availableExportFieldsLabel": "Fields to export",
+  "product-export.dialog.selectAll": "Select all"
+}

package/src/dashboard/locales/sv.json

@@ -0,0 +1,41 @@
+{
+  "product-import.import-products": "Importera produkter",
+  "product-import.card.title": "Importera produkter från CSV",
+  "product-import.card.description": "Välj en CSV-fil att importera produkter från",
+  "product-import.card.button-select": "Välj fil",
+  "product-import.card.button-upload": "Ladda upp fil",
+  "product-import.card.update-product-slugs": "Uppdatera produkt-sluggar utifrån namn",
+  "product-import.card.select-main-language": "Välj huvudspråk:",
+  "product-import.card.updating-strategy": "Uppdateringsstrategi för etiketter och filer:",
+  "product-import.card.overwrite": "Skriv över",
+  "product-import.card.overwrite-warning": "Varning: Detta kommer ta bort befintliga etiketter och filer från produkter och varianter.",
+  "product-import.card.merge": "Sammanfoga",
+  "product-import.card.main-language-info": "Huvudspråket används som fallback när översättningar saknas. Det rekommenderas att välja det språk som används mest i din kanal. Huvudspråket kommer användas för att skapa upp produkter, de övriga språken kommer användas för att fylla i översättningar.",
+  "product-import.notifications.invalid-file-type": "Felaktig filtyp. Vänligen ladda upp en CSV-fil.",
+  "product-import.notifications.invalid-file-structure": "Felaktig filstruktur. Vänligen ladda upp en korrekt CSV-fil.",
+  "product-import.notifications.upload-success": "Filen laddades upp och har lagts till i kön för import.",
+  "product-import.notifications.upload-error": "Ett fel uppstod vid uppladdning av filen.",
+  "product-import.notifications.no-file-selected": "Ingen fil vald.",
+  "product-import.notifications.mismatched-values": "Det saknas språkspecifikationer för vissa fält. Vänligen fyll i alla språk:",
+  "product-import.notifications.missing-base-columns": "Vissa kolumner saknas:",
+  "product-import.notifications.missing-column": "Kolumnen saknas:",
+  "product-import.notifications.no-lines-in-file": "Filen är tom.",
+  "product-import.notifications.file-read-error": "Ett fel uppstod vid läsning av filen.",
+  "product-import.notifications.invalid-json": "Fältet {col} på rad {row} innehåller felaktig JSON-struktur.",
+  "product-import.notifications.missing-languages": "Din CSV-fil innehåller språk som inte är tillgängliga i den här kanalen. Vänligen lägg till språken i kanalen eller ta bort de språk som inte används och försök igen.",
+  "product-import.notifications.mismatched-option-values": "Antalet produktalternativ för vissa produktvarianter är felaktigt:",
+  "product-import.notifications.missing-main-language-name": "Huvudspråket saknas för namn. Vänligen lägg till huvudspråket och försök igen.",
+  "product-import.notifications.missing-translation-values": "Det saknas översättningar för vissa fält för huvudspråket som existerar i andra språk. Dessa kommer inte importeras:",
+  "product-import.notifications.inconsistent-columns": "Kolumnerna i filen är inkonsekventa. Vänligen kontrollera att alla rader har samma antal kolumner.",
+  "product-export.action": "Exportera produkter till CSV",
+  "product-export.dialog.title": "Exportera produkter till CSV",
+  "product-export.dialog.label": "Filnamn (valfritt)",
+  "product-export.dialog.export": "Exportera",
+  "product-export.dialog.cancel": "Avbryt",
+  "product-export.dialog.customFieldsLabel": "Anpassade fält som ska inkluderas i exporten",
+  "product-export.dialog.exportAssetsAs": "Exportera filer som:",
+  "product-export.dialog.exportAssetsAsOptions.url": "URL",
+  "product-export.dialog.exportAssetsAsOptions.json": "JSON",
+  "product-export.dialog.availableExportFieldsLabel": "Fält att exportera",
+  "product-export.dialog.selectAll": "Välj alla"
+}

package/src/dashboard/utils.ts

@@ -0,0 +1,64 @@
+// Shared utilities and types for product import/export plugin
+
+export type UpdatingStrategy = 'replace' | 'merge'
+
+export type ImportOptions = {
+  updateProductSlug?: boolean
+}
+
+export type ValidateReturnType = {
+  isValid: boolean
+  langCodes?: (string | undefined)[]
+  clearFile?: boolean
+}
+
+export type ProductFields =
+  | 'productId'
+  | 'name'
+  | 'slug'
+  | 'description'
+  | 'assets'
+  | 'facets'
+  | 'optionGroups'
+
+export type VariantFields =
+  | 'sku'
+  | 'optionValues'
+  | 'price'
+  | 'taxCategory'
+  | 'stockOnHand'
+  | 'trackInventory'
+  | 'variantAssets'
+  | 'variantFacets'
+  | 'enabled'
+
+export type ExportFields = Array<ProductFields | VariantFields>
+
+export interface PluginInitOptions {
+  visibleOptions?: Array<keyof ImportOptions>
+  defaultOptions?: ImportOptions
+  exportOptions?: {
+    defaultFileName?: string
+    exportAssetsAsOptions?: Array<'url' | 'json'>
+    defaultExportAssetsAs?: 'url' | 'json'
+    defaultExportFields?: ExportFields
+    requiredExportFields?: ExportFields
+  }
+}
+
+// Helper function to get server location (matches Angular UI's getServerLocation)
+export const getServerLocation = (): string => {
+  // In development with Vite, use the API server directly
+  if (window.location.port === '5173') {
+    return 'http://localhost:3000'
+  }
+  const { protocol, hostname, port } = window.location
+  const origin = port ? `${protocol}//${hostname}:${port}` : `${protocol}//${hostname}`
+  return origin
+}
+
+// Return vendure-token header if a non-default channel has been selected in the Dashboard
+export const getChannelHeader = (): Record<string, string> => {
+  const token = localStorage.getItem('vendure-selected-channel-token')
+  return token ? { 'vendure-token': token } : {}
+}

package/src/product-import-export.plugin.js

@@ -160,6 +160,7 @@ exports.ProductImportExportPlugin = ProductImportExportPlugin = ProductImportExp
             });
             return config;
         },
+        dashboard: './dashboard/index.tsx',
         compatibility: '^2.0.0 || ^3.0.0',
     })
 ], ProductImportExportPlugin);

package/src/product-import-export.plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"product-import-export.plugin.js","sourceRoot":"","sources":["../../../../packages/product-import-export-plugin/src/product-import-export.plugin.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"product-import-export.plugin.js","sourceRoot":"","sources":["../../../../packages/product-import-export-plugin/src/product-import-export.plugin.ts"],"names":[],"mappings":"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"}