From 84e05249505c3d2f7eb7a4917f6bca503df81017 Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Thu, 24 Oct 2024 13:40:09 +0200
Subject: [PATCH] fix: initialize empty smtp settings correctly

---
 .../lib/components/InstanceSettings.svelte    | 73 +++++++++++++------
 1 file changed, 51 insertions(+), 22 deletions(-)

diff --git a/frontend/src/lib/components/InstanceSettings.svelte b/frontend/src/lib/components/InstanceSettings.svelte
index ac0aabd161..5ff2262058 100644
--- a/frontend/src/lib/components/InstanceSettings.svelte
+++ b/frontend/src/lib/components/InstanceSettings.svelte
@@ -102,8 +102,8 @@
 		if (values['base_url'] == undefined) {
 			values['base_url'] = 'http://localhost'
 		}
-		if (values['smtp_connect'] == undefined) {
-			values['smtp_connect'] = {}
+		if (values['smtp_settings'] == undefined) {
+			values['smtp_settings'] = {}
 		}
 		loading = false
 
@@ -274,22 +274,34 @@
 				<TabContent value={category}>
 					{#if category == 'SMTP'}
 						<div class="text-secondary pb-4 text-xs"
-							>Setting SMTP unlocks sending emails upon adding new users to the workspace or the instance or sending critical alerts.
-							<a target="_blank" href="https://www.windmill.dev/docs/misc/setup_smtp">Learn more</a></div
+							>Setting SMTP unlocks sending emails upon adding new users to the workspace or the
+							instance or sending critical alerts.
+							<a target="_blank" href="https://www.windmill.dev/docs/misc/setup_smtp">Learn more</a
+							></div
 						>
 					{:else if category == 'Registries'}
 						<div class="text-secondary pb-4 text-xs">
-							Add private registries for Pip, Bun and npm. <a target="_blank" href="https://www.windmill.dev/docs/advanced/imports">Learn more</a>
+							Add private registries for Pip, Bun and npm. <a
+								target="_blank"
+								href="https://www.windmill.dev/docs/advanced/imports">Learn more</a
+							>
 						</div>
 					{:else if category == 'Slack'}
 						<div class="text-secondary pb-4 text-xs">
-							Connecting your instance to a Slack workspace enables critical alerts to be sent to a Slack channel.
-							<a target="_blank" href="https://www.windmill.dev/docs/misc/saml_and_scim">Learn more</a>
+							Connecting your instance to a Slack workspace enables critical alerts to be sent to a
+							Slack channel.
+							<a target="_blank" href="https://www.windmill.dev/docs/misc/saml_and_scim"
+								>Learn more</a
+							>
 						</div>
 					{:else if category == 'SCIM/SAML'}
 						<div class="text-secondary pb-4 text-xs">
-							Setting up SAML and SCIM allows you to authenticate users using your identity provider.
-							<a target="_blank" href="https://www.windmill.dev/docs/advanced/instance_settings#slack">Learn more</a>
+							Setting up SAML and SCIM allows you to authenticate users using your identity
+							provider.
+							<a
+								target="_blank"
+								href="https://www.windmill.dev/docs/advanced/instance_settings#slack">Learn more</a
+							>
 						</div>
 					{:else if category == 'Debug'}
 						<div class="text-secondary pb-4 text-xs">
@@ -310,9 +322,11 @@
 							</ul>
 						</div>
 						{#if $enterpriseLicense}
-						<div class="text-secondary pb-4 text-xs">
-							On Enterprise Edition, you must send data to check that usage is in line with the terms of the subscription. You can either enable telemetry or regularly send usage data by clicking the button below.
-						</div>
+							<div class="text-secondary pb-4 text-xs">
+								On Enterprise Edition, you must send data to check that usage is in line with the
+								terms of the subscription. You can either enable telemetry or regularly send usage
+								data by clicking the button below.
+							</div>
 							<Button
 								on:click={sendStats}
 								variant="border"
@@ -340,12 +354,17 @@
 								{/if}
 
 								<div class="py-1" />
-									<div class="mb-2">
-										<span class="text-primary text-sm">When at least one of the below options is set, users will be able to login to
-											Windmill via their third-party account.
-											<br /> To test SSO, the recommended workflow is to to save the settings and try to
-											login in an incognito window. <a target="_blank" href="https://www.windmill.dev/docs/misc/setup_oauth#sso">Learn more</a></span>
-									</div>
+								<div class="mb-2">
+									<span class="text-primary text-sm"
+										>When at least one of the below options is set, users will be able to login to
+										Windmill via their third-party account.
+										<br /> To test SSO, the recommended workflow is to to save the settings and try
+										to login in an incognito window.
+										<a target="_blank" href="https://www.windmill.dev/docs/misc/setup_oauth#sso"
+											>Learn more</a
+										></span
+									>
+								</div>
 								<div class="flex flex-col gap-2 py-4">
 									<OAuthSetting name="google" bind:value={oauths['google']} />
 									<OAuthSetting name="microsoft" bind:value={oauths['microsoft']} />
@@ -374,7 +393,11 @@
 													<div class="p-2 border rounded">
 														<label class="block pb-2">
 															<span class="text-primary font-semibold text-sm">Custom Name</span>
-															<input type="text" placeholder="Custom Name" bind:value={oauths[k]['display_name']} />
+															<input
+																type="text"
+																placeholder="Custom Name"
+																bind:value={oauths[k]['display_name']}
+															/>
 														</label>
 														<label class="block pb-2">
 															<span class="text-primary font-semibold text-sm">Client Id</span>
@@ -429,12 +452,18 @@
 								</div>
 							{:else if ssoOrOauth === 'oauth'}
 								<div class="mb-2">
-									<span class="text-primary text-sm">When one of the below options is set, you will be able to create a specific
+									<span class="text-primary text-sm"
+										>When one of the below options is set, you will be able to create a specific
 										resource containing a token automatically generated by the third-party provider.
 										<br />
 										To test it after setting an oauth client, go to the Resources menu and create a new
-										one of the type of your oauth client (i.e. a 'github' resource if you set Github OAuth).
-										<br /><a target="_blank" href="https://www.windmill.dev/docs/misc/setup_oauth#oauth">Learn more</a></span>
+										one of the type of your oauth client (i.e. a 'github' resource if you set Github
+										OAuth).
+										<br /><a
+											target="_blank"
+											href="https://www.windmill.dev/docs/misc/setup_oauth#oauth">Learn more</a
+										></span
+									>
 								</div>
 								<div class="py-1" />
 								<OAuthSetting login={false} name="slack" bind:value={oauths['slack']} />