[VisBuilder-Next] Migrate legacy visualizations to visbuilder by mapping the url

[SheyGao]

Description

In this PR, we aim to migrate legacy visualization objects compatible with VisBuilder to VisBuilder objects, enabling users to directly open these legacy objects in VisBuilder. The method involves constructing a URL that navigates directly to the VisBuilder page rendering the object. Key changes to the existing codebase include:

1. Adding a new function, visbuilderEditItem, triggered when users click the Import to VisBuilder button. This function takes a legacy visualization item as input, migrating the states from the visualization object to those required in the VisBuilder URL by calling constructVisBuilderPath, and then navigates to the VisBuilder app with the constructed path to complete the migration.
2. Modifying the existing user interface in Visualize, allowing users to click Editto open the object in its original format or Import to VisBuilder to open it in VisBuilder, instead of only having the Edit option previously.

Issues Resolved

• [Design]Transition of Legacy Visualization to VisBuilder  #7120

Screenshot

1. Migrating an existing area-type legacy visualization object.

Screen.Recording.2024-08-01.at.12.47.47.PM.mov

2. Migrating a newly created line chart.

Screen.Recording.2024-07-31.at.6.42.50.PM.mov

Testing the changes

For testing purposes, we have added unit tests for two files: edit_action_dropdown.test.tsx to verify the updated UI changes, and migrate_url.test.tsx to validate the migration URL functionality. Additional functional tests will be included in a different repository.

Changelog

• feat: [VisBuilder-Next] Migration of legacy visualizations to VisBuilder by constructing the URL.

Check List

• All tests pass
  • yarn test:jest
  • yarn test:jest_integration
• New functionality includes testing.
• New functionality has been documented.
• Update CHANGELOG.md
• Commits are signed per the DCO using --signoff

[github-actions]

ℹ️ Manual Changeset Creation Reminder

Please ensure manual commit for changeset file 7529.yml under folder changelogs/fragments to complete this PR.

If you want to use the available OpenSearch Changeset Bot App to avoid manual creation of changeset file you can install it in your forked repository following this link.

For more information about formatting of changeset files, please visit OpenSearch Auto Changeset and Release Notes Tool.

[github-actions]

❌ Changeset File Not Added Yet

Please ensure manual commit for changeset file 7529.yml under folder changelogs/fragments to complete this PR. File still missing.

[joshuali925]

general question for core team, with force pushes i find it hard to tell what the delta is comparing to the last time i reviewed. Is there a good way to see what changed?

doing a direct .. comparison shows a lot more upstream changes through rebase rather than changes brought by this PR: https://github.com/opensearch-project/OpenSearch-Dashboards/compare/836974a163480915278a090fc0c955243b138d61..a5149689f199a2fabb19f02daf39674a7eea96d9

[opensearch-trigger-bot]

The backport to 2.x failed:

The process '/usr/bin/git' failed with exit code 128

To backport manually, run these commands in your terminal:

# Navigate to the root of your repository
cd $(git rev-parse --show-toplevel)
# Fetch latest updates from GitHub
git fetch
# Create a new working tree
git worktree add ../.worktrees/OpenSearch-Dashboards/backport-2.x 2.x
# Navigate to the new working tree
pushd ../.worktrees/OpenSearch-Dashboards/backport-2.x
# Create a new branch
git switch --create backport/backport-7529-to-2.x
# Cherry-pick the merged commit of this pull request and resolve the conflicts
git cherry-pick -x --mainline 1 231337231be2ad98f7086b154de43339205f9ca6
# Push it to GitHub
git push --set-upstream origin backport/backport-7529-to-2.x
# Go back to the original working tree
popd
# Delete the working tree
git worktree remove ../.worktrees/OpenSearch-Dashboards/backport-2.x

Then, create a pull request where the base branch is 2.x and the compare/head branch is backport/backport-7529-to-2.x.