mappls-search-widgets-react-native/utils/bottomSheet.js

Mappls React Native Search Widget is a readymade widget used to search

import React from 'react';
import {View, Text, StyleSheet, ActivityIndicator} from 'react-native';

 const BottomSheet = props => {
  const data = props.address ? (
    <View>
      <Text style={styles.heading}>{props.label}</Text>
      <Text style={styles.address}>{props.address}</Text>
    </View>
  ) : (
    <View
      style={{
        alignItems: 'center',
        justifyContent: 'center',
        flex: 1,
        height: 100,
      }}>
      <ActivityIndicator animating={true} size="large" color="red" />
    </View>
  );

  return (
    <View
      style={{
        backgroundColor: 'white',
        borderTopRightRadius: 15,
        borderTopLeftRadius: 15,
      }}>
      {data}
      <View style={{height: 1, backgroundColor: 'rgb(211,211,211)'}} />
    </View>
  );
};

const styles = StyleSheet.create({
  heading: {
    margin: 10,
    fontSize: 20,
  },

  address: {
    marginLeft: 10,
    marginRight: 10,
    marginBottom: 10,
    color: 'grey',
  },
});

export default BottomSheet;