From 9f40c1319b27e9bf985c24de332d2fb511c4165d Mon Sep 17 00:00:00 2001
From: Pedro Guerreiro <pedro.a.c.guerreiro@gmail.com>
Date: Wed, 29 Nov 2023 16:14:38 +0000
Subject: [PATCH 1/2] refactor(typescript): migrate ReportActionItemGrouped

---
 ...Grouped.js => ReportActionItemGrouped.tsx} | 21 +++++++------------
 1 file changed, 7 insertions(+), 14 deletions(-)
 rename src/pages/home/report/{ReportActionItemGrouped.js => ReportActionItemGrouped.tsx} (50%)

diff --git a/src/pages/home/report/ReportActionItemGrouped.js b/src/pages/home/report/ReportActionItemGrouped.tsx
similarity index 50%
rename from src/pages/home/report/ReportActionItemGrouped.js
rename to src/pages/home/report/ReportActionItemGrouped.tsx
index 8c8c51bda3c2..727c186d5823 100644
--- a/src/pages/home/report/ReportActionItemGrouped.js
+++ b/src/pages/home/report/ReportActionItemGrouped.tsx
@@ -1,22 +1,16 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import {View} from 'react-native';
-import stylePropTypes from '@styles/stylePropTypes';
+import React, {ReactNode} from 'react';
+import {View, ViewStyle} from 'react-native';
 import useThemeStyles from '@styles/useThemeStyles';
 
-const propTypes = {
+type ReportActionItemGroupedProps = {
     /** Children view component for this action item */
-    children: PropTypes.node.isRequired,
+    children: ReactNode;
 
     /** Styles for the outermost View */
-    wrapperStyle: stylePropTypes,
+    wrapperStyle?: ViewStyle;
 };
 
-const defaultProps = {
-    wrapperStyle: undefined,
-};
-
-function ReportActionItemGrouped({wrapperStyle, children}) {
+function ReportActionItemGrouped({wrapperStyle, children}: ReportActionItemGroupedProps) {
     const styles = useThemeStyles();
     return (
         <View style={[styles.chatItem, wrapperStyle]}>
@@ -25,7 +19,6 @@ function ReportActionItemGrouped({wrapperStyle, children}) {
     );
 }
 
-ReportActionItemGrouped.propTypes = propTypes;
-ReportActionItemGrouped.defaultProps = defaultProps;
 ReportActionItemGrouped.displayName = 'ReportActionItemGrouped';
+
 export default ReportActionItemGrouped;

From 9503b57bb3feb1cfb7c5a4dc061faa740ea7a68f Mon Sep 17 00:00:00 2001
From: Pedro Guerreiro <pedro.a.c.guerreiro@gmail.com>
Date: Fri, 1 Dec 2023 10:18:16 +0000
Subject: [PATCH 2/2] refactor: apply pull request feedback

---
 src/pages/home/report/ReportActionItemGrouped.tsx | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/pages/home/report/ReportActionItemGrouped.tsx b/src/pages/home/report/ReportActionItemGrouped.tsx
index 727c186d5823..5e49f7af9d10 100644
--- a/src/pages/home/report/ReportActionItemGrouped.tsx
+++ b/src/pages/home/report/ReportActionItemGrouped.tsx
@@ -1,13 +1,11 @@
-import React, {ReactNode} from 'react';
-import {View, ViewStyle} from 'react-native';
+import React from 'react';
+import {StyleProp, View, ViewStyle} from 'react-native';
 import useThemeStyles from '@styles/useThemeStyles';
+import ChildrenProps from '@src/types/utils/ChildrenProps';
 
-type ReportActionItemGroupedProps = {
-    /** Children view component for this action item */
-    children: ReactNode;
-
+type ReportActionItemGroupedProps = ChildrenProps & {
     /** Styles for the outermost View */
-    wrapperStyle?: ViewStyle;
+    wrapperStyle?: StyleProp<ViewStyle>;
 };
 
 function ReportActionItemGrouped({wrapperStyle, children}: ReportActionItemGroupedProps) {