Angular FromControls how to handle supporting data

I am in the process of building a small Angular app to help our test team provision new environments for one of our larger systems. The system consists of a number of components in separate repos which are built separately with different pipelines.

When creating the environment the user will be presented an input control for a name, then a list of the components. For each component they will select the type of build to deploy:

Latest Development - use the most recent build from the develop branch

Latest Production - use the most recent build from the main branch

Specific Version - when selected the user will presented with a list of builds for that component

On submission of the form the app will take the information provided, build a message that will be posted to the DevOps API to initiate the running of a release pipeline. I will be passing the selected buildId for each component in the POST.

Currently I have the list of components held in a json file in the assets folder: -

{
    "defaultDevelopmentBranchName": "refs/heads/development",
    "defaultProductionBranchName": "refs/heads/main",
    "components" : [
        {
            "id": 1,
            "name": "Component 1",
            "pipelineId": 485,
            "buildParameterName": "component1IdBuildId"
        },
        {
            "id": 2,
            "name": "Component 2",
            "pipelineId": 482,
            "buildParameterName": "component2BuildId",
            "productionBranchName": "refs/heads/master"
        },

The pipelineId is the DevOps pipeline that is used to get the builds. Either returning just the latest one from development or production or a list of builds to select from if they want to choose a specific one.

I am building this using Reactive Forms with a FormArray for the list of components. The thing I am struggling with is how to handle items that are needed but are not inputs. For example I need to render a literal for the component name or use the pipelineId when fetching builds based on the type selected. I see a couple of options: -

1. When building the form array from the component config I add FormControls for the properties that are not needed for user input but are needed for other purposes.

2. The FormArray only includes what is need for user input and when required I use the index of the row to access the element of the components array in the config to get an other information needed.

Maybe a third option is similar to the second but I just include the component id in the FormArrays items to use as a lookup to the config. This will remove the need to sync the form array index with the config index

I haven't been able to find much which would indicate best practise