Add Masjid subscriptions

fayez-nazzal commented 1 year ago

Allow users to subscribe to one or more masjids using their email address:

How it works? Each masjid has a subscribe button beside it's name. If clicked, it will open a SideOver element with a form element with an email field and a checkbox for each masjid.

When we have the compact view, we could add a checkbox to the table or make it even simpler by adding the subscribe functionality as a table column.

Features:
- Works with Zero JS. We get this done by using input and label elements, the whole SideOver element could be treated as a checkbox, and all we use is native built-in HTML functionality.
- Progressive Enhancements: When having JS, the experience will be better, E.p: checking the masjid in place of the user when subscribe is clicked.

Images

Successful subscription

Already Subscribed

2023-10-16 06 57 15

No-JS

NOTE: It turned out that displaying the message in No-JS mode requires SSR. For static, we don't have a server to display them, but anyway, it's not a big deal as they get an email confirmation message.

2023-10-16 07 09 48

fayez-nazzal commented 1 year ago

Blocked by #21

hammady commented 1 year ago

How does the submit work? Does it do an ajax call if JS is enabled and show the response messages? What if JS is not enabled? Update: my questions are answered in #21. I will check it out! Great work!

hammady commented 1 year ago

@fayez-nazzal is this now ready?

fayez-nazzal commented 1 year ago

@fayez-nazzal is this now ready?

@hammady It seems that #21 is not deployed, can you take a look at the status in the commit history? Currently getting internal server error.

hammady commented 1 year ago

Check my comment on #18 for the resolution.

fayez-nazzal commented 1 year ago

@hammady For the Ajax request support, I'm willing to do those after setting up a toast system. I will do that next morning insha'Allah, I feel very sleepy now :p

fayez-nazzal commented 1 year ago

Note that the environment name for the subscription link is PUBLIC_SUBSCRIPTIONS_BASE_URL

hammady commented 1 year ago

PUBLIC_SUBSCRIPTIONS_BASE_URL

Pushed.

hammady commented 1 year ago

I pushed the env var in the outer node package. Once we work on #20, the two packages will be merged into one. I'm currently generating the site locally only.

hammady commented 1 year ago

Generation failed because the PUBLIC_SUBSCRIPTIONS_BASE_URL was gone after you force pushed yesterday lol. I cherry-picked & pushed it again. I tested the generated site here: https://d2jdofo95ob9gp.cloudfront.net/. I found some minor bugs, but let's merge this to keep going and work on those later. I will report them separately. 🚀

fayez-nazzal commented 1 year ago

Generation failed because the PUBLIC_SUBSCRIPTIONS_BASE_URL was gone after you force-pushed yesterday lol. I cherry-picked & pushed it again. I tested the generated site here: https://d2jdofo95ob9gp.cloudfront.net/. I found some minor bugs, but let's merge this to keep going and work on those later. I will report them separately. 🚀

Oppss sorry > . <

hammady / wwpray