[HOLD for payment 2023-10-27] [$250] Dev: Emojipicker in Set status page has a text cursor instead of pointer

[kbecciv]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: Dev 1.3.79.3
Reproducible in staging?: n
Reproducible in production?: n
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @ishpaul777
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1696763872801869

Action Performed:

Pre condition: Make sure you have Beta for status feature

1. Navigate to Profile -> Status -> Set Status
2. Hover on Emoji Picker Drop Down Button

Expected Result:

Emojipicker Dropdown button has a pointer cursor

Actual Result:

Emojipicker Dropdown button has a text cursor.

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Android: Native

n/a

Android: mWeb Chrome

n/a

iOS: Native

n/a

iOS: mWeb Safari

n/a

MacOS: Chrome / Safari

Screen.Recording.2023-10-08.at.4.42.59.PM.mov

MacOS: Desktop

Screen.Recording.2023-10-08.at.4.51.16.PM.mov

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~018aae903757e06f35
• Upwork Job ID: 1711460039105232896
• Last Price Increase: 2023-10-10
• Automatic offers:
• ishpaul777 | Contributor | 27225708
• ishpaul777 | Reporter | 27225711

Issue Owner

Current Issue Owner: @JmillsExpensify

[melvin-bot]

Unable to auto-create job on Upwork. The BZ team member should create it manually for this issue. cc @thienlnam

[saranshbalyan-1234]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Emojipicker in Set status page has a "text" cursor instead of pointer

What is the root cause of that problem?

We have not added styles for pointer cursor here.

App/src/styles/styles.js

Lines 3539 to 3550 in 389d7b0

	emojiPickerButtonDropdown: {
	justifyContent: 'center',
	backgroundColor: theme.activeComponentBG,
	width: 86,
	height: 52,
	borderRadius: 26,
	alignItems: 'center',
	paddingLeft: 10,
	paddingRight: 4,
	marginBottom: 32,
	alignSelf: 'flex-start',
	},

What changes do you think we should make in order to solve the problem?

add ...cursor.cursorPointer at the end of emojiPickerButtonDropdown

  emojiPickerButtonDropdown: {
        justifyContent: 'center',
        backgroundColor: theme.activeComponentBG,
        width: 86,
        height: 52,
        borderRadius: 26,
        alignItems: 'center',
        paddingLeft: 10,
        paddingRight: 4,
        marginBottom: 32,
        alignSelf: 'flex-start',
        ...cursor.cursorPointer,

    },

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @allroundexperts (External)

[kbecciv]

Proposal by: @ishpaul777
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1696763872801869

Proposal

Problem

Emojipicker in Set status page has a "text" cursor instead of pointer

Root Cause

We are setting the accessibilityRole="text" for PressableWithoutFeedback used for the dropdown which result in curesor style as "text" I have aasked clarifying question why we used "text" instead of "button" (here)[https://github.com//pull/23267]

Changes

We can change accessibilityRole=CONST.ACCESSIBILITY_ROLE.BUTTON or expilicty add cursor style to cursorPointer and cursorDisabled when disabled

Reply…
Also send to expensify-bugs

[ishpaul777]

edit : Fixed some typos from ^

Proposal

Problem

Emojipicker in Set status page has a "text" cursor instead of pointer

Root Cause

We are setting the accessibilityRole="text" for PressableWithoutFeedback used for the dropdown which result in cursor style as "text". I have asked clarifying question why we used "text" instead of "button" here

Changes

We can change accessibilityRole=CONST.ACCESSIBILITY_ROLE.BUTTON or expilicty add cursor style to cursorPointer and cursorDisabled when disabled

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~018aae903757e06f35