import type { ReactElement } from 'react';
import React from 'react';
import type { ViewProps, StyleProp, ViewStyle } from 'react-native';
import { StyledContainer, StyledFocusIcon } from './StyledMapPin';

export interface MapPinFocussedProps extends ViewProps {
  /**
   * Additional style.
   */
  style?: StyleProp<ViewStyle>;
  /**
   * Testing id of the component.
   */
  testID?: string;
}

const MapPinFocussed = ({
  style,
  testID,
  ...nativeProps
}: MapPinFocussedProps): ReactElement => {
  return (
    <StyledContainer {...nativeProps} style={style} testID={testID}>
      <StyledFocusIcon icon="location-on" intent="secondary" />
    </StyledContainer>
  );
};

export default MapPinFocussed;