Vanity URLs for galleries

amyjko commented 1 year ago

What's the problem?

The URLs for galleries are currently one big ugly ID.

What's the idea?

Let's have vanity URLs for them. I've already included a field in Gallery.ts for this, it's just not used anywhere.

Who benefits?

Anyone sharing a gallery via URL.

Design ideas

Add a path editor to the gallery route
Verify that it's unique before setting it, on the client and Firestore rules
Update the gallery route to check both the ID and the vanity name

Design Specification

The URLs for gallery projects are long, ugly, and don’t say anything about the gallery it is linking to. To fix this, the long and ugly URL will be replaced by a vanity URL instead. The gallery will have a default URL that follows the format:

https://wordplay.dev/gallery/galleryname

Where galleryname is the name of the gallery as named by the user on the gallery creation screen. This can be taken from the non-human identifiable string names that are already generated. Since those string names are non-human identifiable, it will have to be converted into something human readable. The full link will have to be verified to ensure that it is unique based on client and Firestore rules.

Additionally, there will be a field on the gallery creation screen that the user can input their own URL, that can be used to easily access the gallery. This second URL would follow the format:

https://wordplay.dev/userInput

Where userInput is whatever the user inputs to make this custom URL. This URL follows the concept of a tinyurl, in that the user can add whatever they want after the slash following the domain name. The creators (contributors) of the gallery will be able to edit this custom URL or get rid of it completely to revert it back to the default vanity URL. Everytime this custom URL is created or edited, it will have to be verified to ensure that it is unique.

jasoncabusao commented 10 months ago

Hi! I'd like to work on this issue. I will find a developer later on to collaborate with.

amyjko commented 10 months ago

Great! I look forward to the design proposal.

jasoncabusao commented 10 months ago

Proposal #1

The URLs for gallery projects are long, ugly, and don’t say anything about the project it is linking to. To fix this, the long and ugly URL will be replaced by a vanity URL instead that is automatically generated, following the format:

https://wordplay.dev/galleries/username/galleryname/#

Where username is the username of the user, galleryname is the name of the project and the # is an extra identifier to distinguish it from other projects created by the user of the same name. This format assumes the username is unique and the galleryname is not. Even though this vanity URL is automatically generated, the user has the ability to edit it as they please. If the user changes the auto-generated URL, the link will have to be verified to ensure that it is unique based on client and Firestore rules.

-Jason, Kelliann, Max

amyjko commented 10 months ago

Thanks @jasoncabusao! Here's some feedback to address:

Per the design wiki, design proposals go in the issue body, not comments. Please move it above to the design ideas section.
Galleries are not tied to usernames, they have their own identifiers, separate from. users. So the URL sketched above would need to be something like https://wordplay.dev/gallery/galleryname. (The hash tag is also not necessary for anything).
Galleries and projects are different. Galleries are collections of projects to which multiple users can contribute.
Where is the design for where gallery vanity names will be edited? There's a gallery creation screen and a gallery screen that needs to show how this interface would work, how it would be explained, etc.
It's not clear in the proposal if users can choose the vanity name for their gallery or if its automatically generated. If the latter, what is generating it and how? (We already generate names: they're random non-human identifiable strings).

kelliannr commented 8 months ago

Hello Amy, I've added the most up to date proposal to the issue! There's no visual design for it yet, but I don't think I'll be able to get to it this quarter as it's been really busy for me :')

Not sure if I'll return next quarter to continue working on it, so I'm leaving my most recent specification here in case I don't.

amyjko commented 8 months ago

Thanks @kelliannr! I think it's pretty close. A few things to resolve:

Putting the userInput right after the domain might collide with existing paths in the Wordplay routes, such as /project. It would also mean that we wouldn't b able to add new routes if someone else had taken the route we needed. (Imagine we wanted to add /play and someone had taken /play. Should we have it be wordplay.dev/gallery/[name] instead?
I'm not sure I understand what is being converted in gallery names. Are you saying we'd take the gallery name that gallery creators provide and convert it into a URL compatible name? Or something else?

Thanks!

wordplaydev / wordplay