* add SelectLangBtn * memoized objects that are created to reduce re-creation on re-render * add langs when uploading post * only send the top 3 languages otherwise backend will throw error * mv ContentLanguagesSettings to folder * add post languages settings modal and state * fix typos * modify feed manip to also check langs label on post * Fix tests * Remove log * Update feed-manip.ts * Fix syntax errors * UI tuneups * Show the currently selected languages in the composer * fix linting * Use a bcp-47 matching function * Fix a duplicate language issue * Fix web * Dont include lang in prompt * Make select language btn an observer * Keep device languages on top of language selection UIs * Fix android build settings * Enforce a max of 3 languages in posts * Fix tests * Fix types --------- Co-authored-by: Paul Frazee <pfrazee@gmail.com>
52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
import React from 'react'
|
|
import {StyleSheet, Text, View, Pressable} from 'react-native'
|
|
import LinearGradient from 'react-native-linear-gradient'
|
|
import {s, colors, gradients} from 'lib/styles'
|
|
import {isDesktopWeb} from 'platform/detection'
|
|
import {usePalette} from 'lib/hooks/usePalette'
|
|
|
|
export const ConfirmLanguagesButton = ({
|
|
onPress,
|
|
extraText,
|
|
}: {
|
|
onPress: () => void
|
|
extraText?: string
|
|
}) => {
|
|
const pal = usePalette('default')
|
|
return (
|
|
<View style={[styles.btnContainer, pal.borderDark]}>
|
|
<Pressable
|
|
testID="confirmContentLanguagesBtn"
|
|
onPress={onPress}
|
|
accessibilityRole="button"
|
|
accessibilityLabel="Confirm content language settings"
|
|
accessibilityHint="">
|
|
<LinearGradient
|
|
colors={[gradients.blueLight.start, gradients.blueLight.end]}
|
|
start={{x: 0, y: 0}}
|
|
end={{x: 1, y: 1}}
|
|
style={[styles.btn]}>
|
|
<Text style={[s.white, s.bold, s.f18]}>Done{extraText}</Text>
|
|
</LinearGradient>
|
|
</Pressable>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
btnContainer: {
|
|
paddingTop: 10,
|
|
paddingHorizontal: 10,
|
|
paddingBottom: isDesktopWeb ? 0 : 40,
|
|
borderTopWidth: isDesktopWeb ? 0 : 1,
|
|
},
|
|
btn: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
width: '100%',
|
|
borderRadius: 32,
|
|
padding: 14,
|
|
backgroundColor: colors.gray1,
|
|
},
|
|
})
|