React child component state management - reactjs

Question

I´ve been reading about different ways of managing state from child components but I´m still a little confused if my workflow is correct or if it´s an anti-pattern.
Basically I have a component with material-ui sibling components and those component´s props need to be update as their state changes. Is there a better way of managing child components state ?
import RaisedButton from 'material-ui/RaisedButton';
import TextField from 'material-ui/TextField';
import React, { Component } from 'react';
import './SearchTicket.css';
class SearchTicket extends Component {
constructor(props) {
super(props);
this.state = {
txtSearchTicket: {
errorText: null,
value: '',
hintText: 'Número do chamado',
},
btnSearch: {
label: 'Buscar',
disabled: false,
},
};
this.handleTxtSearchTicket = this.handleTxtSearchTicket.bind(this);
this.searchTicket = this.searchTicket.bind(this);
this.isTicketValid = this.isTicketValid.bind(this);
}
handleTxtSearchTicket(e) {
const value = e.target.value;
this.setState((prevState) => {
const newState = prevState;
newState.txtSearchTicket.value = value;
return newState;
});
}
isTicketValid() {
const re = new RegExp(/^(im|sd|[0-9])[0-9]+/, 'i');
if (re.test(this.state.txtSearchTicket.value)) {
return true;
}
this.setState((prevState) => {
const newState = prevState;
newState.txtSearchTicket.value = '';
newState.txtSearchTicket.errorText = 'Número de chamado inválido';
return newState;
});
}
searchTicket() {
if (this.isTicketValid()) {
console.log(`Fetching call ${this.state.txtSearchTicket.value}`);
this.setState((prevState) => {
const newState = prevState;
newState.btnSearch.disabled = !newState.btnSearch.disabled;
return newState;
});
}
// TODO: implement retrieve call from api
}
render() {
const style = {
margin: 15,
width: 180,
heigh: 40,
};
return (
<form>
<TextField
name="txtSearchTicket"
hintText={this.state.txtSearchTicket.hintText}
floatingLabelText={this.state.txtSearchTicket.hintText}
errorText={this.state.txtSearchTicket.errorText}
onChange={this.handleTxtSearchTicket}
value={this.state.txtSearchTicket.value}
/>
<br />
<RaisedButton
name="btnSearch"
label={this.state.btnSearch.label}
disabled={this.state.btnSearch.disabled}
onClick={() => this.searchTicket()}
style={style}
primary
/>
</form>
);
// <RaisedButton label="Buscar" style={style} primary={true}/>
}
}