Story 188083: Multiple commissioning packages

[NoraKri]

AB#188083

Aim of the PR

One of the sprint goals is to implement functionality for creating multiple commissioning packages in one P&ID. This PR aims to complete this sprint goal and add all necessary supporting functionality.

Implementation

A lot has been changed in this PR. Some diffs are only from moving components to new folders (see Additional Changes).

Context
The context has been changed, so that everything related to commissioning packages is stored in one context, and each commissioning package contains information on all the nodes in it. This way, it's easier to check which package an ID belongs to.

We also have a new context containing information on the currently active tool.

Sidebar
A new sidebar has been created. The sidebar contains tools for selecting boundaries and internals, plus a button for creating a new commissioning package, and a dropdown to select active package.

There is also a new TopBar that shows the currently active commissioning package.

Creating a new commissioning package
You can now create new packages by clicking the + icon in the sidebar. The ID will, for now, automatically be prefixed with "asset:". There is no hard validation on the id, but the border around the id will be orange if it contains something other than a-z, 0-9 and -. Each commissioning package has a highlight color.

Creating multiple commissioning packages
Like before, you have an initial package which you can add boundaries and internals to. Then, you can create a new package, and select other boundaries and internals for that package. You should now see two different commissioning packages.

IRI
An attempt has been made to port the IRI creation for CenterLines from the XSLT. There are some issues with placement (e.g knowing if something is preceding or next sibling) This means that you cannot reliably select pipes as boundaries or internals, because the IRI might be wrong.

Known issues
While I have attempted to not allow the user to select components which are already in another package, there is nothing to stop the user from just selecting an internal with no borders. Take this scenario:

• You select borders and internal as normal in the initial package.
• You create a new package.
• In the new package, you select a previously unselected element as internal.
• All elements will be in the new package, regardless of if they are in the initial package or not.

For now, this is difficult to fix, would require some automatic boundary creation. Probably not worth spending time on until new format is ready.

Type of change

• Bug fix
• New feature
• Breaking change
• This change requires a documentation update

How Has This Been Tested?

Tested by logging which completion packages contain which elements, and checking that they don't contain too many elements.
Manual testing in browser of functionality:

• Creating commissioning package
• Changing active package
• Border and internal selection
• Trying to select element which is in another package (does nothing but gives no warning at the moment)
• Inspecting that the color and displayname is correct in the topbar

Additional Changes

• Added some comments in Pandid.tsx to clarify what each loading step does.
• Refactor: Created subfolders for components related to the diagram, and components related to the editor.

[eoye]

Amazing!🤩 the code is very clear and well structured, very good job!
We discussed these points in person, but just writing them here to remember!

• Add the possibility for zooming in
• Update the README
• Add a undo button
• Add table / excel downloads in separate tab from the side menu
• Use Equinor font
• Add possibility to delete packages
• Avoid that everything is deleted on refresh of the page
• Make the clickable area larger on lines and symbols
• Change line thickness on symbols/lines which are chosen as boundaries so that they are easier to see