Configuration Editor for machines and targets

[chinchila]

Summary

PR #306 is included in this one. It is advised to close the old one and keep this.

In this PR you can find a new functionality to create and edit configurations for machines, all requirements were discussed in weekly meetings. The structure for configurations we used here is found in the Details section. We implemented recursive depth first searches to deal with the nested parameters, so this should be considered when creating too deep in depth configurations.

Details

UI

The concept for the UI was discussed between the team, and we agreed to proceed with something similar to the one below (this screenshot can be a little outdated)

Implementation

The full documentation for the implementation can be found on the project documentation, here is a brief explanation of each component and what they do.

• config-content.tsx|<Content />: is responsible to show and edit each parameter or metadata, as well as the nested parameters and linked parameters.
• config-editor.tsx|<ConfigEditor />: shows the header that contains the name, version, and some controls to create child configurations as well as change the exhibition mode of the page from view to edit.
• config-tree-view|<ConfigurationTreeView />: maintain the configuration structure, with it is possible to create new child configurations, parameters, metadata and all showing up in a tree view for better visualization.
• config-page-content.tsx|<ConfigContent />: shows both the tree view and the config editor.

Not implemented:

• Search a description in the configuration list, this would require adapting the search functionality proposed by the maintainers and could break the processes listing, for example. It is still possible to search by the name.

Configuration Structure:

ParameterContent{
  displayName: string;
  value: string;
  
}
Parameter{
  id: string;
  type: string;
  content: [ParameterContent];
  linkedParameters: [string (ids of linked parameters)];
  parameters: { [key:string]:Parameter };
}
AbstractConfig{
  id: string;
  name: string;
  metadata: { [key:string]:Parameter };
}
TargetConfig|MachineConfig extends AbstractConfig{
  parameters: { [key:string]:Parameter };
}
ParentConfig {
  targetConfiguration: {TargetConfig}
  machineConfigurations: [MachineConfig]
}