Line data    Source code

       1              : import * as React from 'react';
       2              : 
       3              : import * as styles from '../session/persistence/session_url_share_overlay.module.css';
       4              : 
       5              : import { AnchorAlignment } from '../ui/foundations/anchored_position.js';
       6              : import { AnchoredOverlay } from '../ui/foundations/anchored_overlay.js';
       7              : import { SessionExportSettings, SessionExportSettingsView } from '../session/persistence/session_export_settings_view.js';
       8              : import { ShareURLField } from '../session/persistence/share_url_field.js';
       9              : import { exportConnectionAsUrl, SessionLinkTarget } from '../session/persistence/session_export.js';
      10              : import { connectionParamsHaveLoginHint, getConnectionParamsFromStateDetails } from './connection_params.js';
      11              : import type { ConnectionState } from './connection_state.js';
      12              : 
      13              : interface Props {
      14              :     /// The connection to share
      15              :     database: ConnectionState;
      16              :     isOpen: boolean;
      17              :     setIsOpen: (v: boolean) => void;
      18              : }
      19              : 
      20              : /// Share a connection as a link. The link opens an empty session on the connection.
      21            1 : export const ConnectionURLShareOverlay: React.FC<Props> = ({ database, isOpen, setIsOpen }) => {
      22            1 :     const anchorRef = React.useRef<HTMLDivElement>(null);
      23            1 :     const buttonRef = React.useRef<HTMLButtonElement>(null);
      24            1 :     const [url, setURL] = React.useState<string | null>(null);
      25            1 :     const [settings, setSettings] = React.useState<SessionExportSettings>({
      26            1 :         withCatalog: false,
      27            1 :         withLoginHint: true,
      28            1 :         preserveUUIDs: false,
      29            1 :     });
      30            1 :     const params = database.params;
      31            1 :     const name = database.name ?? null;
      32              : 
      33            1 :     React.useEffect(() => {
      34            1 :         if (!isOpen) return;
      35            1 :         let cancelled = false;
      36            1 :         setURL(null);
      37            1 :         exportConnectionAsUrl(params, name, SessionLinkTarget.WEB, { withLoginHint: settings.withLoginHint })
      38            1 :             .then(link => { if (!cancelled) setURL(link.toString()); })
      39            1 :             .catch(() => { if (!cancelled) setURL(null); });
      40            1 :         return () => {
      41            1 :             cancelled = true;
      42            1 :         };
      43            1 :     }, [params, name, settings.withLoginHint, isOpen]);
      44              : 
      45            1 :     const hasLoginHint = React.useMemo(
      46            1 :         () => isOpen && connectionParamsHaveLoginHint(getConnectionParamsFromStateDetails(database.details)),
      47            1 :         [database.details, isOpen],
      48            1 :     );
      49              : 
      50            1 :     return (
      51            1 :         <AnchoredOverlay
      52            1 :             renderAnchor={() => <div ref={anchorRef} />}
      53            1 :             open={isOpen}
      54            1 :             onClose={() => setIsOpen(false)}
      55            1 :             anchorRef={anchorRef}
      56            1 :             align={AnchorAlignment.End}
      57            1 :             overlayProps={{
      58            1 :                 initialFocusRef: buttonRef,
      59            1 :             }}
      60              :         >
      61            1 :             <div className={styles.sharing_overlay} data-testid="connection-share-overlay">
      62            1 :                 <ShareURLField url={url} ariaLabel="Connection share URL" buttonRef={buttonRef} />
      63            1 :                 <SessionExportSettingsView
      64            1 :                     withCatalog={false}
      65            1 :                     withLoginHint={hasLoginHint}
      66            1 :                     withSessionParts={false}
      67            1 :                     settings={settings}
      68            1 :                     setSettings={setSettings}
      69            1 :                 />
      70            1 :             </div>
      71            1 :         </AnchoredOverlay>
      72              :     );
      73            1 : };