How to properly build a React app?

Question

typescript

New to React and having trouble getting it right. Everything works, but my application is built very strangely and, it seems to me, is not optimal. There is data exchange between front and api. I have created a model in ts file.
This is the model that sends the data to the api:

export interface SearchOrderingPrePaymentParameters {
    orderCrmNumber: string;
}

//and the model that is returned

export interface PrePaymentParameters {
    partnerId: number;
    orderNumber: string;
    webSite: string;
    accountNumber: string;
    sign: string;
    sumValue: number;
    emailClient: string;
    emailOperator: string;
    numberTransactions: number;
    sumTransaction: number;
    period: number;
}

// импорт в приложение 
import { SearchOrderingPrePaymentParameters } from '../../models/Orders/Operations/PrePayment/SearchOrderingPrePaymentParameters';
import { PrePaymentParameters } from '../../models/Orders/Operations/PrePayment/PrePaymentParameters';

export interface IFormState {
    searchOrderingPrePayment: SearchOrderingPrePaymentParameters;
    prePaymentParameters: PrePaymentParameters;

}
export default class PaymentByCardPage extends React.Component<IFormProps, IFormState> { 

constructor(props: IFormProps) {
// вот тут сразу и вопрос почему я не могу сделать тип данных SearchOrderingPrePaymentParameters?
// то есть написать просто searchOrderingPrePayment: SearchOrderingPrePaymentParameters
        super(props);
        this.state = {
                prePaymentParameters: {
                accountNumber: "",
                emailClient: "",
                emailOperator: "",
                numberTransactions: null,
                orderNumber: null,
                partnerId: null,
                period: null,
                sign: "",
                sumTransaction: null,
                sumValue: null,
                webSite: ""
            },
            searchOrderingPrePayment: {
                orderCrmNumber: ""
            },
        };
    }
  // дальше все выглядит так.

    private getOrders = async (): Promise<boolean> => {
        if (this.state.searchOrderingPrePayment.orderCrmNumber != "") {
            let preOrderRes = await Axios.post('/OrderOperations/SearchOrderingPrePayment', {
                ...this.state.searchOrderingPrePayment,
            });
            // Вот тут возвращаемая модель становится any. Как по мне здесь нужно собирать модель из JSON?Но как это 
            //сделать я так и не понял. И не знаю, нужно это или нет? 
            if (preOrderRes.status == 200) {     
                this.setState({
                    prePaymentParameters: preOrderRes.data["prePaymentOrderingList"]
                })
            }
            else {             
                return false;
            }
        }
        return false;
    };
    private onChange = (e: any) => {
        this.setState({
            searchOrderingPrePayment: {
                orderCrmNumber: e.target.value
            }           
            });
    }

render() {
        const { url, submitSuccess, orderInfo, prePaymentOrdering, orderDataCrm, prePaymentParameters, resultPrePayment } = this.state;
        return (
                   <Col md={10} sm={10} xs={10} className="mb-1 pt-3 pr-0 pl-4">
                                        <Field id="orderNumberSearch"
                                            placeholder="Поиск заказа"
                                            onChange={
                                                (e: React.FormEvent<HTMLInputElement>) => {
                                                    this.onChange(e)
                                                }
                                            }
                                            autoComplete="disabled"
                                            value={this.state.searchOrderingPrePayment.orderCrmNumber}
                                        />
                                    </Col>
                                    <Col md={2} sm={2} xs={2} className="mb-1 pt-3 pl-0">
                                        <div className="text-center">
                                            <button type="button" onClick={this.getOrders} className="btn btn-primary">Поиск</button>
                                        </div>
                                    </Col>
                                </Row>
                            </CardBody>
                        </Card>
                                <Card className="mt-2">
                                    <CardBody>                             
                                            render={
                                                () => (
                                                    <React.Fragment>
                                                        <Row>
                                                            <Col md={6} sm={6} xs={12} className="mb-3">
                                                                <Field id="orderNumber" label="Номер заказа"
                                                                    value={prePaymentParameters.orderNumber || ''}
                                                                    onChange={
                                                                        (e: React.FormEvent<HTMLInputElement>) => {
                                                                            this.onChange(e)
                                                                        }
                                                                    }
                                                                />
                                                            </Col>
                                                            <Col md={6} sm={6} xs={12} className="mb-3">
                                                                <Field id="sumValue" label="Сумма предоплаты" onChange={
                                                                    (e: React.FormEvent<HTMLInputElement>) => {
                                                                        this.onChange(e)
                                                                    }
                                                                }
                                                                    value={prePaymentParameters.sumValue || ''}
                                                                    type="number"
                                                                    autoComplete="disabled"
                                                                />
                                                            </Col>
                                                        </Row>
                                                        <Row>
                                                            <Col md={6} sm={6} xs={12} className="mb-3">
                                                                <Field id="numberTransactions" label="Количество транзакций" onChange={
                                                                    (e: any) => {
                                                                        this.onChange(e)
                                                                    }
                                                                }
                                                                    type="number"
                                                                    value={prePaymentParameters.numberTransactions || ''}
                                                                />
                                                            </Col>
                                                            <Col md={6} sm={6} xs={12} className="mb-3">
                                                                <Field id="sumTransaction" label="Сумма транзакций" onChange={
                                                                    (e: React.FormEvent<HTMLInputElement>) => {
                                                                        this.onChange(e)
                                                                    }
                                                                }
                                                                    value={prePaymentParameters.sumTransaction || ''}
                                                                    type="number"
                                                                />
                                                            </Col>
                                                        </Row>
                                                        <Row>
...../ и тд

I want to ask you to tell me if the application is built correctly in this case?