Bug: resolveData props don't render until the user drags and drops a second time

[FedericoBonel]

Description

When using an asynchronous resolveData function, the resolved props do not render on the canvas until the user interacts with the editor (e.g., drags and drops or changes something a second time).

Steps to reproduce

1. Use an asynchronous function with awaited props inside resolveData:

const config = {
  components: {
    SomeAsyncComponent: {
      resolveData: async () => {
        // "Hello World" doesn't render until something changes in the editor
        const result = await new Promise((resolve) => {
          setTimeout(() => {
            resolve("Hello World");
          }, 1000);
        });

        return {
          props: {
            title: result,
          },
        };
      },
      render: ({ title }) => {
        return (
          <div style={{ display: "flex", minHeight: "10rem" }}>
            <h1>{title}</h1>
          </div>
        );
      },
    },
  },
};

const Editor = () => {
  return <Puck config={config} data={{}} onPublish={onPublish} />;
};

2. Open the editor
3. Drag and drop the component with the async resolveData
4. Wait until spinner resolves without changing anything in the editor

What happens

The editor doesn't show the resolved props after the promise resolves unless the user interacts with the editor again.

Vite.+.React.webm

What I expect to happen

The editor should display the resolved props immediately after the spinner/promise resolves, without requiring additional user interaction.

[chrisvxd]

Likely to be closed in 0.19