Allow users to retry copy failures

[vkWeb]

Summary

This PR brings in the capability to retry failed copies and detection of failing copies.

Manual verification steps performed

To generate copy error state on the frontend, I raised an exception from the backend copy function. These are the checks I've performed:-

1. Checked whether error in the changesForSyncing table are detected.
2. Checked whether importing from channels errors out.
3. Checked whether copying completes.
4. Checked whether retrying completes successfully when the exception is removed from the backend code.
5. Checked whether after multiple failures, retrying still reaches success upon exception removal.
6. Copying multiple nodes together by selecting them works as expected.
7. When copy is failed, the node can be removed.

Screenshots (if applicable)

The below screenshot is the current design, it's matching with the expected design. (thanks to sir @bjester for helping me out fix the design).

The below is the UI design that is expected.

Does this introduce any tech-debt items?

Possible tech-debts:-

• the CSS that is used to prevent wrapping retry action can be refactored to make it responsive and robust.
• due to the current architecture, copy error state doesn't persist across sessions.

---

Reviewer guidance

Does manual verification steps checks out green?

References

Closes #2850.
Closes #3914.

---

Contributor's Checklist

PR process:

• If this is an important user-facing change, PR or related issue the CHANGELOG label been added to this PR. Note: items with this label will be added to the CHANGELOG at a later time
• If this includes an internal dependency change, a link to the diff is provided
• The docs label has been added if this introduces a change that needs to be updated in the user docs?
• If any Python requirements have changed, the updated requirements.txt files also included in this PR
• Opportunities for using Google Analytics here are noted
• Migrations are safe for a large db

Studio-specifc:

• All user-facing strings are translated properly
• The notranslate class been added to elements that shouldn't be translated by Google Chrome's automatic translation feature (e.g. icons, user-generated text)
• All UI components are LTR and RTL compliant
• Views are organized into pages, components, and layouts directories as described in the docs
• Users' storage used is recalculated properly on any changes to main tree files
• If there new ways this uses user data that needs to be factored into our Privacy Policy, it has been noted.

Testing:

• Code is clean and well-commented
• Contributor has fully tested the PR manually
• If there are any front-end changes, before/after screenshots are included
• Critical user journeys are covered by Gherkin stories
• Any new interactions have been added to the QA Sheet
• Critical and brittle code paths are covered by unit tests

---

Reviewer's Checklist

This section is for reviewers to fill out.

• Automated test coverage is satisfactory
• PR is fully functional
• PR has been tested for accessibility regressions
• External dependency files were updated if necessary (yarn and pip)
• Documentation is updated
• Contributor is in AUTHORS.md

[vkWeb]

@bjester I've fixed the merge conflict, ready for review & merge.

[bjester]

Some questions, but only two main areas to focus on for requested for changes:

1. Seems undoing a copy isn't working-- there was an issue that was fixed in hotfixes but since you merged that in, I expect it to still work
2. Some CSS issues-- the copy failure text and CTA is causing overflow for smaller widths, and the CTA and message are different font sizes. Additionally, it could use better vertical alignment between the icon, text and CTA

[vkWeb]

Seems undoing a copy isn't working-- there was an issue that was fixed in hotfixes but since you merged that in, I expect it to still work

I tried on hotfixes and unstable, I am not able to undo copying. I think we need to fix it, let's do it with this PR itself @bjester?

Some CSS issues-- the copy failure text and CTA is causing overflow for smaller widths, and the CTA and message are different font sizes. Additionally, it could use better vertical alignment between the icon, text and CTA

Let me try sir fixing those!

[vkWeb]

I checked why undoing copy isn't working. Here's my take sir: the record is being successfully deleted only at the indexed db level, Vuex isn't reflecting it, backend isn't affected as well. Record still exists on the backend.

[bjester]

You're right-- the UNDO of a copy seems to have regressed again

[vkWeb]

@bjester I've fixed the font-size. Fixing font-size seemed to have solved the vertical-alignment problem I feel. So, this is ready for final review and merge sir 🎉 Let me know if it needs anything!

[vkWeb]

While manual testing this, I have observed an edge case. Putting this as draft until I solve it.

[bjester]

@vkWeb There's still some misalignment with the text. I committed one change to your PR, on code that was pre-existing. Let me know if you have questions about that.

[bjester]

Created a new issue for the misalignment of the CTA as discussed. Merging this!