chore: use Object.assign instead of direct assign

Author: bang9

packages/uikit-react-native-foundation/src/components/Icon/index.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 import { Image, ImageStyle, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
 
 import { FileType, convertFileTypeToMessageType, getFileIconFromMessageType } from '@sendbird/uikit-utils';
@@ -17,10 +17,8 @@ type Props = {
   style?: StyleProp<ImageStyle>;
   containerStyle?: StyleProp<ViewStyle>;
 };
-const Icon: ((props: Props) => ReactNode) & {
-  Assets: typeof IconAssets;
-  File: typeof FileIcon;
-} = ({ icon, color, size = 24, containerStyle, style }) => {
+
+const Icon = ({ icon, color, size = 24, containerStyle, style }: Props) => {
   const sizeStyle = sizeStyles[size as SizeFactor] ?? { width: size, height: size };
   const { colors } = useUIKitTheme();
   return (
@@ -68,6 +66,7 @@ const sizeStyles = createStyleSheet({
   },
 });
 
-Icon.Assets = IconAssets;
-Icon.File = FileIcon;
-export default Icon;
+export default Object.assign(Icon, {
+  Assets: IconAssets,
+  File: FileIcon,
+});

packages/uikit-react-native-foundation/src/styles/createScaleFactor.ts

@@ -10,9 +10,9 @@ const createScaleFactor = (deviceWidth = DESIGNED_DEVICE_WIDTH) => {
   return (dp: number) => PixelRatio.roundToNearestPixel(dp * rangedRatio);
 };
 
-createScaleFactor.updateScaleFactor = (scaleFactor: (dp: number) => number) => {
-  DEFAULT_SCALE_FACTOR = scaleFactor;
-};
-
 export let DEFAULT_SCALE_FACTOR = createScaleFactor();
-export default createScaleFactor;
+export default Object.assign(createScaleFactor, {
+  updateScaleFactor: (scaleFactor: (dp: number) => number) => {
+    DEFAULT_SCALE_FACTOR = scaleFactor;
+  },
+});

packages/uikit-react-native-foundation/src/ui/Avatar/index.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode, useState } from 'react';
+import React, { useState } from 'react';
 import { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
 
 import { conditionChaining } from '@sendbird/uikit-utils';
@@ -10,24 +10,15 @@ import useUIKitTheme from '../../theme/useUIKitTheme';
 import AvatarGroup from './AvatarGroup';
 import AvatarIcon from './AvatarIcon';
 
-type SubComponents = {
-  Group: typeof AvatarGroup;
-  Icon: typeof AvatarIcon;
-};
 type Props = {
   uri?: string;
   size?: number;
   square?: boolean;
   muted?: boolean;
   containerStyle?: StyleProp<ViewStyle>;
 };
-const Avatar: ((props: Props) => ReactNode) & SubComponents = ({
-  uri,
-  square,
-  muted = false,
-  size = 56,
-  containerStyle,
-}) => {
+
+const Avatar = ({ uri, square, muted = false, size = 56, containerStyle }: Props) => {
   const { colors, palette } = useUIKitTheme();
   const [loadFailure, setLoadFailure] = useState(false);
 
@@ -74,6 +65,7 @@ const styles = createStyleSheet({
   },
 });
 
-Avatar.Group = AvatarGroup;
-Avatar.Icon = AvatarIcon;
-export default Avatar;
+export default Object.assign(Avatar, {
+  Group: AvatarGroup,
+  Icon: AvatarIcon,
+});

packages/uikit-react-native-foundation/src/ui/Header/index.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import React from 'react';
 import { TouchableOpacity, TouchableOpacityProps, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
@@ -26,11 +26,7 @@ export type HeaderProps = BaseHeaderProps<
 >;
 
 const AlignMapper = { left: 'flex-start', center: 'center', right: 'flex-end' } as const;
-const Header: ((props: HeaderProps) => ReactNode) & {
-  Button: typeof HeaderButton;
-  Title: typeof HeaderTitle;
-  Subtitle: typeof HeaderSubtitle;
-} = ({
+const Header = ({
   children,
   titleAlign,
   title = null,
@@ -41,7 +37,7 @@ const Header: ((props: HeaderProps) => ReactNode) & {
   clearTitleMargin = false,
   clearStatusBarTopInset = false,
   statusBarTopInsetAs = 'padding',
-}) => {
+}: HeaderProps) => {
   const { topInset, defaultTitleAlign, defaultHeight } = useHeaderStyle();
 
   const { colors } = useUIKitTheme();
@@ -183,7 +179,8 @@ const styles = createStyleSheet({
   },
 });
 
-Header.Button = HeaderButton;
-Header.Title = HeaderTitle;
-Header.Subtitle = HeaderSubtitle;
-export default Header;
+export default Object.assign(Header, {
+  Button: HeaderButton,
+  Title: HeaderTitle,
+  Subtitle: HeaderSubtitle,
+});