<SafeAreaView style={fixedStyles.modalContentStyle}>
  <Item style={fixedStyles.filterItem}>
    <Input value={this.state.filterStr} placeholder='Filter...' onChange={this.filterChange} ref={this.setRef} disableFullscreenUI={true}/>
  </Item>
  
  <KeyboardAwareFlatList
    style={fixedStyles.flatList}
    data={this.state.items}
    keyExtractor={this.keyExtractor}
    renderItem={this.renderItem}
    ListEmptyComponent={!this.state.loaded ? loadingText : (this.props.noResultsText || noResultsText)}
    removeClippedSubviews={true}
    maxToRenderPerBatch={pageSize / 2}
    initialNumToRender={pageSize}
    onEndReached={this.loadMore}
    onEndReachedThreshold={0.6}
    keyboardShouldPersistTaps={'handled'}
    enableResetScrollToCoords={false}
  />

  <View style={{width: '100%', flexDirection: 'row', justifyContent: 'space-between'}}>

    {this.props.close ?
      <Button
        onPress={this.props.onCancel}
        iconLeft
        transparent
        black
        >
        <Icon name='close' type='AntDesign'></Icon>
        <Text>{this.props.cancelButtonText || "Close"}</Text>
      </Button>
    : null}

    {this.props.extraAction || null}

    {!this.props.required ?
      <Button
        onPress={this.clear}
        transparent
        noSpacing={this.props.showTotal}
        black
      >
        <Text>{"Clear"}</Text>
      </Button>
    : null}

    {this.props.showTotal?
      <Button
        transparent
        black
      >
        <Text>{`Total: ${this.state.total}`}</Text>
      </Button>
    : null}
  </View>
</SafeAreaView>