@dxos/plugin-github 0.7.4 → 0.14.0

package/src/components/EmbeddedMain/GfmPreview.tsx

@@ -1,110 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import 'github-markdown-css/github-markdown.css';
-import DOMPurify from 'dompurify';
-import React, { useEffect, useState } from 'react';
-
-import { useTranslation } from '@dxos/react-ui';
-
-import { GITHUB_PLUGIN } from '../../meta';
-import { GitHubSettings, useOctokitContext } from '../GithubApiProviders';
-import { Loading } from '../Loading';
-
-const defaultOptions: Parameters<typeof DOMPurify.sanitize>[1] = {
-  ALLOWED_TAGS: [
-    'span',
-    'div',
-    'b',
-    'i',
-    'em',
-    'strong',
-    'a',
-    'p',
-    'h1',
-    'h2',
-    'h3',
-    'h4',
-    'h5',
-    'h6',
-    'table',
-    'td',
-    'th',
-    'tr',
-    'blockquote',
-    'ul',
-    'ol',
-    'li',
-    'dd',
-    'tt',
-    'dl',
-    'dt',
-    'details',
-    'figcaption',
-    'figure',
-    'summary',
-    'abbr',
-    'dfn',
-    'mark',
-    'sub',
-    'sup',
-    'img',
-    'code',
-    'kbd',
-    'pre',
-    'samp',
-    'hr',
-    'input',
-    'pre',
-    'del',
-    'g-emoji',
-    'label',
-  ],
-  ALLOWED_ATTR: ['class', 'href', 'target', 'hidden', 'title', 'type', 'role', 'align', 'data-footnote-ref'],
-};
-
-const sanitize = (dirty: string, options: Partial<Parameters<typeof DOMPurify.sanitize>[1]>) => ({
-  __html: DOMPurify.sanitize(dirty, { ...defaultOptions, ...options }) as string,
-});
-
-export type GfmPreviewProps = {
-  markdown: string;
-  owner?: string;
-  repo?: string;
-};
-
-export const GfmPreview = ({ markdown, owner, repo }: GfmPreviewProps) => {
-  const [html, setHtml] = useState('');
-  const { octokit } = useOctokitContext();
-  const { t } = useTranslation(GITHUB_PLUGIN);
-
-  useEffect(() => {
-    if (octokit && markdown) {
-      void octokit
-        .request('POST /markdown', {
-          text: markdown,
-          ...(owner && repo && { context: `${owner}/${repo}` }),
-        })
-        .then(
-          ({ data }) => setHtml(data),
-          () => {},
-        );
-    }
-  }, [markdown, octokit]);
-
-  return html ? (
-    <>
-      <style>{'.markdown-body ol, .markdown-body ul {list-style-type: disc; list-style-position: outside;}'}</style>
-      <div
-        className='markdown-body grow is-full max-is-[980px] mli-auto p-[15px] sm:pli-[45px] sm:plb-[30px]'
-        dangerouslySetInnerHTML={sanitize(html, {})}
-      />
-    </>
-  ) : (
-    <div role='none' className='mli-auto max-is-md pli-2 text-center'>
-      {!octokit && <p className='mlb-4 text-lg font-medium'>{t('empty github pat message')}</p>}
-      {octokit ? <Loading label={t('loading preview message')} /> : <GitHubSettings />}
-    </div>
-  );
-};

package/src/components/EmbeddedMain/embedded.css

@@ -1,3 +0,0 @@
-html, body, #root {
-  height: 100%;
-}

package/src/components/EmbeddedMain/index.ts

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

package/src/components/ExportDialog.tsx

