From 764bc2d3af9d20c07e495b7015daf9e393fe659a Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Thu, 4 Aug 2022 18:42:30 +0200
Subject: [PATCH] tooltip for why python not supported for trigger scripts

---
 frontend/src/lib/components/AppConnect.svelte                | 4 ++--
 frontend/src/lib/components/flows/FlowInputs.svelte          | 4 ++++
 .../src/lib/components/flows/pickers/FlowScriptPicker.svelte | 5 +++++
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/AppConnect.svelte b/frontend/src/lib/components/AppConnect.svelte
index 8fd2b5aafc..cc1ec84860 100644
--- a/frontend/src/lib/components/AppConnect.svelte
+++ b/frontend/src/lib/components/AppConnect.svelte
@@ -248,9 +248,9 @@
 					>{(extra_params ?? []).length} item{(extra_params ?? []).length > 1 ? 's' : ''}</span
 				>
 			{:else}
-				<p class="italic text-sm">Pick an OAuth app and customize the scopes here</p>
+				<p class="italic text-sm">Pick an OAuth app and customize the extra parameters here</p>
 			{/if}
-			<PageHeader title="API token apps" />
+			<PageHeader title="Non OAuth apps" />
 			<div class="grid sm:grid-cols-2 md:grid-cols-3 gap-x-2 gap-y-1 items-center mb-2">
 				{#each connectsManual as [key, instructions]}
 					<button
diff --git a/frontend/src/lib/components/flows/FlowInputs.svelte b/frontend/src/lib/components/flows/FlowInputs.svelte
index c298f41a5b..62f99f79de 100644
--- a/frontend/src/lib/components/flows/FlowInputs.svelte
+++ b/frontend/src/lib/components/flows/FlowInputs.svelte
@@ -21,11 +21,15 @@
 		iconColor="text-blue-800"
 		on:click={() => dispatch('new', { language: RawScript.language.DENO })}
 	/>
+
 	<FlowScriptPicker
 		disabled={isTrigger}
 		label="New Python {isTrigger ? 'trigger ' : ''}script (3.10)"
 		icon={faCode}
 		iconColor="text-yellow-500"
 		on:click={() => dispatch('new', { language: RawScript.language.PYTHON3 })}
+		tooltip={isTrigger
+			? 'Python is not supported for trigger scripts yet but is supported for every other steps'
+			: undefined}
 	/>
 </div>
diff --git a/frontend/src/lib/components/flows/pickers/FlowScriptPicker.svelte b/frontend/src/lib/components/flows/pickers/FlowScriptPicker.svelte
index 4796d99014..3c3108cf63 100644
--- a/frontend/src/lib/components/flows/pickers/FlowScriptPicker.svelte
+++ b/frontend/src/lib/components/flows/pickers/FlowScriptPicker.svelte
@@ -1,14 +1,19 @@
 <script lang="ts">
 	import type { IconDefinition } from '@fortawesome/free-brands-svg-icons'
+	import { Tooltip } from 'flowbite-svelte'
 	import Icon from 'svelte-awesome'
 
 	export let disabled: boolean = false
 	export let icon: IconDefinition
 	export let label: string
 	export let iconColor: string
+	export let tooltip: string | undefined = undefined
 </script>
 
 <button {disabled} type="button" on:click class="default-secondary-button-v2 mb-2 w-full">
 	<Icon data={icon} class={`w-4 h-4 mr-2 -ml-2 ${iconColor}`} />
 	{label}
+	{#if tooltip}
+		<Tooltip placement="bottom" content={tooltip}>(?)</Tooltip>
+	{/if}
 </button>