Untitled

if (headerMode === "left")
        return (
            <View style={{
                width: '100%',
                marginTop: StatusBar.currentHeight,
                flexDirection: 'row',
                backgroundColor: COLORS.secondary,
            }}>

                <Text style={{
                    paddingVertical: 16,
                    marginStart: 20,
                    ...FONTS.headerTitle2,
                    color: COLORS.white
                }}>{title}</Text>

                <View style={{
                    flex: 1,
                    justifyContent: 'flex-end',
                    flexDirection: 'row',
                }}>

                    <TouchableOpacity style={{
                        paddingHorizontal: 8,
                        marginEnd: 12,
                        justifyContent: 'center'
                    }}
                        onPress={iconRight2onPress}
                    >

                        {iconRight2}

                    </TouchableOpacity>

                    <TouchableOpacity style={{
                        paddingHorizontal: 8,
                        marginEnd: 16,
                        justifyContent: 'center'
                    }}
                        onPress={iconRight1onPress}
                    >

                        {iconRight1}

                    </TouchableOpacity>

                </View>

            </View>
        );
    else if (headerMode === "middle")
        return (
            <View style={{
                width: '100%',
                marginTop: StatusBar.currentHeight,
                flexDirection: 'row',
                borderBottomColor: '#F7F7F7',
                justifyContent: 'space-between',
                backgroundColor: COLORS.secondary,
            }}>

                <View style={{
                    flex: 1,
                    flexDirection: 'row',
                }}>

                    <TouchableOpacity style={{
                        paddingHorizontal: 8,
                        marginStart: 16,
                        justifyContent: 'center',
                    }}
                        onPress={iconLeftOnPress}
                    >
                        {iconLeft}
                    </TouchableOpacity>

                </View>

                <Text style={{
                    paddingVertical: 16,
                    ...FONTS.headerTitle1,
                    color: COLORS.white,
                }}>{title}</Text>

                <View style={{
                    flex: 1,
                    flexDirection: 'row',
                    justifyContent: 'flex-end',
                }}>

                    <TouchableOpacity style={{
                        paddingHorizontal: 8,
                        justifyContent: 'center',
                    }}
                        onPress={iconRight2onPress}
                    >
                        {iconRight2}
                    </TouchableOpacity>

                    <TouchableOpacity style={{
                        paddingHorizontal: 8,
                        marginEnd: 16,
                        justifyContent: 'center',
                    }}
                        onPress={iconRight1onPress}
                    >
                        {iconRight1}
                    </TouchableOpacity>

                </View>

            </View>
        );