@@ -1,157 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, { useCallback, useState } from 'react';
-
-import { log } from '@dxos/log';
-import { Button, Dialog, Input, Trans, useTranslation } from '@dxos/react-ui';
-
-import { useOctokitContext } from './GithubApiProviders';
-import { GITHUB_PLUGIN } from '../meta';
-import type { ExportViewState, GhFileIdentifier, GhIdentifier } from '../types';
-
-export const ExportDialog = ({
-  type,
-  target,
-  docGhId,
-}: {
-  type: ExportViewState;
-  target: string | null;
-  docGhId: GhIdentifier;
-}) => {
-  // TODO(burdon): Model removed.
-  const content = '';
-
-  const { octokit } = useOctokitContext();
-  const { t } = useTranslation(GITHUB_PLUGIN);
-  const [exportViewState, setExportViewState] = useState<ExportViewState>(type);
-  const [ghResponseUrl, setGhResponseUrl] = useState<string | null>(target);
-  const [ghBranchValue, setGhBranchValue] = useState('');
-  const [ghMessageValue, setGhMessageValue] = useState('');
-
-  const exportGhFileContent = useCallback(async () => {
-    if (octokit && docGhId && 'path' in docGhId && content) {
-      const branchName = ghBranchValue || t('github branch name placeholder');
-      const commitMessage = ghMessageValue || t('github commit message placeholder');
-      setExportViewState('pending');
-      try {
-        const { owner, repo, path, ref } = docGhId as GhFileIdentifier;
-        const { data: fileData } = await octokit.rest.repos.getContent({ owner, repo, path });
-        if (Array.isArray(fileData) || fileData.type !== 'file') {
-          log.error('Attempted to export to a destination in Github that is not a file.');
-          return;
-        }
-        const { sha: fileSha } = fileData;
-        const {
-          data: {
-            object: { sha: baseSha },
-          },
-        } = await octokit.rest.git.getRef({ owner, repo, ref: `heads/${ref}` });
-        await octokit.rest.git.createRef({
-          owner,
-          repo,
-          ref: `refs/heads/${branchName}`,
-          sha: baseSha,
-        });
-        await octokit.rest.repos.createOrUpdateFileContents({
-          owner,
-          repo,
-          path,
-          message: commitMessage,
-          branch: branchName,
-          sha: fileSha,
-          content: btoa(content),
-        });
-        const {
-          data: { html_url: prUrl },
-        } = await octokit.rest.pulls.create({
-          owner,
-          repo,
-          head: branchName,
-          base: ref,
-          title: commitMessage,
-        });
-        setGhResponseUrl(prUrl);
-        setExportViewState('response');
-      } catch (err) {
-        log.error('Failed to export to Github file', err);
-        setExportViewState('create-pr');
-        setGhResponseUrl(null);
-      }
-    } else {
-      log.error('Not prepared to export to Github file when requested.');
-      setGhResponseUrl(null);
-    }
-  }, [octokit, docGhId, content, ghBranchValue, ghMessageValue, t]);
-
-  return (
-    <Dialog.Content>
-      <Dialog.Title>{t('confirm export title')}</Dialog.Title>
-      {exportViewState === 'response' ? (
-        <>
-          <p>
-            <Trans
-              {...{
-                t,
-                i18nKey: 'export to github success message',
-                values: { linkText: ghResponseUrl },
-                components: {
-                  resultStyle: <span className='text-success-600 dark:text-success-300'>_</span>,
-                  prLink: (
-                    <a
-                      href={ghResponseUrl!}
-                      target='_blank'
-                      rel='noreferrer'
-                      className='text-primary-600 dark:text-primary-300 hover:text-primary-700 dark:hover:text-primary-400'
-                    >
-                      _
-                    </a>
-                  ),
-                },
-              }}
-            />
-          </p>
-          <div role='none' className='flex justify-end'>
-            <Dialog.Close asChild>
-              <Button variant='primary' onClick={() => setExportViewState(null)}>
-                {t('done label', { ns: 'os' })}
-              </Button>
-            </Dialog.Close>
-          </div>
-        </>
-      ) : (
-        <div role='none' className='mbs-2 space-b-2'>
-          <Input.Root>
-            <Input.Label>{t('github branch name label')}</Input.Label>
-            <Input.TextInput
-              autoFocus
-              classNames='font-mono'
-              disabled={exportViewState === 'pending'}
-              placeholder={t('github branch name placeholder')}
-              value={ghBranchValue}
-              onChange={({ target: { value } }) => setGhBranchValue(value)}
-            />
-          </Input.Root>
-          <Input.Root>
-            <Input.Label>{t('github commit message label')}</Input.Label>
-            <Input.TextArea
-              disabled={exportViewState === 'pending'}
-              placeholder={t('github commit message placeholder')}
-              value={ghMessageValue}
-              onChange={({ target: { value } }) => setGhMessageValue(value)}
-            />
-          </Input.Root>
-          <div role='none' className='flex justify-end gap-2'>
-            <Dialog.Close asChild>
-              <Button onClick={() => setExportViewState(null)}>{t('close label', { ns: 'os' })}</Button>
-            </Dialog.Close>
-            <Button disabled={exportViewState === 'pending'} variant='primary' onClick={() => exportGhFileContent()}>
-              {t('continue label', { ns: 'os' })}
-            </Button>
-          </div>
-        </div>
-      )}
-    </Dialog.Content>
-  );
-};

