Show date post published in Gutenberg component

Question

I am coming from the PHP world where I would just put

<div>
  <h1><?= get_the_title() ?></h1>
  <p><?= the_time('j F  Y'); ?></p>
</div>

Now I have a Gutenberg Edit.js block.

<div>
    <RichText
        className="snug huge"
        placeholder="Your title here"
        onChange={(content) => setAttributes({ title: content })}
        value={attributes.title}
        tagName="h1"
    />
    <p>[The date of the page or post needs to be formatted and placed here]</p>
</div>

How on earth do I put the date the post was published in?

Edit:

Recently I have found a list of all PHP template tags and their Gutenberg counterparts: https://github.com/WordPress/gutenberg/issues/22724

This has lead me to find the Post Date — however there is no documentation at all for it. I think it is what I am after, however I'm unsure how to use it. https://github.com/WordPress/gutenberg/tree/trunk/packages/block-library/src/post-date

Answer 1

I was able to get there by doing the following.

import * as wpDate from "@wordpress/date";

You can find the very limited documentation on that here: https://developer.wordpress.org/block-editor/reference-guides/packages/packages-date/

I was able to use the following:

const post = wp.data.select("core/editor").getCurrentPost();
const postDate = wpDate.format("d|m|Y", post.date);

Then, when I needed it:

<div>
    <RichText
        className="snug huge"
        placeholder="Your title here"
        onChange={(content) => setAttributes({ title: content })}
        value={attributes.title}
        tagName="h1"
    />
    <p>{postDate}</p>
</div>