Slate Editor - Clickable Image

Question

I want to allow my slate editor to insert an image with the destination URL and make a clickable image to the destination URL:

<a href={destinationUrl}\><img src={src}</a\>

I do not know what the right approach is. Here is my insert image function:

const image: Element = {
    type: "image",
    url,
    children: [{ text: "" }]
};

if (destinationUrl) {
    const link: Element = {
        type: "link",
        url: destinationUrl,
        children: [{ ...image, text: "" }]
    };

    Transforms.insertNodes(editor, [link]);
} else {
    Transforms.insertNodes(editor, [image]);
}

But with no success. Does there exist some better way to do it? Or how am I wrong?

Anyway right now while adding image also form contain destinationUrl field, so if user fill the destinationUrl I want to setup link

Thanks for all tips