javascript – react native orientation is not going to be work on above ios 16.0 model the best way to repair that

The code works simply high quality on Android units and iOS variations as much as 15. Nevertheless, with regards to iOS variations 16 and newer, it begins having issues. Which means that if somebody is utilizing an iPhone or iPad with the newest iOS, the code won’t work as anticipated. This is usually a downside since you need your app to work easily for all customers, no matter their system or iOS model.

import React, { Element, useState } from 'react';
import {
  View,
  Textual content,
  StyleSheet,
  FlatList,
  Picture,
  TouchableOpacity,
  SafeAreaView,
  BackHandler,
} from 'react-native';
import Orientation from 'react-native-orientation'

class InvoiceScreen extends Element {
  constructor(props) {
    tremendous(props);
    this._hitAllInvoice()
    this.state = {
      seen: false,
      from:this.subtractDaysFromDate(new Date(), 10),
      to: new Date(),
      invoice_status: "-1",
      loading: false,
      flag: false,
    }

  }
  componentWillUnmount() {
    BackHandler.addEventListener('hardwareBackPress', this.backPressed);
    Orientation.lockToPortrait()
  }

  componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.backPressed);
    Orientation.lockToLandscape()

  }
  _renderHeader = () => {
    return (
      <View model={{ flexDirection: 'row', marginHorizontal: 5, marginTop: 5, borderBottomWidth:1,  borderBottomColor: '#a5a7a6', }}>
        <View model={[styles.shellStyle, { flex: 0.4, borderTopStartRadius: 10, backgroundColor: "white", }]}>
          <Textual content model={kinds.txtStyle}>{'#'}</Textual content>
        </View>
        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'DATE'}</Textual content>
        </View>
        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'NAME'}</Textual content>
        </View>

        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'CONTACT'}</Textual content>
        </View>

        <View model={[styles.shellStyle,{flex:1.6}]}>
          <Textual content model={kinds.txtStyle}>{'VIN NO.'}</Textual content>
        </View>

        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'INVOICE'}</Textual content>
        </View>

        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'AMOUNT'}</Textual content>
        </View>

        <View model={kinds.shellStyle}>
          <Textual content model={kinds.txtStyle}>{'STATUS'}</Textual content>
        </View>

        <View model={[styles.shellStyle, { borderTopRightRadius: 10, backgroundColor: "white", }]}>
          <Textual content model={kinds.txtStyle}>{'ACTION'}</Textual content>
        </View>
      </View>
    );
  };

  _renderFooter = () => {
    return <View model={{ peak: 0.5, backgroundColor: 'black' }}></View>;
  };

  render() {
    return (

      <View model={[styles.container, { backgroundColor: Colors.whiteText }]}>
        <View model={kinds.container}>
          <Header
            containerStyle={{ paddingHorizontal: 16, paddingVertical: 5 }}
            standing="Bill Sheets"
            iconWidth={26}
            iconHeight={12}
            shade={Colours.whiteText}
            isEditDelete={true}
            delete_icon={require('../property/setting.png')}
            onPress={() => {
              if (this.state.flag == true) {
                this._hitAllInvoice()
                this.setState({
                  flag: false
                })
              }
              else {
                this.props.navigation.navigate('DashboardScreen')
              }
            }}
            // picture={require('../property/menuvertical.png')}
            onModal={() => {
              this.setState({ seen: true })
            }}
            backVisible={true}

          />
          <SearchInput
            onChangeText={(txt) => { this.props.searchInvoice(txt) }}
          />

          <SafeAreaView model={{ marginBottom: 5, flex: 1 }} >
            {this._renderHeader()}
            <FlatList
              information={this.props.invoice_list}
              renderItem={this._renderItem}

              // ListFooterComponent={this._renderFooter}
              keyExtractor={(merchandise, index) => "merchandise" + index}
            />
          </SafeAreaView>
        </View>
        {/* {this.state.loading ? (
          <View
            model={{
              width: '100%',
              peak: '100%',
              justifyContent: 'heart',
              alignItems: 'heart',
              backgroundColor: '#000a',
              elevation: 10,
              place: 'absolute',
            }}>
            <MyLoading
              title="Please anticipate some time..."
            />
          </View>
        ) : null} */}
      </View>

    );
  }
}
const kinds = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'white',
  },
  shellStyle: {
    flex: 1,
    alignItems: 'heart',
    justifyContent: 'heart',
    paddingVertical: 5,
    peak: 35,
    elevation: 2,
    backgroundColor: '#FFFFFF',
    margin: 1,
  },
  txtStyle: {
    fontFamily: Font.SourceSansPro,
    fontSize: 13,
    // peak: 18,
    fontWeight: '700',
    shade: '#3D3D3D',
  },
});

const mapStateToProps = (state) => {
  let s = state.indexReducer;
  let ss = state.indexJasReducer;

  return {
    invoice_list: ss.invoice_list,
    is_loading: s.is_loading,
    vendor_id: s.vendor_id,
    alert_msg: ss.alert_msg,
    search_invoice_list: ss.search_invoice_list,
    print_invoice: s.print_invoice_detail_list,



  };
};

const mapDispatchToProps = (dispatch) => {
  return bindActionCreators(
    {
      hitInvoiceApi: (param) => hitInvoiceApi(param),
      setInvoiceList: (lists) => setInvoiceList(lists),
      resetInvoiceList: () => resetInvoiceList(),
      setAlertMSG: (msg) => setAlertMSG(msg),
      searchInvoice: (checklist) => searchInvoice(checklist),
      selectedInvoice: (contact) => selectedInvoice(contact),

      setAutoCustName: (param) => setAutoCustName(param),
      setEstimateCustId: (param) => setEstimateCustId(param),
      setInvoiceId: (invoice_id) => setInvoiceId(invoice_id),
      setAppointmentId: (appointment_id) => setAppointmentId(appointment_id),
      setEstimateCustVin_no: (param) => setEstimateCustVin_no(param),
      setPrintInvoiceDetails: (checklist) => setPrintInvoiceDetails(checklist),
      hitEmailInvoice: (param) => hitEmailInvoice(param),
      hitInvoiceEmail: (param) => hitInvoiceEmail(param)




    },
    dispatch,
  );
};
export default join(mapStateToProps, mapDispatchToProps)(InvoiceScreen);