Tags - After bulk delete, adding tag with same name shows error

izarutskaya 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.34-2 Reproducible in staging?: Y Reproducible in production?: Y Logs: https://stackoverflow.com/c/expensify/questions/4856 Issue reported by: Applause-Internal team

Action Performed:

Launch app
Create a workspace
Enable tags
From old dot, upload below tag file
In new dot, tap tags
Delete "1" tag
Add "1" tag
Note tag "1" can be added without error
Select all tags and delete it
Add "1" tag
Note tag already exists error displayed
Refresh the page
Add "1" tag
Now tag added without error

Expected Result:

After bulk delete, adding tag with same name must not show error and user must able to add tag.

Actual Result:

After bulk delete, adding tag with same name shows tag already exists and user can add tag only after refreshing the page.

Workaround:

Unknown

Platforms:

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

[x] Android: Native
[x] Android: mWeb Chrome
[ ] iOS: Native
[x] iOS: mWeb Safari
[x] MacOS: Chrome / Safari
[ ] MacOS: Desktop

Screenshots/Videos

https://github.com/user-attachments/assets/8d419e5f-8979-4d5b-b155-6a66af5d7aea

Bug6601913_1726207158406!Over_500_tags.csv

View all open jobs on GitHub

melvin-bot[bot] commented 4 days ago

Triggered auto assignment to @abekkala (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.

c3024 commented 4 days ago

Proposal

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

When tags are deleted in bulk and a new tag is created with one of the deleted tags names it throws same name error.

What is the root cause of that problem?

When we delete large number of tags the network request takes significant time and the tags remain till the delete process is complete so this https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/WorkspaceCreateTagPage.tsx#L50-L51 throws an error.

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

We add CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE to each tag optimistically while they are being deleted. https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/libs/actions/Policy/Tag.ts#L301 We can use this check here https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/WorkspaceCreateTagPage.tsx#L50 like

            } else if (tags?.[tagName] && && tags?.[tagName]?.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE) {

What alternative solutions did you explore? (Optional)

dominictb commented 3 days ago

Proposal

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

After bulk delete, adding tag with same name shows tag already exists and user can add tag only after refreshing the page.

What is the root cause of that problem?

In https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/WorkspaceCreateTagPage.tsx#L44 and

https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/EditTagPage.tsx#L45

the tags data we use to compare with the current edit/add tag value contain the tag which has pendingAction: 'delete', that lead to the case: If the tag a is deleted or is pending delete, then we try to create tag a, the error will be shown.

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

We need to update getTagList so that it only return the active tag:


function getTagList(policyTagList: OnyxEntry<PolicyTagLists>, tagIndex: number, onlyActiveTag = false): ValueOf<PolicyTagLists> {
    const tagLists = getTagLists(policyTagList);

    const result = tagLists[tagIndex] ?? {
        name: '',
        required: false,
        tags: {},
    };
    if (!onlyActiveTag) {
        return result;
    }
    return {
        ...result,
        tags: pickBy(result.tags, (child) => !(child.pendingAction === 'delete')),
    };
}

Then in https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/WorkspaceCreateTagPage.tsx#L44 and

https://github.com/Expensify/App/blob/587698f1f4c703bab45d10056551ede97a67abe0/src/pages/workspace/tags/EditTagPage.tsx#L45 we use PolicyUtils.getTagList with onlyActiveTag param is true

What alternative solutions did you explore? (Optional)

melvin-bot[bot] commented 1 day ago

@abekkala Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

Expensify / App