import React, {ReactNode} from 'react';
import {View, ViewStyle, StyleProp, ImageStyle} from 'react-native';
import HumandLogo from '@assets/humand.svg';
import {Image} from '@components';

interface Props {
  logo?: string;
  containerStyle?: StyleProp<ViewStyle>;
  logoStyle?: StyleProp<ImageStyle>;
  children?: ReactNode;
}

export function CommunityLogo({
  logo,
  containerStyle,
  logoStyle,
  children,
}: Props) {
  return (
    <View style={containerStyle}>
      {logo ? (
        <Image style={logoStyle} source={{uri: logo}} contentFit="contain" />
      ) : (
        <HumandLogo
          width={(logoStyle as ImageStyle)?.width as number}
          height={(logoStyle as ImageStyle)?.height as number}
        />
      )}
      {children}
    </View>
  );
}