Clarify a few things around running shared albums locally (#1652)

apps/photos/.env.development

@@ -44,12 +44,20 @@
 
 # The URL for the shared albums deployment
 #
-# Currently the shared albums code is intermixed with the photos app code; when
-# deploying, we add an a CNAME alias from "albums.ente.io" -> "/shared-album".
+# The shared albums are served from the photos app code, and "albums.ente.io" is
+# a CNAME alias to the main photo app itself. When the main index page loads, it
+# checks to see if the host is "albums.ente.io", and if so, redirects to
+# /shared-albums.
+#
+# This environment variable allows us to check for a host other than
+# "albums.ente.io". By setting this to localhost:3002 and running the photos app
+# on port 3002 (using `yarn dev:albums`), we can connect to it and emulate the
+# production behaviour.
 #
 # Enhancement: Consider splitting this into a separate app/ in this repository.
+# That can also reduce bundle sizes and make it load faster.
 #
-# NEXT_PUBLIC_ENTE_ALBUM_ENDPOINT = http://localhost:3002
+# NEXT_PUBLIC_ENTE_ALBUMS_ENDPOINT = http://localhost:3002
 
 # The URL of the family plans web app deployment
 #

apps/photos/.env.localhost

@@ -0,0 +1,21 @@
+# Develop against a server running on localhost
+#
+# Copy this file to `.env`. Then if you run a local instance of the web client
+# with `yarn dev:photos`, it will connect to a locally running instance of the
+# server. Not everything will work, you might need to set other env vars (see
+# `.env.development`), but it should give you a usable baseline setup.
+#
+# Equivalent CLI command using environment variables would be
+#
+#     NEXT_PUBLIC_ENTE_ENDPOINT=http://localhost:8080 NEXT_PUBLIC_ENTE_DIRECT_UPLOAD=true yarn dev:photos
+#
+
+NEXT_PUBLIC_ENTE_ENDPOINT = http://localhost:8080
+NEXT_PUBLIC_ENTE_DIRECT_UPLOAD = true
+
+# If you wish to preview how the shared albums work, you can use `yarn
+# dev:albums`. The equivalent CLI command using env vars would be
+#
+#     NEXT_PUBLIC_ENTE_ENDPOINT=http://localhost:8080 NEXT_PUBLIC_ENTE_ALBUMS_ENDPOINT=http://localhost:3002 NEXT_PUBLIC_ENTE_DIRECT_UPLOAD=true yarn dev:albums
+
+NEXT_PUBLIC_ENTE_ALBUMS_ENDPOINT = http://localhost:3002

apps/photos/package.json

@@ -2,11 +2,6 @@
     "name": "photos",
     "version": "0.0.0",
     "private": true,
-    "scripts": {
-        "dev": "next dev",
-        "build": "next build",
-        "albums": "next dev -p 3002"
-    },
     "dependencies": {
         "@/ui": "*",
         "@/utils": "*",

package.json

@@ -17,7 +17,7 @@
         "dev:auth": "yarn workspace auth next dev",
         "dev:cast": "yarn workspace cast next dev",
         "dev:photos": "yarn workspace photos next dev",
-        "albums": "yarn workspace photos albums",
+        "dev:albums": "yarn workspace photos next dev -p 3002",
         "lint": "yarn prettier --check . && yarn workspaces run eslint .",
         "lint-fix": "yarn prettier --write . && yarn workspaces run eslint --fix ."
     },

packages/shared/network/api.ts

@@ -79,7 +79,7 @@ export const getPaymentsURL = () => {
 };
 
 export const getAlbumsURL = () => {
-    const albumsURL = process.env.NEXT_PUBLIC_ENTE_ALBUM_ENDPOINT;
+    const albumsURL = process.env.NEXT_PUBLIC_ENTE_ALBUMS_ENDPOINT;
     if (albumsURL) {
         return albumsURL;
     }