Google calendar support

[KentBrockman]

For whatever reason, I have a hell of a time adding classes to my calendar on my iPhone. I can't figure out how to get ics files to open in google calendar so I did this instead:

Screencast.from.07-10-2022.12.18.03.PM.webm

• Added a third option - adding straight to google calendar using their URL template functionality. Explained here
• Instead of adding a third button, switch the calendar invite preference into a Button with dropdown. Semantic UI is nice, it has been growing on me
• Added a preference saving mechanic using localStorage. Whatever the user selects as their option will persist across page reloads.

Let me know if you detect any bugs or weirdness. Happy to fix

[tannercollin]

This is a great idea! I noticed a few problems though:

The thing is too wide and causes horizontal scrolling on mobile:

And it's not intuitive that you need to click the button after selecting it from the dropdown. That's not a big deal though. I suspect all that's needed is a vertical line left of the arrow.

[tannercollin]

Oup, didn't mean to close lol

[tannercollin]

I also noticed a bug when Google Calendar or Download ICS is my saved option, I refresh the page, I open the dropdown, then click outside the dropdown. The setting is changed back to Email but it only happens the first time after a refresh.

[tannercollin]

Fixed the issues in those commits. I tried to break the commits up so you can follow the changes easier.

Note: you'll have to delete the key from your browser's localStorage or it will crash since I capitalized the value.

Also you can use const since no variables change within one execution of the function.

[tannercollin]

Can you test my changes? Then I'll merge + deploy

[KentBrockman]

Nice! Looks good, thanks for fixing it up.

Good call changing the button text to the short form. I think it strikes a better balance between explaining what the button does and keeping it a good size when the dropdown in collapsed
Good call on find vs filter - I need to learn all of these built in methods
Good call on simplifying the logic with inline boolean logic

I'm having a hard time figuring out what selectOnBlur and the css tweak are doing - my eyes are probably pretty bad at UI stuff. No worries though, LGTM 👍 !!

[tannercollin]

Disabling selectOnBlur fixes this and the CSS tweak is adding a thin vertical line to the left of the arrow.