@dxos/plugin-client 0.8.1-staging.391c573 → 0.8.1-staging.9eaf14f

package/src/components/ManageCredentialsDialog.tsx

@@ -1,64 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Receipt, Key } from '@phosphor-icons/react';
-import React, { useMemo } from 'react';
-
-import { createIntent, useIntentDispatcher } from '@dxos/app-framework';
-import { useCredentials } from '@dxos/react-client/halo';
-import { Dialog, Icon, List, ListItem, useTranslation } from '@dxos/react-ui';
-import { BifurcatedAction, type ActionMenuItem } from '@dxos/shell/react';
-
-import { CLIENT_PLUGIN } from '../meta';
-import { ClientAction } from '../types';
-
-export const MANAGE_CREDENTIALS_DIALOG = `${CLIENT_PLUGIN}/ManageCredentialsDialog`;
-
-// TODO(wittjosiah): Factor panel out to @dxos/shell.
-export const ManageCredentialsDialog = () => {
-  const { t } = useTranslation(CLIENT_PLUGIN);
-  const { dispatchPromise: dispatch } = useIntentDispatcher();
-  const credentials = useCredentials();
-  const recoveryCredentials = credentials.filter(
-    (credential) => credential.subject.assertion['@type'] === 'dxos.halo.credentials.IdentityRecovery',
-  );
-
-  // TODO(wittjosiah): Reconsile w/ RecoverySetupDialog actions.
-  const actions: Record<string, ActionMenuItem> = useMemo(
-    () => ({
-      createPasskey: {
-        label: t('create passkey label'),
-        description: t('create passkey description'),
-        // TODO(wittjosiah): Ideally this would be a `user-key` icon.
-        icon: Key,
-        onClick: () => dispatch(createIntent(ClientAction.CreatePasskey)),
-      },
-      createRecoveryCode: {
-        label: t('create recovery code label'),
-        description: t('create recovery code description'),
-        icon: Receipt,
-        onClick: () => dispatch(createIntent(ClientAction.CreateRecoveryCode)),
-      },
-    }),
-    [t],
-  );
-
-  return (
-    <Dialog.Content classNames='bs-content min-bs-[15rem] max-bs-full md:max-is-[25rem] overflow-hidden'>
-      <Dialog.Title>{t('manage credentials dialog title')}</Dialog.Title>
-      <List classNames='py-4'>
-        {recoveryCredentials.map((credential) => (
-          <ListItem.Root key={credential.id?.toHex()}>
-            <ListItem.Endcap>
-              <Icon icon='ph--key--regular' size={5} />
-            </ListItem.Endcap>
-            <ListItem.Heading>{credential.issuanceDate.toLocaleString()}</ListItem.Heading>
-          </ListItem.Root>
-        ))}
-      </List>
-      <div className='grow' />
-      <BifurcatedAction actions={actions} />
-    </Dialog.Content>
-  );
-};

package/src/components/RecoverySetupDialog.stories.tsx

@@ -1,77 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import '@dxos-theme';
-
-import { type StoryObj, type Meta } from '@storybook/react';
-import React from 'react';
-
-import { createResolver, contributes, Capabilities, IntentPlugin, LayoutAction } from '@dxos/app-framework';
-import { withPluginManager } from '@dxos/app-framework/testing';
-import { S } from '@dxos/echo-schema';
-import { create } from '@dxos/live-object';
-import { AlertDialog } from '@dxos/react-ui';
-import { withTheme, withLayout } from '@dxos/storybook-utils';
-
-import { RECOVER_CODE_DIALOG, RecoveryCodeDialog } from './RecoveryCodeDialog';
-import { RecoverySetupDialog } from './RecoverySetupDialog';
-import { ClientPlugin } from '../ClientPlugin';
-import translations from '../translations';
-
-const state = create<{ recoveryCode?: string }>({});
-
-const Render = () => {
-  return (
-    <AlertDialog.Root open>
-      <AlertDialog.Overlay>
-        {state.recoveryCode ? <RecoveryCodeDialog code={state.recoveryCode} /> : <RecoverySetupDialog />}
-      </AlertDialog.Overlay>
-    </AlertDialog.Root>
-  );
-};
-
-const meta: Meta = {
-  title: 'plugins/plugin-client/RecoverySetupDialog',
-  component: RecoverySetupDialog,
-  render: Render,
-  decorators: [
-    withPluginManager({
-      plugins: [
-        IntentPlugin(),
-        ClientPlugin({
-          onClientInitialized: async (_, client) => {
-            await client.halo.createIdentity();
-          },
-        }),
-      ],
-      capabilities: [
-        contributes(
-          Capabilities.IntentResolver,
-          createResolver({
-            intent: LayoutAction.UpdateLayout,
-            filter: (data): data is S.Schema.Type<typeof LayoutAction.UpdateDialog.fields.input> =>
-              S.is(LayoutAction.UpdateDialog.fields.input)(data),
-            resolve: (data) => {
-              if (data.subject === RECOVER_CODE_DIALOG) {
-                state.recoveryCode = data.options?.props?.code;
-              }
-            },
-          }),
-        ),
-      ],
-    }),
-    withTheme,
-    withLayout({ tooltips: true }),
-  ],
-  parameters: {
-    layout: 'fullscreen',
-    translations,
-  },
-};
-
-export default meta;
-
-type Story = StoryObj<typeof RecoverySetupDialog>;
-
-export const Default: Story = {};

package/src/components/RecoverySetupDialog.tsx

@@ -1,52 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { Key, Receipt } from '@phosphor-icons/react';
-import React, { useMemo } from 'react';
-
-import { createIntent, LayoutAction, useIntentDispatcher } from '@dxos/app-framework';
-import { AlertDialog, useTranslation } from '@dxos/react-ui';
-import { type ActionMenuItem, BifurcatedAction } from '@dxos/shell/react';
-
-import { CLIENT_PLUGIN } from '../meta';
-import { ClientAction } from '../types';
-
-export const RECOVER_SETUP_DIALOG = `${CLIENT_PLUGIN}/RecoverySetupDialog`;
-
-// TODO(wittjosiah): Factor panel out to @dxos/shell.
-export const RecoverySetupDialog = () => {
-  const { t } = useTranslation(CLIENT_PLUGIN);
-  const { dispatchPromise: dispatch } = useIntentDispatcher();
-
-  const actions: Record<string, ActionMenuItem> = useMemo(
-    () => ({
-      createPasskey: {
-        label: t('create passkey label'),
-        description: t('create passkey description'),
-        // TODO(wittjosiah): Ideally this would be a `user-key` icon.
-        icon: Key,
-        onClick: async () => {
-          await dispatch(createIntent(ClientAction.CreatePasskey));
-          await dispatch(createIntent(LayoutAction.UpdateDialog, { part: 'dialog', options: { state: false } }));
-        },
-      },
-      createRecoveryCode: {
-        label: t('create recovery code label'),
-        description: t('create recovery code description'),
-        icon: Receipt,
-        onClick: () => dispatch(createIntent(ClientAction.CreateRecoveryCode)),
-      },
-    }),
-    [t],
-  );
-
-  return (
-    <AlertDialog.Content classNames='bs-content min-bs-[15rem] max-bs-full md:max-is-[25rem] overflow-hidden'>
-      <AlertDialog.Title>{t('recovery setup dialog title')}</AlertDialog.Title>
-      <p className='py-4'>{t('recovery setup dialog description')}</p>
-      <div className='grow' />
-      <BifurcatedAction actions={actions} />
-    </AlertDialog.Content>
-  );
-};