RI-7479 Rework the vector search onboarding screen

[valkirilov]

Description

Make adjustments to the behavior and the visuals of the Onboarding screen that users see when they open the Vector Search page for the first time

• no longer silently mark the onboarding as seen, unless it's explicitly dismissed by the user (video bellow)
• update the spacings (after discussion with the designer) to match what we have in Figma and ignore Redis UI

How it was tested

Manually

1. Open existing database (or connect to a new instance)
2. Go to the Search page (click on the corresponding link in the main navbar)
3. You'll land on the new onboarding screen, presenting the Vector Search feature

• clicking on the "X" button in the top right corner will dismiss the screen
• clicking on the "Skip for now" button will dismiss the screen
• clicking on the "Explore vector search" button will lead you to the Create Index wizard, but won't dismiss the onboarding. Next time you open the Vector Search page, you'll see the onboarding screen again.

Screen.Recording.2025-09-17.at.11.20.15.mov

Automatic e2e tests

There are also e2e tests to verify the new onboarding screen.

You can always refer to the README, but simply running the following commands should do the trick for you

# From the root directory
yarn dev:api

# In a new tab, again from the root directory
yarn dev:ui

# In a new tab, but this time go to tests/playwright directory
yarn test:chromium:local-web vector-search/onboarding

# Then, check the detailed report and all the video recordings
yarn playwright show-report

[github-actions]

Code Coverage - Frontend unit tests

St.❔	Category	Percentage	Covered / Total
🟢	Statements	82.05%	19968/24335
🟡	Branches	67.42%	8650/12830
🟡	Functions	76.22%	5326/6988
🟢	Lines	82.47%	19549/23703

Test suite run success

5127 tests passing in 676 suites.

Report generated by 🧪jest coverage report action from 29c4d68