@dxos/plugin-status-bar 0.8.4-main.9735255 → 0.8.4-main.9be5663bfe

package/src/capabilities/react-surface/index.ts

@@ -1,7 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import { Capability } from '@dxos/app-framework';
-
-export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));

package/src/capabilities/react-surface/react-surface.tsx

@@ -1,39 +0,0 @@
-//
-// Copyright 2025 DXOS.org
-//
-
-import * as Effect from 'effect/Effect';
-import React from 'react';
-
-import { Capability, Common } from '@dxos/app-framework';
-import { Surface } from '@dxos/app-framework/react';
-
-import { StatusBarActions, StatusBarPanel, VersionNumber } from '../../components';
-import { meta } from '../../meta';
-
-export default Capability.makeModule(() =>
-  Effect.succeed(
-    Capability.contributes(Common.Capability.ReactSurface, [
-      Common.createSurface({
-        id: `${meta.id}/status-bar`,
-        role: 'status-bar',
-        component: () => <StatusBarPanel />,
-      }),
-      Common.createSurface({
-        id: `${meta.id}/status-bar--r0-footer`,
-        role: 'status-bar--r0-footer',
-        component: () => <Surface role='status' />,
-      }),
-      Common.createSurface({
-        id: `${meta.id}/status-bar--r1-footer`,
-        role: 'status-bar--r1-footer',
-        component: () => <StatusBarActions />,
-      }),
-      Common.createSurface({
-        id: `${meta.id}/header-end`,
-        role: 'header-end',
-        component: () => <VersionNumber />,
-      }),
-    ]),
-  ),
-);

package/src/components/StatusBar.stories.tsx

@@ -1,45 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { type Meta, type StoryObj } from '@storybook/react-vite';
-import React from 'react';
-
-import { Icon } from '@dxos/react-ui';
-import { withTheme } from '@dxos/react-ui/testing';
-
-import { StatusBar } from './StatusBar';
-
-export const DefaultStory = () => (
-  <div>
-    <StatusBar.EndContent>
-      <StatusBar.Button>
-        <Icon icon='ph--mailbox--regular' size={4} />
-        <StatusBar.Text>Quick feedback</StatusBar.Text>
-      </StatusBar.Button>
-      <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>
-        <StatusBar.Button>
-          <Icon icon='ph--discord-logo--regular' size={4} />
-          <StatusBar.Text>Join us on Discord</StatusBar.Text>
-        </StatusBar.Button>
-      </a>
-      <StatusBar.Item>
-        <Icon icon='ph--lightning--regular' size={4} />
-        <StatusBar.Text>Online</StatusBar.Text>
-      </StatusBar.Item>
-    </StatusBar.EndContent>
-  </div>
-);
-
-const meta = {
-  title: 'plugins/plugin-status/StatusBar',
-  component: StatusBar as any,
-  render: DefaultStory,
-  decorators: [withTheme],
-} satisfies Meta<typeof StatusBar>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-export const Default: Story = {};

package/src/components/StatusBarPanel.tsx

@@ -1,76 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import React, { useState } from 'react';
-
-import { Surface } from '@dxos/app-framework/react';
-import { useConfig } from '@dxos/react-client';
-import { Icon, Popover, useTranslation } from '@dxos/react-ui';
-
-import { meta } from '../meta';
-
-import { StatusBar } from './StatusBar';
-import { VersionNumber } from './VersionNumber';
-
-export const StatusBarActions = () => {
-  const { t } = useTranslation(meta.id);
-  const [open, setOpen] = useState(false);
-
-  return (
-    <Popover.Root open={open} onOpenChange={setOpen}>
-      <EnvironmentLabel />
-      <VersionNumber />
-      <StatusBar.Button asChild>
-        <a href='https://dxos.org/discord' target='_blank' rel='noopener noreferrer'>
-          <Icon icon='ph--discord-logo--regular' size={4} />
-          <StatusBar.Text classNames='hidden sm:block'>{t('discord label')}</StatusBar.Text>
-        </a>
-      </StatusBar.Button>
-      <StatusBar.Button asChild>
-        <a href='https://github.com/dxos/dxos' target='_blank' rel='noopener noreferrer'>
-          <Icon icon='ph--github-logo--regular' size={4} />
-          <StatusBar.Text classNames='hidden sm:block'>{t('github label')}</StatusBar.Text>
-        </a>
-      </StatusBar.Button>
-    </Popover.Root>
-  );
-};
-
-export const StatusBarPanel = () => {
-  return (
-    <>
-      <StatusBarActions />
-      <span role='separator' className='grow' />
-      <Surface role='status' />
-    </>
-  );
-};
-
-const ENV_LABELS: Record<string, string> = {
-  'edge-dev': 'Dev',
-  'edge-main': 'Main',
-  'edge-labs': 'Labs',
-  'edge-production': 'Production',
-};
-
-const EnvironmentLabel = () => {
-  const config = useConfig();
-  const edgeUrl = config.values.runtime?.services?.edge?.url;
-  if (!edgeUrl) {
-    return null;
-  }
-  const part = new URL(edgeUrl).host.split('.')[0];
-  const edgeEnv = ENV_LABELS[part];
-  if (!edgeEnv) {
-    return null;
-  }
-
-  return (
-    <StatusBar.Item>
-      <StatusBar.Text classNames='text-xs text-subdued border border-separator rounded-full pli-1'>
-        <span title={edgeEnv}>{edgeEnv[0]}</span>
-      </StatusBar.Text>
-    </StatusBar.Item>
-  );
-};

