WD-15025 - feat: add built verification email

[huwshimi]

Changes

Commit the built email template.
NOTE: the logo needs to be attached by the backend. Not sure if that should be done before landing this PR?

https://warthogs.atlassian.net/browse/WD-15025

QA

• Rebuild the image with this PR (https://github.com/canonical/identity-platform-admin-ui?tab=readme-ov-file#image-rebuild-and-redeployment).
• Create a new identity. You can do this by entering this into the dev console from the UI:

fetch("/api/v0/identities", {
  method: "POST",
  body: JSON.stringify({
  schema_id: "default",
  traits: { email: "[email protected]" },
  credentials: { password: { config: { password: "123" } } },
})
});

• Go to the mail UI: http://localhost:18025/ (I had to port forward to access this from outside my multipass: kubectl port-forward services/mailhog 18025:8025)
• You should have a "Complete your registration" email that will include the HTML content (without the logo as that needs to be included by the backend).

[BarcoMasile]

About the logo: right now the UI serves assets only under the assets folder (take a look at this)
If you move the image under the assets folder and adjust the url it will automatically work

[huwshimi]

About the logo: right now the UI serves assets only under the assets folder (take a look at this) If you move the image under the assets folder and adjust the url it will automatically work

The most widely supported method of handling images in HTML emails is to include them as CID attachments. It looks like go-mail supports this, so we'd need the backend service to attach the logo (we'll also need update the template to use an image src with a cid:.. reference).

The other options are to use a CDN like assets.ubuntu.com or use a base64 embed, but these are progressively less supported.

[nsklikas]

The most widely supported method of handling images in HTML emails is to include them as CID attachments. It looks like go-mail supports this, so we'd need the backend service to attach the logo (we'll also need update the template to use an image src with a cid:.. reference).

The other options are to use a CDN like assets.ubuntu.com or use a base64 embed, but these are progressively less supported.

After reading a little about this, I am curious. It's true that CID is the oldest method of all, but it is not clear if it is the best option. It feels like most people nowadays go with the link option and pull the image from a CDN as it's easier to use and it decreases the size of the mail. I went through emails that I have received from various sites and all of them seem to be using CDN. Can you provide some reading material around or some references?

[huwshimi]

The most widely supported method of handling images in HTML emails is to include them as CID attachments. It looks like go-mail supports this, so we'd need the backend service to attach the logo (we'll also need update the template to use an image src with a cid:.. reference).
The other options are to use a CDN like assets.ubuntu.com or use a base64 embed, but these are progressively less supported.

After reading a little about this, I am curious. It's true that CID is the oldest method of all, but it is not clear if it is the best option. It feels like most people nowadays go with the link option and pull the image from a CDN as it's easier to use and it decreases the size of the mail. I went through emails that I have received from various sites and all of them seem to be using CDN. Can you provide some reading material around or some references?

There aren't really very good resources on the topic and what info there is is often out of date (e.g. many articles mention CID not working in Gmail, but this is no longer true).

The main issue with CDNs is that they are blocked by default in many (all?) clients, but if we're happy with that then we can change this to use the asset server.

If we can get the budget for it we can use a mailbox testing tool to see how this email performs in the real world.

[BarcoMasile]

@nsklikas @huwshimi
I agee with Nikos about the use of CDN, I experience the same thing in my inbox.
That said, if Huw think is ok, I'd move on and put the logo in the assets folder so it's correctly served like other assets.
If we want to switch to any other thing I'd consider this an improvement to allocate post-sprint.
Do we agree?

[huwshimi]

I've updated this to load the logo from our CDN (I think this will be more reliable than self hosting on this site).