Display dropdown values depending on the selected category

I have checked and clear the values but again getting error msg.

a!formLayout(
label: "Create Incident Management",
contents: {
a!boxLayout(
label: "Requestor Details",
contents: {
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!textField(
label: "Requestor",
labelPosition: "ABOVE",
value: loggedInUser(),
saveInto: {},
refreshAfter: "UNFOCUS",
readOnly: true(),
validations: {}
)
}
),
a!columnLayout(
contents: {
a!textField(
label: "Designation",
labelPosition: "ABOVE",
value: "Project Lead",
saveInto: {},
refreshAfter: "UNFOCUS",
readOnly: true(),
validations: {}
)
}
)
}
)
},
style: "ACCENT"
),

ri!subCategory: choose(
if(isnull(ri!category),1,ri!category),
{"Laptop Issue","Internet Issue"},
{"Cabs Issue","AC Issue"},
{"Salary Issue","Project Allocation Issue"},
{"Finance Planning","Fund Raising"}
),

a!sectionLayout(
label: "Incident Category",
contents: {
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!dropdownField(
label: "Category",
labelPosition: "ABOVE",
placeholder: "--- Select a Value ---",
choiceLabels: {"IT Support", "Admin Support", "HR Support", "Finance"},
choiceValues: {"IT Support", "Admin Support", "HR Support", "Finance"},
value : ri!category,
saveInto:{
local!category,
a!save(local!subCategory, null)

}
searchDisplay: "AUTO",
validations: {}
)
}
),
a!columnLayout(
contents: {
a!dropdownField(
label: "Sub Category",
labelPosition: "ABOVE",
placeholder: "--- Select a Value ---",
choiceLabels:ri!subCategory,

choiceValues:ri!subCategory,
value: ri!subCategory,
saveInto:{ri!subCategory},
searchDisplay: "AUTO",
validations: {}
)
}
),
a!columnLayout(
contents: {
a!dateTimeField(
label: "Reporting Date and Time",
labelPosition: "ABOVE",
value: ri!reportingDateTime,
saveInto: ri!reportingDateTime,
validations: {}
)
}
)
}
),
a!cardLayout(
contents: {
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!textField(
label: "Incident Title",
labelPosition: "ABOVE",
value : ri!incidentTitle,
saveInto: {ri!incidentTitle},
refreshAfter: "UNFOCUS",
validations: {}

)
}
),
a!columnLayout(
contents: {
a!paragraphField(
label: "Description",
labelPosition: "ABOVE",
value: ri!Description,
saveInto: ri!Description,
refreshAfter: "UNFOCUS",
height: "MEDIUM",
validations: {}
)
}
)
}
)
},
height: "AUTO",
style: "SUCCESS",
marginBelow: "STANDARD",
showBorder: false()
)
}
),
a!boxLayout(
label: "SLA",
style: "ACCENT"
)
},
buttons: a!buttonLayout(
primaryButtons: {
a!buttonWidget(
label: "Submit",
submit: true,
style: "PRIMARY"
)
},
secondaryButtons: {
a!buttonWidget(
label: "Cancel",
value: true,
saveInto: ri!cancel,
submit: true,
style: "NORMAL",
validate: false
)
}
)
)

  
  

a!formLayout(
  label: "Create Incident Management",
  contents: {
    a!boxLayout(
      label: "Requestor Details",
      contents: {
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!textField(
                  label: "Requestor",
                  labelPosition: "ABOVE",
                  value: loggedInUser(),
                  saveInto: {},
                  refreshAfter: "UNFOCUS",
                  readOnly: true(),
                  validations: {}
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!textField(
                  label: "Designation",
                  labelPosition: "ABOVE",
                  value: "Project Lead",
                  saveInto: {},
                  refreshAfter: "UNFOCUS",
                  readOnly: true(),
                  validations: {}
                )
              }
            )
          }
        )
      },
      style: "ACCENT"
    ),

    
    ri!availableSubCategories: choose(
      if(isnull(ri!category),1,ri!category),
      {"Laptop Issue","Internet Issue"},
      {"Cabs Issue","AC Issue"},
      {"Salary Issue","Project Allocation Issue"},
      {"Finance Planning","Fund Raising"}
    ),
    
    a!sectionLayout(
      label: "Incident Category",
      contents: {
        a!columnsLayout(
          columns: {
            a!columnLayout(
              contents: {
                a!dropdownField(
                  label: "Category",
                  labelPosition: "ABOVE",
                  placeholder: "--- Select a Value ---",
                  choiceLabels: {"IT Support", "Admin Support", "HR Support", "Finance"},
                  choiceValues: {1,2,3,4},
                  value : ri!category,
                  saveInto:{
                    ri!category,
                    a!save(ri!subCategory, null)

                  }
                  /*searchDisplay: "AUTO",*/
                  /*validations: {}*/
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!dropdownField(
                  label: "Sub Category",
                  labelPosition: "ABOVE",
                  placeholder: "--- Select a Value ---",
                  choiceLabels:ri!availableSubCategories,

                  choiceValues:ri!availableSubCategories,
                  value: ri!subCategory,
                  saveInto:{ri!subCategory},
                  disabled: isnull(ri!category),
                  searchDisplay: "AUTO",
                  validations: {}
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!dateTimeField(
                  label: "Reporting Date and Time",
                  labelPosition: "ABOVE",
                  value: ri!reportingDateTime,
                  saveInto: ri!reportingDateTime,
                  validations: {}
                )
              }
            )
          }
        ),
        a!cardLayout(
          contents: {
            a!columnsLayout(
              columns: {
                a!columnLayout(
                  contents: {
                    a!textField(
                      label: "Incident Title",
                      labelPosition: "ABOVE",
                      value : ri!incidentTitle,
                      saveInto: {ri!incidentTitle},
                      refreshAfter: "UNFOCUS",
                      validations: {}

                    )
                  }
                ),
                a!columnLayout(
                  contents: {
                    a!paragraphField(
                      label: "Description",
                      labelPosition: "ABOVE",
                      value: ri!Description,
                      saveInto: ri!Description,
                      refreshAfter: "UNFOCUS",
                      height: "MEDIUM",
                      validations: {}
                    )
                  }
                )
              }
            )
          },
          height: "AUTO",
          style: "SUCCESS",
          marginBelow: "STANDARD",
          showBorder: false()
        )
      }
    ),
    a!boxLayout(
      label: "SLA",
      style: "ACCENT"
    )
  },
  buttons: a!buttonLayout(
    primaryButtons: {
      a!buttonWidget(
        label: "Submit",
        submit: true,
        style: "PRIMARY"
      )
    },
    secondaryButtons: {
      a!buttonWidget(
        label: "Cancel",
        value: true,
        saveInto: ri!cancel,
        submit: true,
        style: "NORMAL",
        validate: false
      )
    }
  )
)

As per your suggestion, I have used above code. I have used rule inputs instead of local variables in my form. Please check the code from line no.42 to 90. I am getting below error message.

Could not display interface. Please check definition and inputs. Interface Definition: Expression evaluation error at function a!dropdownField [line 80]: Could not find variable 'ri!availableSubCategories'

Eventhough I have used ri!subCategory instead of ri!availableSubCategories, I am getting error message like below.

Could not display interface. Please check definition and inputs. Interface Definition: Expression evaluation error at function a!dropdownField [line 80]: A dropdown component [label="Sub Category"] has an invalid value for "choiceValues". Choice values cannot be null.