package/src/components/VersionNumber.tsx

@@ -1,85 +0,0 @@
-//
-// Copyright 2024 DXOS.org
-//
-
-import { formatDistance } from 'date-fns/formatDistance';
-import React from 'react';
-
-import { useConfig } from '@dxos/react-client';
-import { Icon, Link, Message, Popover, Trans, useTranslation } from '@dxos/react-ui';
-
-import { meta } from '../meta';
-
-import { StatusBar } from './StatusBar';
-
-const repo = 'https://github.com/dxos/dxos';
-
-const VERSION_REGEX = /([\d.]+)/;
-
-export const VersionNumber = () => {
-  const { t } = useTranslation(meta.id);
-  const config = useConfig();
-  const { version, timestamp, commitHash } = config.values.runtime?.app?.build ?? {};
-  const [_, v] = version?.match(VERSION_REGEX) ?? [];
-  const isLabs = config.values.runtime?.app?.env?.DX_LABS;
-
-  const releaseUrl =
-    config.values.runtime?.app?.env?.DX_ENVIRONMENT === 'production'
-      ? `${repo}/releases/tag/v${version}`
-      : `${repo}/commit/${commitHash}`;
-
-  const previewUrl = 'https://docs.dxos.org/composer#technology-preview';
-
-  return (
-    <Popover.Root>
-      <Popover.Trigger asChild>
-        <StatusBar.Button classNames='text-xs'>{isLabs ? version : v}</StatusBar.Button>
-      </Popover.Trigger>
-      <Popover.Portal>
-        <Popover.Content
-          side='top'
-          role='message'
-          classNames='z-[12] bg-warning-500 max-is-[min(calc(100vw-16px),40ch)]'
-        >
-          <Message.Root valence='warning' classNames='rounded-be-none p-5'>
-            <Message.Title>{t('warning title')}</Message.Title>
-            <Message.Content>
-              {t('technology preview message')}
-              <br />
-              <Link href={previewUrl} target='_blank' rel='noreferrer' variant='neutral'>
-                {t('learn more label')}
-                <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />
-              </Link>
-            </Message.Content>
-          </Message.Root>
-          <div role='none' className='plb-4 pli-5 space-b-2 text-baseText'>
-            {timestamp && (
-              <p>
-                {t('released message', {
-                  released: formatDistance(new Date(timestamp), new Date(), { addSuffix: true }),
-                })}
-                <br />
-                <Link href={releaseUrl} target='_blank' rel='noreferrer' variant='neutral'>
-                  {t('see release label')}
-                  <Icon icon='ph--arrow-square-out--bold' classNames='inline mis-1' />
-                </Link>
-              </p>
-            )}
-            <p>
-              <Trans
-                {...{
-                  t,
-                  i18nKey: 'powered by dxos message',
-                  components: {
-                    dxos: <Link href='https://dxos.org' target='_blank' rel='noreferrer' variant='neutral' />,
-                  },
-                }}
-              />
-            </p>
-          </div>
-          <Popover.Arrow />
-        </Popover.Content>
-      </Popover.Portal>
-    </Popover.Root>
-  );
-};