diff --git a/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-chromium-linux.png b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-chromium-linux.png new file mode 100644 index 00000000000..d52ac47572d --- /dev/null +++ b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-chromium-linux.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:6485e2033c7eb88acf5347c392a1a789e471975ea086211c478d7229cc3c3dfd +size 14652 diff --git a/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-personal-chromium-linux.png b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-personal-chromium-linux.png new file mode 100644 index 00000000000..1fad2819c5c --- /dev/null +++ b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/logged-in-personal-chromium-linux.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:f3cf6345efab3cefbc8d1ec2ae3b81103deb017bc930ede91fccb6efef59a65c +size 10738 diff --git a/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/not-logged-in-chromium-linux.png b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/not-logged-in-chromium-linux.png new file mode 100644 index 00000000000..f49f4d723e7 --- /dev/null +++ b/packages/kilo-vscode/tests/visual-regression.spec.ts-snapshots/profile/not-logged-in-chromium-linux.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:b70dcaf2b3f89e0644fb47273881076cbb84cf5d36ce506685689968edb021dc +size 5527 diff --git a/packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx b/packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx new file mode 100644 index 00000000000..0039b58c759 --- /dev/null +++ b/packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx @@ -0,0 +1,75 @@ +/** @jsxImportSource solid-js */ +/** + * Stories for ProfileView component. + */ + +import type { Meta, StoryObj } from "storybook-solidjs-vite" +import { StoryProviders } from "./StoryProviders" +import ProfileView from "../components/profile/ProfileView" +import type { ProfileData, DeviceAuthState } from "../types/messages" + +const meta: Meta = { + title: "Profile", + parameters: { layout: "fullscreen" }, +} +export default meta +type Story = StoryObj + +const loggedInProfile: ProfileData = { + profile: { + email: "user@example.com", + name: "Jane Developer", + organizations: [ + { id: "org-1", name: "Acme Corp", role: "admin" }, + { id: "org-2", name: "Side Project Inc", role: "member" }, + ], + }, + balance: { balance: 42.5 }, + currentOrgId: null, +} + +const personalProfile: ProfileData = { + profile: { + email: "solo@example.com", + name: "Solo Dev", + }, + balance: { balance: 7.25 }, + currentOrgId: null, +} + +const idleAuth: DeviceAuthState = { status: "idle" } + +const noop = () => {} + +export const LoggedIn: Story = { + name: "ProfileView — logged in with orgs", + render: () => ( + +
+ +
+
+ ), +} + +export const LoggedInPersonal: Story = { + name: "ProfileView — personal account", + render: () => ( + +
+ +
+
+ ), +} + +export const NotLoggedIn: Story = { + name: "ProfileView — not logged in", + render: () => ( + +
+ +
+
+ ), +}