feat: extract getPreparedCopyItemOptions & onCopyFulfill to Daskkit p…

…rops
gravity-ui · Nov 13, 2024 · 7eaa5b6 · 7eaa5b6
1 parent d80e9e0
commit 7eaa5b6
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 16 deletions.
diff --git a/src/components/DashKit/DashKit.tsx b/src/components/DashKit/DashKit.tsx
@@ -29,9 +29,10 @@ import {
 import {RegisterManager, UpdateManager, reflowLayout} from '../../utils';
 import DashKitView from '../DashKitView/DashKitView';
 import GridLayout from '../GridLayout/GridLayout';
-import {OverlayControlItem} from '../OverlayControls/OverlayControls';
+import {OverlayControlItem, OverlayControlsCtxShape} from '../OverlayControls/OverlayControls';
 
-interface DashKitGeneralProps {
+interface DashKitGeneralProps
+    extends Pick<OverlayControlsCtxShape, 'getPreparedCopyItemOptions' | 'onCopyFulfill'> {
     config: Config;
     editMode: boolean;
     draggableHandleClassName?: string;

diff --git a/src/components/DashKit/__stories__/DashKitShowcase.tsx b/src/components/DashKit/__stories__/DashKitShowcase.tsx
@@ -18,7 +18,7 @@ import {Button, Icon} from '@gravity-ui/uikit';
 import {ActionPanel, DashKit, DashKitProps} from '../../..';
 import {MenuItems} from '../../../helpers';
 import {i18n} from '../../../i18n';
-import type {ConfigItem, OverlayControlItem, PreparedCopyItemOptions} from '../../../index';
+import type {ConfigItem, OverlayControlItem} from '../../../index';
 import {cn} from '../../../utils/cn';
 
 import {Demo, DemoRow} from './Demo';
@@ -236,10 +236,9 @@ export class DashKitShowcase extends React.Component<{}, DashKitDemoState> {
                         overlayControls={this.state.enableOverlayControls ? this.controls : null}
                         overlayMenuItems={this.state.overlayMenuItems}
                         focusable={true}
-                        context={{
-                            onCopySuccess: (data: PreparedCopyItemOptions) =>
-                                console.info('Copied: ' + JSON.stringify(data)),
-                        }}
+                        onCopyFulfill={(_error, data) =>
+                            console.info('Copied: ' + JSON.stringify(data))
+                        }
                     />
                 </DemoRow>
             </Demo>

diff --git a/src/components/OverlayControls/OverlayControls.tsx b/src/components/OverlayControls/OverlayControls.tsx
@@ -75,7 +75,7 @@ interface OverlayControlsDefaultProps {
     size: ButtonSize;
 }
 
-interface OverlayControlsProps extends OverlayControlsDefaultProps {
+export interface OverlayControlsProps extends OverlayControlsDefaultProps {
     configItem: ConfigItem;
     onItemClick?: () => void | null;
 }
@@ -94,7 +94,7 @@ export type PreparedCopyItemOptions<C extends object = {}> = PreparedCopyItemOpt
     copyContext?: C;
 };
 
-type DashKitCtx = React.Context<{
+export interface OverlayControlsCtxShape {
     overlayControls?: Record<string, OverlayControlItem[]>;
     context: Record<string, any>;
     menu: MenuItem[];
@@ -103,7 +103,11 @@ type DashKitCtx = React.Context<{
     editItem: (item: ConfigItem) => void;
     removeItem: (id: string) => void;
     getLayoutItem: (id: string) => ConfigLayout | void;
-}>;
+    getPreparedCopyItemOptions?: (options: PreparedCopyItemOptions) => PreparedCopyItemOptions;
+    onCopyFulfill?: (error: null | unknown, data?: PreparedCopyItemOptions) => void;
+}
+
+type OverlayControlsCtx = React.Context<OverlayControlsCtxShape>;
 
 const DEFAULT_DROPDOWN_MENU = [MenuItems.Copy, MenuItems.Delete];
 
@@ -114,7 +118,7 @@ class OverlayControls extends React.Component<OverlayControlsProps> {
         view: 'flat',
         size: 'm',
     };
-    context!: React.ContextType<DashKitCtx>;
+    context!: React.ContextType<OverlayControlsCtx>;
     render() {
         const {position} = this.props;
         const items = this.getItems();
@@ -405,18 +409,20 @@ class OverlayControls extends React.Component<OverlayControlsProps> {
             targetInnerId,
         };
 
-        if (typeof this.context.context?.getPreparedCopyItemOptions === 'function') {
+        const getPreparedCopyItemOptions =
+            this.context?.getPreparedCopyItemOptions ??
+            this.context.context?.getPreparedCopyItemOptions;
+
+        if (typeof getPreparedCopyItemOptions === 'function') {
             options = this.context.context.getPreparedCopyItemOptions(options);
         }
 
         try {
             localStorage.setItem(COPIED_WIDGET_STORE_KEY, JSON.stringify(options));
-            if (typeof this.context.context?.onCopySuccess === 'function') {
-                this.context.context.onCopySuccess(options);
-            }
+            this.context.onCopyFulfill?.(null, options);
         } catch (e) {
             if (typeof this.context.context?.onCopyError === 'function') {
-                this.context.context.onCopyError(e);
+                this.context.onCopyFulfill?.(e);
             }
         }
         // https://stackoverflow.com/questions/35865481/storage-event-not-firing

diff --git a/src/hocs/withContext.js b/src/hocs/withContext.js
@@ -520,12 +520,16 @@ function useMemoStateContext(props) {
             editItem: props.onItemEdit,
             removeItem: onItemRemove,
             getLayoutItem: getLayoutItem,
+            getPreparedCopyItemOptions: props.getPreparedCopyItemOptions,
+            onCopyFulfill: props.onCopyFulfill,
         }),
         [
             props.overlayControls,
             props.context,
             props.itemsStateAndParams,
             props.onItemEdit,
+            props.getPreparedCopyItemOptions,
+            props.onCopyFulfill,
             overlayMenuItems,
             itemsParams,
             onItemRemove,