-
-
Notifications
You must be signed in to change notification settings - Fork 2.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: pressable card title #4191
base: main
Are you sure you want to change the base?
Conversation
src/components/Card/CardTitle.tsx
Outdated
@@ -169,7 +176,18 @@ const CardTitle = ({ | |||
) : null} | |||
|
|||
<View style={[styles.titles]}> | |||
{title && ( | |||
{title && onPressTitle ? ( | |||
<TouchableOpacity onPress={onPressTitle} style={[styles.title]}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Avoid code repetition and move the title outside the render then used wrapped in pressable and without it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
After moving the Title component from the render, I did the same for subtitle to keep preserve coding style consistency, also had to rename some variables
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Are the changes okay? Or Is there something I have to correct? @lukewalczak
src/components/Card/CardTitle.tsx
Outdated
@@ -169,7 +176,18 @@ const CardTitle = ({ | |||
) : null} | |||
|
|||
<View style={[styles.titles]}> | |||
{title && ( | |||
{title && onPressTitle ? ( | |||
<TouchableOpacity onPress={onPressTitle} style={[styles.title]}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use Pressable
instead of TouchableOpacity
Motivation
I needed the option to press the card title
Test plan
Two test cases on the Card.Title component
- Card.Title without onPressTitle props {...props, onPressTitle:undefined}
make sure the card functions normally
- Card.Title with onPressTitle props = () => {Alert.alert("Pressed")}
Both are tested in the Card example👇
After press event on card title