Apply suggestions from code review
Co-authored-by: surfdude29 <149612116+surfdude29@users.noreply.github.com>
This commit is contained in:
@@ -211,7 +211,7 @@ export function StepHandle() {
|
|||||||
<Requirement>
|
<Requirement>
|
||||||
{!validCheck.hyphenStartOrEnd ? (
|
{!validCheck.hyphenStartOrEnd ? (
|
||||||
<RequirementText>
|
<RequirementText>
|
||||||
<Trans>Doesn't begin or end with a hyphen</Trans>
|
<Trans>Username cannot begin or end with a hyphen</Trans>
|
||||||
</RequirementText>
|
</RequirementText>
|
||||||
) : (
|
) : (
|
||||||
<RequirementText>
|
<RequirementText>
|
||||||
@@ -225,7 +225,7 @@ export function StepHandle() {
|
|||||||
!validCheck.totalLength) && (
|
!validCheck.totalLength) && (
|
||||||
<RequirementText>
|
<RequirementText>
|
||||||
<Trans>
|
<Trans>
|
||||||
No longer than{' '}
|
Username cannot be longer than{' '}
|
||||||
<Plural
|
<Plural
|
||||||
value={MAX_SERVICE_HANDLE_LENGTH}
|
value={MAX_SERVICE_HANDLE_LENGTH}
|
||||||
other="# characters"
|
other="# characters"
|
||||||
@@ -265,7 +265,7 @@ function RequirementText({children}: {children: React.ReactNode}) {
|
|||||||
const t = useTheme()
|
const t = useTheme()
|
||||||
return (
|
return (
|
||||||
<Text style={[a.text_sm, a.flex_1, {color: t.palette.negative_500}]}>
|
<Text style={[a.text_sm, a.flex_1, {color: t.palette.negative_500}]}>
|
||||||
<Trans>{children}</Trans>
|
{children}
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -300,7 +300,12 @@ function HandleSuggestions({
|
|||||||
]}>
|
]}>
|
||||||
{suggestions.map((suggestion, index) => (
|
{suggestions.map((suggestion, index) => (
|
||||||
<Button
|
<Button
|
||||||
label={_(msg`Select ${suggestion.handle}`)}
|
label={_(
|
||||||
|
msg({
|
||||||
|
message: `Select ${suggestion.handle}`,
|
||||||
|
comment: `Accessibility label for a username suggestion in the account creation flow`,
|
||||||
|
}),
|
||||||
|
)}
|
||||||
key={index}
|
key={index}
|
||||||
onPress={() => onSelect(suggestion)}
|
onPress={() => onSelect(suggestion)}
|
||||||
hoverStyle={[t.atoms.bg_contrast_25]}
|
hoverStyle={[t.atoms.bg_contrast_25]}
|
||||||
@@ -326,7 +331,9 @@ function HandleSuggestions({
|
|||||||
]}>
|
]}>
|
||||||
<Text style={[a.text_md]}>{suggestion.handle}</Text>
|
<Text style={[a.text_md]}>{suggestion.handle}</Text>
|
||||||
<Text style={[a.text_sm, {color: t.palette.positive_700}]}>
|
<Text style={[a.text_sm, {color: t.palette.positive_700}]}>
|
||||||
<Trans>Available</Trans>
|
<Trans comment="Shown next to an available username suggestion in the account creation flow">
|
||||||
|
Available
|
||||||
|
</Trans>
|
||||||
</Text>
|
</Text>
|
||||||
</Button>
|
</Button>
|
||||||
))}
|
))}
|
||||||
|
|||||||
Reference in New Issue
Block a user