@dxos/shell 0.4.10-main.fa5a270 → 0.4.10-main.fe71b4c

package/src/components/IdentityList/DeviceList.tsx

@@ -1,49 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React from 'react';
-
-import { generateName } from '@dxos/display-name';
-import { type Device, DeviceType } from '@dxos/react-client/halo';
-import { List, useTranslation } from '@dxos/react-ui';
-import { descriptionText, mx } from '@dxos/react-ui-theme';
-
-import { IdentityListItem } from './IdentityListItem';
-
-export interface DeviceListProps {
-  devices: Device[];
-  onSelect?: (device: Device) => void;
-}
-
-export const DeviceList = ({ devices, onSelect }: DeviceListProps) => {
-  const { t } = useTranslation('os');
-  return devices.length > 0 ? (
-    <List classNames='flex flex-col gap-2'>
-      {devices.map((device) => {
-        // TODO(wittjosiah): Render this better. Consider communicating these as apps rather than devices.
-        const deviceType = device.profile?.type || DeviceType.UNKNOWN;
-        const displayName = device.profile?.label
-          ? `${device.profile.label} (${DeviceType[deviceType]})`
-          : generateName(device.deviceKey.toHex());
-
-        const identity = {
-          identityKey: device.deviceKey,
-          profile: { displayName },
-        };
-        return (
-          <IdentityListItem
-            key={device.deviceKey.toHex()}
-            identity={identity}
-            presence={device.presence}
-            onClick={onSelect && (() => onSelect(device))}
-          />
-        );
-      })}
-    </List>
-  ) : (
-    <div role='none' className='grow flex items-center p-2'>
-      <p className={mx(descriptionText, 'text-center is-full')}>{t('empty device list message')}</p>
-    </div>
-  );
-};

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

@@ -1,61 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React from 'react';
-
-import { useTranslation } from '@dxos/react-ui';
-
-import { Action, Actions, StepHeading, Input } from '../../../components';
-import { type AgentFormProps, type IdentityPanelStepProps } from '../IdentityPanelProps';
-
-export const AgentForm = (props: IdentityPanelStepProps & AgentFormProps) => {
-  const {
-    active,
-    onAgentCreate,
-    onAgentDestroy,
-    send,
-    validationMessage,
-    agentStatus,
-    agentActive,
-    agentProviderDisabled,
-  } = props;
-  const disabled = !active;
-  const { t } = useTranslation('os');
-  return (
-    <>
-      <div role='none' className='grow flex flex-col justify-center'>
-        <Input
-          {...{ validationMessage }}
-          label={<StepHeading>Agent Status</StepHeading>}
-          disabled={disabled}
-          data-testid='agent-status'
-          value={agentStatus}
-        />
-      </div>
-      <Actions>
-        <Action
-          disabled={agentActive || agentProviderDisabled}
-          onClick={() => onAgentCreate?.()}
-          data-testid={'create-agent'}
-        >
-          Create Agent
-        </Action>
-        <Action
-          disabled={!agentActive || agentProviderDisabled}
-          onClick={() => onAgentDestroy?.()}
-          data-testid={'destroy-agent'}
-        >
-          Destroy Agent
-        </Action>
-        <Action
-          disabled={disabled}
-          onClick={() => send?.({ type: 'unchooseAction' })}
-          data-testid={'update-profile-form-back'}
-        >
-          {t('back label')}
-        </Action>
-      </Actions>
-    </>
-  );
-};

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

@@ -1,41 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React from 'react';
-import { type Event, type SingleOrArray } from 'xstate';
-
-import { type Device } from '@dxos/react-client/halo';
-import { useTranslation } from '@dxos/react-ui';
-
-import { Action, Actions, DeviceList } from '../../../components';
-import type { IdentityPanelStepProps } from '../IdentityPanelProps';
-import type { IdentityEvent } from '../identityMachine';
-
-export interface DeviceManagerProps extends Omit<IdentityPanelStepProps, 'send'> {
-  send?: (event: SingleOrArray<Event<IdentityEvent>>) => void;
-  devices: Device[];
-}
-
-export const DeviceManager = ({ devices, active, send }: DeviceManagerProps) => {
-  const { t } = useTranslation('os');
-  const disabled = !active;
-
-  return (
-    <>
-      <div role='none' className='grow'>
-        <DeviceList devices={devices} />
-      </div>
-      <Actions>
-        <Action
-          variant='ghost'
-          disabled={disabled}
-          onClick={() => send?.({ type: 'unchooseAction' })}
-          data-testid={'manage-devices-back'}
-        >
-          {t('back label')}
-        </Action>
-      </Actions>
-    </>
-  );
-};

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

