Hey,
I have the following dynamic route:
http://example.com/category/[categorySlug]

So users can enter the following:
http://example.com/category/fashion
http://example.com/category/gaming
etc, and see a grid of photos.
Clicking on a photo opens a modal.

Everything's cool so far. But what I'm unable to achieve is to change the url to something like this:
http://example.com/someUser/examplePhoto1
http://example.com/anotherUser/examplePhoto2
etc..
Note that opening these links works. So there is something similar to Instagram behavior where opening a modal changes the URL, and reloading the page results in the same content.

I'm aware of the as property from link/next
It works when I open the modal when browsing from http://example.com but not when I trigger a modal through any of the category pages.

That's the code for my link:

<Link
            href={`/category/gifts/?username=${props.user?.username}&listId=${props.slug}`}
            as={`/${props.user?.username}/${props.slug}`}>
Open image in a modal
</Link>

Any ideas?