UNPKG

@atlaskit/editor-plugin-card

Version:

Card plugin for @atlaskit/editor-core

93 lines (91 loc) 4.86 kB
/** * @jsxRuntime classic * @jsx jsx */ import { useEffect, useMemo } from 'react'; // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports import { css, jsx } from '@emotion/react'; import AnalyticsContext from '@atlaskit/analytics-next/AnalyticsContext'; import { getResolvedAttributesFromStore } from '../../pm-plugins/utils'; import useLinkUpgradeDiscoverability from '../hooks/useLinkUpgradeDiscoverability'; import { isLocalStorageKeyDiscovered, LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK, LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR, markLocalStorageKeyDiscovered, ONE_DAY_IN_MILLISECONDS } from '../local-storage'; import { DiscoveryPulse } from '../Pulse'; // editor adds a standard line-height that is bigger than an inline smart link // due to that the link has a bit of white space around it, which doesn't look right when there is pulse around it var loaderWrapperStyles = css({ // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766 '.loader-wrapper': { // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography lineHeight: 'normal' } }); export var AwarenessWrapper = function AwarenessWrapper(_ref) { var _cardContext$value2; var cardContext = _ref.cardContext, children = _ref.children, getPos = _ref.getPos, isOverlayEnabled = _ref.isOverlayEnabled, isSelected = _ref.isSelected, isResolvedViewRendered = _ref.isResolvedViewRendered, isPulseEnabled = _ref.isPulseEnabled, markMostRecentlyInsertedLink = _ref.markMostRecentlyInsertedLink, pluginInjectionApi = _ref.pluginInjectionApi, url = _ref.url, appearance = _ref.appearance; var linkPosition = useMemo(function () { if (!getPos || typeof getPos === 'boolean') { return undefined; } var pos = getPos(); return typeof pos === 'number' ? pos : undefined; }, [getPos]); var _useLinkUpgradeDiscov = useLinkUpgradeDiscoverability({ url: url, linkPosition: linkPosition || -1, cardContext: cardContext === null || cardContext === void 0 ? void 0 : cardContext.value, pluginInjectionApi: pluginInjectionApi, isOverlayEnabled: isOverlayEnabled, isPulseEnabled: isPulseEnabled }), shouldShowLinkPulse = _useLinkUpgradeDiscov.shouldShowLinkPulse, shouldShowToolbarPulse = _useLinkUpgradeDiscov.shouldShowToolbarPulse, shouldShowLinkOverlay = _useLinkUpgradeDiscov.shouldShowLinkOverlay, isLinkMostRecentlyInserted = _useLinkUpgradeDiscov.isLinkMostRecentlyInserted; // If the toolbar pulse has not yet been invalidated and this is a case where we will be showing it, // we need to invalidate the link pulse too. Toolbar pulse will be invalidated in the corresponding component. if (isSelected && shouldShowToolbarPulse && !isLocalStorageKeyDiscovered(LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR)) { markLocalStorageKeyDiscovered(LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK); } useEffect(function () { if (shouldShowLinkOverlay && isLinkMostRecentlyInserted) { markMostRecentlyInsertedLink(true); } }, [isLinkMostRecentlyInserted, markMostRecentlyInsertedLink, shouldShowLinkOverlay]); var isInline = appearance === 'inline'; var placeholderUniqId = linkPosition || 0; return useMemo(function () { var _cardContext$value; return jsx("span", { css: shouldShowLinkPulse && loaderWrapperStyles // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766 , className: "card", "data-vc": "awareness-wrapper", "data-ssr-placeholder": "awareness-wrapper-".concat(placeholderUniqId), "data-ssr-placeholder-replace": "awareness-wrapper-".concat(placeholderUniqId) }, jsx(AnalyticsContext // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed) , { data: { attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store) } }, jsx(DiscoveryPulse, { localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_SMART_LINK, localStorageKeyExpirationInMs: ONE_DAY_IN_MILLISECONDS, discoveryMode: "start", shouldShowPulse: isResolvedViewRendered && shouldShowLinkPulse, testId: "link-discovery-pulse", isInline: isInline }, children))); }, [shouldShowLinkPulse, url, cardContext === null || cardContext === void 0 || (_cardContext$value2 = cardContext.value) === null || _cardContext$value2 === void 0 ? void 0 : _cardContext$value2.store, isResolvedViewRendered, children, isInline, placeholderUniqId]); };