package/src/components/GithubApiProviders/GitHubSettings.tsx

@@ -1,72 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { ArrowSquareOut } from '@phosphor-icons/react';
-import React, { type PropsWithChildren, useEffect, useState } from 'react';
-
-import { Link, Input, Trans, useTranslation, useId } from '@dxos/react-ui';
-import { DeprecatedFormInput } from '@dxos/react-ui-form';
-import { getSize, mx } from '@dxos/react-ui-theme';
-
-import { useOctokitContext } from './OctokitProvider';
-import { GITHUB_PLUGIN } from '../../meta';
-
-// TODO(burdon): Factor out with PluginList.
-const ExternalLink = ({ children }: PropsWithChildren<{}>) => {
-  const { t } = useTranslation(GITHUB_PLUGIN);
-  const descriptionId = useId('link--external');
-  return (
-    <>
-      <Link href={t('github pat description href')} target='_blank' rel='noreferrer' aria-describedby={descriptionId}>
-        {children}
-        <ArrowSquareOut weight='bold' className={mx(getSize(3), 'inline-block leading-none -mbs-0.5 mli-px')} />
-      </Link>
-      <span className='sr-only' id={descriptionId}>
-        {t('target blank description', { ns: GITHUB_PLUGIN })}
-      </span>
-    </>
-  );
-};
-
-// TODO(burdon): Pass in settings.
-export const GitHubSettings = () => {
-  const { t } = useTranslation(GITHUB_PLUGIN);
-  const { pat, setPat } = useOctokitContext();
-  const [patValue, setPatValue] = useState(pat);
-
-  useEffect(() => {
-    setPatValue(pat);
-  }, [pat]);
-
-  useEffect(() => {
-    void setPat(patValue);
-  }, [patValue]);
-
-  return (
-    <>
-      <DeprecatedFormInput
-        label={t('github pat label')}
-        description={
-          <Trans
-            {...{
-              t,
-              i18nKey: 'github pat description',
-              components: {
-                docsLink: <ExternalLink />,
-              },
-            }}
-          />
-        }
-      >
-        <Input.TextInput
-          autoFocus
-          spellCheck={false}
-          classNames='font-mono mlb-1'
-          value={patValue ?? ''}
-          onChange={({ target: { value } }) => setPatValue(value)}
-        />
-      </DeprecatedFormInput>
-    </>
-  );
-};

package/src/components/GithubApiProviders/OctokitProvider.tsx

@@ -1,60 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { Octokit } from 'octokit';
-import React, { type Context, createContext, type PropsWithChildren, useContext, useEffect, useState } from 'react';
-
-import { log } from '@dxos/log';
-
-export type OctokitContextValue = {
-  pat?: string;
-  setPat: (pat?: string) => void;
-  patError: 'failed' | null; // TODO(burdon): Remove/generalize?
-  octokit: Octokit | null;
-};
-
-export const OctokitContext: Context<OctokitContextValue> = createContext<OctokitContextValue>({
-  setPat: () => {},
-  patError: null,
-  octokit: null,
-});
-
-export const useOctokitContext = () => useContext(OctokitContext);
-
-export const OctokitProvider = ({
-  pat,
-  onPatChanged,
-  children,
-}: PropsWithChildren<{ pat?: string; onPatChanged?: (pat: string | undefined) => void }>) => {
-  const [octokit, setOctokit] = useState<Octokit | null>(null);
-  const [patError, setPatError] = useState<OctokitContextValue['patError']>(null);
-
-  useEffect(() => {
-    if (pat && !octokit) {
-      void setPat(pat);
-    }
-  }, [pat, octokit]);
-
-  const setPat = async (pat?: string) => {
-    onPatChanged?.(pat);
-    if (pat) {
-      const octokit = new Octokit({ auth: pat });
-      return octokit.rest.users.getAuthenticated().then(
-        () => {
-          setPatError(null);
-          setOctokit(octokit);
-        },
-        (err) => {
-          log.warn('Failed to authenticate Octokit from PAT', err);
-          setPatError('failed');
-          setOctokit(null);
-        },
-      );
-    } else {
-      setOctokit(null);
-    }
-  };
-
-  return <OctokitContext.Provider value={{ pat, setPat, patError, octokit }}>{children}</OctokitContext.Provider>;
-};

