Сгибать динамически при изменении ориентации (перевернуть устройство)

Question

Я еще не готов заблокировать свое приложение в портретном режиме, пока я не уверен, что мы не сможем это выяснить.

Когда-то был контейнер с именем SwipeListView. Это сторонний пакет, если вы не знаете, можете проверить этот перекус: react-native-swipe-list-view. Это работает, но задний слой каждой строки не растягивается на всю ширину экрана, когда я переворачиваю свое устройство (портрет -> пейзаж)

Сам элемент списка растягивается нормально, но задний слой (с кнопками) придерживается своей первоначальной ширины.
Вот SwipeListView с renderItem для данных элемента и renderHiddenItem для заднего слоя для каждого. строка:

<SafeAreaView style={{flex:1}}>
    <SwipeListView
        keyExtractor={Child.keyExtractor}
        data={this.props.children}
        renderItem={(itemInfo, rowMap) => {
            return <ChildListItem child={itemInfo.item}
                onPress={() => console.log("Row pressed: ", itemInfo)} />
        }}
        renderHiddenItem={(itemInfo, rowMap) => {
            return <ChildListHiddenItem child={itemInfo.item}
                onEdit={() => this.props.openEditChildDialog(true, itemInfo.item.id)}
                onDelete={() => this.props.openDeleteChildDialog(true)} />
        }}
        onRowDidOpen={rowKey => console.log(`Row with key ${rowKey} openend`)}
        leftOpenValue={75}
        rightOpenValue={-75}
        previewRowKey={'0'}
        previewOpenValue={-40}
        previewOpenDelay={3000}
    />
</SafeAreaView>

Ради длины я избавлю вас от ChildListItem. Это ChildListHiddenItem:

class CChildListHiddenItem
extends Component<IChildListHiddenItemProps>
implements ComponentLifecycle<IChildListHiddenItemProps, {}> {
    shouldComponentUpdate(nextProps: Readonly<IStyleState>, nextState: Readonly<IStyleState>, nextContext: any): boolean {
        return this.props.orientation !== nextProps.orientation;
    }

    render() {
        const {
            child,
            style,
            onDelete,
            onEdit,
            ...viewProps
        } = this.props;
        return(

            <LinearGradient
                style={[
                    styles.containers.listHiddenItem,
                    {flexBasis: this.props.dimensions.width}, \\ <----- OVER HERE
                    // orientationAwareStyles.apply.flexBasisFull,
                    style
                ]}
                colors={['red','transparent', 'green']}
                start={{x: 0, y: .5}} end={{x: 1, y: .5}}
                locations={[0.1,0.5,0.9]}
                {...viewProps}
            >
                <Buttons.ListDelete onPress={onDelete} />{/* iconName="user-minus" */}
                <Buttons.ListEdit onPress={onEdit} />{/* iconName="user-edit" */}
            </LinearGradient>
        )
    }
}
const mapStateToChildListHiddenItemProps = ((state:IStore) => {
    return {
        orientation: state.style.orientation,
        dimensions: state.style.dimensions,
    };
});

// @ts-ignore
export const ChildListHiddenItem = connect<IStore>(mapStateToChildListHiddenItemProps, null)(CChildListHiddenItem);

и применяемое свойство StyleSheet:

listHiddenItem: {
    flex:1,
    flexDirection: 'row',
    flexBasis: dimWindow.width,
    flexWrap: "nowrap",
    justifyContent: 'space-between',
    height: 50,
},

Я избавлю вас от логики c для обновления this.props.dimensions тоже, потому что я подтвердил, что это значение корректно обновляется, поместив точку останова в функцию рендеринга.

Любые идеи или прошлый опыт?

PS: Если вам это нужно:

Двоичные файлы:
Узел: 13.9.0 - C: \ Program Files \ nodejs \ node.EXE
npm: 6.13.7 - C: \ Program Files \ nodejs \ npm .CMD
IDE:
Android Studio: версия 3.6.0.0 AI-192.7142.36.36.6241897
npmПакеты:
реакция: 16,9,0 => 16,9,0
Reaction-native: ^ 0.61.5 => 0.61.5

Попытка обновления

<View
    style={[
        styles.containers.listHiddenItem,
        {flexBasis: this.props.dimensions.width},
        // orientationAwareStyles.apply.flexBasisFull,
        style
    ]}
    {...viewProps}
>
    <Buttons.ListDelete onPress={onDelete} />{/* iconName="user-minus" */}
    <LinearGradient
        style={{flex:1, flexGrow:1}}
        colors={['red','transparent', 'green']}
        start={{x: 0, y: .5}} end={{x: 1, y: .5}}
        locations={[0.1,0.5,0.9]}
    />
    <Buttons.ListEdit onPress={onEdit} />{/* iconName="user-edit" */}
</View>

LinearGradient опустился на один уровень вниз, используя flexGrow и flexShrink все еще не помогает, что доказывает, что это контейнер, который не обновлен с новым flexBasis