Highlighting the update stack options when navigating to the instance update settings

[cstns]

Description

Added a new composable that can highlight elements on a page by center scrolling and adding an animation.

Clicking the update button on the instance overview now navigates and highlights the update stack options.

Related Issue(s)

closes #4153

Checklist

• I have read the contribution guidelines
• Suitable unit/system level tests have been added and they pass
• Documentation has been updated
  • Upgrade instructions
  • Configuration details
  • Concepts
• Changes flowforge.yml?
  • Issue/PR raised on FlowFuse/helm to update ConfigMap Template
  • Issue/PR raised on FlowFuse/CloudProject to update values for Staging/Production

Labels

• Includes a DB migration? -> add the area:migration label

[cstns]

went with the animate-bounce animation as it was predefined in tailwind and was the easiest to use

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 78.17%. Comparing base (552a608) to head (717bcff).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #4321   +/-   ##
=======================================
  Coverage   78.17%   78.17%           
=======================================
  Files         292      292           
  Lines       13430    13430           
  Branches     3010     3010           
=======================================
  Hits        10499    10499           
  Misses       2931     2931           

Flag	Coverage Δ
backend	78.17% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[knolleary]

Can you attach a screen recording to show the result?

[cstns]

This is the animate-bounce with tailwind:

animate-bounce.mp4

this is with a custom implementation that I have stashed locally but didn't make the cut:

custom-pop-up.mp4

[joepavitt]

Not a fan of the animations, too exaggerated, and doesn't really fit with the surrounding content well...

I'm open to a new animation on just the button, just to expand/contract the button itself a couple of times so that it's highlighted?

[cstns]

I'll come up with a couple of alternatives

[cstns]

Here's a subtle jiggle variant:

jiggle-highlight.mp4