From 0a540b7892d4784c1cd344a0a556a1f8a3d3eb01 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Thu, 7 Mar 2024 18:10:07 +0000 Subject: [PATCH 1/3] Add storybook for BuildAvatar --- .../BuildAvatar/BuildAvatar.stories.tsx | 38 +++++++++++++++++++ .../components/BuildAvatar/BuildAvatar.tsx | 2 +- 2 files changed, 39 insertions(+), 1 deletion(-) create mode 100644 site/src/components/BuildAvatar/BuildAvatar.stories.tsx diff --git a/site/src/components/BuildAvatar/BuildAvatar.stories.tsx b/site/src/components/BuildAvatar/BuildAvatar.stories.tsx new file mode 100644 index 0000000000000..0de9506d1cb38 --- /dev/null +++ b/site/src/components/BuildAvatar/BuildAvatar.stories.tsx @@ -0,0 +1,38 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { MockWorkspaceBuild } from "testHelpers/entities"; +import { BuildAvatar } from "./BuildAvatar"; + +const meta: Meta = { + title: "components/BuildAvatar", + component: BuildAvatar, + args: { + build: MockWorkspaceBuild, + }, +}; + +export default meta; +type Story = StoryObj; + +export const XSSize: Story = { + args: { + size: "xs", + }, +}; + +export const SMSize: Story = { + args: { + size: "sm", + }, +}; + +export const MDSize: Story = { + args: { + size: "md", + }, +}; + +export const XLSize: Story = { + args: { + size: "xl", + }, +}; diff --git a/site/src/components/BuildAvatar/BuildAvatar.tsx b/site/src/components/BuildAvatar/BuildAvatar.tsx index 4ac90fe669546..80d45de7d3897 100644 --- a/site/src/components/BuildAvatar/BuildAvatar.tsx +++ b/site/src/components/BuildAvatar/BuildAvatar.tsx @@ -28,7 +28,7 @@ export const BuildAvatar: FC = ({ build, size }) => { title={status} overlap="circular" anchorOrigin={{ vertical: "bottom", horizontal: "right" }} - badgeContent={
} + badgeContent={
} classes={{ badge: cx(classNames.badge, badgeType) }} > From 7004290030ec087d4444bced3ac79adb2c4471be Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Thu, 7 Mar 2024 18:22:26 +0000 Subject: [PATCH 2/3] Add stories for build icon and more for build avatar --- .../BuildAvatar/BuildAvatar.stories.tsx | 99 +++++++++++++++++++ .../BuildIcon/BuildIcon.stories.tsx | 28 ++++++ 2 files changed, 127 insertions(+) create mode 100644 site/src/components/BuildIcon/BuildIcon.stories.tsx diff --git a/site/src/components/BuildAvatar/BuildAvatar.stories.tsx b/site/src/components/BuildAvatar/BuildAvatar.stories.tsx index 0de9506d1cb38..c61662c07986f 100644 --- a/site/src/components/BuildAvatar/BuildAvatar.stories.tsx +++ b/site/src/components/BuildAvatar/BuildAvatar.stories.tsx @@ -36,3 +36,102 @@ export const XLSize: Story = { size: "xl", }, }; + +export const Start: Story = { + args: { + build: { + ...MockWorkspaceBuild, + transition: "start", + }, + }, +}; + +export const Stop: Story = { + args: { + build: { + ...MockWorkspaceBuild, + transition: "stop", + }, + }, +}; + +export const Delete: Story = { + args: { + build: { + ...MockWorkspaceBuild, + transition: "delete", + }, + }, +}; + +export const Succeeded: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "succeeded", + }, + }, + }, +}; + +export const Pending: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "pending", + }, + }, + }, +}; + +export const Running: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "running", + }, + }, + }, +}; + +export const Failed: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "failed", + }, + }, + }, +}; + +export const Canceling: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "canceling", + }, + }, + }, +}; + +export const Canceled: Story = { + args: { + build: { + ...MockWorkspaceBuild, + job: { + ...MockWorkspaceBuild.job, + status: "canceled", + }, + }, + }, +}; diff --git a/site/src/components/BuildIcon/BuildIcon.stories.tsx b/site/src/components/BuildIcon/BuildIcon.stories.tsx new file mode 100644 index 0000000000000..1b80dbb31b894 --- /dev/null +++ b/site/src/components/BuildIcon/BuildIcon.stories.tsx @@ -0,0 +1,28 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { BuildIcon } from "./BuildIcon"; + +const meta: Meta = { + title: "components/BuildIcon", + component: BuildIcon, +}; + +export default meta; +type Story = StoryObj; + +export const Start: Story = { + args: { + transition: "start", + }, +}; + +export const Stop: Story = { + args: { + transition: "stop", + }, +}; + +export const Delete: Story = { + args: { + transition: "delete", + }, +}; From 46db2eea03b151836cba2c9ef61896d74b279372 Mon Sep 17 00:00:00 2001 From: BrunoQuaresma Date: Fri, 8 Mar 2024 10:33:53 +0000 Subject: [PATCH 3/3] Remove self closed divs --- site/src/components/BuildAvatar/BuildAvatar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/components/BuildAvatar/BuildAvatar.tsx b/site/src/components/BuildAvatar/BuildAvatar.tsx index 80d45de7d3897..4ac90fe669546 100644 --- a/site/src/components/BuildAvatar/BuildAvatar.tsx +++ b/site/src/components/BuildAvatar/BuildAvatar.tsx @@ -28,7 +28,7 @@ export const BuildAvatar: FC = ({ build, size }) => { title={status} overlap="circular" anchorOrigin={{ vertical: "bottom", horizontal: "right" }} - badgeContent={
} + badgeContent={
} classes={{ badge: cx(classNames.badge, badgeType) }} > 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:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy