Add Ableton Live version selection and validation for export options

src/hooks/useExportProject.ts

@@ -18,7 +18,7 @@ import { getCustomSceneNames } from './useSceneName';
 
 export const EXPORT_FORMATS: ExportFormat[] = [
   {
-    name: 'Ableton 11+',
+    name: 'Ableton Live',
     value: 'ableton',
   },
   {

src/routes/home/Export/ExportOptions.tsx

@@ -3,6 +3,7 @@ import { useMemo } from 'preact/hooks';
 import { useFormContext, useWatch } from 'react-hook-form';
 import { projectIdAtom } from '~/atoms/project';
 import CheckboxField from '~/components/form/CheckboxField';
+import SelectField from '~/components/form/SelectField';
 import useProject from '~/hooks/useProject';
 import { hasMultipleNoteVariations } from '~/lib/utils';
 import { ExportFormValues } from './exportFormSchema';
@@ -89,6 +90,13 @@ function ExportOptions({ disabled = false }: { disabled?: boolean }) {
 
       {format === 'ableton' && (
         <>
+          <label className="flex flex-col gap-1 mb-2">
+            <span className="text-sm">Ableton Live version</span>
+            <SelectField name="abletonVersion" disabled={disabled} className="mr-auto">
+              <option value="10">Live 10</option>
+              <option value="11">Live 11+</option>
+            </SelectField>
+          </label>
           <CheckboxField
             name="includeArchivedSamples"
             title="Include samples"

src/routes/home/Export/ExportProjectDialog.tsx

@@ -42,6 +42,7 @@ function ExportProjectDialog({
     resolver: zodResolver(exportFormSchema),
     defaultValues: {
       format: EXPORT_FORMATS[0].value,
+      abletonVersion: '10',
       projectName: `Project${projectId}`,
       includeArchivedSamples: true,
       exportAllPadsWithSamples: false,
@@ -122,24 +123,6 @@ function ExportProjectDialog({
             </div>
           )}
 
-          {!result && !percentage && (
-            <a
-              href="https://eptoolkit.ep133-to-daw.cc/"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="bg-creme w-full bg-grid border border-black gap-2 p-2 text-black flex mt-4 justify-center items-center"
-            >
-              <p>
-                Want fader automation support? Get <strong>EP Toolkit</strong>: desktop app for
-                exporting, sample management, backups and more.{' '}
-              </p>
-              <img
-                src="/eptoolkit/eptoolkit-logo.png"
-                alt="EP Toolkit"
-                className="size-10 shrink-0 ml-auto"
-              />
-            </a>
-          )}
         </div>
 
         <div className="mt-4 min-h-13.5">

src/routes/home/Export/exportFormSchema.ts

@@ -10,6 +10,7 @@ const FORMAT_IDS: [ExportFormatId, ...ExportFormatId[]] = [
 
 export const exportFormSchema = z.object({
   format: z.enum(FORMAT_IDS),
+  abletonVersion: z.enum(['10', '11']),
   projectName: z.string(),
   includeArchivedSamples: z.boolean(),
   exportAllPadsWithSamples: z.boolean(),
@@ -28,6 +29,7 @@ export type ExportFormValues = z.infer<typeof exportFormSchema>;
 
 export const PERSISTED_FIELDS: (keyof ExportFormValues)[] = [
   'format',
+  'abletonVersion',
   'includeArchivedSamples',
   'exportAllPadsWithSamples',
   'clips',

src/types/types.ts

@@ -216,6 +216,7 @@ export type ExportFormat = {
 };
 
 export type ExporterParams = {
+  abletonVersion?: '10' | '11';
   projectName?: string; // custom project name for exported files
   includeArchivedSamples?: boolean;
   exportAllPadsWithSamples?: boolean; // export all pads with assigned samples even if not used