App: [$500] [Wave 6: Tags] Allow for multiple levels of tags on workspace requests

Part of the Wave 6: Tags project

Main issue: https://github.com/Expensify/App/issues/32828 Doc section: N/A (Orignal tags doc is here: https://docs.google.com/document/d/1eXGKhdUP98f6RUVYpRzxLi49El9Rizeqq-EYjrF24tU/edit) Project: https://github.com/orgs/Expensify/projects/73

Feature Description

We already support multiple levels of tags on policies in Expensify and within our workspaces. Our current code assumes you have a single tag list. We need to update it to juggle the potential for multiple tags. Thankfully, from there, the rest of the framework is already in place. We will do this by:

  • Updating MoneyRequestConfirmationList to retrieve all tags in the policy instead of just the first here. Then, when rendering the MenuItem for tag, iteratively render a single MenuItem for each tag here. The same applies to MoneyTemporaryForRefactorRequestConfirmationList.
  • Do the same thing in MoneyRequestView.
  • Adjusting the routes for tags to incorporate the tag index (discussion). This means adjusting the current routes for editing/selecting tags in the following way:
    • ${iouType}/new/tag/${reportID} -> ${iouType}/new/tag/0/${reportID}
    • create/${iouType}/tag/${transactionID}/${reportID}/ -> create/${iouType}/tag/0/${transactionID}/${reportID}/
    • r/:threadReportID/edit/:field -> r/:threadReportID/edit/:field/0
  • Then for the tag we send to the API, we create a string of all tags, by order of index, delimited by colons, like so tag1:tag2:tag3. The Expensify API already understands this format.
  • For displaying the tag, for instance when we have the tag key from getTransactionDetails, we should split the tag by the colon delimiter and display each in it’s corresponding index.
  • We’ll need to create a method that translates a tag index to a tag name. This would correspond to the order a tag appears in the policyTags_ OnyxKey: Screenshot 2024-01-04 at 12 06 11 PM
  • For any “Modified Expense” message, anytime we change a single tag level, we’ll just display the entire colon-delimited tag, like we do on OldDot:
    • Screenshot 2024-01-04 at 2 27 49 PM

Manual Test Steps

  1. In OldDot, create a policy with multiple tags. One can do this by following the instructions here, and using the following csv with multiple tag levels: independentTags.csv
  2. Create a new workspace request
  3. Make sure you see a row rendered for each tag in the workspace
  4. Make sure that selection works for each row, and that the appropriate list of tags show for the appropriate level.
  5. Save the request, make sure that the tags save properly on the expense
  6. Open the recently saved request, make sure that the saved tag selections show up in the correct rows.
  7. Edit the request, again make sure that the selections work the same as when you created the expense, and save properly.

cc @amyevans @rezkiy37 @waterim @puneetlath

Upwork Automation - Do Not Edit
  • Upwork Job URL: https://www.upwork.com/jobs/~0131596ecedabdad1c
  • Upwork Job ID: 1744420931750514688
  • Last Price Increase: 2024-01-08

About this issue

  • Original URL
  • State: open
  • Created 6 months ago
  • Comments: 48 (38 by maintainers)

Most upvoted comments

As for the violations beta I see that you’ve been added - can you confirm the email is right there? Screenshot 2024-02-01 at 11 46 50 AM

Perhaps log in and out of the app? Or clear the local Onyx cache entirely?

@rezkiy37 yeah I think that’s out of the scope of this PR.

Added you to the beta!

@rezkiy37 That looks good to me! Tapping in @cead22 for a second set of eyes.

@yuwenmemon, I just imported those tags and they have “GL” in their titles. So, no tech. features behind that, just naming.

Haha okay cool 👍 😄

Implementing logic to process a string like tags for rendering and business + API layer.

Thanks @rezkiy37 - do let me know if you need anything from the API that you think is missing.

Worked on another task. Going to continue with this one tomorrow.

Yeah, makes sense. It is clear now. Thank you!

Also, I consider a transformation from tags object to array. I am going to use the index based on position inside the array.

This makes sense to me, yes.

what do you think about storing tags in transaction drafts?

@rezkiy37 I think it would be best to store the tag as a single string delimited by colons, aka Accounting:North America:Project 7 - as that’s what the API is expecting and how the tags are stored in the db:

         created = 2023-09-26
   transactionID = 3622990993903110271
          cardID = 2
        reportID = 341010080006119
       receiptID = 
          amount = -2000
        merchant = 3434
             mcc = 0
           state = -3
         comment = {"comment":""}
             tag = Ops:Asia:Project 2
      externalID = 
            memo = 
        inserted = 2023-09-26 05:17:11
        currency = USD
 modifiedCreated = 
  modifiedAmount = 
modifiedMerchant = 
     modifiedMCC = 
        category = Car
 transactionHash = hash2C5B23D78998401AB6C0301F1FBE870D5C55AE4C
modifiedCurrency = 

Furthermore, looking at your screenshot I don’t think it’s necessary to show the GL for now.

Actively working on the issue.

I’ve started to investigate the feature. I will let you know if any questions appear, thank you!

Thanks @rezkiy37! Let me know if you have any questions and if there’s any updates you’d like to see on the back-end that we overlooked.

Hi, I’m Michael (Mykhailo) from Callstack and I would like to work on this issue.