@dxos/plugin-client 0.9.1-main.c7dcc2e112 → 0.9.1-staging.ee54ba693a

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-client",
-  "version": "0.9.1-main.c7dcc2e112",
+  "version": "0.9.1-staging.ee54ba693a",
   "description": "DXOS Surface plugin for DXOS Client",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -104,62 +104,63 @@
   ],
   "dependencies": {
     "@effect/cli": "0.75.2",
-    "@effect/platform": "0.96.1",
-    "effect": "3.21.3",
+    "@effect/platform": "0.96.2",
+    "effect": "3.21.4",
     "react-qr-rounded": "^1.0.0",
     "yaml": "^2.8.2",
-    "@dxos/async": "0.9.1-main.c7dcc2e112",
-    "@dxos/client": "0.9.1-main.c7dcc2e112",
-    "@dxos/cli-util": "0.9.1-main.c7dcc2e112",
-    "@dxos/client-protocol": "0.9.1-main.c7dcc2e112",
-    "@dxos/config": "0.9.1-main.c7dcc2e112",
-    "@dxos/client-services": "0.9.1-main.c7dcc2e112",
-    "@dxos/compute": "0.9.1-main.c7dcc2e112",
-    "@dxos/context": "0.9.1-main.c7dcc2e112",
-    "@dxos/credentials": "0.9.1-main.c7dcc2e112",
-    "@dxos/app-toolkit": "0.9.1-main.c7dcc2e112",
-    "@dxos/echo": "0.9.1-main.c7dcc2e112",
-    "@dxos/echo-protocol": "0.9.1-main.c7dcc2e112",
-    "@dxos/edge-client": "0.9.1-main.c7dcc2e112",
-    "@dxos/effect": "0.9.1-main.c7dcc2e112",
-    "@dxos/echo-client": "0.9.1-main.c7dcc2e112",
-    "@dxos/functions": "0.9.1-main.c7dcc2e112",
-    "@dxos/log": "0.9.1-main.c7dcc2e112",
-    "@dxos/app-framework": "0.9.1-main.c7dcc2e112",
-    "@dxos/keys": "0.9.1-main.c7dcc2e112",
-    "@dxos/invariant": "0.9.1-main.c7dcc2e112",
-    "@dxos/plugin-graph": "0.9.1-main.c7dcc2e112",
-    "@dxos/protocols": "0.9.1-main.c7dcc2e112",
-    "@dxos/plugin-observability": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-client": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-ui-form": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-ui-pickers": "0.9.1-main.c7dcc2e112",
-    "@dxos/shell": "0.9.1-main.c7dcc2e112",
-    "@dxos/util": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-ui-syntax-highlighter": "0.9.1-main.c7dcc2e112"
+    "@dxos/app-framework": "0.9.1-staging.ee54ba693a",
+    "@dxos/app-toolkit": "0.9.1-staging.ee54ba693a",
+    "@dxos/async": "0.9.1-staging.ee54ba693a",
+    "@dxos/cli-util": "0.9.1-staging.ee54ba693a",
+    "@dxos/client-protocol": "0.9.1-staging.ee54ba693a",
+    "@dxos/config": "0.9.1-staging.ee54ba693a",
+    "@dxos/client-services": "0.9.1-staging.ee54ba693a",
+    "@dxos/compute": "0.9.1-staging.ee54ba693a",
+    "@dxos/context": "0.9.1-staging.ee54ba693a",
+    "@dxos/credentials": "0.9.1-staging.ee54ba693a",
+    "@dxos/echo": "0.9.1-staging.ee54ba693a",
+    "@dxos/echo-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/echo-protocol": "0.9.1-staging.ee54ba693a",
+    "@dxos/edge-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/effect": "0.9.1-staging.ee54ba693a",
+    "@dxos/client": "0.9.1-staging.ee54ba693a",
+    "@dxos/invariant": "0.9.1-staging.ee54ba693a",
+    "@dxos/functions": "0.9.1-staging.ee54ba693a",
+    "@dxos/keys": "0.9.1-staging.ee54ba693a",
+    "@dxos/log": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-graph": "0.9.1-staging.ee54ba693a",
+    "@dxos/plugin-observability": "0.9.1-staging.ee54ba693a",
+    "@dxos/protocols": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-form": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-client": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-list": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-pickers": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui-syntax-highlighter": "0.9.1-staging.ee54ba693a",
+    "@dxos/util": "0.9.1-staging.ee54ba693a",
+    "@dxos/shell": "0.9.1-staging.ee54ba693a"
   },
   "devDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
     "@effect/printer": "0.49.0",
     "@effect/printer-ansi": "0.49.0",
