Commit5b2acbc

authored

chore(site): add FileUpload stories (#12456)

Related to#12260

1 parent18d1c17 commit5b2acbcCopy full SHA for 5b2acbc

File tree

+51

-5

lines changed

+51

-5

lines changed

Lines changed: 35 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,35 @@`
	`1`	`+importLinkfrom"@mui/material/Link";`
	`2`	`+importtype{Meta,StoryObj}from"@storybook/react";`
	`3`	`+import{FileUpload}from"./FileUpload";`
	`4`	`+`
	`5`	`+constmeta:Meta<typeofFileUpload>={`
	`6`	`+title:"components/FileUpload",`
	`7`	`+component:FileUpload,`
	`8`	`+args:{`
	`9`	`+title:"Upload template",`
	`10`	`+description:(`
	`11`	`+<>`
	`12`	`+ The template has to be a .tar or .zip file. You can also use our{" "}`
	`13`	`+<Linkhref="/starter-templates">starter templates</Link> to getting`
	`14`	`+ started with Coder.`
	`15`	`+</>`
	`16`	`+),`
	`17`	`+},`
	`18`	`+};`
	`19`	`+`
	`20`	`+exportdefaultmeta;`
	`21`	`+typeStory=StoryObj<typeofFileUpload>;`
	`22`	`+`
	`23`	`+exportconstDefault:Story={};`
	`24`	`+`
	`25`	`+exportconstUploading:Story={`
	`26`	`+args:{`
	`27`	`+isUploading:true,`
	`28`	`+},`
	`29`	`+};`
	`30`	`+`
	`31`	`+exportconstWithFile:Story={`
	`32`	`+args:{`
	`33`	`+file:newFile([],"template.zip"),`
	`34`	`+},`
	`35`	`+};`

Lines changed: 16 additions & 5 deletions

Original file line number	Diff line number	Diff line change
`@@ -64,11 +64,13 @@ export const FileUpload: FC<FileUploadProps> = ({`
`64`	`64`	`{...fileDrop}`
`65`	`65`	`>`
`66`	`66`	`<StackalignItems="center"spacing={1}>`
`67`		`-{isUploading ?(`
`68`		`-<CircularProgresssize={32}/>`
`69`		`-) :(`
`70`		`-<UploadIconcss={styles.icon}/>`
`71`		`-)}`
	`67`	`+<divcss={styles.iconWrapper}>`
	`68`	`+{isUploading ?(`
	`69`	`+<CircularProgresssize={32}/>`
	`70`	`+) :(`
	`71`	`+<UploadIconcss={styles.icon}/>`
	`72`	`+)}`
	`73`	`+</div>`
`72`	`74`
`73`	`75`	`<StackalignItems="center"spacing={0.5}>`
`74`	`76`	`<spancss={styles.title}>{title}</span>`
`@@ -155,6 +157,15 @@ const styles = {`
`155`	`157`	`opacity:0.75,`
`156`	`158`	`},`
`157`	`159`
	`160`	`+// Used to maintain the size of icon and spinner`
	`161`	`+iconWrapper:{`
	`162`	`+width:64,`
	`163`	`+height:64,`
	`164`	`+display:"flex",`
	`165`	`+alignItems:"center",`
	`166`	`+justifyContent:"center",`
	`167`	`+},`
	`168`	`+`
`158`	`169`	`icon:{`
`159`	`170`	`fontSize:64,`
`160`	`171`	`},`

Comments

(0)