Store Tokens Locally to Improve Usability

[XoMEX]

Hi, in before: Sorry for the lengthy issue, and again thanks for this project. This started out from #51 though I feel it distances itself too far from the original idea. It also branched into #61.

I like the idea of using localStorage to store the private tokens to increase usability. The idea could also work with cookies, depending on how much of the work you want to do on the serverside and on the clientside. I feel that localStorage is more privacy-focused.

Edit Tokens (Events/Groups)

If edit tokens are stored, you can display a button on the relevant page to enable editing. When clicking the button it:

1. checks if you have the editing code in localStorage (the button might also have a different style in this case)
2. if not, asks you for the token (this could enable password managers)

Then it simply redirects you to the same page with the token applied to the URL. If it was correct, you can edit the page. If not, and the token was taken from localStorage, it is removed from local storage.

Ideas on Implementation

When an edit token is present and is valid: Include JS for the client to put this token into local storage. Use case: I can send you a link to my edit page and you automatically store the token

When an edit token is present and is invalid: Include JS for the client to remove this token from local storage (if exactly present): Any invalid tokens are removed (however they got there). It is important to only remove the exact token. Otherwise, I could send you a link with an invalid token and your correct token would be deleted.

Group Tokens

When creating a new event and group tokens are stored locally, a drop-down could be displayed to automatically apply the group tokens with all the tokens you have stored locally. This way you don't have to copy+paste them manually.

RSVP Tokens (Deletion Password)

When viewing an event you would not need to remember the password you got shown only once.

When a deletion password is present locally, the "Remove me" button would use this password and remove it from local storage. You could also gray out the "Add me" button and replace it with: "Add another person" or remove it if you do not want this use case.

It would also be nice to be able to see for which user name(s) you have a deletion token locally. However this would require tokens to be bound to the user id (also stored locally with the deletion token(s)), and the user id would need to visible on the page. From a privacy standpoint, I think it would be okay if each user/RSVP gets an id that is unique for the event. For example, counting the ids from 0 and also counting removed users. I.e. user 2 deregisters, I register and am assigned id=3. This way user 2 does not think they are still registered and displays the correct buttons.

---

These are just some ideas I had. It might make sense to split them into multiple issues to track/discuss them more easily. However, they are based on the same base idea, hence I put them into a single issue.

[lowercasename]

This was a really great issue, thank you so much for it! I've now done the following in a series of recent commits:

• Store editing tokens in localStorage
• Added backend routes to verify tokens
• Check localStorage for editing tokens when a page is loaded without a token, and reload the page with the token if the token is valid
• Check the URL for a editing token, and if it is valid, add it to localStorage
• Made supplying an email optional

I would still like to do:

• [x] Add the 'groups I'm able to edit' functionality when adding an event to a group
• [x] Add a new feature to one-click add an event to a group from an event page
• [ ] Investigate your recommended behaviour for saving RSVP deletion passwords in localStorage

For this reason I'll keep this issue open until I can deal with these tasks. If you prefer, you're very welcome to close this issue and open a new one or multiple new ones, just for those tasks.

Again, thank you for this excellent issue, I found your implementation notes really helpful!

[lowercasename]

I've now added a nice event group picker tool for groups which you have edited before and are stored locally: https://github.com/lowercasename/gathio/pull/115