feat: support whitelabel

[wa0x6e]

Summary

Closes: https://github.com/snapshot-labs/workflow/issues/142

This PR shows a special version of the website (white label version*), when accessed through a valid custom domain).

A white label is a stripped down version of the main website, with all Snapshot branding removed, with the site appearing like something owned by the DAO. No inside links to snapshot should remain, everything on the website should only concern the DAO.

A custom domain is a domain name (e.g. vote.balancer.fi) associated to a space id (balancer.eth), saved and served through a list managed by ourself. Currently, we used the hub, through the Space object to fetch a space, given a domain, so this feature is offchain spaces only.

Main features

• Some components edited to be hidden on white label, e.g. sidebar, notifications, follow list, follow button, etc ....
• white label have its own set of routes (notably, the removal of /network:id prefix for space routes)
• white label do not have non-dao related pages (no global user pages, my- and site- routes, etc ...)
• the space breadcrumb should appear on all pages
• Added a new splash screen, to be shown while resolving the white label, or show an error when white label failed to resolve
• Removed the space key in most of the routes nested under space-, as this key will be inherited automatically when nested and when needed. Skipping this hardcoding allow routes to be compatible with white label routes, which do not have this params

Changes summary

• Most of the non-directly related changes have been offloaded into their own PR, so this one can be reviewed more easily
• Added a new useWhiteLabel composable
• Split routes into multiple files, index.ts is for logic, and the rest are for declaration.
• When using a custom domain, router will load a new catch all routes, and show a splash screen, while it's deciding whether the custom domain is associated to a space. If true, will load the white label routes and show the space, else load the main website routes and will show the main website.

How to test

White label domain<->spaceID mapping list can be overridden locally by using the custom env variable VITE_WHITE_LABEL_MAPPING, formatted like DOMAIN;SPACEID (e.g. VITE_WHITE_LABEL_MAPPING='vote.balancer.fi:balancer.eth')

With VITE_WHITE_LABEL_MAPPING='127.0.0.1;balancer.eth', http://localhost:8080 will serve the snapshot website, whereas http://127.0.0.1:8080 will serve the balancer.eth white label version

Testing a custom domain associated to a space

1. Start the dev server with VITE_WHITE_LABEL_MAPPING='127.0.0.1;balancer.eth yarn dev
2. Go to http://localhost:3000
3. It should show the main website as before (immediate loading, no splash screen)
4. Go to http://127.0.0.1:8080
5. It should show the white label site for balancer.eth (will show a splash screen, but since on local, too fast to see it)

To test the splash screen, add a delay

diff --git a/apps/ui/src/composables/useWhiteLabel.ts b/apps/ui/src/composables/useWhiteLabel.ts
index 00a82383..0b6217d7 100644
--- a/apps/ui/src/composables/useWhiteLabel.ts
+++ b/apps/ui/src/composables/useWhiteLabel.ts
@@ -1,3 +1,4 @@
+import { sleep } from '@/helpers/utils';
 import { getNetwork } from '@/networks';
 import { useSpacesStore } from '@/stores/spaces';
 import { NetworkID } from '@/types';
@@ -29,6 +30,7 @@ async function getSpaceId(domain: string): Promise<string | null> {
   // e.g. VITE_WHITE_LABEL_MAPPING='127.0.0.1;snapshot.eth'
   const localMapping = import.meta.env.VITE_WHITE_LABEL_MAPPING;
   if (localMapping) {
+    await sleep(1000); // Add 1s delay to simulate network latency
     const [localDomain, localSpaceId] = localMapping.split(';');
     if (domain === localDomain) return localSpaceId;
   }

Loading http://127.0.0.1:8080 will now show the splash screen for 1s (emulating the delay for resolving the custom domain from the hub)

Testing a custom domain not associated to a space

1. yarn dev
2. Go to http://127.0.0.1:8080
3. It should show the splash screen
4. It should load the main website after deciding that no space is associated to 127.0.0.1
5. Go to http://localhost:3000
6. It should show the main website as before (immediat loading, no splash screen)

Testing a custom domain not being able to resolve

1. Edit your code source and put an invalid url for the snapshot hub url
2. yarn dev
3. Go to http://127.0.0.1
4. It should show the splash screen
5. Once the hub fails to resolve, it should show the splash screen with an error message

To-Do

• App should respond to any domains thrown at it, in addition to localhost
• Hide sidebar
• Custom routes only related to /space
• Remove Follow space button
• Remove link to user global profile
• Remove verified/turbo badge
• My Profile should redirect to user space profile
• Handle routes redirection on white label load
• Check all "share" links
• Check all Page title
• Check for extrapolated url in router (.push(xxx/xxx)
• Disable intercom on whitelabel
• Fix duplicate calls of fetchSpace
• Editor page crashing with resolver error
• Set correct page title (current issue where page title is overwritten by space name)

[ChaituVR]

I think we should still keep Snapshot here by default. (can be changed later) At least for some of the crawlers

[ChaituVR]

we will not have localhost here?

[wa0x6e]

it's responding on both localhost and 127.0.0.1

[wa0x6e]

Last minute update in the test env var, network id has been removed, now it's just domain:spaceId, e.g. VITE_WHITE_LABEL_MAPPING='127.0.0.1;balancer.eth'

[bonustrack]

Last minute update in the test env var, network id has been removed, now it's just domain:spaceId, e.g. VITE_WHITE_LABEL_MAPPING='127.0.0.1;balancer.eth'

Any reason for that? Would that work with SX spaces too?

[wa0x6e]

Before it was working with sx, but with this change, not anymore.

Will bring that back if we add support for sx, but for now, it's simpler, and we only support offchain since we're resolving domain name with the hub

[bonustrack]

Tried all the ways and it works well! tACK

[ChaituVR]

tAck

[Sekhmet]

Didn't get around to testing it today, will review it tomorrow.