-    "@types/react": "~19.2.7",
+    "@types/react": "~19.2.17",
     "@types/react-dom": "~19.2.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
     "vite": "^8.0.16",
-    "@dxos/plugin-testing": "0.9.1-main.c7dcc2e112",
-    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112",
-    "@dxos/storybook-utils": "0.9.1-main.c7dcc2e112",
-    "@dxos/react-ui": "0.9.1-main.c7dcc2e112"
+    "@dxos/plugin-testing": "0.9.1-staging.ee54ba693a",
+    "@dxos/react-ui": "0.9.1-staging.ee54ba693a",
+    "@dxos/storybook-utils": "0.9.1-staging.ee54ba693a",
+    "@dxos/ui-theme": "0.9.1-staging.ee54ba693a"
   },
   "peerDependencies": {
     "@effect-atom/atom-react": "^0.5.0",
-    "@effect/platform": "0.96.1",
-    "effect": "3.21.3",
-    "react": "~19.2.3",
-    "react-dom": "~19.2.3",
-    "@dxos/react-ui": "0.9.1-main.c7dcc2e112",
-    "@dxos/ui-theme": "0.9.1-main.c7dcc2e112"
+    "@effect/platform": "0.96.2",
+    "effect": "3.21.4",
+    "react": "~19.2.7",
+    "react-dom": "~19.2.7",
+    "@dxos/react-ui": "0.9.1-staging.ee54ba693a",
+    "@dxos/ui-theme": "0.9.1-staging.ee54ba693a"
   },
   "publishConfig": {
     "access": "public"

package/src/capabilities/account-cache.ts

@@ -7,9 +7,7 @@ import * as Effect from 'effect/Effect';
 import { Capability } from '@dxos/app-framework';
 import { createKvsStore } from '@dxos/effect';
 
-import { ClientCapabilities } from '#types';
-
-import { AccountCache } from '../state/account-cache';
+import { AccountCache, ClientCapabilities } from '#types';
 
 export default Capability.makeModule(() =>
   Effect.succeed(

package/src/capabilities/app-graph-builder.ts

@@ -37,86 +37,87 @@ export default Capability.makeModule(
             },
           },
         ]),
