From b738b354e6f188cb99841b32141be051117bcd26 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A5kon=20Underbakke?= <haakonu97@gmail.com>
Date: Wed, 21 Feb 2024 17:57:56 +0100
Subject: [PATCH] refactor: Added types to TableActionList and wrapComponent
 (#15689)

* refactor: added types to TableActionList and wrapComponent

* chore: type ReactNode to ReactElement

* chore: className should be optional in wrapComponent

* chore: changed imports

* chore: fixed type error

---------

Co-authored-by: TJ Egan <tw15egan@gmail.com>
---
 ...{TableActionList.js => TableActionList.ts} |  0
 .../src/components/DataTable/TableHead.tsx    |  4 ++--
 .../{wrapComponent.js => wrapComponent.ts}    | 21 +++++++++++++++----
 3 files changed, 19 insertions(+), 6 deletions(-)
 rename packages/react/src/components/DataTable/{TableActionList.js => TableActionList.ts} (100%)
 rename packages/react/src/tools/{wrapComponent.js => wrapComponent.ts} (72%)

diff --git a/packages/react/src/components/DataTable/TableActionList.js b/packages/react/src/components/DataTable/TableActionList.ts
similarity index 100%
rename from packages/react/src/components/DataTable/TableActionList.js
rename to packages/react/src/components/DataTable/TableActionList.ts
diff --git a/packages/react/src/components/DataTable/TableHead.tsx b/packages/react/src/components/DataTable/TableHead.tsx
index ad5ec19fee07..d615ca317ac8 100644
--- a/packages/react/src/components/DataTable/TableHead.tsx
+++ b/packages/react/src/components/DataTable/TableHead.tsx
@@ -5,12 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, { ThHTMLAttributes } from 'react';
+import { ThHTMLAttributes } from 'react';
 import wrapComponent from '../../tools/wrapComponent';
 
 export type TableHeadProps = ThHTMLAttributes<HTMLTableSectionElement>;
 
-const TableHead: React.FC<TableHeadProps> = wrapComponent({
+const TableHead = wrapComponent({
   name: 'TableHead',
   type: 'thead',
 });
diff --git a/packages/react/src/tools/wrapComponent.js b/packages/react/src/tools/wrapComponent.ts
similarity index 72%
rename from packages/react/src/tools/wrapComponent.js
rename to packages/react/src/tools/wrapComponent.ts
index f99dfbd54cbe..95d02e101959 100644
--- a/packages/react/src/tools/wrapComponent.js
+++ b/packages/react/src/tools/wrapComponent.ts
@@ -5,16 +5,29 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React from 'react';
-import PropTypes from 'prop-types';
 import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
 import { usePrefix } from '../internal/usePrefix';
+import { ReactAttr } from '../types/common';
+
+type HTMLTagName = keyof HTMLElementTagNameMap;
+
+type WrapComponentArgs<T extends HTMLTagName> = {
+  name: string;
+  type: T;
+  className?: string | ((prefix: string) => string);
+};
 
 /**
  * @param {{ name: string, type: string, className?: string | (prefix: string) => string }} props
  * @returns
  */
-const wrapComponent = ({ name, className: getClassName, type }) => {
+const wrapComponent = <T extends HTMLTagName>({
+  name,
+  className: getClassName,
+  type,
+}: WrapComponentArgs<T>): ((props: ReactAttr<T>) => React.ReactElement) => {
   /**
    *
    * @param {{ className?: string, [x: string]: any}} param0
@@ -41,7 +54,7 @@ const wrapComponent = ({ name, className: getClassName, type }) => {
     className: PropTypes.string,
   };
 
-  return Component;
+  return Component as (props: ReactAttr<T>) => React.ReactElement;
 };
 
 export default wrapComponent;