Nice blog! I also recommend to update index.js to avoid duplicate subscription that Gabriel E mentioned too.

    // Subscribe to creation of message
    const subscription = API.graphql(
      graphqlOperation(onCreateMessage)
    ).subscribe({
      next: ({ provider, value }) => {
        setStateMessages((stateMessages) => [
          ...stateMessages,
          value.data.onCreateMessage,
        ]);
      },
      error: (error) => console.warn(error),
    });
    return () => subscription.unsubscribe()
  }, []);

Great blog, thank you. One minor recommendation, to unsubscribe from subscription (or even within a timer).

return () => {
    subscription.unsubscribe();
  }