docs: #15988 follow-up: Use URL.parse to fix Version Switcher URL double slash issue

[NicholasFlamy]

Description

Uses URL.parse(location.pathname + location.hash, url).href instead of url + location.pathname + location.hash
I noticed the issue after PR #15988 was merged. Sorry about this 3rd PR. Maybe don't merge this until a day after all the comments are addressed so that we don't jinx it. 🤞🤞🤞

How Has This Been Tested?

• Tested in dev environment with npm run start for docs.

Screenshots (if appropriate)

Before:

After:

Checklist:

• I have performed a self-review of my own code
• I have made corresponding changes to the documentation if applicable
• I have no unrelated changes in the PR.
• I have confirmed that any new dependencies are strictly necessary.
• I have written tests for new code (if applicable)
• I have followed naming conventions/patterns in the surrounding code
• All code in src/services uses repositories implementations for database calls, filesystem operations, etc.
• All code in src/repositories/ is pretty basic/simple and does not have any immich specific logic (that belongs in src/services)

[github-actions]

📖 Documentation deployed to pr-16014.preview.immich.app

[jrasm91]

This doesn't include any query params.

[jrasm91]

Maybe just to something like location.href.replace(location.origin, url)

[NicholasFlamy]

Maybe just to something like location.href.replace(location.origin, url)

It doesn't handle the double slash, though. So I'll fix the issue in the docs\static\archived-versions.json file, and we have to be sure that doesn't happen again.

[NicholasFlamy]

Suggested change

	to: URL.parse(location.pathname + location.hash, url).href,
	to: location.href.replace(location.origin, URL.parse(url.origin)),

If I do this, it handles the double slash issue in case someone forgets about this and it ever happens again.

[bo0tzz]

The URL constructor won't override the host, but we can just do that explicitly right?
From browser console:

let url = new URL(location.href) 
// URL { href: "https://github.com/immich-app/immich/pull/16014/files", origin: "https://github.com/", protocol: "https:", username: "", password: "", host: "github.com", hostname: "github.com", port: "", pathname: "/immich-app/immich/pull/16014/files", search: "" }
url.host = "immich.app" 
url
// URL { href: "https://immich.app/immich-app/immich/pull/16014/files", origin: "https://immich.app/", protocol: "https:", username: "", password: "", host: "immich.app", hostname: "immich.app", port: "", pathname: "/immich-app/immich/pull/16014/files", search: "" }

[NicholasFlamy]

The URL constructor won't override the host, but we can just do that explicitly right? From browser console:

let url = new URL(location.href) 
// URL { href: "https://github.com/immich-app/immich/pull/16014/files", origin: "https://github.com/", protocol: "https:", username: "", password: "", host: "github.com", hostname: "github.com", port: "", pathname: "/immich-app/immich/pull/16014/files", search: "" }
url.host = "immich.app" 
url
// URL { href: "https://immich.app/immich-app/immich/pull/16014/files", origin: "https://immich.app/", protocol: "https:", username: "", password: "", host: "immich.app", hostname: "immich.app", port: "", pathname: "/immich-app/immich/pull/16014/files", search: "" }

Hmm. I'll have to see how that goes.

Edit: in dev builds it'll link to http://immich.app instead of https but that's probably fine since it'll probably redirect to https.

[bo0tzz]

It should retain the scheme of the original URL, which would be http in dev and https in prod.

[NicholasFlamy]

It should retain the scheme of the original URL, which would be http in dev and https in prod.

It breaks the dev instance though because of the port.

https://url.spec.whatwg.org/#dom-url-host

If the given value for the host setter lacks a port, this’s URL’s port will not change. This can be unexpected as host getter does return a URL-port string so one might have assumed the setter to always "reset" both.

[NicholasFlamy]

Let me know what you think of the latest implementation. There doesn't seem to be any easy and obvious way to do this.