[WIP] Movement Recorder UX Enhancement

[hello-vinitha]

Description

Previously movement recorder was a global setting. When enabled in the Customization mode, the movement recorder would appear as a widget between the header and the panels. This took up significant vertical space on smaller screens. In this feature enhancement, movement recorder appears in a panel below the control buttons in the default view and has additional functionality that allows the user to edit and filter through a list of recorded movements.

Testing procedure

Checkout the feature/move_r_contained branch and launch the interface. As the default layout has changed, you may need to run localStorage.clear() in the webpage console. Movement recorder should appear below the controls similar to below:

Test the following behaviors:

• Save a specific pose
• Save a sequences of movements
• Edit the name of a saved recording
• Delete a saved recording
• Search through a list of saved recordings

TO DOs:

• Add an option in the sidebar to hide the entire movement recorder panel
• The user should not be able to add a tab to the movement recorder panel, or move the movement recorder tab to another panel. The only customization option should be to move the movement recorder panel elsewhere.
• Maintain the state when a recording is being played, allow it to be canceled. User should not be able to play another recording while another is being played.

Before opening a pull request

From the top-level of this repository, run:

• pre-commit run --all-files

To merge

• Squash & Merge

[hello-william]

this passed the functions test... leaving PR open until those 3 additional tasks are completed