package/src/components/GithubApiProviders/index.ts

@@ -1,6 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-export * from './GitHubSettings';
-export * from './OctokitProvider';

package/src/components/GithubEchoResolverProviders/DocumentTreeItem.tsx

@@ -1,26 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { TextAa } from '@phosphor-icons/react';
-import React from 'react';
-
-import { type DocumentType } from '@dxos/plugin-markdown/types';
-import { useTranslation, TreeItem } from '@dxos/react-ui';
-import { getSize, mx } from '@dxos/react-ui-theme';
-
-import { GITHUB_PLUGIN } from '../../meta';
-
-export const DocumentTreeItem = ({ document }: { document: DocumentType }) => {
-  const { t } = useTranslation(GITHUB_PLUGIN);
-  return (
-    <TreeItem.Root classNames='flex gap-2'>
-      <TreeItem.Heading classNames='contents'>
-        <TextAa weight='regular' className={mx(getSize(4), 'shrink-0 mbs-2')} />
-        <span className='grow mbs-2 text-sm no-leading'>
-          {document.name || t('document title placeholder', { ns: 'dxos.org/plugin/markdown' })}
-        </span>
-      </TreeItem.Heading>
-    </TreeItem.Root>
-  );
-};

package/src/components/GithubEchoResolverProviders/ResolverContext.tsx

