From 2c81c4dc39b241222ec8f44cc680846dadc2fa5d Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Mon, 7 Nov 2022 21:54:49 +0100
Subject: [PATCH] fix copy first step schema + import buttons

---
 .../src/lib/components/SimpleEditor.svelte    |  2 +-
 .../src/lib/components/flows/flowStore.ts     | 13 +++++++--
 .../flows/header/FlowImportExportMenu.svelte  | 28 ++++++++-----------
 .../components/scripts/CreateActions.svelte   |  2 +-
 frontend/tailwind.config.cjs                  |  3 +-
 5 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/frontend/src/lib/components/SimpleEditor.svelte b/frontend/src/lib/components/SimpleEditor.svelte
index bd22e9e366..d5ebb4e86d 100644
--- a/frontend/src/lib/components/SimpleEditor.svelte
+++ b/frontend/src/lib/components/SimpleEditor.svelte
@@ -173,6 +173,6 @@
 
 	.few-lines-editor {
 		/* stylelint-disable-next-line unit-allowed-list */
-		height: 150px;
+		height: 100px;
 	}
 </style>
diff --git a/frontend/src/lib/components/flows/flowStore.ts b/frontend/src/lib/components/flows/flowStore.ts
index 6c74463841..27f03d1eda 100644
--- a/frontend/src/lib/components/flows/flowStore.ts
+++ b/frontend/src/lib/components/flows/flowStore.ts
@@ -108,10 +108,19 @@ export async function initFlow(flow: Flow) {
 export async function copyFirstStepSchema() {
 	const flowState = get(flowStateStore)
 	flowStore.update((flow) => {
-		const firstModuleId = flow.value.modules[0].id
+		const firstModuleId = flow.value.modules[0]?.id
 
-		if (flowState[firstModuleId]) {
+		if (flowState[firstModuleId] && firstModuleId) {
 			flow.schema = flowState[firstModuleId].schema
+			const v = flow.value.modules[0].value
+			if (v.type == 'rawscript' || v.type == 'script') {
+				Object.keys(v.input_transforms ?? {}).forEach((key) => {
+					v.input_transforms[key] = {
+						type: 'javascript',
+						expr: `flow_input.${key}`
+					}
+				})
+			}
 		}
 		return flow
 	})
diff --git a/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte b/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
index 08b1f3e758..de53b3c6ec 100644
--- a/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
+++ b/frontend/src/lib/components/flows/header/FlowImportExportMenu.svelte
@@ -26,26 +26,20 @@
 	}
 </script>
 
-<Menu placement="bottom-end">
-	<div slot="trigger">
-		<Button nonCaptureEvent={true} color="light" size="sm" variant="border">Import/Export</Button>
-	</div>
-
-	<div class="divide-y divide-gray-200">
-		<MenuItem on:click={() => jsonSetterDrawer.toggleDrawer()}>
-			<Icon data={faFileImport} scale={0.6} class="inline mr-2" />
-			Import from a JSON OpenFlow
-		</MenuItem>
-		<MenuItem on:click={() => jsonViewerDrawer.toggleDrawer()}>
-			<Icon data={faFileExport} scale={0.6} class="inline mr-2" />
-			Export to a JSON OpenFlow
-		</MenuItem>
-	</div>
-</Menu>
+<div class="flex-row gap-x-2 hidden sm:flex">
+	<Button size="sm" variant="border" color="light" on:click={() => jsonSetterDrawer.toggleDrawer()}>
+		<Icon data={faFileImport} scale={0.6} class="inline mr-2" />
+		Import JSON
+	</Button>
+	<Button size="sm" variant="border" color="light" on:click={() => jsonViewerDrawer.toggleDrawer()}>
+		<Icon data={faFileExport} scale={0.6} class="inline mr-2" />
+		Export JSON
+	</Button>
+</div>
 
 <Drawer bind:this={jsonSetterDrawer} size="800px">
 	<DrawerContent title="Import JSON" on:close={() => jsonSetterDrawer.toggleDrawer()}>
-		<Button size="sm" on:click={importJson}>Import</Button>
+		<Button slot="submission" size="sm" on:click={importJson}>Import</Button>
 		<SimpleEditor bind:code={pendingJson} lang="json" class="h-full" />
 	</DrawerContent>
 </Drawer>
diff --git a/frontend/src/lib/components/scripts/CreateActions.svelte b/frontend/src/lib/components/scripts/CreateActions.svelte
index 66bf9405d3..4d7dea2d89 100644
--- a/frontend/src/lib/components/scripts/CreateActions.svelte
+++ b/frontend/src/lib/components/scripts/CreateActions.svelte
@@ -120,7 +120,7 @@
 <!-- Raw JSON -->
 <Drawer bind:this={drawers.json} size="800px">
 	<DrawerContent title="Import JSON" on:close={() => drawers.json?.toggleDrawer()}>
-		<div class="p-2"><Button size="sm" on:click={importJson}>Import</Button></div>
 		<SimpleEditor bind:code={pendingJson} lang="json" class="h-full" />
+		<span slot="submission"><Button size="sm" on:click={importJson}>Import</Button></span>
 	</DrawerContent>
 </Drawer>
diff --git a/frontend/tailwind.config.cjs b/frontend/tailwind.config.cjs
index e2bbd5deb7..6b6ed0d69d 100644
--- a/frontend/tailwind.config.cjs
+++ b/frontend/tailwind.config.cjs
@@ -3,8 +3,7 @@ const plugin = require('tailwindcss/plugin');
 /** @type {import('tailwindcss').Config} */
 const config = {
 	content: [
-		'./src/**/*.{html,js,svelte,ts}',
-		"./node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}",
+		'./src/**/*.{html,js,svelte,ts}'
 	],
 	safelist: [
 		'hljs',