-      connector: Effect.fnUntraced(function* (node, get) {
-        const client = yield* Capability.get(ClientCapabilities.Client);
-        const identity = get(CreateAtom.fromObservable(client.halo.identity));
-        const status = get(CreateAtom.fromObservable(client.mesh.networkStatus));
+      connector: (node, get) =>
+        Effect.gen(function* () {
+          const client = yield* Capability.get(ClientCapabilities.Client);
+          const identity = get(CreateAtom.fromObservable(client.halo.identity));
+          const status = get(CreateAtom.fromObservable(client.mesh.networkStatus));
 
-        return [
-          Node.make({
-            id: Account.id,
-            type: meta.profile.key,
-            properties: {
-              label: ['account.label', { ns: meta.profile.key }],
-              icon: 'ph--user--regular',
-              disposition: 'user-account',
-              testId: 'clientPlugin.account',
-              // NOTE: This currently needs to be the identity key because the fallback is generated from hex.
-              userId: identity?.identityKey.toHex(),
-              hue: identity?.profile?.data?.hue,
-              emoji: identity?.profile?.data?.emoji,
-              status: status.swarm === ConnectionState.OFFLINE ? 'error' : 'active',
-            },
-            nodes: [
-              Node.make({
-                id: Account.Profile,
-                data: Account.Profile,
-                type: meta.profile.key,
-                properties: {
-                  label: ['profile.label', { ns: meta.profile.key }],
-                  icon: 'ph--user--regular',
-                },
-              }),
-              Node.make({
-                id: Account.Account,
-                data: Account.Account,
-                type: meta.profile.key,
-                properties: {
-                  label: ['account-panel.label', { ns: meta.profile.key }],
-                  icon: 'ph--identification-card--regular',
-                },
-              }),
-              Node.make({
-                id: Account.Devices,
-                data: Account.Devices,
-                type: meta.profile.key,
-                properties: {
-                  label: ['devices.label', { ns: meta.profile.key }],
-                  icon: 'ph--devices--regular',
-                  testId: 'clientPlugin.devices',
-                },
-              }),
-              Node.make({
-                id: Account.Security,
-                data: Account.Security,
-                type: meta.profile.key,
-                properties: {
-                  label: ['security.label', { ns: meta.profile.key }],
-                  icon: 'ph--key--regular',
-                },
-              }),
-              Node.make({
-                id: Account.Invitations,
-                data: Account.Invitations,
-                type: meta.profile.key,
-                properties: {
-                  label: ['invitations-panel.label', { ns: meta.profile.key }],
-                  icon: 'ph--ticket--regular',
-                },
-              }),
-              Node.make({
-                id: Account.Usage,
-                data: Account.Usage,
-                type: meta.profile.key,
-                properties: {
-                  label: ['usage-panel.label', { ns: meta.profile.key }],
-                  icon: 'ph--chart-bar--regular',
-                },
-              }),
-            ],
-          }),
-        ];
-      }),
+          return [
+            Node.make({
+              id: Account.id,
+              type: meta.profile.key,
+              properties: {
+                label: ['account.label', { ns: meta.profile.key }],
+                icon: 'ph--user--regular',
+                disposition: 'user-account',
+                testId: 'clientPlugin.account',
+                // NOTE: This currently needs to be the identity key because the fallback is generated from hex.
+                userId: identity?.identityKey.toHex(),
+                hue: identity?.profile?.data?.hue,
+                emoji: identity?.profile?.data?.emoji,
+                status: status.swarm === ConnectionState.OFFLINE ? 'error' : 'active',
+              },
+              nodes: [
+                Node.make({
+                  id: Account.Profile,
+                  data: Account.Profile,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['profile.label', { ns: meta.profile.key }],
+                    icon: 'ph--user--regular',
+                  },
+                }),
+                Node.make({
+                  id: Account.Account,
+                  data: Account.Account,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['account-panel.label', { ns: meta.profile.key }],
+                    icon: 'ph--identification-card--regular',
+                  },
+                }),
+                Node.make({
+                  id: Account.Devices,
+                  data: Account.Devices,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['devices.label', { ns: meta.profile.key }],
+                    icon: 'ph--devices--regular',
+                    testId: 'clientPlugin.devices',
+                  },
+                }),
+                Node.make({
+                  id: Account.Security,
+                  data: Account.Security,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['security.label', { ns: meta.profile.key }],
+                    icon: 'ph--key--regular',
+                  },
+                }),
+                Node.make({
+                  id: Account.Invitations,
+                  data: Account.Invitations,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['invitations-panel.label', { ns: meta.profile.key }],
+                    icon: 'ph--ticket--regular',
+                  },
+                }),
+                Node.make({
+                  id: Account.Usage,
+                  data: Account.Usage,
+                  type: meta.profile.key,
+                  properties: {
+                    label: ['usage-panel.label', { ns: meta.profile.key }],
+                    icon: 'ph--chart-bar--regular',
+                  },
+                }),
+              ],
+            }),
+          ];
+        }).pipe(Effect.orDie),
     });
 
     return Capability.contributes(AppCapabilities.AppGraphBuilder, extensions);

package/src/capabilities/layer-specs.ts

@@ -8,8 +8,7 @@ import * as Layer from 'effect/Layer';
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { ClientService } from '@dxos/client';
 import { Credential, LayerSpec } from '@dxos/compute';
-import { Database, Feed } from '@dxos/echo';
-import { createFeedServiceLayer } from '@dxos/echo-client';
+import { Database } from '@dxos/echo';
 import { credentialsLayerFromDatabase } from '@dxos/functions';
 import { invariant } from '@dxos/invariant';
 
@@ -20,8 +19,7 @@ import { ClientCapabilities } from '#types';
 //
 // Contributes the core client/space service layer specs:
 //   - {@link ClientService} (application affinity).
-//   - {@link Database.Service}, {@link Feed.FeedService},
-//     {@link Credential.CredentialsService} (space affinity).
+//   - {@link Database.Service}, {@link Credential.CredentialsService} (space affinity).
 //
 // Specs are declared at module level and resolve the underlying
 // {@link ClientCapabilities.Client} through the Effect layer graph (via
