zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Tags menu/muted words improvements (#3002)

Browse source 
* Fix translations

* Handle loooong words

* Truncate on desktop web, revert mobile changes

* Break the words

* Small enough for mobile web

* Fix alignment on mobile web

* Clarify
This commit is contained in:
Eric Bailey 2024-02-27 16:04:49 -06:00 • committed by GitHub
parent 6717f8f11e
commit 978bcc1ba9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 53 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/view/com/util/forms/NativeDropdown.tsx
View file

@ -1,7 +1,7 @@
import React from 'react'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import * as DropdownMenu from 'zeego/dropdown-menu'
import {Pressable, StyleSheet, Platform, View} from 'react-native'
import {Pressable, StyleSheet, Platform, View, ViewStyle} from 'react-native'
import {IconProp} from '@fortawesome/fontawesome-svg-core'
import {MenuItemCommonProps} from 'zeego/lib/typescript/menu'
import {usePalette} from 'lib/hooks/usePalette'
@ -151,6 +151,7 @@ type Props = {
testID?: string
accessibilityLabel?: string
accessibilityHint?: string
triggerStyle?: ViewStyle
}
/* The `NativeDropdown` function uses native iOS and Android dropdown menus.

7
src/view/com/util/forms/NativeDropdown.web.tsx
View file

@ -1,7 +1,7 @@
import React from 'react'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
import {Pressable, StyleSheet, View, Text} from 'react-native'
import {Pressable, StyleSheet, View, Text, ViewStyle} from 'react-native'
import {IconProp} from '@fortawesome/fontawesome-svg-core'
import {MenuItemCommonProps} from 'zeego/lib/typescript/menu'
import {usePalette} from 'lib/hooks/usePalette'
@ -53,6 +53,7 @@ type Props = {
testID?: string
accessibilityLabel?: string
accessibilityHint?: string
triggerStyle?: ViewStyle
}
export function NativeDropdown({
@ -61,6 +62,7 @@ export function NativeDropdown({
testID,
accessibilityLabel,
accessibilityHint,
triggerStyle,
}: React.PropsWithChildren<Props>) {
const pal = usePalette('default')
const theme = useTheme()
@ -120,7 +122,8 @@ export function NativeDropdown({
accessibilityLabel={accessibilityLabel}
accessibilityHint={accessibilityHint}
onPress={() => setOpen(o => !o)}
hitSlop={HITSLOP_10}>
hitSlop={HITSLOP_10}
style={triggerStyle}>
{children}
</Pressable>
</DropdownMenu.Trigger>