Default Component - Copy this React, Mui Component to your project

i have updated the const to be clearer const [tasks, setTasks] = useState([ { Id: 1, Description: "About You", Type: "Header", helptext: "", Active: true, options: [], isStage: true }, { Id: 2, Description: "What is your name", Type: "text", helptext: "please enter your full name", Active: true, options: [] }, { Id: 3, Description: "what is your email address", Type: "email", helptext: "enter a valid", Active: false, options: [] }, { Id: 4, Description: "what is your gender", Type: "select", helptext: "What was your gender at birth", Active: false, options: ["male", "female"] }, { Id: 5, Description: "You are male", Type: "subheader", helptext: "", Active: false, options: [] }, { Id: 6, Description: "you are female", Type: "subheader", helptext: "", Active: false, options: [] }, { Id: 7, Description: "Your Work", Type: "Header", helptext: "", Active: false, options: [], isStage: true }, { Id: 8, Description: "have you completed the task", Type: "boolean", helptext: "", Active: false, options: [] }, { Id: 9, Description: "Why not", Type: "text", helptext: "please give your reason", Active: false, options: [] }, { Id: 10, Description: "what will you do next", Type: "text", helptext: "", Active: false, options: [] } ]); const [actions] = useState([ { condition: "2 is not null", action: "3 active= true" }, { condition: "3 is active", action: "2 active = false" }, { condition: "3 is not null", action: "4 active = true" }, { condition: "4 is active", action: "3 active = false" }, { condition: "4 is male", action: "5 active= true" }, { condition: "4 is active", action: "3 active= false" }, { condition: "4 is female", action: "6 active=true" }, { condition: "4 is male or female", action: "7 active=true" }, { condition: "7 is active", action: "8 active=true" }, { condition: "8 is false", action: "9 active = true" }, { condition: "8 is true", action: "10 active=true" } ]);