@@ -59,7 +57,7 @@ const DatabaseLayerSpec = LayerSpec.make(
   {
     affinity: 'space',
     requires: [ClientService],
-    provides: [Database.Service, Feed.FeedService],
+    provides: [Database.Service],
   },
   (context) =>
     Layer.unwrapEffect(
@@ -69,7 +67,7 @@ const DatabaseLayerSpec = LayerSpec.make(
         const space = client.spaces.get(context.space);
         invariant(space, `space not found on client: ${context.space}`);
         yield* Effect.promise(() => space.waitUntilReady());
-        return Layer.mergeAll(Database.layer(space.db), createFeedServiceLayer(space.db));
+        return Database.layer(space.db);
       }),
     ),
 );

package/src/commands/account/login/login.ts

@@ -33,8 +33,8 @@ const METHOD_CHOICES = [
 ];
 
 const INPUT_PROMPT: Record<LoginMethod, string> = {
-  email: 'Email address',
-  atproto: 'atproto handle or DID (e.g. alice.bsky.social)',
+  'email': 'Email address',
+  'atproto': 'atproto handle or DID (e.g. alice.bsky.social)',
   'device-invitation': 'Invitation code or URL',
   'recovery-code': 'Recovery code (seed phrase)',
 };

package/src/containers/AccountContainer/AccountContainer.stories.tsx

@@ -0,0 +1,46 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import * as Effect from 'effect/Effect';
+
+import { ProcessManagerPlugin } from '@dxos/app-framework';
+import { withPluginManager } from '@dxos/app-framework/testing';
+import { withLayout, withTheme } from '@dxos/react-ui/testing';
+
+import { initializeIdentity } from '#testing';
+import { translations } from '#translations';
+
+import { ClientPlugin } from '../../ClientPlugin';
+import { AccountContainer } from './AccountContainer';
+
+const meta = {
+  title: 'plugins/plugin-client/containers/AccountContainer',
+  component: AccountContainer,
+  decorators: [
+    withTheme(),
+    withLayout({ layout: 'fullscreen' }),
+    withPluginManager({
+      plugins: [
+        ClientPlugin({
+          onClientInitialized: ({ client }) =>
+            Effect.gen(function* () {
+              yield* initializeIdentity(client);
+            }),
+        }),
+        ProcessManagerPlugin(),
+      ],
+    }),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+    translations,
+  },
+} satisfies Meta<typeof AccountContainer>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};

package/src/containers/AccountContainer/AccountContainer.tsx

@@ -11,13 +11,13 @@ import { Context } from '@dxos/context';
 import { createDidFromIdentityKey } from '@dxos/credentials';
 import { useIdentity } from '@dxos/react-client/halo';
 import { Button, Icon, IconButton, Input, Message, useAsyncEffect, useTranslation } from '@dxos/react-ui';
-import { Settings } from '@dxos/react-ui-form';
+import { Form } from '@dxos/react-ui-form';
 
 import { meta } from '#meta';
 import { ClientCapabilities } from '#types';
 
 import { RESET_DIALOG } from '../../constants';
-import { useHubHttpClient } from '../../state/use-hub-http';
+import { useHubHttpClient } from '../../hooks';
 
 type AccountState = 'loading' | 'present' | 'missing' | 'error';
 
