From eee071f4803270e871470856fa8b770e841dab3b Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Mon, 23 Oct 2023 22:04:10 +0200
Subject: [PATCH 1/7] Migrate to Typescript

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

diff --git a/src/components/TextWithEllipsis/index.js b/src/components/TextWithEllipsis/index.js
deleted file mode 100644
index 1734e24b03b6..000000000000
--- a/src/components/TextWithEllipsis/index.js
+++ /dev/null
@@ -1,54 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {View} from 'react-native';
-import Text from '../Text';
-import styles from '../../styles/styles';
-import stylePropTypes from '../../styles/stylePropTypes';
-import * as StyleUtils from '../../styles/StyleUtils';
-
-const propTypes = {
-    /** Leading text before the ellipsis */
-    leadingText: PropTypes.string.isRequired,
-
-    /** Text after the ellipsis */
-    trailingText: PropTypes.string.isRequired,
-
-    /** Styles for leading and trailing text */
-    textStyle: stylePropTypes,
-
-    /** Styles for leading text View */
-    leadingTextParentStyle: stylePropTypes,
-
-    /** Styles for parent View */
-    wrapperStyle: stylePropTypes,
-};
-
-const defaultProps = {
-    textStyle: {},
-    leadingTextParentStyle: {},
-    wrapperStyle: {},
-};
-
-function TextWithEllipsis(props) {
-    return (
-        <View style={[styles.flexRow, ...StyleUtils.parseStyleAsArray(props.wrapperStyle)]}>
-            <View style={[styles.flexShrink1, ...StyleUtils.parseStyleAsArray(props.leadingTextParentStyle)]}>
-                <Text
-                    style={[...StyleUtils.parseStyleAsArray(props.textStyle)]}
-                    numberOfLines={1}
-                >
-                    {props.leadingText}
-                </Text>
-            </View>
-            <View style={styles.flexShrink0}>
-                <Text style={props.textStyle}>{props.trailingText}</Text>
-            </View>
-        </View>
-    );
-}
-
-TextWithEllipsis.propTypes = propTypes;
-TextWithEllipsis.defaultProps = defaultProps;
-TextWithEllipsis.displayName = 'TextWithEllipsis';
-
-export default TextWithEllipsis;
diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
new file mode 100644
index 000000000000..02bfe8789f22
--- /dev/null
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import {StyleProp, TextStyle, View, ViewStyle} from 'react-native';
+import Text from '../Text';
+import styles from '../../styles/styles';
+
+type TextWithEllipsisProps = {
+    /** Leading text before the ellipsis */
+    leadingText: string;
+
+    /** Text after the ellipsis */
+    trailingText: string;
+
+    /** Styles for leading and trailing text */
+    textStyle: TextStyle;
+
+    /** Styles for leading text View */
+    leadingTextParentStyle: StyleProp<ViewStyle>;
+
+    /** Styles for parent View */
+    wrapperStyle: StyleProp<ViewStyle>;
+}
+
+function TextWithEllipsis({leadingText, trailingText, textStyle = {}, leadingTextParentStyle = {}, wrapperStyle = {}}: TextWithEllipsisProps) {
+    return (
+        <View style={[styles.flexRow, wrapperStyle]}>
+            <View style={[styles.flexShrink1, leadingTextParentStyle]}>
+                <Text style={textStyle}>
+                    {leadingText}
+                </Text>
+            </View>
+            <View style={styles.flexShrink0}>
+                <Text style={textStyle}>{trailingText}</Text>
+            </View>
+        </View>
+    );
+}
+
+TextWithEllipsis.displayName = 'TextWithEllipsis';
+
+export default TextWithEllipsis;

From cce1657467c1fd28641977db1d2260f39b433dd1 Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Mon, 23 Oct 2023 22:06:14 +0200
Subject: [PATCH 2/7] Eslint - semicolons and blank lines

