Skip to content

Commit bf18bdc

Browse files
MananTankMananTank
committed
Dashboard: Storybook cleanup
1 parent 4691343 commit bf18bdc

File tree

77 files changed

+532
-1152
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

77 files changed

+532
-1152
lines changed

‎apps/dashboard/.storybook/preview.tsx‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -81,23 +81,18 @@ function StoryLayout(props: {
8181
return (
8282
<QueryClientProvider client={queryClient}>
8383
<div className="flex min-h-dvh min-w-0 flex-col bg-background text-foreground">
84-
<div className="flex justify-end gap-2 border-b p-4">
84+
<div className="fixed right-0 bottom-0 z-50 flex justify-end gap-2 p-4">
8585
<Button
86-
onClick={() => setTheme("dark")}
86+
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
8787
size="sm"
88-
variant={theme === "dark" ? "default" : "outline"}
88+
variant="outline"
8989
className="h-auto w-auto shrink-0 rounded-full p-2"
9090
>
91-
<MoonIcon className="size-4" />
92-
</Button>
93-
94-
<Button
95-
onClick={() => setTheme("light")}
96-
size="sm"
97-
variant={theme === "light" ? "default" : "outline"}
98-
className="h-auto w-auto shrink-0 rounded-full p-2"
99-
>
100-
<SunIcon className="size-4" />
91+
{theme === "dark" ? (
92+
<MoonIcon className="size-4" />
93+
) : (
94+
<SunIcon className="size-4" />
95+
)}
10196
</Button>
10297
</div>
10398

‎apps/dashboard/src/@/components/blocks/Avatars/GradientAvatar.stories.tsx‎

Lines changed: 12 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,28 +8,27 @@ import { GradientAvatar } from "./GradientAvatar";
88
const meta = {
99
title: "blocks/Avatars/GradientAvatar",
1010
component: Story,
11-
parameters: {},
1211
} satisfies Meta<typeof Story>;
1312

1413
export default meta;
1514
type Story = StoryObj<typeof meta>;
1615

17-
export const Desktop: Story = {
16+
export const Variants: Story = {
1817
args: {},
1918
};
2019

2120
const client = getThirdwebClient();
2221

2322
function Story() {
2423
return (
25-
<div className="flex flex-col gap-10 p-10">
26-
<p> All images below are set with size-6 className </p>
24+
<div className="container flex max-w-6xl flex-col gap-10 py-10">
25+
<p> All images below are set with size-20 className </p>
2726

2827
<BadgeContainer label="No Src, No id - Skeleton">
2928
<GradientAvatar
3029
id={undefined}
3130
src={undefined}
32-
className="size-6"
31+
className="size-20"
3332
client={client}
3433
/>
3534
</BadgeContainer>
@@ -38,7 +37,7 @@ function Story() {
3837
<GradientAvatar
3938
id={"foo"}
4039
src={undefined}
41-
className="size-6"
40+
className="size-20"
4241
client={client}
4342
/>
4443
</BadgeContainer>
@@ -47,7 +46,7 @@ function Story() {
4746
<GradientAvatar
4847
id={"foo"}
4948
src={""}
50-
className="size-6"
49+
className="size-20"
5150
client={client}
5251
/>
5352
</BadgeContainer>
@@ -56,7 +55,7 @@ function Story() {
5655
<GradientAvatar
5756
id={"bar"}
5857
src={""}
59-
className="size-6"
58+
className="size-20"
6059
client={client}
6160
/>
6261
</BadgeContainer>
@@ -65,7 +64,7 @@ function Story() {
6564
<GradientAvatar
6665
src="invalid-src"
6766
id={undefined}
68-
className="size-6"
67+
className="size-20"
6968
client={client}
7069
/>
7170
</BadgeContainer>
@@ -74,7 +73,7 @@ function Story() {
7473
<GradientAvatar
7574
src="https://picsum.photos/200/300"
7675
id={undefined}
77-
className="size-6"
76+
className="size-20"
7877
client={client}
7978
/>
8079
</BadgeContainer>
@@ -83,7 +82,7 @@ function Story() {
8382
<GradientAvatar
8483
src="ipfs://QmZbeJYEs7kCJHyQxjxU2SJUtjSAr4m87wzJFJUyWomKdj/Smily.svg"
8584
id={undefined}
86-
className="size-6"
85+
className="size-20"
8786
client={client}
8887
/>
8988
</BadgeContainer>
@@ -123,14 +122,14 @@ function ToggleTest() {
123122
<GradientAvatar
124123
src={data?.src}
125124
id={data?.id}
126-
className="size-6"
125+
className="size-20"
127126
client={client}
128127
/>
129128
</BadgeContainer>
130129

131130
<BadgeContainer label="invalid Src">
132131
<GradientAvatar
133-
className="size-6"
132+
className="size-20"
134133
src={data ? "invalid-src" : undefined}
135134
id={undefined}
136135
client={client}

‎apps/dashboard/src/@/components/blocks/Avatars/ProjectAvatar.stories.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,15 @@ const meta = {
1414
export default meta;
1515
type Story = StoryObj<typeof meta>;
1616

17-
export const Desktop: Story = {
17+
export const Variants: Story = {
1818
args: {},
1919
};
2020

2121
const client = getThirdwebClient();
2222

2323
function Story() {
2424
return (
25-
<div className="flex flex-col gap-10 p-10">
25+
<div className="container flex max-w-6xl flex-col gap-10 py-10">
2626
<p> All images below are set with size-6 className </p>
2727

2828
<BadgeContainer label="No Src - Skeleton">

‎apps/dashboard/src/@/components/blocks/DangerSettingCard.stories.tsx‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { Meta, StoryObj } from "@storybook/react";
2-
import { BadgeContainer, mobileViewport } from "../../../stories/utils";
2+
import { BadgeContainer } from "../../../stories/utils";
33
import { DangerSettingCard } from "./DangerSettingCard";
44

55
const meta = {
@@ -15,17 +15,10 @@ const meta = {
1515
export default meta;
1616
type Story = StoryObj<typeof meta>;
1717

18-
export const Desktop: Story = {
18+
export const Variants: Story = {
1919
args: {},
2020
};
2121

22-
export const Mobile: Story = {
23-
args: {},
24-
parameters: {
25-
viewport: mobileViewport("iphone14"),
26-
},
27-
};
28-
2922
function Story() {
3023
return (
3124
<div className="container flex max-w-[1000px] flex-col gap-8 py-10">

‎apps/dashboard/src/@/components/blocks/Img.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,12 @@ import { Img } from "./Img";
99
const meta = {
1010
title: "blocks/Img",
1111
component: Story,
12-
parameters: {},
1312
} satisfies Meta<typeof Story>;
1413

1514
export default meta;
1615
type Story = StoryObj<typeof meta>;
1716

18-
export const Desktop: Story = {
17+
export const Variants: Story = {
1918
args: {},
2019
};
2120

‎apps/dashboard/src/@/components/blocks/MultiNetworkSelector.stories.tsx‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { Meta, StoryObj } from "@storybook/react";
22
import { useState } from "react";
3-
import { BadgeContainer, mobileViewport } from "../../../stories/utils";
3+
import { BadgeContainer } from "../../../stories/utils";
44
import { MultiNetworkSelector } from "./NetworkSelectors";
55

66
const meta = {
@@ -16,20 +16,13 @@ const meta = {
1616
export default meta;
1717
type Story = StoryObj<typeof meta>;
1818

19-
export const Desktop: Story = {
19+
export const Variants: Story = {
2020
args: {},
2121
};
2222

23-
export const Mobile: Story = {
24-
args: {},
25-
parameters: {
26-
viewport: mobileViewport("iphone14"),
27-
},
28-
};
29-
3023
function Story() {
3124
return (
32-
<div className="container flex max-w-[1000px] flex-col gap-8 lg:p-10">
25+
<div className="container flex max-w-6xl flex-col gap-8 py-10">
3326
<Variant label="No Chains selected by default" selectedChainIds={[]} />
3427
<Variant
3528
label="Polygon, Ethereum selected by default"

0 commit comments

Comments
 (0)