Expensify / App

Welcome to New Expensify: a complete re-imagination of financial collaboration, centered around chat. Help us build the next generation of Expensify by sharing feedback and contributing to the code.
https://new.expensify.com
MIT License
3.43k stars 2.8k forks source link

Android - Chat - Both parentheses and code block alignment is not same #49935

Open lanitochka17 opened 4 days ago

lanitochka17 commented 4 days ago

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: 9.0.41-2 Reproducible in staging?: Y Reproducible in production?: Y If this was caught during regression t sting, add the test name, ID and link from TestRail: N/A Issue reported by: Applause - Internal Team

Action Performed:

  1. Launch app in both Android and mweb
  2. Open a chat
  3. Paste the text - def test_code(): print(ode block test)
  4. Send the message
  5. Note code block and Parentheses alignment

Expected Result:

Both parentheses and code block alignment must be same

Actual Result:

In Android, slightly above parentheses, code block is displayed. In mweb, both parentheses and code block display in same line

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Add any screenshot/video evidence

om expensify chat-edit

View all open jobs on GitHub

melvin-bot[bot] commented 4 days ago

Triggered auto assignment to @alexpensify (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

lanitochka17 commented 4 days ago

We think that this bug might be related to #Live Markdown

kushu7 commented 4 days ago

Proposal

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

parentheses and code block alignment is not same mismatch

What is the root cause of that problem?

Its happening because we are providing height here. https://github.com/Expensify/App/blob/1d0fa649cef8726d406ab685475ac975da0f93bd/src/components/InlineCodeBlock/WrappedText.tsx#L62

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

By removing height element from here fixes the issue. This file is used for Android and IOS only. https://github.com/Expensify/App/blob/1d0fa649cef8726d406ab685475ac975da0f93bd/src/components/InlineCodeBlock/WrappedText.tsx#L62

Checked on both android and ios.

Android ![Screenshot_1727716468](https://github.com/user-attachments/assets/c555ccf2-a408-47be-ab1f-e25ed8d1eb57)
Ios ![Simulator Screenshot - iPhone 16 Plus - 2024-09-30 at 22 43 42](https://github.com/user-attachments/assets/74fcacfe-3abc-4193-86a9-d098df788d5b)

What alternative solutions did you explore? (Optional)

None

alexpensify commented 2 days ago

Adding this one to my test list and will get to it later this week.