React with typescript func types - reactjs

Question

I've decided to refactor a project I've made with vanilla javascript and use typescript, I'm always in doubt about how to pass a function as a type on interface.
I took a look on the typescript documentation but I didn't understood how it works.
For instance, What type bringTransactions should have ? and the return type of the handleChange func ?
import React from 'react';
import moment from 'moment';
import { Select } from 'antd';
interface Props {
bringTransactions: any;
}
const PeriodPicker: React.FC<Props> = ({ bringTransactions }: Props) => {
const periodOptions = [
{ value: 0, label: 'Hoje' },
{ value: 3, label: 'Últimos 3 dias' },
{ value: 7, label: 'Últimos 7 dias' },
{ value: 15, label: 'Últimos 15 dias' },
{ value: 30, label: 'Últimos 30 dias' },
{ value: 5, label: 'Data específica' },
];
async function handleChange(value: number): Promise<void> {
const filter = [];
// setDataPickerStatus(false);
if (value === 5) {
// setDataPickerStatus(true);
} else {
const current = moment().format('YYYY-MM-DD HH:mm:ss');
const subtracted = moment(current).subtract(value, 'days');
const initialDate = moment(subtracted)
.utc()
.hours(0)
.minutes(0)
.seconds(0)
.milliseconds(0);
filter[0] = initialDate.format('YYYY-MM-DD HH:mm:ss');
const finatlDate = moment(current)
.utc()
.subtract(1, 'days')
.hours(23)
.minutes(59)
.seconds(59)
.milliseconds(0);
filter[1] = finatlDate.format('YYYY-MM-DD HH:mm:ss');
if (value === 0) {
const normalized = `&date=${filter[0]}`;
bringTransactions(normalized);
} else {
const normalized = `&period=${JSON.stringify(filter)}`;
bringTransactions(normalized);
}
}
}
return (
<Select
placeholder="Selecione um período"
onChange={handleChange}
style={{ width: 200 }}
>
{periodOptions.map(option => (
<Select.Option value={option.value} key={option.value}>
{option.label}
</Select.Option>
))}
</Select>
);
};
export default PeriodPicker;

Answer 1

It looks like bringTransactions is a function which takes a single string argument and returns nothing. That would be:
interface Props {
bringTransactions(value: string): void;
}
or you can write it with arrow syntax
interface Props {
bringTransactions: (value: string) => void;
}
Read more about functions in the typescript docs.

Answer 2

I usually write function types like this:
interface Props {
bringTransactions: (prop: propType) => ReturnType;
}
And the handleChange function will return void as events callbacks usually return void