chore: translate Item to TS (#280)

Co-authored-by: Yury Kornilov <[email protected]>

Author: ykornilov

src/components/GridLayout/GridLayout.tsx

@@ -31,6 +31,7 @@ import type {
 
 const hasPluginId = (value: PluginRef): value is {props: {id: string}} => {
     return (
+        value !== null &&
         'props' in value &&
         typeof value.props === 'object' &&
         value.props !== null &&

src/components/Item/Item.js renamed to src/components/Item/Item.tsx

@@ -1,16 +1,28 @@
 import React from 'react';
 
-import PropTypes from 'prop-types';
-
 import {prepareItem} from '../../hocs/prepareItem';
+import type {ConfigItem} from '../../shared/types';
+import type {PluginRef, PluginWidgetProps} from '../../typings';
 import {cn} from '../../utils/cn';
+import type {RegisterManager} from '../../utils/register-manager';
 
 import './Item.scss';
 
 const b = cn('dashkit-item');
 
+type ItemProps = {
+    registerManager: RegisterManager;
+    rendererProps: Omit<PluginWidgetProps, 'onBeforeLoad'>;
+    type: string;
+    isPlaceholder?: boolean;
+    forwardedPluginRef?: (pluginRef: PluginRef) => void;
+    onItemRender?: (item: ConfigItem) => void;
+    onItemMountChange?: (item: ConfigItem, meta: {isAsync: boolean; isMounted: boolean}) => void;
+    item: ConfigItem;
+};
+
 // TODO: getDerivedStateFromError и заглушка с ошибкой
-const Item = ({
+const Item: React.FC<ItemProps> = ({
     registerManager,
     rendererProps,
     type,
@@ -50,6 +62,8 @@ const Item = ({
                 });
             };
         }
+
+        return undefined;
     }, []);
 
     const onLoad = React.useCallback(() => {
@@ -88,15 +102,4 @@ const Item = ({
     );
 };
 
-Item.propTypes = {
-    forwardedPluginRef: PropTypes.any,
-    rendererProps: PropTypes.object,
-    registerManager: PropTypes.object,
-    type: PropTypes.string,
-    isPlaceholder: PropTypes.bool,
-    onItemRender: PropTypes.func,
-    onItemMountChange: PropTypes.func,
-    item: PropTypes.object,
-};
-
 export default prepareItem(Item);

src/typings/plugin.ts

@@ -41,10 +41,16 @@ export interface PluginWidgetProps<T = StringParams> {
 
 export type PluginDefaultLayout = Partial<Omit<WidgetLayout, 'i'>>;
 
-export type PluginRef = React.RefObject<any> | Record<string, unknown>;
+export type PluginRef = object | null;
 
 export interface Plugin<P extends PluginWidgetProps<T> = any, T = StringParams> extends PluginBase {
     defaultLayout?: PluginDefaultLayout;
-    renderer: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;
-    placeholderRenderer?: (props: P, forwardedRef: React.RefObject<any>) => React.ReactNode;
+    renderer: (
+        props: P,
+        forwardedRef: ((instance: PluginRef) => void) | undefined,
+    ) => React.ReactNode;
+    placeholderRenderer?: (
+        props: P,
+        forwardedRef: ((instance: PluginRef) => void) | undefined,
+    ) => React.ReactNode;
 }