From 2b0677763d2980b3ba4958df683cc423f3f22d59 Mon Sep 17 00:00:00 2001
From: Quentin Gliech <quenting@element.io>
Date: Tue, 15 Nov 2022 15:12:01 +0100
Subject: [PATCH] More stories

---
 frontend/src/components/Button.stories.ts     | 14 ++++++++++
 frontend/src/components/Button.tsx            |  7 +++++
 .../src/components/LoadingScreen.stories.tsx  | 28 +++++++++++++++++++
 .../src/components/LoadingSpinner.stories.tsx | 28 +++++++++++++++++++
 4 files changed, 77 insertions(+)
 create mode 100644 frontend/src/components/LoadingScreen.stories.tsx
 create mode 100644 frontend/src/components/LoadingSpinner.stories.tsx

diff --git a/frontend/src/components/Button.stories.ts b/frontend/src/components/Button.stories.ts
index 36f2cd38..774364c8 100644
--- a/frontend/src/components/Button.stories.ts
+++ b/frontend/src/components/Button.stories.ts
@@ -1,3 +1,17 @@
+// Copyright 2022 The Matrix.org Foundation C.I.C.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
 import type { Meta, StoryObj } from "@storybook/react";
 
 import Button from "./Button";
diff --git a/frontend/src/components/Button.tsx b/frontend/src/components/Button.tsx
index 70d6eaff..2c08d829 100644
--- a/frontend/src/components/Button.tsx
+++ b/frontend/src/components/Button.tsx
@@ -13,9 +13,16 @@
 // limitations under the License.
 
 type Props = {
+  /** The label of the button */
   children: string;
+
+  /** Makes the button more compact */
   compact?: boolean;
+
+  /** Uses the 'ghotst' (outline) alternative */
   ghost?: boolean;
+
+  /** Disables all interactions with the button */
   disabled?: boolean;
 } & React.HTMLProps<HTMLButtonElement>;
 
diff --git a/frontend/src/components/LoadingScreen.stories.tsx b/frontend/src/components/LoadingScreen.stories.tsx
new file mode 100644
index 00000000..be457999
--- /dev/null
+++ b/frontend/src/components/LoadingScreen.stories.tsx
@@ -0,0 +1,28 @@
+// Copyright 2022 The Matrix.org Foundation C.I.C.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import type { Meta, StoryObj } from "@storybook/react";
+
+import LoadingScreen from "./LoadingScreen";
+
+const meta: Meta<typeof LoadingScreen> = {
+  title: "UI/Loading Screen",
+  component: LoadingScreen,
+  tags: ["docsPage"],
+};
+
+export default meta;
+type Story = StoryObj<typeof LoadingScreen>;
+
+export const Basic: Story = {};
diff --git a/frontend/src/components/LoadingSpinner.stories.tsx b/frontend/src/components/LoadingSpinner.stories.tsx
new file mode 100644
index 00000000..2a3bc650
--- /dev/null
+++ b/frontend/src/components/LoadingSpinner.stories.tsx
@@ -0,0 +1,28 @@
+// Copyright 2022 The Matrix.org Foundation C.I.C.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import type { Meta, StoryObj } from "@storybook/react";
+
+import LoadingSpinner from "./LoadingSpinner";
+
+const meta: Meta<typeof LoadingSpinner> = {
+  title: "UI/Loading Spinner",
+  component: LoadingSpinner,
+  tags: ["docsPage"],
+};
+
+export default meta;
+type Story = StoryObj<typeof LoadingSpinner>;
+
+export const Basic: Story = {};