Refine structure

src/components/Separator.tsx

@@ -0,0 +1,31 @@
+import { StyleConstants } from '@utils/styles/constants'
+import { useTheme } from '@utils/styles/ThemeManager'
+import React from 'react'
+import { StyleSheet, View } from 'react-native'
+
+export interface Props {
+  extraMarginLeft?: number
+  extraMarginRight?: number
+}
+
+const ComponentSeparator = React.memo(
+  ({ extraMarginLeft = 0, extraMarginRight = 0 }: Props) => {
+    const { theme } = useTheme()
+
+    return (
+      <View
+        style={{
+          borderTopColor: theme.border,
+          borderTopWidth: StyleSheet.hairlineWidth,
+          marginLeft:
+            StyleConstants.Spacing.Global.PagePadding + extraMarginLeft,
+          marginRight:
+            StyleConstants.Spacing.Global.PagePadding + extraMarginRight
+        }}
+      />
+    )
+  },
+  () => true
+)
+
+export default ComponentSeparator