@@ -1,84 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { Warning } from '@phosphor-icons/react';
-import React from 'react';
-import { type Event, type SingleOrArray } from 'xstate';
-
-import { Message, useTranslation } from '@dxos/react-ui';
-import { getSize, mx } from '@dxos/react-ui-theme';
-
-import { Action, Actions } from '../../../components';
-import { type IdentityPanelStepProps } from '../IdentityPanelProps';
-import { type IdentityEvent } from '../identityMachine';
-
-export interface SignOutChooserProps extends Omit<IdentityPanelStepProps, 'send'> {
-  send?: (event: SingleOrArray<Event<IdentityEvent>>) => void;
-  onResetDevice?: () => Promise<void>;
-  onJoinNewIdentity?: () => void;
-}
-
-export const SignOutChooser = (props: SignOutChooserProps) => {
-  const { t } = useTranslation('os');
-  const onResetDevice = () => {
-    if (window.confirm(t('reset device confirm message'))) {
-      void props.onResetDevice?.();
-    }
-  };
-  return (
-    <SignOutChooserImpl
-      disabled={!props.active}
-      onBack={() => props.send?.({ type: 'unchooseAction' })}
-      onResetDevice={onResetDevice}
-      onJoinNewIdentity={props.onJoinNewIdentity}
-    />
-  );
-};
-
-export type SignOutChooserImplProps = {
-  disabled?: boolean;
-  onResetDevice?: () => void;
-  onJoinNewIdentity?: () => void;
-  onBack?: () => void;
-};
-
-const SignOutChooserImpl = ({ disabled, onResetDevice, onJoinNewIdentity, onBack }: SignOutChooserImplProps) => {
-  const { t } = useTranslation('os');
-  return (
-    <>
-      <div role='none' className='grow flex flex-col justify-center'>
-        <Message.Root valence='error'>
-          <Message.Title>
-            <Warning className={mx(getSize(6), 'inline mie-2')} />
-            {t('sign out chooser title')}
-          </Message.Title>
-          <Message.Body>{t('sign out chooser message')}</Message.Body>
-        </Message.Root>
-      </div>
-      <Actions>
-        <Action disabled={disabled} onClick={onBack}>
-          {t('back label')}
-        </Action>
-        <Action
-          variant='primary'
-          data-testid='sign-out.join-new-identity'
-          classNames='!bg-error-500 hover:!bg-error-550'
-          disabled={disabled}
-          onClick={onJoinNewIdentity}
-        >
-          {t('join new identity label')}
-        </Action>
-        <Action
-          variant='primary'
-          data-testid='sign-out.reset-device'
-          classNames='!bg-error-500 hover:!bg-error-550'
-          disabled={disabled}
-          onClick={onResetDevice}
-        >
-          {t('reset device label')}
-        </Action>
-      </Actions>
-    </>
-  );
-};

package/src/panels/JoinPanel/steps/ResetIdentity.tsx

@@ -1,80 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { useState } from 'react';
-
-import { log } from '@dxos/log';
-import { useClient } from '@dxos/react-client';
-import { useTranslation } from '@dxos/react-ui';
-
-import { Action, Actions, StepHeading, Input } from '../../../components';
-import { type JoinStepProps } from '../JoinPanelProps';
-
-export type ResetIdentityProps = JoinStepProps & {
-  method: 'reset identity';
-};
-
-export type ResetIdentityImplProps = {
-  disabled?: boolean;
-  pending?: boolean;
-  validationMessage?: string;
-  onConfirm?: () => void;
-};
-
-export const ResetIdentity = ({ send, active }: ResetIdentityProps) => {
-  const client = useClient();
-  const { t } = useTranslation('os');
-  const [validationMessage, setValidationMessage] = useState('');
-  const [pending, setPending] = useState(false);
-  const resetIdentity = () => {
-    setPending(true);
-    void client.reset().then(
-      () => send?.({ type: 'resetIdentity' }),
-      (error) => {
-        log.catch(error);
-        setValidationMessage(t('failed to reset identity message'));
-        setPending(false);
-      },
-    );
-  };
-  return (
-    <ResetIdentityImpl
-      disabled={!active}
-      pending={pending}
-      validationMessage={validationMessage}
-      onConfirm={() => resetIdentity()}
-    />
-  );
-};
-
-export const ResetIdentityImpl = ({ disabled, pending, validationMessage, onConfirm }: ResetIdentityImplProps) => {
-  const { t } = useTranslation('os');
-  const confirmationValue = t('confirmation value');
-  const [inputValue, setInputValue] = useState('');
-  return (
-    <>
-      <div role='none' className='grow flex flex-col justify-center'>
-        <Input
-          {...{ validationMessage }}
-          label={<StepHeading>{t('reset identity input label', { confirmationValue })}</StepHeading>}
-          disabled={disabled}
-          data-testid='reset-identity-input'
-          placeholder={confirmationValue}
-          onChange={({ target: { value } }) => setInputValue(value)}
-        />
-      </div>
-      <Actions>
-        <Action
-          // TODO(wittjosiah): Probably make this red?
-          variant='primary'
-          disabled={disabled || pending || inputValue !== confirmationValue}
-          onClick={() => onConfirm?.()}
-          data-testid='reset-identity-input-confirm'
-        >
-          {pending ? t('reset in progress label') : t('confirm label')}
-        </Action>
-      </Actions>
-    </>
-  );
-};