---
 src/components/TextWithEllipsis/index.tsx | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 02bfe8789f22..44171914e60b 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -18,15 +18,13 @@ type TextWithEllipsisProps = {
 
     /** Styles for parent View */
     wrapperStyle: StyleProp<ViewStyle>;
-}
+};
 
 function TextWithEllipsis({leadingText, trailingText, textStyle = {}, leadingTextParentStyle = {}, wrapperStyle = {}}: TextWithEllipsisProps) {
     return (
         <View style={[styles.flexRow, wrapperStyle]}>
             <View style={[styles.flexShrink1, leadingTextParentStyle]}>
-                <Text style={textStyle}>
-                    {leadingText}
-                </Text>
+                <Text style={textStyle}>{leadingText}</Text>
             </View>
             <View style={styles.flexShrink0}>
                 <Text style={textStyle}>{trailingText}</Text>

From 7c0cb500dcfbe77b9470cfae96a3dbfbb27ea974 Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Thu, 26 Oct 2023 10:55:31 +0200
Subject: [PATCH 3/7] Make styles optional

---
 src/components/TextWithEllipsis/index.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 44171914e60b..23cf7907e3b0 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -11,13 +11,13 @@ type TextWithEllipsisProps = {
     trailingText: string;
 
     /** Styles for leading and trailing text */
-    textStyle: TextStyle;
+    textStyle?: TextStyle;
 
     /** Styles for leading text View */
-    leadingTextParentStyle: StyleProp<ViewStyle>;
+    leadingTextParentStyle?: StyleProp<ViewStyle>;
 
     /** Styles for parent View */
-    wrapperStyle: StyleProp<ViewStyle>;
+    wrapperStyle?: StyleProp<ViewStyle>;
 };
 
 function TextWithEllipsis({leadingText, trailingText, textStyle = {}, leadingTextParentStyle = {}, wrapperStyle = {}}: TextWithEllipsisProps) {

From 76e62e6952b5f043a45e06864dd271c4890b978e Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Thu, 26 Oct 2023 11:51:47 +0200
Subject: [PATCH 4/7] Drop default values - undefined works too

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

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 23cf7907e3b0..349ce5871d37 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -20,7 +20,7 @@ type TextWithEllipsisProps = {
     wrapperStyle?: StyleProp<ViewStyle>;
 };
 
-function TextWithEllipsis({leadingText, trailingText, textStyle = {}, leadingTextParentStyle = {}, wrapperStyle = {}}: TextWithEllipsisProps) {
+function TextWithEllipsis({leadingText, trailingText, textStyle, leadingTextParentStyle, wrapperStyle}: TextWithEllipsisProps) {
     return (
         <View style={[styles.flexRow, wrapperStyle]}>
             <View style={[styles.flexShrink1, leadingTextParentStyle]}>

From 0f69e7ceec613f127c862b7b268708744bb4e6e5 Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Tue, 31 Oct 2023 18:48:25 +0100
Subject: [PATCH 5/7] Better typescript

---
 src/components/TextWithEllipsis/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 349ce5871d37..979db8083968 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -11,7 +11,7 @@ type TextWithEllipsisProps = {
     trailingText: string;
 
     /** Styles for leading and trailing text */
-    textStyle?: TextStyle;
+    textStyle?: StyleProp<TextStyle>;
 
     /** Styles for leading text View */
     leadingTextParentStyle?: StyleProp<ViewStyle>;
@@ -24,7 +24,7 @@ function TextWithEllipsis({leadingText, trailingText, textStyle, leadingTextPare
     return (
         <View style={[styles.flexRow, wrapperStyle]}>
             <View style={[styles.flexShrink1, leadingTextParentStyle]}>
-                <Text style={textStyle}>{leadingText}</Text>
+                <Text style={textStyle} numberOfLines={1}>{leadingText}</Text>
             </View>
             <View style={styles.flexShrink0}>
                 <Text style={textStyle}>{trailingText}</Text>

From 4dfcc00cfe3cb5d483067f8e11dc3fd23916187f Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Tue, 31 Oct 2023 18:50:24 +0100
Subject: [PATCH 6/7] Use alias imports

---
 src/components/TextWithEllipsis/index.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 979db8083968..992530ed8a64 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import {StyleProp, TextStyle, View, ViewStyle} from 'react-native';
-import Text from '../Text';
-import styles from '../../styles/styles';
+import Text from '@components/Text';
+import styles from '@styles/styles';
 
 type TextWithEllipsisProps = {
     /** Leading text before the ellipsis */

From d934a6ce6ec02b99163cb8e446e74ac264193dcd Mon Sep 17 00:00:00 2001
From: Maciej Dobosz <maciej.dobosz@swmansion.com>
Date: Tue, 31 Oct 2023 18:51:46 +0100
Subject: [PATCH 7/7] Break into multiple lines

---
 src/components/TextWithEllipsis/index.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx
index 992530ed8a64..1afa05309337 100644
--- a/src/components/TextWithEllipsis/index.tsx
+++ b/src/components/TextWithEllipsis/index.tsx
@@ -24,7 +24,12 @@ function TextWithEllipsis({leadingText, trailingText, textStyle, leadingTextPare
     return (
         <View style={[styles.flexRow, wrapperStyle]}>
             <View style={[styles.flexShrink1, leadingTextParentStyle]}>
-                <Text style={textStyle} numberOfLines={1}>{leadingText}</Text>
+                <Text
+                    style={textStyle}
+                    numberOfLines={1}
+                >
+                    {leadingText}
+                </Text>
             </View>
             <View style={styles.flexShrink0}>
                 <Text style={textStyle}>{trailingText}</Text>