From dc707869b48e72b85cb3c81d4ffea6bfbb7cd210 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Jaenisch?= <andre.jaenisch@posteo.de>
Date: Wed, 28 Feb 2024 20:25:19 +0100
Subject: [PATCH] docs: write Story for LoginForm
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

As it is visible here, part of the layout is deferred to the parent
component. See Login template.

Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>
---
 stories/organisms/LoginForm.stories.ts | 110 +++++++++++++++++++++++++
 stories/pages/Login.stories.ts         |   6 +-
 stories/templates/Login.stories.ts     |   6 +-
 3 files changed, 116 insertions(+), 6 deletions(-)
 create mode 100644 stories/organisms/LoginForm.stories.ts

diff --git a/stories/organisms/LoginForm.stories.ts b/stories/organisms/LoginForm.stories.ts
new file mode 100644
index 0000000..d67df3e
--- /dev/null
+++ b/stories/organisms/LoginForm.stories.ts
@@ -0,0 +1,110 @@
+import type { Meta, StoryObj } from '@storybook/svelte';
+
+import LoginForm from '$lib/components/organisms/LoginForm.svelte';
+
+const meta = {
+	title: 'Organisms/LoginForm',
+	component: LoginForm,
+	tags: ['autodocs'],
+	argTypes: {
+		form: { controls: 'object' },
+		i18n: { controls: 'object' },
+		servers: { controls: 'object' }
+	}
+} satisfies Meta<LoginForm>;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Plain: Story = {
+	args: {
+		form: {
+			account: 'jane.doe@domain.example',
+			incorrect: false,
+			missing: false
+		},
+		i18n: {
+			fields: {
+				account: {
+					label: 'page.login.form.fields.account.label'
+				},
+				passphrase: {
+					label: 'page.login.form.fields.passphrase.label',
+					placeholder: 'page.login.form.fields.passphrase.placeholder'
+				},
+				server: {
+					label: 'page.login.form.fields.server.label'
+				}
+			},
+			reset: 'page.login.form.reset',
+			submit: 'page.login.form.submit',
+			validation: {
+				incorrect: 'page.login.form.validation.incorrect',
+				missing: 'page.login.form.validation.missing'
+			}
+		},
+		servers: []
+	}
+};
+
+export const MissingInput: Story = {
+	args: {
+		form: {
+			account: '',
+			incorrect: false,
+			missing: true
+		},
+		i18n: {
+			fields: {
+				account: {
+					label: 'page.login.form.fields.account.label'
+				},
+				passphrase: {
+					label: 'page.login.form.fields.passphrase.label',
+					placeholder: 'page.login.form.fields.passphrase.placeholder'
+				},
+				server: {
+					label: 'page.login.form.fields.server.label'
+				}
+			},
+			reset: 'page.login.form.reset',
+			submit: 'page.login.form.submit',
+			validation: {
+				incorrect: 'page.login.form.validation.incorrect',
+				missing: 'page.login.form.validation.missing'
+			}
+		},
+		servers: []
+	}
+};
+
+export const InvalidFormData: Story = {
+	args: {
+		form: {
+			account: 'jane.doe@domain.example',
+			incorrect: true,
+			missing: false
+		},
+		i18n: {
+			fields: {
+				account: {
+					label: 'page.login.form.fields.account.label'
+				},
+				passphrase: {
+					label: 'page.login.form.fields.passphrase.label',
+					placeholder: 'page.login.form.fields.passphrase.placeholder'
+				},
+				server: {
+					label: 'page.login.form.fields.server.label'
+				}
+			},
+			reset: 'page.login.form.reset',
+			submit: 'page.login.form.submit',
+			validation: {
+				incorrect: 'page.login.form.validation.incorrect',
+				missing: 'page.login.form.validation.missing'
+			}
+		},
+		servers: []
+	}
+};
diff --git a/stories/pages/Login.stories.ts b/stories/pages/Login.stories.ts
index 887faef..a57bd89 100644
--- a/stories/pages/Login.stories.ts
+++ b/stories/pages/Login.stories.ts
@@ -19,7 +19,7 @@ export const Plain: Story = {
 		form: {
 			account: 'jane.doe@domain.example',
 			incorrect: false,
-			missing: false,
+			missing: false
 		}
 	}
 };
@@ -29,7 +29,7 @@ export const MissingInput: Story = {
 		form: {
 			account: '',
 			incorrect: false,
-			missing: true,
+			missing: true
 		}
 	}
 };
@@ -39,7 +39,7 @@ export const InvalidFormData: Story = {
 		form: {
 			account: 'jane.doe@domain.example',
 			incorrect: true,
-			missing: false,
+			missing: false
 		}
 	}
 };
diff --git a/stories/templates/Login.stories.ts b/stories/templates/Login.stories.ts
index 04e5ba9..d5c2ee4 100644
--- a/stories/templates/Login.stories.ts
+++ b/stories/templates/Login.stories.ts
@@ -19,7 +19,7 @@ export const Plain: Story = {
 		form: {
 			account: 'jane.doe@domain.example',
 			incorrect: false,
-			missing: false,
+			missing: false
 		}
 	}
 };
@@ -29,7 +29,7 @@ export const MissingInput: Story = {
 		form: {
 			account: '',
 			incorrect: false,
-			missing: true,
+			missing: true
 		}
 	}
 };
@@ -39,7 +39,7 @@ export const InvalidFormData: Story = {
 		form: {
 			account: 'jane.doe@domain.example',
 			incorrect: true,
-			missing: false,
+			missing: false
 		}
 	}
 };