@@ -114,66 +114,70 @@ export const AccountContainer = () => {
   const account = cache.account;
 
   return (
-    <Settings.Viewport>
-      <Settings.Section title={t('account-section.title')} description={t('account-section.description')}>
-        {accountState === 'loading' ? null : accountState === 'missing' ? (
-          <>
-            <Message.Root valence='warning'>
-              <Message.Title icon='ph--warning--duotone'>{t('no-edge-access.title')}</Message.Title>
-              <Message.Content>{t('no-edge-access.description')}</Message.Content>
-            </Message.Root>
-            <Settings.Item title={t('request-access.label')} description={t('request-access.description')}>
-              {requestSubmitted ? (
-                <span className='text-sm text-description'>{t('access-request-submitted.message')}</span>
-              ) : (
-                <form onSubmit={handleRequestAccess} className='flex gap-2 items-center justify-end'>
-                  <Input.Root>
-                    <Input.TextInput
-                      type='email'
-                      required
-                      placeholder={t('access-request-email.placeholder')}
-                      value={requestEmail}
-                      onChange={(event) => setRequestEmail(event.target.value)}
-                      classNames='min-w-64'
-                    />
-                  </Input.Root>
-                  <Button type='submit' density='sm'>
-                    {t('request-access.label')}
+    <Form.Root variant='settings'>
+      <Form.Viewport scroll>
+        <Form.Content>
+          <Form.Section title={t('account-section.title')} description={t('account-section.description')}>
+            {accountState === 'loading' ? null : accountState === 'missing' ? (
+              <>
+                <Message.Root valence='warning'>
+                  <Message.Title icon='ph--warning--duotone'>{t('no-edge-access.title')}</Message.Title>
+                  <Message.Content>{t('no-edge-access.description')}</Message.Content>
+                </Message.Root>
+                <Form.Row label={t('request-access.label')} description={t('request-access.description')}>
+                  {requestSubmitted ? (
+                    <span className='text-sm text-description'>{t('access-request-submitted.message')}</span>
+                  ) : (
+                    <form onSubmit={handleRequestAccess} className='flex gap-2 items-center justify-end'>
+                      <Input.Root>
+                        <Input.TextInput
+                          type='email'
+                          required
+                          placeholder={t('access-request-email.placeholder')}
+                          value={requestEmail}
+                          onChange={(event) => setRequestEmail(event.target.value)}
+                          classNames='min-w-64'
+                        />
+                      </Input.Root>
+                      <Button type='submit' density='sm'>
+                        {t('request-access.label')}
+                      </Button>
+                    </form>
+                  )}
+                </Form.Row>
+              </>
+            ) : accountState === 'error' && !account ? (
+              <Message.Root valence='error'>
+                <Message.Title icon='ph--cloud-x--duotone'>{t('account-offline.title')}</Message.Title>
+                <Message.Content>{t('account-offline.description')}</Message.Content>
+              </Message.Root>
+            ) : account ? (
+              <>
+                <Form.Row label={t('email.label')} description={account.email}>
+                  {account.emailVerified ? (
+                    <Icon icon='ph--check-circle--duotone' size={5} classNames='text-success-text justify-self-end' />
+                  ) : (
+                    <div className='flex flex-col gap-1 items-end'>
+                      <IconButton
+                        icon='ph--paper-plane-tilt--regular'
+                        label={t('resend-verification.label')}
+                        onClick={handleResend}
+                        density='sm'
+                      />
+                      {resendStatus ? <span className='text-xs text-description'>{resendStatus}</span> : null}
+                    </div>
+                  )}
+                </Form.Row>
+                <Form.Row label={t('delete-account.label')} description={t('delete-account.description')}>
+                  <Button variant='destructive' density='sm' onClick={handleDeleteAccount}>
+                    {t('delete-account.label')}
                   </Button>
-                </form>
-              )}
-            </Settings.Item>
-          </>
-        ) : accountState === 'error' && !account ? (
-          <Message.Root valence='error'>
-            <Message.Title icon='ph--cloud-x--duotone'>{t('account-offline.title')}</Message.Title>
-            <Message.Content>{t('account-offline.description')}</Message.Content>
-          </Message.Root>
-        ) : account ? (
-          <>
-            <Settings.Item title={t('email.label')} description={account.email}>
-              {account.emailVerified ? (
-                <Icon icon='ph--check-circle--duotone' size={5} classNames='text-success-text justify-self-end' />
-              ) : (
-                <div className='flex flex-col gap-1 items-end'>
-                  <IconButton
-                    icon='ph--paper-plane-tilt--regular'
-                    label={t('resend-verification.label')}
-                    onClick={handleResend}
-                    density='sm'
-                  />
-                  {resendStatus ? <span className='text-xs text-description'>{resendStatus}</span> : null}
-                </div>
-              )}
-            </Settings.Item>
-            <Settings.Item title={t('delete-account.label')} description={t('delete-account.description')}>
-              <Button variant='destructive' density='sm' onClick={handleDeleteAccount}>
-                {t('delete-account.label')}
-              </Button>
-            </Settings.Item>
-          </>
-        ) : null}
-      </Settings.Section>
-    </Settings.Viewport>
+                </Form.Row>
+              </>
+            ) : null}
+          </Form.Section>
+        </Form.Content>
+      </Form.Viewport>
+    </Form.Root>
   );
 };