From 56172e9b4987d6d5328fe000b807f29f7236dcaa Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Fri, 20 Oct 2023 14:57:38 +0200
Subject: [PATCH 1/7] Migrate to TS

---
 src/components/SelectCircle.js  | 40 ---------------------------------
 src/components/SelectCircle.tsx | 29 ++++++++++++++++++++++++
 2 files changed, 29 insertions(+), 40 deletions(-)
 delete mode 100644 src/components/SelectCircle.js
 create mode 100644 src/components/SelectCircle.tsx

diff --git a/src/components/SelectCircle.js b/src/components/SelectCircle.js
deleted file mode 100644
index 55e410f8baa1..000000000000
--- a/src/components/SelectCircle.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react';
-import {View} from 'react-native';
-import PropTypes from 'prop-types';
-import styles from '../styles/styles';
-import Icon from './Icon';
-import * as Expensicons from './Icon/Expensicons';
-import themeColors from '../styles/themes/default';
-
-const propTypes = {
-    /** Should we show the checkmark inside the circle */
-    isChecked: PropTypes.bool,
-
-    /** Additional styles to pass to SelectCircle */
-    // eslint-disable-next-line react/forbid-prop-types
-    styles: PropTypes.arrayOf(PropTypes.object),
-};
-
-const defaultProps = {
-    isChecked: false,
-    styles: [],
-};
-
-function SelectCircle(props) {
-    return (
-        <View style={[styles.selectCircle, styles.alignSelfCenter, ...props.styles]}>
-            {props.isChecked && (
-                <Icon
-                    src={Expensicons.Checkmark}
-                    fill={themeColors.iconSuccessFill}
-                />
-            )}
-        </View>
-    );
-}
-
-SelectCircle.propTypes = propTypes;
-SelectCircle.defaultProps = defaultProps;
-SelectCircle.displayName = 'SelectCircle';
-
-export default SelectCircle;
diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
new file mode 100644
index 000000000000..5e8d12cb7308
--- /dev/null
+++ b/src/components/SelectCircle.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import {View} from 'react-native';
+import globalStyles from '../styles/styles';
+import Icon from './Icon';
+import * as Expensicons from './Icon/Expensicons';
+import themeColors from '../styles/themes/default';
+
+type SelectCircleProps = {
+    /** Should we show the checkmark inside the circle */
+    isChecked: boolean;
+
+    /** Additional styles to pass to SelectCircle */
+    styles: Array<Record<string, unknown>>;
+};
+
+function SelectCircle({isChecked, styles}: SelectCircleProps) {
+    return (
+        <View style={[globalStyles.selectCircle, globalStyles.alignSelfCenter, ...styles]}>
+            {isChecked && (
+                <Icon
+                    src={Expensicons.Checkmark}
+                    fill={themeColors.iconSuccessFill}
+                />
+            )}
+        </View>
+    );
+}
+
+export default SelectCircle;

From dcb7386abe23c70b18457faf8272421bc70495fc Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Fri, 20 Oct 2023 15:04:36 +0200
Subject: [PATCH 2/7] Restore default values

---
 src/components/SelectCircle.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 5e8d12cb7308..97939f7acff5 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -13,7 +13,7 @@ type SelectCircleProps = {
     styles: Array<Record<string, unknown>>;
 };
 
-function SelectCircle({isChecked, styles}: SelectCircleProps) {
+function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {
     return (
         <View style={[globalStyles.selectCircle, globalStyles.alignSelfCenter, ...styles]}>
             {isChecked && (

From 0b620d03f96c8c88c68e7fbf4c34b9581d091877 Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Mon, 23 Oct 2023 21:30:07 +0200
Subject: [PATCH 3/7] Use StyleProp

---
 src/components/SelectCircle.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 97939f7acff5..776fed4180dc 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import {View} from 'react-native';
+import {StyleProp, View, ViewStyle} from 'react-native';
 import globalStyles from '../styles/styles';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';
@@ -10,12 +10,12 @@ type SelectCircleProps = {
     isChecked: boolean;
 
     /** Additional styles to pass to SelectCircle */
-    styles: Array<Record<string, unknown>>;
+    styles: StyleProp<ViewStyle>;
 };
 
 function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {
     return (
-        <View style={[globalStyles.selectCircle, globalStyles.alignSelfCenter, ...styles]}>
+        <View style={[globalStyles.selectCircle, globalStyles.alignSelfCenter, styles]}>
             {isChecked && (
                 <Icon
                     src={Expensicons.Checkmark}
@@ -26,4 +26,6 @@ function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {
     );
 }
 
+SelectCircle.displayName = 'SelectCircle';
+
 export default SelectCircle;

From f8b0614b6af1211bed7ce314d08b0149921a3c65 Mon Sep 17 00:00:00 2001
From: MaciejSWM <85628901+MaciejSWM@users.noreply.github.com>
Date: Wed, 25 Oct 2023 21:30:41 +0200
Subject: [PATCH 4/7] Make styles optional
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Fábio Henriques <fabio.lacerda@outlook.com>
---
 src/components/SelectCircle.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 776fed4180dc..0afb18988bf3 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -10,7 +10,7 @@ type SelectCircleProps = {
     isChecked: boolean;
 
     /** Additional styles to pass to SelectCircle */
-    styles: StyleProp<ViewStyle>;
+    styles?: StyleProp<ViewStyle>;
 };
 
 function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {

From 8196502b0cdf451a1d249e34f22f221c238e850f Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Wed, 25 Oct 2023 21:48:19 +0200
Subject: [PATCH 5/7] Optional styles

---
 src/components/SelectCircle.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 776fed4180dc..0afb18988bf3 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -10,7 +10,7 @@ type SelectCircleProps = {
     isChecked: boolean;
 
     /** Additional styles to pass to SelectCircle */
-    styles: StyleProp<ViewStyle>;
+    styles?: StyleProp<ViewStyle>;
 };
 
 function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {

From fd366982524512102e66097439163d57eef89d61 Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Thu, 26 Oct 2023 13:02:00 +0200
Subject: [PATCH 6/7] Drop default value - undefined works too

---
 src/components/SelectCircle.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 0afb18988bf3..489f8774b61e 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -13,7 +13,7 @@ type SelectCircleProps = {
     styles?: StyleProp<ViewStyle>;
 };
 
-function SelectCircle({isChecked = false, styles = []}: SelectCircleProps) {
+function SelectCircle({isChecked = false, styles}: SelectCircleProps) {
     return (
         <View style={[globalStyles.selectCircle, globalStyles.alignSelfCenter, styles]}>
             {isChecked && (

From 6535ceaf10edb94cc37d396d6e73f9ce599fa60f Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Thu, 2 Nov 2023 10:51:42 +0100
Subject: [PATCH 7/7] Reorder imports - eslint

---
 src/components/SelectCircle.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx
index 6bf43edbc67a..cf8ee6af975d 100644
--- a/src/components/SelectCircle.tsx
+++ b/src/components/SelectCircle.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import {StyleProp, View, ViewStyle} from 'react-native';
-import themeColors from '@styles/themes/default';
 import globalStyles from '@styles/styles';
+import themeColors from '@styles/themes/default';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';