Refine accessibilityHint (#7554)

* `accessibilityHint`

* accessibilityHint

* Update

Co-Authored-By: jason-me <mail@jason-hester.me>

* Update LoginForm.tsx

---------

Co-authored-by: jason-me <mail@jason-hester.me>

src/components/ProgressGuide/FollowDialog.tsx

@@ -762,7 +762,7 @@ function SearchInput({
         autoComplete="off"
         autoCapitalize="none"
         accessibilityLabel={_(msg`Search profiles`)}
-        accessibilityHint={_(msg`Search profiles`)}
+        accessibilityHint={_(msg`Searches for profiles`)}
       />
     </View>
   )

src/components/VideoPostCard.tsx

@@ -112,7 +112,7 @@ export function VideoPostCard({
 
   return (
     <Link
-      accessibilityHint={_(msg`Tap to view video in immersive mode.`)}
+      accessibilityHint={_(msg`Views video in immersive mode`)}
       label={_(msg`Video from ${author.handle}: ${text}`)}
       to={{
         screen: 'VideoFeed',

src/components/dms/dialogs/SearchablePeopleList.tsx

@@ -505,7 +505,7 @@ function SearchInput({
         autoCapitalize="none"
         autoFocus
         accessibilityLabel={_(msg`Search profiles`)}
-        accessibilityHint={_(msg`Search profiles`)}
+        accessibilityHint={_(msg`Searches for profiles`)}
       />
     </View>
   )

src/components/forms/HostingProvider.tsx

@@ -47,7 +47,7 @@ export function HostingProvider({
           </Text>
           <Button
             label={toNiceDomain(serviceUrl)}
-            accessibilityHint={_(msg`Press to change hosting provider`)}
+            accessibilityHint={_(msg`Changes hosting provider`)}
             onPress={onPressSelectService}
             variant="ghost"
             color="secondary"
@@ -63,7 +63,7 @@ export function HostingProvider({
         <Button
           testID="selectServiceButton"
           label={toNiceDomain(serviceUrl)}
-          accessibilityHint={_(msg`Press to change hosting provider`)}
+          accessibilityHint={_(msg`Changes hosting provider`)}
           variant="solid"
           color="secondary"
           style={[

src/components/moderation/ContentHider.tsx

@@ -146,10 +146,10 @@ function ContentHiderActive({
         label={desc.name}
         accessibilityHint={
           modui.noOverride
-            ? _(msg`Learn more about the moderation applied to this content.`)
+            ? _(msg`Learn more about the moderation applied to this content`)
             : override
-            ? _(msg`Hide the content`)
+            ? _(msg`Hides the content`)
-            : _(msg`Show the content`)
+            : _(msg`Shows the content`)
         }>
         {state => (
           <View

src/components/moderation/PostHider.tsx

@@ -76,7 +76,7 @@ export function PostHider({
       }}
       accessibilityRole="button"
       accessibilityHint={
-        override ? _(msg`Hide the content`) : _(msg`Show the content`)
+        override ? _(msg`Hides the content`) : _(msg`Shows the content`)
       }
       accessibilityLabel=""
       style={[

src/screens/Login/LoginForm.tsx

@@ -232,7 +232,7 @@ export const LoginForm = ({
               onSubmitEditing={onPressNext}
               blurOnSubmit={false} // HACK: https://github.com/facebook/react-native/issues/21911#issuecomment-558343069 Keyboard blur behavior is now handled in onSubmitEditing
               editable={!isProcessing}
-              accessibilityHint={_(msg`Input your password`)}
+              accessibilityHint={_(msg`Enter your password`)}
             />
             <Button
               testID="forgotPasswordButton"

src/screens/Messages/components/ChatListItem.tsx

@@ -281,7 +281,7 @@ function ChatListItemReady({
             !isDeletedAccount
               ? _(msg`Go to conversation with ${profile.handle}`)
               : _(
-                  msg`This conversation is with a deleted or a deactivated account. Press for options.`,
+                  msg`This conversation is with a deleted or a deactivated account. Press for options`,
                 )
           }
           accessibilityActions={

src/screens/Onboarding/Layout.tsx

@@ -53,9 +53,7 @@ export function Layout({children}: React.PropsWithChildren<{}>) {
       aria-role="dialog"
       aria-label={dialogLabel}
       accessibilityLabel={dialogLabel}
-      accessibilityHint={_(
+      accessibilityHint={_(msg`Customizes your Bluesky experience`)}
-        msg`The following steps will help customize your Bluesky experience.`,
-      )}
       style={[
         // @ts-ignore web only -prf
         isWeb ? a.fixed : a.absolute,

src/screens/Profile/ErrorState.tsx

@@ -60,7 +60,7 @@ export function ErrorState({error}: {error: string}) {
           color="secondary"
           variant="solid"
           label={_(msg`Go Back`)}
-          accessibilityHint="Return to previous page"
+          accessibilityHint="Returns to previous page"
           onPress={onPressBack}>
           <ButtonText>
             <Trans>Go Back</Trans>

src/screens/Settings/AboutSettings.tsx

@@ -65,7 +65,7 @@ export function AboutSettingsScreen({}: Props) {
           </SettingsList.LinkItem>
           <SettingsList.PressableItem
             label={_(msg`Version ${appVersion}`)}
-            accessibilityHint={_(msg`Copy build version to clipboard`)}
+            accessibilityHint={_(msg`Copies build version to clipboard`)}
             onPress={() => {
               setStringAsync(
                 `Build version: ${appVersion}; Bundle info: ${bundleInfo}; Bundle date: ${BUNDLE_DATE}; Platform: ${Platform.OS}; Platform version: ${Platform.Version}`,

src/screens/Settings/AccountSettings.tsx

@@ -124,7 +124,7 @@ export function AccountSettingsScreen({}: Props) {
           </SettingsList.PressableItem>
           <SettingsList.PressableItem
             label={_(msg`Handle`)}
-            accessibilityHint={_(msg`Open change handle dialog`)}
+            accessibilityHint={_(msg`Opens change handle dialog`)}
             onPress={() => changeHandleControl.open()}>
             <SettingsList.ItemIcon icon={AtIcon} />
             <SettingsList.ItemText>

src/screens/Settings/AppIconSettings/index.tsx

@@ -213,7 +213,7 @@ function AppIcon({icon, size = 50}: {icon: AppIconSet; size: number}) {
   return (
     <PressableScale
       accessibilityLabel={icon.name}
-      accessibilityHint={_(msg`Tap to change app icon`)}
+      accessibilityHint={_(msg`Changes app icon`)}
       targetScale={0.95}
       onPress={() => {
         if (isAndroid) {

src/screens/Settings/Settings.tsx

@@ -101,7 +101,7 @@ export function SettingsScreen({}: Props) {
               <SettingsList.PressableItem
                 label={_(msg`Switch account`)}
                 accessibilityHint={_(
-                  msg`Show other accounts you can switch to`,
+                  msg`Shows other accounts you can switch to`,
                 )}
                 onPress={() => {
                   if (!reducedMotion) {
@@ -205,7 +205,7 @@ export function SettingsScreen({}: Props) {
           <SettingsList.PressableItem
             onPress={() => Linking.openURL(HELP_DESK_URL)}
             label={_(msg`Help`)}
-            accessibilityHint={_(msg`Open helpdesk in browser`)}>
+            accessibilityHint={_(msg`Opens helpdesk in browser`)}>
             <SettingsList.ItemIcon icon={CircleQuestionIcon} />
             <SettingsList.ItemText>
               <Trans>Help</Trans>

src/screens/Settings/components/ChangeHandleDialog.tsx

@@ -537,7 +537,7 @@ function OwnHandlePage({goToServiceHandle}: {goToServiceHandle: () => void}) {
 
         <Button
           label={_(msg`Use default provider`)}
-          accessibilityHint={_(msg`Go back to previous page`)}
+          accessibilityHint={_(msg`Returns to previous page`)}
           onPress={goToServiceHandle}
           variant="outline"
           color="secondary"

src/screens/StarterPack/Wizard/index.tsx

@@ -284,7 +284,7 @@ function WizardInner({
       <Layout.Header.Outer>
         <Layout.Header.BackButton
           label={_(msg`Back`)}
-          accessibilityHint={_(msg`Go back to the previous step`)}
+          accessibilityHint={_(msg`Returns to the previous step`)}
           onPress={evt => {
             if (state.currentStep !== 'Details') {
               evt.preventDefault()

src/screens/VideoFeed/index.tsx

@@ -800,7 +800,7 @@ function Overlay({
                           : _(msg`Follow ${handle}`)
                       }
                       accessibilityHint={
-                        profile.viewer?.following ? _(msg`Unfollow user`) : ''
+                        profile.viewer?.following ? _(msg`Unfollows the user`) : ''
                       }
                       size="small"
                       variant="solid"
@@ -930,7 +930,7 @@ function ExpandableRichTextView({
       />
       {constrained && !screenReaderEnabled && (
         <Pressable
-          accessibilityHint={_(msg`Tap to expand or collapse post text.`)}
+          accessibilityHint={_(msg`Expands or collapses post text`)}
           accessibilityLabel={expanded ? _(msg`Read less`) : _(msg`Read more`)}
           hitSlop={HITSLOP_20}
           onPress={() => setExpanded(prev => !prev)}

src/view/com/composer/Composer.tsx

@@ -1241,7 +1241,7 @@ function ComposerFooter({
                 onPress={onEmojiButtonPress}
                 style={a.p_sm}
                 label={_(msg`Open emoji picker`)}
-                accessibilityHint={_(msg`Open emoji picker`)}
+                accessibilityHint={_(msg`Opens emoji picker`)}
                 variant="ghost"
                 shape="round"
                 color="primary">

src/view/com/composer/ComposerReplyTo.tsx

@@ -70,7 +70,7 @@ export function ComposerReplyTo({replyTo}: {replyTo: ComposerOptsPostRef}) {
         msg`Expand or collapse the full post you are replying to`,
       )}
       accessibilityHint={_(
-        msg`Expand or collapse the full post you are replying to`,
+        msg`Expands or collapses the full post you are replying to`,
       )}>
       <PreviewableUserAvatar
         size={50}

src/view/com/composer/text-input/web/EmojiPicker.web.tsx

@@ -135,7 +135,7 @@ export function EmojiPicker({state, close, pinToTop}: IProps) {
         <Pressable
           accessible
           accessibilityLabel={_(msg`Close emoji picker`)}
-          accessibilityHint={_(msg`Tap to close the emoji picker`)}
+          accessibilityHint={_(msg`Closes the emoji picker`)}
           onPress={close}
           style={[a.fixed, a.inset_0]}
         />
@@ -171,7 +171,7 @@ export function EmojiPicker({state, close, pinToTop}: IProps) {
         <Pressable
           accessible
           accessibilityLabel={_(msg`Close emoji picker`)}
-          accessibilityHint={_(msg`Tap to close the emoji picker`)}
+          accessibilityHint={_(msg`Closes the emoji picker`)}
           onPress={close}
           style={[a.fixed, a.inset_0]}
         />

src/view/com/post-thread/PostThreadItem.tsx

@@ -802,7 +802,7 @@ function BackdatedPostIndicator({post}: {post: AppBskyFeedDefs.PostView}) {
       <Button
         label={_(msg`Archived post`)}
         accessibilityHint={_(
-          msg`Show information about when this post was created`,
+          msg`Shows information about when this post was created`,
         )}
         onPress={e => {
           e.preventDefault()

src/view/com/util/forms/DropdownButton.tsx

@@ -293,7 +293,9 @@ const DropdownItems = ({
                 onPress={() => onPressItem(index)}
                 accessibilityRole="button"
                 accessibilityLabel={item.label}
-                accessibilityHint={_(msg`Option ${index + 1} of ${numItems}`)}>
+                accessibilityHint={_(
+                  msg`Selects option ${index + 1} of ${numItems}`,
+                )}>
                 {item.icon && (
                   <FontAwesomeIcon
                     style={styles.icon}

src/view/com/util/images/AutoSizedImage.tsx

@@ -196,7 +196,7 @@ export function AutoSizedImage({
         onPressIn={onPressIn}
         // alt here is what screen readers actually use
         accessibilityLabel={image.alt}
-        accessibilityHint={_(msg`Tap to view full image`)}
+        accessibilityHint={_(msg`Views full image`)}
         style={[
           a.w_full,
           a.rounded_md,
@@ -218,7 +218,7 @@ export function AutoSizedImage({
           onPressIn={onPressIn}
           // alt here is what screen readers actually use
           accessibilityLabel={image.alt}
-          accessibilityHint={_(msg`Tap to view full image`)}
+          accessibilityHint={_(msg`Views full image`)}
           style={[a.h_full]}>
           {contents}
         </Pressable>

src/view/com/util/post-embeds/ExternalPlayerEmbed.tsx

@@ -56,7 +56,7 @@ function PlaceholderOverlay({
       <Pressable
         accessibilityRole="button"
         accessibilityLabel={_(msg`Play Video`)}
-        accessibilityHint={_(msg`Play Video`)}
+        accessibilityHint={_(msg`Plays the video`)}
         onPress={onPress}
         style={[styles.overlayContainer]}>
         {!isPlayerActive ? (

src/view/com/util/post-embeds/GifEmbed.tsx

@@ -39,7 +39,7 @@ function PlaybackControls({
   return (
     <Pressable
       accessibilityRole="button"
-      accessibilityHint={_(msg`Play or pause the GIF`)}
+      accessibilityHint={_(msg`Plays or pauses the GIF`)}
       accessibilityLabel={isPlaying ? _(msg`Pause`) : _(msg`Play`)}
       style={[
         a.absolute,

src/view/com/util/post-embeds/VideoEmbedInner/VideoEmbedInnerNative.tsx

@@ -132,13 +132,13 @@ function VideoControls({
         onPress={enterFullscreen}
         style={a.flex_1}
         accessibilityLabel={_(msg`Video`)}
-        accessibilityHint={_(msg`Tap to enter full screen`)}
+        accessibilityHint={_(msg`Enters full screen`)}
         accessibilityRole="button"
       />
       <ControlButton
         onPress={togglePlayback}
         label={isPlaying ? _(msg`Pause`) : _(msg`Play`)}
-        accessibilityHint={_(msg`Tap to play or pause`)}
+        accessibilityHint={_(msg`Plays or pauses the video`)}
         style={{left: 6}}>
         {isPlaying ? (
           <PauseIcon width={13} fill={t.palette.white} />
@@ -155,7 +155,7 @@ function VideoControls({
             ? _(msg({message: `Unmute`, context: 'video'}))
             : _(msg({message: `Mute`, context: 'video'}))
         }
-        accessibilityHint={_(msg`Tap to toggle sound`)}
+        accessibilityHint={_(msg`Toggles the sound`)}
         style={{right: 6}}>
         {muted ? (
           <MuteIcon width={13} fill={t.palette.white} />

src/view/screens/ProfileList.tsx

@@ -1007,7 +1007,7 @@ function ErrorScreen({error}: {error: string}) {
         <Button
           type="default"
           accessibilityLabel={_(msg`Go back`)}
-          accessibilityHint={_(msg`Return to previous page`)}
+          accessibilityHint={_(msg`Returns to previous page`)}
           onPress={onPressBack}
           style={{flexShrink: 1}}>
           <Text type="button" style={pal.text}>

src/view/screens/Search/Search.tsx

@@ -807,7 +807,7 @@ export function SearchScreen(
                   hitSlop={HITSLOP_10}
                   label={_(msg`Menu`)}
                   accessibilityHint={_(
-                    msg`Access navigation links and settings`,
+                    msg`Provides access to navigation links and settings`,
                   )}
                   size="large"
                   variant="solid"
@@ -1033,7 +1033,7 @@ function SearchHistory({
                     accessibilityRole="button"
                     accessibilityLabel={_(msg`Remove profile`)}
                     accessibilityHint={_(
-                      msg`Remove profile from search history`,
+                      msg`Removes profile from search history`,
                     )}
                     onPress={() => onRemoveProfileClick(profile)}
                     hitSlop={createHitslop(6)}