Dynamically set antd input default value in react js

Question

I am trying to pass data to antd form and set the values of the data as default value of the input form but nothing displays on the input.

I get the id from from the url and use the id to fetch data from the backend which I pass to the form as default value.

winningTags.name directly under the card component displays the name but the one passed to the form does not display.

const EditWinningTags = () => {

    const { id } = useParams()
    const [winningTags, setWinningTags] = useState([])

    useEffect(() => {
        const getDraws = async () => {
            const res = await CategoryServices.getSingleWinningTags(id);
            console.log(res.data.data.name)
            if (res.data.data) setWinningTags(res.data.data)

        }
        getDraws()
    }, []);


    const [form] = Form.useForm();

    const onFinish = (values) => {
        console.log(values);
    };
    const onReset = () => {
        form.resetFields();
    };
    console.log("name ", winningTags.name)
    return (
        <div className="d-flex justify-content-center align-items-center" style={{ "height": "70vh" }}>
            <Card title="Edit Winning Tag" style={{ width: 600 }}>
                {winningTags && winningTags.name}
                <Form
                    {...layout}
                    form={form}
                    initialValues={{
                        name: winningTags && winningTags.name,
                        stake_price: winningTags && winningTags.stake_price,
                    }}
                    name="control-hooks"
                    onFinish={onFinish}
                    style={{
                        maxWidth: 600,
                    }}
                >
                    <Form.Item
                        name="name"
                        label="Name"
                        rules={[
                            {
                                required: true,
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        name="stake_price"
                        label="Stake Price"
                        rules={[
                            {
                                required: true,
                            },
                        ]}
                    >
                        <Input type='text' values="Mon" />
                    </Form.Item>
                    <Form.Item {...tailLayout}>
                        <Button type="primary" htmlType="submit">
                            Submit
                        </Button>
                    </Form.Item>
                </Form>
            </Card>
        </div>
    )
}