@@ -1,137 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React, {
-  type Context,
-  createContext,
-  type PropsWithChildren,
-  useContext,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
-
-import { create } from '@dxos/live-object';
-import { log } from '@dxos/log';
-import { DocumentType, TextType } from '@dxos/plugin-markdown/types';
-import { useMulticastObservable } from '@dxos/react-client';
-import { Filter, type Space, SpaceState, useQuery, useSpaces } from '@dxos/react-client/echo';
-import { useIdentity } from '@dxos/react-client/halo';
-
-import { type DocumentResolverProps, type SpaceResolverProps } from './ResolverProps';
-import { displayName, matchSpace } from './spaceResolvers';
-
-const getLocationIdentifier = () => {
-  const searchParams = new URLSearchParams(window.location.search);
-  const location = searchParams.get('location');
-  let source, id;
-  try {
-    const url = location ? new URL(location) : undefined;
-    source = url?.hostname.split('.').reverse().join('.');
-    id = url?.pathname.slice(1);
-  } catch (err) {
-    log.catch(err);
-  }
-  return [source, id];
-};
-
-export const SpaceResolverContext: Context<SpaceResolverProps> = createContext<SpaceResolverProps>({
-  space: null,
-  setSpace: (_space) => {},
-});
-
-export const SpaceResolverProvider = ({ children }: PropsWithChildren<{}>) => {
-  const identity = useIdentity();
-  const identityHex = identity?.identityKey.toHex();
-  const [source, id] = getLocationIdentifier();
-  const spaces = useSpaces({ all: true });
-
-  const [nextSpace, setSpace] = useState<Space | null>(null);
-
-  const space = useMemo(
-    () =>
-      nextSpace ?? (identityHex ? spaces.find((space) => matchSpace(space, identityHex, source, id)) ?? null : null),
-    [spaces, nextSpace, identityHex, source, id],
-  );
-
-  return (
-    <SpaceResolverContext.Provider value={{ space, setSpace, source, id, identityHex }}>
-      {children}
-    </SpaceResolverContext.Provider>
-  );
-};
-
-const defaultDocumentResolverContext: DocumentResolverProps = {
-  document: null,
-  setDocument: (_document) => {},
-};
-
-export const DocumentResolverContext: Context<DocumentResolverProps> =
-  createContext<DocumentResolverProps>(defaultDocumentResolverContext);
-
-const DocumentResolverProviderImpl = ({
-  space,
-  source,
-  id,
-  children,
-}: PropsWithChildren<{ space: Space; source: string; id: string }>) => {
-  const spaceState = useMulticastObservable(space.state);
-  const [document, setDocument] = useState<DocumentType | null>(null);
-  const defaultDisplayName = displayName(source, id);
-
-  const documents = useQuery(space, Filter.foreignKeys([{ source, id }]));
-
-  useEffect(() => {
-    const handler = (event: MessageEvent) => {
-      if (event.source !== window.parent || spaceState !== SpaceState.SPACE_READY) {
-        return;
-      }
-
-      if (event.data.type === 'initial-data') {
-        const nextDocument = space.db.add(
-          create(
-            DocumentType,
-            {
-              name: defaultDisplayName,
-              content: create(TextType, { content: event.data.content }),
-              threads: [],
-            },
-            {
-              keys: [{ source, id }],
-            },
-          ),
-        );
-
-        setDocument(nextDocument);
-      }
-    };
-
-    // todo(thure): Won't this always be the case initially?
-    if (documents.length === 0) {
-      window.addEventListener('message', handler);
-      window.parent.postMessage({ type: 'request-initial-data' }, 'https://github.com');
-      return () => window.removeEventListener('message', handler);
-    } else {
-      setDocument(documents[0] as DocumentType);
-    }
-  }, [spaceState, space, documents]);
-
-  return (
-    <DocumentResolverContext.Provider value={{ document, setDocument }}>{children}</DocumentResolverContext.Provider>
-  );
-};
-
-export const DocumentResolverProvider = ({ children }: PropsWithChildren<{}>) => {
-  const { space, source, id } = useContext(SpaceResolverContext);
-
-  return space && source && id ? (
-    <DocumentResolverProviderImpl space={space} source={source} id={id}>
-      {children}
-    </DocumentResolverProviderImpl>
-  ) : (
-    <DocumentResolverContext.Provider value={defaultDocumentResolverContext}>
-      {children}
-    </DocumentResolverContext.Provider>
-  );
-};

package/src/components/GithubEchoResolverProviders/ResolverDialog.tsx

@@ -1,34 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import React from 'react';
-
-import { Button, useTranslation } from '@dxos/react-ui';
-
-import { ResolverTree } from './ResolverTree';
-import { GITHUB_PLUGIN } from '../../meta';
-
-export const ResolverDialog = ({
-  handleJoinSpace,
-  handleCreateSpace,
-}: {
-  handleJoinSpace?: () => void;
-  handleCreateSpace?: () => void;
-}) => {
-  const { t } = useTranslation(GITHUB_PLUGIN);
-
-  return (
-    <>
-      <ResolverTree />
-      <div role='group' className='shrink-0 flex is-full gap-2'>
-        <Button classNames='grow' onClick={handleCreateSpace}>
-          {t('create space label', { ns: 'appkit' })}
-        </Button>
-        <Button classNames='grow' onClick={handleJoinSpace}>
-          {t('join space label', { ns: 'appkit' })}
-        </Button>
-      </div>
-    </>
-  );
-};

package/src/components/GithubEchoResolverProviders/ResolverProps.ts

@@ -1,23 +0,0 @@
-//
-// Copyright 2023 DXOS.org
-//
-
-import { type Dispatch, type SetStateAction } from 'react';
-
-import { type DocumentType } from '@dxos/plugin-markdown/types';
-import { type Space } from '@dxos/react-client/echo';
-
-export type SpaceResolverProps = {
-  space: Space | null;
-  setSpace: Dispatch<SetStateAction<Space | null>>;
-  source?: string;
-  id?: string;
-  identityHex?: string;
-};
-
-export type DocumentResolverProps = {
-  document: DocumentType | null;
-  setDocument: Dispatch<SetStateAction<DocumentType | null>>;
-};
-
-export type ResolverProps = SpaceResolverProps & DocumentResolverProps;