acetheking987/bsky-social-app
1
0
Fork 0
Code Issues Actions Packages Projects Releases 1 Wiki Activity

[Sheets] [Pt. 9] Normalize RNGH pressable, use in remaining places (#5575)

Browse Source 
Co-authored-by: Samuel Newman <mozzius@protonmail.com>
This commit is contained in:
Hailey
2024-10-02 21:34:12 -07:00
committed by GitHub
parent a458b4b26a
commit 9039e93ae2
7 changed files with 41 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Button.tsx
+7 -7
View File
@@ -89,7 +89,7 @@ export type ButtonProps = Pick<
style?: StyleProp<ViewStyle>
hoverStyle?: StyleProp<ViewStyle>
children: NonTextElements | ((context: ButtonContext) => NonTextElements)
Component?: React.ComponentType<PressableProps>
PressableComponent?: React.ComponentType<PressableProps>
}
export type ButtonTextProps = TextProps & VariantProps & {disabled?: boolean}
@@ -117,7 +117,7 @@ export const Button = React.forwardRef<View, ButtonProps>(
disabled = false,
style,
hoverStyle: hoverStyleProp,
Component,
PressableComponent,
...rest
},
ref,
@@ -125,11 +125,11 @@ export const Button = React.forwardRef<View, ButtonProps>(
// This will pick the correct default pressable to use. If we are inside a dialog, we need to use the RNGH
// pressable so that it is usable inside the dialog.
const {insideDialog} = useDialogContext()
if (!Component) {
if (!PressableComponent) {
if (insideDialog) {
Component = NormalizedRNGHPressable
PressableComponent = NormalizedRNGHPressable
} else {
Component = Pressable
PressableComponent = Pressable
}
}
@@ -464,7 +464,7 @@ export const Button = React.forwardRef<View, ButtonProps>(
const flattenedBaseStyles = flatten([baseStyles, style])
return (
<Component
<PressableComponent
role="button"
accessibilityHint={undefined} // optional
{...rest}
@@ -516,7 +516,7 @@ export const Button = React.forwardRef<View, ButtonProps>(
<Context.Provider value={context}>
{typeof children === 'function' ? children(context) : children}
</Context.Provider>
</Component>
</PressableComponent>
)
},
)
src/components/ReportDialog/SubmitView.tsx
+3 -1
View File
@@ -16,6 +16,7 @@ import * as Toggle from '#/components/forms/Toggle'
import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check'
import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron'
import {Loader} from '#/components/Loader'
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
import {Text} from '#/components/Typography'
import {ReportDialogProps} from './types'
@@ -153,7 +154,8 @@ export function SubmitView({
<Toggle.Item
key={labeler.creator.did}
name={labeler.creator.did}
label={title}>
label={title}
PressableComponent={NormalizedRNGHPressable}>
<LabelerToggle title={title} />
</Toggle.Item>
)
src/components/dialogs/MutedWords.tsx
+15 -7
View File
@@ -30,6 +30,7 @@ import {PageText_Stroke2_Corner0_Rounded as PageText} from '#/components/icons/P
import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus'
import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times'
import {Loader} from '#/components/Loader'
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
import * as Prompt from '#/components/Prompt'
import {Text} from '#/components/Typography'
@@ -168,7 +169,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word until you unmute it`)}
name="forever"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -183,7 +185,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word for 24 hours`)}
name="24_hours"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -207,7 +210,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word for 7 days`)}
name="7_days"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -222,7 +226,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word for 30 days`)}
name="30_days"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -256,7 +261,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word in post text and tags`)}
name="content"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -272,7 +278,8 @@ function MutedWordsInner() {
<Toggle.Item
label={_(msg`Mute this word in tags only`)}
name="tag"
style={[a.flex_1]}>
style={[a.flex_1]}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
@@ -302,7 +309,8 @@ function MutedWordsInner() {
name="exclude_following"
style={[a.flex_row, a.justify_between]}
value={excludeFollowing}
onChange={setExcludeFollowing}>
onChange={setExcludeFollowing}
PressableComponent={NormalizedRNGHPressable}>
<TargetToggle>
<View style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
<Toggle.Checkbox />
src/components/dialogs/PostInteractionSettingsDialog.tsx
+3 -1
View File
@@ -37,6 +37,7 @@ import * as Toggle from '#/components/forms/Toggle'
import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check'
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
import {Loader} from '#/components/Loader'
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
import {Text} from '#/components/Typography'
export type PostInteractionSettingsFormProps = {
@@ -303,7 +304,8 @@ export function PostInteractionSettingsForm({
}
value={quotesEnabled}
onChange={onChangeQuotesEnabled}
style={[, a.justify_between, a.pt_xs]}>
style={[a.justify_between, a.pt_xs]}
PressableComponent={NormalizedRNGHPressable}>
<Text style={[t.atoms.text_contrast_medium]}>
{quotesEnabled ? (
<Trans>Quote posts enabled</Trans>
src/components/forms/Toggle.tsx
+6 -4
View File
@@ -1,9 +1,9 @@
import React from 'react'
import {Pressable, View, ViewStyle} from 'react-native'
import {Pressable, PressableProps, View, ViewStyle} from 'react-native'
import Animated, {LinearTransition} from 'react-native-reanimated'
import {HITSLOP_10} from '#/lib/constants'
import {isNative} from '#/platform/detection'
import {HITSLOP_10} from 'lib/constants'
import {
atoms as a,
flatten,
@@ -68,6 +68,7 @@ export type ItemProps = ViewStyleProp & {
onChange?: (selected: boolean) => void
isInvalid?: boolean
children: ((props: ItemState) => React.ReactNode) | React.ReactNode
PressableComponent?: React.ComponentType<PressableProps>
}
export function useItemContext() {
@@ -159,6 +160,7 @@ export function Item({
style,
type = 'checkbox',
label,
PressableComponent = Pressable,
...rest
}: ItemProps) {
const {
@@ -206,7 +208,7 @@ export function Item({
return (
<ItemContext.Provider value={state}>
<Pressable
<PressableComponent
accessibilityHint={undefined} // optional
hitSlop={HITSLOP_10}
{...rest}
@@ -231,7 +233,7 @@ export function Item({
onBlur={onBlur}
style={[a.flex_row, a.align_center, a.gap_sm, flatten(style)]}>
{typeof children === 'function' ? children(state) : children}
</Pressable>
</PressableComponent>
</ItemContext.Provider>
)
}
src/view/com/auth/server-input/index.tsx
+7 -2
View File
@@ -12,6 +12,7 @@ import * as TextField from '#/components/forms/TextField'
import * as ToggleButton from '#/components/forms/ToggleButton'
import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe'
import {InlineLinkText} from '#/components/Link'
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
import {P, Text} from '#/components/Typography'
export function ServerInputDialog({
@@ -82,7 +83,10 @@ export function ServerInputDialog({
label="Preferences"
values={fixedOption}
onChange={setFixedOption}>
<ToggleButton.Button name={BSKY_SERVICE} label={_(msg`Bluesky`)}>
<ToggleButton.Button
name={BSKY_SERVICE}
label={_(msg`Bluesky`)}
PressableComponent={NormalizedRNGHPressable}>
<ToggleButton.ButtonText>
{_(msg`Bluesky`)}
</ToggleButton.ButtonText>
@@ -90,7 +94,8 @@ export function ServerInputDialog({
<ToggleButton.Button
testID="customSelectBtn"
name="custom"
label={_(msg`Custom`)}>
label={_(msg`Custom`)}
PressableComponent={NormalizedRNGHPressable}>
<ToggleButton.ButtonText>
{_(msg`Custom`)}
</ToggleButton.ButtonText>
src/view/com/util/post-ctrls/RepostButton.tsx
-1
View File
@@ -156,7 +156,6 @@ let RepostButton = ({
</View>
<Button
label={_(msg`Cancel quote post`)}
onAccessibilityEscape={close}
onPress={close}
size="large"
variant="solid"