@dxos/shell 0.4.10-main.ec8b427 → 0.4.10-main.f68a1ca

package/dist/types/src/steps/index.d.ts

@@ -1,3 +1,4 @@
 export * from './InvitationManager';
 export * from './StepProps';
+export * from './ConfirmReset';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/steps/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/steps/index.ts"],"names":[],"mappings":"AAIA,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/steps/index.ts"],"names":[],"mappings":"AAIA,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC"}

package/dist/types/src/steps/index.js

@@ -19,4 +19,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./InvitationManager"), exports);
 __exportStar(require("./StepProps"), exports);
+__exportStar(require("./ConfirmReset"), exports);
 //# sourceMappingURL=index.js.map

package/dist/types/src/steps/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/steps/index.ts"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;;;;;;;;;;;;;;;;AAEF,sDAAoC;AACpC,8CAA4B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/steps/index.ts"],"names":[],"mappings":";AAAA,EAAE;AACF,0BAA0B;AAC1B,EAAE;;;;;;;;;;;;;;;;AAEF,sDAAoC;AACpC,8CAA4B;AAC5B,iDAA+B"}

package/dist/types/src/translations/locales/en-US.d.ts

@@ -70,6 +70,7 @@ export declare const os: {
     'choose devices label': string;
     'choose profile label': string;
     'choose sign out label': string;
+    'choose join new identity label': string;
     'empty space members message': string;
     'back to all invitations label': string;
     'invitation heading': string;
@@ -93,7 +94,8 @@ export declare const os: {
     'invite options label': string;
     'reset in progress label': string;
     'confirm label': string;
-    'reset identity input label': string;
+    'reset storage input label': string;
+    'join new identity input label': string;
     'failed to reset identity message': string;
     'confirmation value': string;
     'sign out chooser title': string;
@@ -105,6 +107,7 @@ export declare const os: {
     'clear label': string;
     'select emoji label': string;
     'select hue label': string;
+    'resetting message': string;
     'red label': string;
     'orange label': string;
     'amber label': string;

package/dist/types/src/translations/locales/en-US.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"en-US.d.ts","sourceRoot":"","sources":["../../../../../src/translations/locales/en-US.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Hd,CAAC"}
+{"version":3,"file":"en-US.d.ts","sourceRoot":"","sources":["../../../../../src/translations/locales/en-US.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiId,CAAC"}

package/dist/types/src/translations/locales/en-US.js

@@ -75,7 +75,8 @@ exports.os = {
     'choose add device label': 'Add device',
     'choose devices label': 'Manage devices',
     'choose profile label': 'Edit profile',
-    'choose sign out label': 'Sign out',
+    'choose sign out label': 'Reset storage',
+    'choose join new identity label': 'Join existing device',
     'empty space members message': 'There is nobody in this space yet.',
     'back to all invitations label': 'Back to all invitations',
     'invitation heading': 'Invitation',
@@ -99,18 +100,20 @@ exports.os = {
     'invite options label': 'Change the active invite option.',
     'reset in progress label': 'Resetting...',
     'confirm label': 'Confirm',
-    'reset identity input label': 'This will clear this device and all associated data. Type {{confirmationValue}} and confirm to continue.',
+    'reset storage input label': 'This will clear this device and all associated data. Type {{confirmationValue}} and confirm to continue.',
+    'join new identity input label': 'In order to join an existing device, storage on this device must be cleared first. Type {{confirmationValue}} to continue.',
     'failed to reset identity message': 'Failed to reset identity.',
     'confirmation value': 'CONFIRM',
-    'sign out chooser title': 'DANGER ZONE',
-    'sign out chooser message': 'Proceeding with either action below will erase all data on this device.',
+    'sign out chooser title': 'Danger zone',
+    'sign out chooser message': 'Proceeding with the action below will erase all data on this device.',
     'join new identity label': 'Join a new identity',
-    'reset device label': 'Reset device',
+    'reset device label': 'Reset storage',
     'reset device confirm message': 'Are you sure you want to reset your device? All data will be lost.',
     'emoji and color label': 'Emoji and color',
     'clear label': 'Use default',
     'select emoji label': 'Choose an emoji to use in your avatar',
     'select hue label': 'Choose a hue to use in your avatar',
+    'resetting message': 'One moment while things are reset…',
     'red label': 'Red',
     'orange label': 'Orange',
     'amber label': 'Amber',

package/dist/types/src/translations/locales/en-US.js.map

@@ -1 +1 @@
-{"version":3,"file":"en-US.js","sourceRoot":"","sources":["../../../../../src/translations/locales/en-US.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"en-US.js","sourceRoot":"","sources":["../../../../../src/translations/locales/en-US.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/shell",
-  "version": "0.4.10-main.ec8b427",
+  "version": "0.4.10-main.f68a1ca",
   "description": "DXOS’s OS experiences",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -42,19 +42,19 @@
     "react-qr-rounded": "^1.0.0",
     "url-join": "^5.0.0",
     "xstate": "^4.37.0",
-    "@dxos/async": "0.4.10-main.ec8b427",
-    "@dxos/client-protocol": "0.4.10-main.ec8b427",
-    "@dxos/debug": "0.4.10-main.ec8b427",
-    "@dxos/client-services": "0.4.10-main.ec8b427",
-    "@dxos/display-name": "0.4.10-main.ec8b427",
-    "@dxos/invariant": "0.4.10-main.ec8b427",
-    "@dxos/log": "0.4.10-main.ec8b427",
-    "@dxos/react-client": "0.4.10-main.ec8b427",
-    "@dxos/react-ui": "0.4.10-main.ec8b427",
-    "@dxos/react-ui-types": "0.4.10-main.ec8b427",
-    "@dxos/react-ui-theme": "0.4.10-main.ec8b427",
-    "@dxos/rpc-tunnel": "0.4.10-main.ec8b427",
-    "@dxos/util": "0.4.10-main.ec8b427"
+    "@dxos/async": "0.4.10-main.f68a1ca",
+    "@dxos/client-services": "0.4.10-main.f68a1ca",
+    "@dxos/client-protocol": "0.4.10-main.f68a1ca",
+    "@dxos/debug": "0.4.10-main.f68a1ca",
+    "@dxos/display-name": "0.4.10-main.f68a1ca",
+    "@dxos/invariant": "0.4.10-main.f68a1ca",
+    "@dxos/react-client": "0.4.10-main.f68a1ca",
+    "@dxos/react-ui-theme": "0.4.10-main.f68a1ca",
+    "@dxos/log": "0.4.10-main.f68a1ca",
+    "@dxos/react-ui": "0.4.10-main.f68a1ca",
+    "@dxos/rpc-tunnel": "0.4.10-main.f68a1ca",
+    "@dxos/util": "0.4.10-main.f68a1ca",
+    "@dxos/react-ui-types": "0.4.10-main.f68a1ca"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.0.5",
@@ -65,11 +65,11 @@
     "react-dom": "^18.2.0",
     "vite": "^5.1.5",
     "vite-plugin-turbosnap": "^1.0.2",
-    "@dxos/config": "0.4.10-main.ec8b427",
-    "@dxos/react-ui-theme": "0.4.10-main.ec8b427",
-    "@dxos/react-async": "0.4.10-main.ec8b427",
-    "@dxos/storybook-utils": "0.4.10-main.ec8b427",
-    "@dxos/random": "0.4.10-main.ec8b427"
+    "@dxos/config": "0.4.10-main.f68a1ca",
+    "@dxos/random": "0.4.10-main.f68a1ca",
+    "@dxos/storybook-utils": "0.4.10-main.f68a1ca",
+    "@dxos/react-async": "0.4.10-main.f68a1ca",
+    "@dxos/react-ui-theme": "0.4.10-main.f68a1ca"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.0.5",

package/src/components/EmojiPicker.tsx

@@ -7,7 +7,7 @@ import { ArrowCounterClockwise, CaretDown } from '@phosphor-icons/react';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import React, { type Dispatch, type SetStateAction, useState } from 'react';
 
-import { Button, Popover, useTranslation, Tooltip, type ButtonProps } from '@dxos/react-ui';
+import { Button, Popover, useTranslation, Tooltip, type ButtonProps, useMediaQuery } from '@dxos/react-ui';
 import { getSize } from '@dxos/react-ui-theme';
 
 export type EmojiPickerProps = {
@@ -20,6 +20,7 @@ export type EmojiPickerProps = {
 
 export const EmojiPicker = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onClickClear }: EmojiPickerProps) => {
   const { t } = useTranslation('os');
+  const [isMd] = useMediaQuery('md', { ssr: false });
 
   const [emojiValue, setEmojiValue] = useControllableState<string>({
     prop: emoji,
@@ -41,6 +42,7 @@ export const EmojiPicker = ({ disabled, defaultEmoji, emoji, onChangeEmoji, onCl
         </Popover.Trigger>
         <Popover.Content
           side='right'
+          sideOffset={isMd ? 0 : -310}
           onKeyDownCapture={(event) => {
             if (event.key === 'Escape') {
               event.stopPropagation();

package/src/composites/IdentityDialog/IdentityDialog.tsx

@@ -16,7 +16,7 @@ export interface IdentityDialogProps
 }
 
 export const IdentityDialog = (props: IdentityDialogProps) => {
-  const titleId = useId('spaceDialog__title');
+  const titleId = useId('identityDialog__title', props.title);
   return (
     <Dialog.Root defaultOpen onOpenChange={(open) => open || props.onDone?.()}>
       <Dialog.Portal>

package/src/composites/Shell/Shell.tsx

@@ -11,6 +11,7 @@ import { useSpace } from '@dxos/react-client/echo';
 import { IdentityDialog } from '../IdentityDialog';
 import { JoinDialog } from '../JoinDialog';
 import { SpaceDialog } from '../SpaceDialog';
+import { StatusDialog } from '../StatusDialog';
 
 export const Shell = ({ runtime, origin }: { runtime: ShellRuntime; origin: string }) => {
   const [{ layout, invitationCode, spaceKey, target }, setLayout] = useState<LayoutRequest>({
@@ -41,11 +42,18 @@ export const Shell = ({ runtime, origin }: { runtime: ShellRuntime; origin: stri
   }, [runtime, layout, space]);
 
   switch (layout) {
+    case ShellLayout.STATUS:
+      return <StatusDialog />;
     case ShellLayout.INITIALIZE_IDENTITY:
+    case ShellLayout.INITIALIZE_IDENTITY_FROM_INVITATION:
       return (
         <JoinDialog
           mode='halo-only'
+          initialDisposition={
+            layout === ShellLayout.INITIALIZE_IDENTITY_FROM_INVITATION ? 'accept-halo-invitation' : 'default'
+          }
           initialInvitationCode={invitationCode}
+          onCancelResetStorage={() => runtime.setLayout({ layout: ShellLayout.IDENTITY })}
           onDone={() => {
             void runtime.setAppContext({ display: ShellDisplay.NONE });
             runtime.setLayout({ layout: ShellLayout.DEFAULT });
@@ -53,22 +61,33 @@ export const Shell = ({ runtime, origin }: { runtime: ShellRuntime; origin: stri
         />
       );
 
-    // TODO(wittjosiah): Jump straight to specific step if SHARE or EDIT are specified.
     case ShellLayout.IDENTITY:
     case ShellLayout.SHARE_IDENTITY:
     case ShellLayout.EDIT_PROFILE:
       return (
         <IdentityDialog
           createInvitationUrl={(invitationCode) => `${origin}?deviceInvitationCode=${invitationCode}`}
-          onResetDevice={async () => {
+          onResetStorage={async () => {
+            runtime.setLayout({ layout: ShellLayout.STATUS });
             await client.reset();
-            await runtime.setAppContext({ display: ShellDisplay.NONE, reload: true });
+            return runtime.setAppContext({ display: ShellDisplay.NONE, reload: true });
+          }}
+          onJoinNewIdentity={async () => {
+            runtime.setLayout({ layout: ShellLayout.STATUS });
+            await client.reset();
+            return runtime.setLayout({ layout: ShellLayout.INITIALIZE_IDENTITY_FROM_INVITATION });
           }}
-          onJoinNewIdentity={() => runtime.setLayout({ layout: ShellLayout.INITIALIZE_IDENTITY })}
           onDone={async () => {
             await runtime.setAppContext({ display: ShellDisplay.NONE });
             runtime.setLayout({ layout: ShellLayout.DEFAULT });
           }}
+          initialDisposition={
+            layout === ShellLayout.SHARE_IDENTITY
+              ? 'manage-device-invitation'
+              : layout === ShellLayout.EDIT_PROFILE
+                ? 'manage-profile'
+                : 'default'
+          }
         />
       );
 

package/src/composites/StatusDialog/StatusDialog.tsx

@@ -0,0 +1,24 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import React from 'react';
+
+import { AlertDialog, useId } from '@dxos/react-ui';
+
+import { StatusPanel } from '../../panels';
+
+export const StatusDialog = () => {
+  const titleId = useId('statusDialog__title');
+  return (
+    <AlertDialog.Root open>
+      <AlertDialog.Portal>
+        <AlertDialog.Overlay>
+          <AlertDialog.Content aria-labelledby={titleId}>
+            <StatusPanel titleId={titleId} />
+          </AlertDialog.Content>
+        </AlertDialog.Overlay>
+      </AlertDialog.Portal>
+    </AlertDialog.Root>
+  );
+};

package/src/composites/StatusDialog/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+export * from './StatusDialog';

package/src/panels/IdentityPanel/IdentityPanel.tsx

@@ -18,10 +18,10 @@ import {
   type IdentityPanelProps,
 } from './IdentityPanelProps';
 import { useIdentityMachine } from './identityMachine';
-import { AgentForm, DeviceManager, IdentityActionChooser, ProfileForm, SignOutChooser } from './steps';
+import { AgentForm, DeviceManager, IdentityActionChooser, ProfileForm } from './steps';
 import { useAgentHandlers } from './useAgentHandlers';
 import { Viewport, Heading, CloseButton } from '../../components';
-import { InvitationManager } from '../../steps';
+import { ConfirmReset, InvitationManager } from '../../steps';
 
 const viewStyles = 'pbs-1 pbe-3 pli-3';
 
@@ -47,7 +47,7 @@ export const IdentityPanelImpl = (props: IdentityPanelImplProps) => {
     titleId,
     activeView,
     onUpdateProfile,
-    onResetDevice,
+    onResetStorage,
     onJoinNewIdentity,
     IdentityActionChooser: IdentityActionChooserComponent = IdentityActionChooser,
     InvitationManager: InvitationManagerComponent = InvitationManager,
@@ -66,6 +66,8 @@ export const IdentityPanelImpl = (props: IdentityPanelImplProps) => {
     }
   }, [activeView, t]);
 
+  const onCancelReset = () => rest.send?.('unchooseAction');
+
   return (
     <DensityProvider density='fine'>
       <IdentityHeading {...{ identity, titleId, title, onDone }} />
@@ -92,17 +94,27 @@ export const IdentityPanelImpl = (props: IdentityPanelImplProps) => {
               onUpdateProfile={onUpdateProfile}
             />
           </Viewport.View>
-          <Viewport.View classNames={viewStyles} id='signing out'>
-            <SignOutChooser
-              send={rest.send}
-              active={activeView === 'signing out'}
-              onResetDevice={onResetDevice}
-              onJoinNewIdentity={onJoinNewIdentity}
-            />
-          </Viewport.View>
           <Viewport.View classNames={viewStyles} id='agent manager'>
             <AgentForm send={rest.send} active={activeView === 'agent manager'} {...rest} />
           </Viewport.View>
+          <Viewport.View classNames={viewStyles} id='confirm join new identity'>
+            <ConfirmReset
+              active={activeView === 'confirm join new identity'}
+              {...rest}
+              mode='join new identity'
+              onConfirm={onJoinNewIdentity}
+              onCancel={onCancelReset}
+            />
+          </Viewport.View>
+          <Viewport.View classNames={viewStyles} id='confirm reset storage'>
+            <ConfirmReset
+              active={activeView === 'confirm reset storage'}
+              {...rest}
+              mode='reset storage'
+              onConfirm={onResetStorage}
+              onCancel={onCancelReset}
+            />
+          </Viewport.View>
         </Viewport.Views>
       </Viewport.Root>
     </DensityProvider>
@@ -120,6 +132,7 @@ const IdentityPanelWithInvitationImpl = ({
 export const IdentityPanel = ({
   titleId: propsTitleId,
   createInvitationUrl = (code) => code,
+  initialDisposition = 'default',
   ...props
 }: IdentityPanelProps) => {
   const titleId = useId('identityPanel__heading', propsTitleId);
@@ -132,7 +145,9 @@ export const IdentityPanel = ({
     log.error('IdentityPanel rendered with no active identity.');
     return null;
   }
-  const [identityState, identitySend, identityService] = useIdentityMachine(client);
+  const [identityState, identitySend, identityService] = useIdentityMachine(client, {
+    context: { initialDisposition },
+  });
 
   useEffect(() => {
     const subscription = identityService.subscribe((state) => {
@@ -152,8 +167,10 @@ export const IdentityPanel = ({
         return 'device manager';
       case [{ managingProfile: 'idle' }, { managingProfile: 'pending' }].some(identityState.matches):
         return 'update profile form';
-      case identityState.matches('signingOut'):
-        return 'signing out';
+      case identityState.matches('confirmingResetStorage'):
+        return 'confirm reset storage';
+      case identityState.matches('confirmingJoinNewIdentity'):
+        return 'confirm join new identity';
       case [{ managingAgent: 'idle' }, { managingAgent: 'pending' }].some(identityState.matches):
         return 'agent manager';
       default:

package/src/panels/IdentityPanel/IdentityPanelProps.ts

@@ -11,6 +11,8 @@ import type { InvitationStatus } from '@dxos/react-client/invitations';
 import type { IdentityEvent } from './identityMachine';
 import type { InvitationManagerProps } from '../../steps';
 
+export type IdentityPanelInitialDisposition = 'default' | 'manage-device-invitation' | 'manage-profile';
+
 export type AgentFormProps = {
   onAgentCreate?: () => Promise<void>;
   onAgentDestroy?: () => Promise<void>;
@@ -28,12 +30,14 @@ export type IdentityPanelImplProps = {
     | 'update profile form'
     | 'device invitation manager'
     | 'identity action chooser'
-    | 'signing out';
+    | 'confirm join new identity'
+    | 'confirm reset storage';
+  initialDisposition?: IdentityPanelInitialDisposition;
   identity: Identity;
   devices: Device[];
   onUpdateProfile?: (profile: NonNullable<Identity['profile']>) => Promise<void>;
-  onResetDevice?: () => Promise<void>;
-  onJoinNewIdentity?: () => void;
+  onResetStorage?: () => Promise<void>;
+  onJoinNewIdentity?: () => Promise<void>;
   createInvitationUrl: (invitationCode: string) => string;
   send?: (event: SingleOrArray<Event<IdentityEvent>>) => void;
   onDone?: () => void;

package/src/panels/IdentityPanel/identityMachine.ts

@@ -10,16 +10,24 @@ import { type Client } from '@dxos/react-client';
 import { type Identity } from '@dxos/react-client/halo';
 import { type CancellableInvitationObservable } from '@dxos/react-client/invitations';
 
+import { type IdentityPanelInitialDisposition } from './IdentityPanelProps';
 import { type StepEvent } from '../../steps';
 
 type IdentityMachineContext = {
+  initialDisposition?: IdentityPanelInitialDisposition;
   invitation?: CancellableInvitationObservable;
   identity: Identity | null;
   identitySubscribable: Subscribable<SetIdentityEvent> | null;
 };
 
 type IdentityChooseActionEvent = {
-  type: 'chooseDevices' | 'chooseAgent' | 'chooseProfile' | 'chooseSignOut' | 'sigingOut' | 'unchooseAction';
+  type:
+    | 'chooseDevices'
+    | 'chooseAgent'
+    | 'chooseProfile'
+    | 'chooseResetStorage'
+    | 'chooseJoinNewIdentity'
+    | 'unchooseAction';
 };
 
 type IdentitySelectDeviceInvitationEvent = {
@@ -56,6 +64,13 @@ const identityMachine = createMachine<IdentityMachineContext, IdentityEvent>(
       src: (context) => context.identitySubscribable!,
     },
     states: {
+      unknown: {
+        always: [
+          { cond: 'initiallyManagingDeviceInvitation', target: 'managingDeviceInvitation', actions: 'log' },
+          { cond: 'initiallyManagingProfile', target: 'managingProfile', actions: 'log' },
+          { target: 'choosingAction', actions: 'log' },
+        ],
+      },
       choosingAction: {},
       managingDeviceInvitation: {},
       managingAgent: {
@@ -77,7 +92,8 @@ const identityMachine = createMachine<IdentityMachineContext, IdentityEvent>(
           updateProfile: { target: '.pending', actions: 'log' },
         },
       },
-      signingOut: {},
+      confirmingResetStorage: {},
+      confirmingJoinNewIdentity: {},
     },
     on: {
       unchooseAction: { target: '.choosingAction', actions: ['unsetInvitation', 'log'] },
@@ -85,11 +101,17 @@ const identityMachine = createMachine<IdentityMachineContext, IdentityEvent>(
       selectInvitation: { target: '.managingDeviceInvitation', actions: ['setInvitation', 'log'] },
       chooseDevices: { target: '.managingDevices', actions: 'log' },
       chooseProfile: { target: '.managingProfile', actions: 'log' },
-      chooseSignOut: { target: '.signingOut', actions: 'log' },
+      chooseJoinNewIdentity: { target: '.confirmingJoinNewIdentity', actions: 'log' },
+      chooseResetStorage: { target: '.confirmingResetStorage', actions: 'log' },
       chooseAgent: { target: '.managingAgent', actions: 'log' },
     },
   },
   {
+    guards: {
+      initiallyManagingDeviceInvitation: ({ initialDisposition }, _event) =>
+        initialDisposition === 'manage-device-invitation',
+      initiallyManagingProfile: ({ initialDisposition }, _event) => initialDisposition === 'manage-profile',
+    },
     actions: {
       setIdentity: assign<IdentityMachineContext, IdentityEvent>({
         identity: (context, event) => (event as SetIdentityEvent)?.identity ?? null,

package/src/panels/IdentityPanel/steps/IdentityActionChooser.tsx

@@ -2,7 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-import { CaretRight, Devices, Plus, Power, UserGear, HardDrive } from '@phosphor-icons/react';
+import { CaretRight, Devices, Plus, Power, UserGear, HardDrive, Intersect } from '@phosphor-icons/react';
 import React, { useCallback } from 'react';
 
 import { log } from '@dxos/log';
@@ -73,6 +73,11 @@ export const IdentityActionChooserImpl = ({
     <div role='none' className='grow flex flex-col gap-1'>
       <DensityProvider density='coarse'>
         <div className='grow justify-center flex flex-col gap-1'>
+          <Action data-testid='manage-profile' onClick={() => send?.({ type: 'chooseProfile' })} classNames='plb-4'>
+            <UserGear className={getSize(6)} />
+            <span className='grow mli-3'>{t('choose profile label')}</span>
+            <CaretRight weight='bold' className={getSize(4)} />
+          </Action>
           {agentHostingEnabled && (
             <Action data-testid='manage-agent' onClick={() => send?.({ type: 'chooseAgent' })} classNames='plb-4'>
               <HardDrive className={getSize(6)} />
@@ -90,19 +95,23 @@ export const IdentityActionChooserImpl = ({
             <span className='grow mli-3'>{t('choose add device label')}</span>
             <CaretRight weight='bold' className={getSize(4)} />
           </Action>
+          <Action
+            data-testid='devices-panel.join-new-identity'
+            onClick={() => send?.({ type: 'chooseJoinNewIdentity' })}
+            classNames='plb-4'
+          >
+            <Intersect className={getSize(6)} />
+            <span className='grow mli-3'>{t('choose join new identity label')}</span>
+            <CaretRight weight='bold' className={getSize(4)} />
+          </Action>
           <Action data-testid='manage-devices' onClick={() => send?.({ type: 'chooseDevices' })} classNames='plb-4'>
             <Devices className={getSize(6)} />
             <span className='grow mli-3'>{t('choose devices label')}</span>
             <CaretRight weight='bold' className={getSize(4)} />
           </Action>
-          <Action data-testid='manage-profile' onClick={() => send?.({ type: 'chooseProfile' })} classNames='plb-4'>
-            <UserGear className={getSize(6)} />
-            <span className='grow mli-3'>{t('choose profile label')}</span>
-            <CaretRight weight='bold' className={getSize(4)} />
-          </Action>
           <Action
             data-testid='devices-panel.sign-out'
-            onClick={() => send?.({ type: 'chooseSignOut' })}
+            onClick={() => send?.({ type: 'chooseResetStorage' })}
             classNames='plb-4'
           >
             <Power className={getSize(6)} />

package/src/panels/IdentityPanel/steps/ProfileForm.tsx

@@ -106,7 +106,12 @@ const ProfileFormImpl = (props: ProfileFormImplProps) => {
         <Action
           variant='primary'
           disabled={disabled}
-          onClick={() => onUpdateProfile?.({ displayName, data: { emoji, hue } })}
+          onClick={() =>
+            onUpdateProfile?.({
+              ...(displayName && { displayName }),
+              ...((emoji || hue) && { data: { ...(emoji && { emoji }), ...(hue && { hue }) } }),
+            })
+          }
           data-testid='update-profile-form-continue'
         >
           {t('done label')}

package/src/panels/IdentityPanel/steps/index.ts

@@ -6,4 +6,3 @@ export * from './AgentForm';
 export * from './DeviceManager';
 export * from './IdentityActionChooser';
 export * from './ProfileForm';
-export * from './SignOutChooser';

package/src/panels/JoinPanel/JoinPanel.stories.tsx

@@ -10,8 +10,9 @@ import { withTheme } from '@dxos/storybook-utils';
 
 import { JoinPanelImpl } from './JoinPanel';
 import { type JoinPanelImplProps } from './JoinPanelProps';
-import { IdentityInputImpl, ResetIdentityImpl } from './steps';
+import { IdentityInputImpl } from './steps';
 import { StorybookDialog } from '../../components/StorybookDialog';
+import { ConfirmResetImpl } from '../../steps';
 
 const noOpProps: JoinPanelImplProps = {
   titleId: 'storybookJoinPanel__title',
@@ -34,7 +35,7 @@ export default {
   parameters: { chromatic: { disableSnapshot: false } },
   args: {
     IdentityInput: IdentityInputImpl,
-    ResetIdentity: ResetIdentityImpl,
+    ResetIdentity: ConfirmResetImpl,
   },
 };