@dxos/react-client 0.6.11-staging.e6894a4 → 0.6.12-main.5cc132e

package/dist/types/src/client/ClientContext.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ClientContext.test.d.ts","sourceRoot":"","sources":["../../../../src/client/ClientContext.test.tsx"],"names":[],"mappings":""}

package/dist/types/src/client/useClientServices.d.ts

@@ -1,3 +0,0 @@
-import type { ClientServices } from '@dxos/client';
-export declare const useClientServices: () => ClientServices | undefined;
-//# sourceMappingURL=useClientServices.d.ts.map

package/dist/types/src/client/useClientServices.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useClientServices.d.ts","sourceRoot":"","sources":["../../../../src/client/useClientServices.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAKnD,eAAO,MAAM,iBAAiB,QAAO,cAAc,GAAG,SAGrD,CAAC"}

package/dist/types/src/testing/decorators.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"decorators.stories.d.ts","sourceRoot":"","sources":["../../../../src/testing/decorators.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;AAS1B,wBAGE;AAsBF,eAAO,MAAM,UAAU;;CAEtB,CAAC;AAkBF,eAAO,MAAM,eAAe;;CAE3B,CAAC"}

package/src/client/ClientContext.stories.tsx

@@ -1,94 +0,0 @@
-//
-// Copyright 2021 DXOS.org
-//
-
-import '@dxos-theme';
-
-import React, { Component, type PropsWithChildren } from 'react';
-
-import { fromHost } from '@dxos/client';
-import { Config } from '@dxos/config';
-import { withTheme } from '@dxos/storybook-utils';
-
-import { ClientProvider, useClient } from './ClientContext';
-
-export default {
-  title: 'react-client/ClientContext',
-  component: ClientProvider,
-  decorators: [withTheme],
-};
-
-const JsonPanel = ({ value }: { value: any }) => (
-  <pre
-    style={{
-      margin: 0,
-      // code whiteSpace: 'pre-wrap',
-      // code wordBreak: 'break-all',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-    }}
-  >
-    {JSON.stringify(value, undefined, 2)}
-  </pre>
-);
-
-const TestApp = () => {
-  const client = useClient();
-
-  return (
-    <div>
-      <div style={{ padding: 1 }}>
-        <JsonPanel value={client.config} />
-      </div>
-      <div style={{ padding: 1 }}>
-        <JsonPanel value={client.toJSON()} />
-      </div>
-      <div style={{ padding: 1 }}>
-        <JsonPanel value={client.halo.identity} />
-      </div>
-    </div>
-  );
-};
-
-const servicesProvider = (config?: Config) => fromHost(config);
-
-export const Default = {
-  render: () => (
-    <ClientProvider services={servicesProvider}>
-      <TestApp />
-    </ClientProvider>
-  ),
-};
-
-class ErrorBoundary extends Component<PropsWithChildren<{}>, { hasError: boolean }> {
-  constructor(props: any) {
-    super(props);
-    this.state = { hasError: false };
-  }
-
-  static getDerivedStateFromError() {
-    // Update state so the next render will show the fallback UI.
-    return { hasError: true };
-  }
-
-  override render() {
-    if (this.state.hasError) {
-      // You can render any custom fallback UI
-      return <div>Runtime Error</div>;
-    }
-
-    return this.props.children;
-  }
-}
-
-const config = new Config({ runtime: { client: { remoteSource: 'bad-value' } } });
-
-export const Error = {
-  render: () => (
-    <ErrorBoundary>
-      <ClientProvider config={config}>
-        <TestApp />
-      </ClientProvider>
-    </ErrorBoundary>
-  ),
-};

package/src/client/ClientContext.tsx

@@ -1,182 +0,0 @@
-//
-// Copyright 2020 DXOS.org
-//
-
-import React, {
-  type ReactNode,
-  useState,
-  type Context,
-  createContext,
-  useContext,
-  useEffect,
-  type FunctionComponent,
-  useMemo,
-} from 'react';
-
-import {
-  Client,
-  SystemStatus,
-  type ClientOptions,
-  type ClientServices,
-  type ClientServicesProvider,
-} from '@dxos/client';
-import { type Config } from '@dxos/config';
-import { raise } from '@dxos/debug';
-import { registerSignalFactory } from '@dxos/echo-signals/react';
-import { log } from '@dxos/log';
-import { getAsyncValue, type MaybePromise, type Provider } from '@dxos/util'; // TODO(burdon): Deprecate "util"?
-
-import { printBanner } from '../banner';
-
-// TODO(burdon): Reconcile with ClientOptions.
-export type ClientContextProps = {
-  client: Client;
-
-  // Optionally expose services (e.g., for devtools).
-  // TODO(burdon): Can't this just be accessed via `client.services`?
-  services?: ClientServices;
-
-  status?: SystemStatus | null;
-};
-
-export const ClientContext: Context<ClientContextProps | undefined> = createContext<ClientContextProps | undefined>(
-  undefined,
-);
-
-/**
- * Hook returning instance of DXOS client.
- * Requires ClientContext to be set via ClientProvider.
- */
-export const useClient = () => {
-  const { client } = useContext(ClientContext) ?? raise(new Error('Missing ClientContext.'));
-  return client;
-};
-
-/**
- * Properties for the ClientProvider.
- */
-export type ClientProviderProps = Omit<ClientOptions, 'config' | 'services'> & {
-  children?: ReactNode;
-
-  /**
-   * Config object or async provider.
-   */
-  config?: Config | Provider<Promise<Config>>;
-
-  /**
-   * Callback to enable the caller to create a custom ClientServicesProvider.
-   *
-   * Most apps won't need this.
-   */
-  services?: (config?: Config) => MaybePromise<ClientServicesProvider>;
-
-  /**
-   * Client object or async provider to enable to caller to do custom initialization.
-   *
-   * Most apps won't need this.
-   */
-  // TODO(wittjosiah): Remove async and just use to keeping reference to client?
-  //   (Prefering `onInitialized` for custom initialization.)
-  client?: Client | Provider<Promise<Client>>;
-
-  /**
-   * ReactNode to display until the client is available.
-   */
-  // TODO(wittjosiah): Rename to `placeholder`.
-  fallback?: FunctionComponent<Partial<ClientContextProps>>;
-
-  /**
-   * Set to false to stop default signal factory from being registered.
-   */
-  registerSignalFactory?: boolean;
-
-  /**
-   * Post initialization hook to enable to caller to do custom initialization.
-   *
-   * @param Client
-   */
-  onInitialized?: (client: Client) => MaybePromise<void>;
-};
-
-/**
- * Root component that provides the DXOS client instance to child components.
- * To be used with the `useClient` hook.
- */
-export const ClientProvider = ({
-  children,
-  config: configProvider,
-  services: createServices,
-  client: clientProvider,
-  fallback: Fallback = () => null,
-  registerSignalFactory: register = true,
-  onInitialized,
-  ...options
-}: ClientProviderProps) => {
-  useMemo(() => {
-    // TODO(wittjosiah): Ideally this should be imported asynchronosly because it is optional.
-    //   Unfortunately, async import seemed to break signals React instrumentation.
-    register && registerSignalFactory();
-  }, []);
-
-  const [client, setClient] = useState(clientProvider instanceof Client ? clientProvider : undefined);
-  const [status, setStatus] = useState<SystemStatus | null>(null);
-  const [error, setError] = useState();
-  if (error) {
-    throw error;
-  }
-
-  useEffect(() => {
-    if (!client) {
-      return;
-    }
-
-    const subscription = client.status.subscribe((status) => setStatus(status));
-    return () => subscription.unsubscribe();
-  }, [client, setStatus]);
-
-  useEffect(() => {
-    const done = async (client: Client) => {
-      await client.initialize().catch(setError);
-      log('client ready');
-      await onInitialized?.(client);
-      log('initialization complete');
-      setClient(client);
-      setStatus(client.status.get() ?? SystemStatus.ACTIVE);
-      printBanner(client);
-    };
-
-    const timeout = setTimeout(async () => {
-      if (clientProvider) {
-        // Asynchronously request client.
-        const client = await getAsyncValue(clientProvider);
-        await done(client);
-      } else {
-        // Asynchronously construct client (config may be undefined).
-        const config = await getAsyncValue(configProvider);
-        log('resolved config', { config });
-        const services = await createServices?.(config);
-        log('created services', { services });
-        const client = new Client({ config, services, ...options });
-        log('created client');
-        await done(client);
-      }
-    });
-
-    return () => {
-      log('clean up');
-      clearTimeout(timeout);
-      void client?.destroy().catch((err) => log.catch(err));
-    };
-  }, [clientProvider, configProvider, createServices]);
-
-  if (!client || status !== SystemStatus.ACTIVE) {
-    return <Fallback client={client} status={status} />;
-  }
-
-  // prettier-ignore
-  return (
-    <ClientContext.Provider value={{ client, status }}>
-      {children}
-    </ClientContext.Provider>
-  );
-};

package/src/client/useClientServices.ts

@@ -1,15 +0,0 @@
-//
-// Copyright 2022 DXOS.org
-//
-
-import { useContext } from 'react';
-
-import type { ClientServices } from '@dxos/client';
-import { raise } from '@dxos/debug';
-
-import { ClientContext } from './ClientContext';
-
-export const useClientServices = (): ClientServices | undefined => {
-  const { services } = useContext(ClientContext) ?? raise(new Error('Missing ClientContext.'));
-  return services;
-};

package/src/testing/decorators.stories.tsx

@@ -1,63 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import '@dxos-theme';
-
-import React from 'react';
-
-import { type PublicKey } from '@dxos/client';
-import { withTheme } from '@dxos/storybook-utils';
-
-import { ClientRepeater } from './ClientRepeater';
-import { useClient } from '../client';
-import { useSpace } from '../echo';
-
-export default {
-  title: 'testing/decorators',
-  decorators: [withTheme],
-};
-
-const JsonPanel = ({ value }: { value: any }) => (
-  <pre
-    style={{
-      margin: 0,
-      // code whiteSpace: 'pre-wrap',
-      // code wordBreak: 'break-all',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-    }}
-  >
-    {JSON.stringify(value, undefined, 2)}
-  </pre>
-);
-
-const ClientStory = () => {
-  const client = useClient();
-
-  return <JsonPanel value={client.toJSON()} />;
-};
-
-export const WithClient = {
-  render: () => <ClientRepeater component={ClientStory} count={2} />,
-};
-
-const ClientSpace = ({ spaceKey }: { spaceKey: PublicKey }) => {
-  const space = useSpace(spaceKey);
-
-  if (!space) {
-    return <>null</>;
-  }
-
-  return (
-    <div className='flex-1 min-w-0 p-4'>
-      <label>
-        Name <input value={space.properties.name} onChange={(event) => (space.properties.name = event.target.value)} />
-      </label>
-    </div>
-  );
-};
-
-export const WithClientSpace = {
-  render: () => <ClientRepeater component={ClientSpace} count={2} createSpace />,
-};