Feature: Social share when completing lesson quiz

[kempsterrrr]

We need to update the quiz modal flow for a customisable success message and a social share button that prompts the user to click a Twitter Intent link that pre-populates a tweet to post to celebrate completing the lesson.

Here is the current user journey:

1. Click the button to open the quiz
2. Complete questions and hit submit
3. If questions are correct, the modal closes and the user is shown a toast message to say they've completed the lesson

NB - the use is not shown a success modal. The success modal (below) is only shown if the user clicks the Quiz button a second time

Success Modal

Here is the update flow we need to implement to deliver on the requirement for AR.IO course:

1. Click the button to open the quiz
2. Complete questions and hit submit
3. If questions are correct, the success modal (above) is shown with a customisable success message and a share to Twitter button

• As a user, when I want to be shown clearly I've completed the course with instructions on what to do next
  • Success modal is shown when the quiz is completed with correct answers
  • Success modal has a customisable message for the user
  • Success modal includes a share to Twitter button that opens a provided Twitter Intent link, which opens the compose tweet screen in a new tab with pre-populated text in the tweet to post

Why show the modal vs just the toast?
Showing the modal after completing the quiz gives us a much better opportunity to communicate with the user that they have:

a) complete the quiz
b) any instructions on what to do next, such as share to Twitter or, as in AR's case, claim their points on Zealy.

Why customisable message?
For our campaign with AR.IO, they are releasing Quests on their Zealy platform. When users complete the lesson, we must give them specific instructions on completing the Zealy quest.

What is a Twitter Intent link
This is a link that, when a user clicks it, will open the tweet compose view with a tweet that is pre-populated with text we define for them. These are easily created using something like - https://www.sharelinkgenerator.com/

Here is an example - https://twitter.com/intent/tweet?text=I%20just%20completed%20the%20Arweave%20XXX%20lesson%20by%20%40ar_io_network%20on%20%40devdao_academy%0A%0AURL%20OF%20LESSON