I have a button called Add Service that I would like to be inactive after a condition. The condition would be when the status of my request passed the "Initial" stage. After this initial stage, the add service button could no longer be available.
This is the part of my code where I handle the status change:
<GridForm>
<MaterialSelect
labelId="status"
name="status"
label="Status"
value={serviceFilter.status || ''}
customOnChange={(e) => { onChangeStatus(e) }}
formControlClassName={'fullRow'}
>
<MenuItem value={''}>Select a Filter</MenuItem>
<MenuItem value={'all'}>ALL</MenuItem>
<MenuItem value={'initial'}>Inicial</MenuItem>
<MenuItem value={'submited'}>A</MenuItem>
<MenuItem value={'rejeitado'}>B</MenuItem>
<MenuItem value={'approved'}>C</MenuItem>
<MenuItem value={'awaiting_payment'}>D</MenuItem>
<MenuItem value={'awaiting_conciliation'}>E</MenuItem>
<MenuItem value={'payment_done'}>F</MenuItem>
<MenuItem value={'payment_refused'}>G</MenuItem>
<MenuItem value={'finished'}>H</MenuItem>
<MenuItem value={'canceled'}>I</MenuItem>
</MaterialSelect>
</GridForm>
this part of the code is in a different folder from the code where my button is. I tried to use useState, I import the serviceFilter inside the code where the button is. But I couldn't get it to work this way. Here's how I'm using the add service button:
<Grid item xs={4} alignContent="right" display="flex" alignItems="center">
<Button variant="contained"
onClick={() => addServiceItem()}
sx={{ marginRight: '5px' }}
>Ad Service</Button>
</Grid>
is there a simpler way than using useState to accomplish what I would like?
