refactor: convert all title components

src/components/FormattedText.tsx

@@ -1,6 +1,6 @@
 import { Text } from 'tamagui'
 
-type TextElement = {
+export type TextElement = {
   text: string
   bold?: boolean
   italic?: boolean

src/components/Icon.tsx

@@ -5,6 +5,7 @@ export type IconProps = {
   width?: number
   height?: number
   style?: unknown
+  className?: string
 }
 
 const Icon = ({ source, width = 16, height = 16, ...props }: IconProps) => {

src/components/IconButton.tsx

@@ -2,9 +2,12 @@ import Icon from './Icon'
 import ReactButton from './ReactButton'
 
 type IconButtonProps = {
-  icon: string
   children: string
-  onClick: () => void
+  icon: string
+  style?: unknown
+  size?: string
+  fontSize?: string
+  onClick?: () => void
 }
 
 const IconButton = ({ icon, children, ...props }: IconButtonProps) => {

src/components/ReactButton.tsx

@@ -6,7 +6,7 @@ type ReactButtonProps = {
   style?: unknown
   icon?: ReactNode
   size?: string
-  onClick: () => void
+  onClick?: () => void
 }
 
 const ReactButton = ({ children, ...props }: ReactButtonProps) => {

src/components/Titles.tsx

@@ -1,9 +1,14 @@
 import { XStack, YStack } from 'tamagui'
-import { SubTitle } from './SubTitle'
+import Title from './Title'
-import { Title } from './Title'
+import SubTitle from './SubTitle'
-import { IconButton } from './IconButton'
+import IconButton from './IconButton'
 
-const Titles = ({ title, subtitle }) => {
+type TitlesProps = {
+  title: string
+  subtitle: string
+}
+
+const Titles = ({ title, subtitle }: TitlesProps) => {
   return (
     <YStack>
       <XStack justifyContent="space-between">
@@ -12,13 +17,14 @@ const Titles = ({ title, subtitle }) => {
           style={{
             backgroundColor: 'transparent',
             border: '1px solid #DCE0E5',
+            color: '#09101C',
           }}
-          color={'#09101C'}
           size={'$3'}
           icon={'/icons/reveal.png'}
-          text={'Advanced Settings'}
           fontSize={'$5'}
-        />
+        >
+          Advanced Settings
+        </IconButton>
       </XStack>
       <SubTitle color={'#09101C'}>{subtitle}</SubTitle>
     </YStack>