feat: Add sample with some more features using Next JS (React + TS)

[teddyward]

This is quite similar to #15, but also includes:

• Promoting the add-on through screen sharing
• Using the collaboration starting state
• Frame to frame messaging

The idea is that I can link this add-on from all three of those pages, and dramatically shorten the content of https://developers.google.com/meet/add-ons/guides/use-SDK to only cover the "hello world" features of #15

Edit: if you screenshare https://googleworkspace.github.io/meet/animation-next-js/ from prod Meet, you should see a (slightly outdated) version of this in action

[clayplumridge]

For future additions like this (and this one if you're able), could you add a screenshot or gif to the PR description?

[teddyward]

I'm a bit wary of posting screenshots to a public site because the add-on is currently only published for people with @google.com domains, and posting screenshots of my corp version of Google Meet could potentially leak something. But, you can see the animation live at https://googleworkspace.github.io/meet/animation-next-js/mainstage.html, and the side panel live at https://googleworkspace.github.io/meet/animation-next-js/sidepanel.html

Googlers can also screenshare https://googleworkspace.github.io/meet/animation-next-js/ from prod Meet, and it will prompt them to install the add-on. So you can also test it yourself!

I would like to publish this one publicly, but need to talk through the details there...

[azizj1]

Setting up eslint+prettier is non-trivial amount of work so I'm not recommending that for a sample add-on, but we should scan through the files to make sure we're consistently using 2-space indents, single quotes, and 80 character lines.

[teddyward]

Thank you so much azizj@!

[azizj1]

Looks great! Thanks so much Teddy!

[teddyward]

caught something - thanks again