import { FC } from 'react';
import { ImageBackground, Text, ScrollView } from 'react-native';
import type { NavigationProp } from '@react-navigation/native';

import { Header, PageWrapper } from '../../../components';
import { styles } from './styles';

type Props = {
  navigation: NavigationProp<any>;
};

export const FixersInfoScreen: FC<Props> = ({ navigation }) => {
  return (
    <PageWrapper>
      <Header label={'Fixers'} />
      <ImageBackground
        style={styles.background}
        source={require('../../../../assets/images/nm-background.png')}
      >
        <ScrollView
          style={styles.wrapper}
          showsVerticalScrollIndicator={false}
          contentContainerStyle={styles.contentContainerStyle}
        >
          <Text style={styles.text}>
            This section is meant to provide contact details of fixers in challenging places as
            suggested by our own travellers.{'\n'}
            {'\n'}Advertising is strictly not allowed - the idea is for you to recommend local
            fixers/experts that you experienced directly and you would recommend. Only trusted users
            can add an entry!{'\n'}
            {'\n'}Thanks for your input.
          </Text>
        </ScrollView>
      </ImageBackground>
    </PageWrapper>
  );
};
