From 1ee4afe2acfe770329545356183ed6b0959692ea Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Thu, 7 Mar 2024 18:32:06 +0000 Subject: [PATCH 1/2] chore(site): add FileUpload stories --- .../FileUpload/FileUpload.stories.tsx | 35 +++++++++++++++++++ site/src/components/FileUpload/FileUpload.tsx | 21 ++++++++--- 2 files changed, 51 insertions(+), 5 deletions(-) create mode 100644 site/src/components/FileUpload/FileUpload.stories.tsx diff --git a/site/src/components/FileUpload/FileUpload.stories.tsx b/site/src/components/FileUpload/FileUpload.stories.tsx new file mode 100644 index 0000000000000..fda208a974cd5 --- /dev/null +++ b/site/src/components/FileUpload/FileUpload.stories.tsx @@ -0,0 +1,35 @@ +import Link from "@mui/material/Link"; +import type { Meta, StoryObj } from "@storybook/react"; +import { FileUpload } from "./FileUpload"; + +const meta: Meta = { + title: "components/FileUpload", + component: FileUpload, + args: { + title: "Upload template", + description: ( + <> + The template has to be a .tar or .zip file. You can also use our{" "} + starter templates to getting + started with Coder. + + ), + }, +}; + +export default meta; +type Story = StoryObj; + +export const Default: Story = {}; + +export const Uploading: Story = { + args: { + isUploading: true, + }, +}; + +export const WithFile: Story = { + args: { + file: new File([""], "template.zip"), + }, +}; diff --git a/site/src/components/FileUpload/FileUpload.tsx b/site/src/components/FileUpload/FileUpload.tsx index c6feb07189efa..79e0a3b4f212b 100644 --- a/site/src/components/FileUpload/FileUpload.tsx +++ b/site/src/components/FileUpload/FileUpload.tsx @@ -64,11 +64,13 @@ export const FileUpload: FC = ({ {...fileDrop} > - {isUploading ? ( - - ) : ( - - )} +

+ {isUploading ? ( + + ) : ( + + )} +

{title} @@ -155,6 +157,15 @@ const styles = { opacity: 0.75, }, + // Used to maintain the size of icon and spinner + iconWrapper: { + width: 64, + height: 64, + display: "flex", + alignItems: "center", + justifyContent: "center", + }, + icon: { fontSize: 64, }, From 885e8c2a7dec6175e0fc077c3f96da0b5470b7c4 Mon Sep 17 00:00:00 2001 From: Bruno Quaresma Date: Fri, 8 Mar 2024 07:34:34 -0300 Subject: [PATCH 2/2] Update FileUpload.stories.tsx --- site/src/components/FileUpload/FileUpload.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/components/FileUpload/FileUpload.stories.tsx b/site/src/components/FileUpload/FileUpload.stories.tsx index fda208a974cd5..be49f25d92e4d 100644 --- a/site/src/components/FileUpload/FileUpload.stories.tsx +++ b/site/src/components/FileUpload/FileUpload.stories.tsx @@ -30,6 +30,6 @@ export const Uploading: Story = { export const WithFile: Story = { args: { - file: new File([""], "template.zip"), + file: new File([], "template.zip"), }, }; pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies: