Watch during dev

desktop/README.md

@@ -10,27 +10,13 @@ To know more about Ente, see [our main README](../README.md) or visit
 
 ## Building from source
 
-Fetch submodules
-
-```sh
-git submodule update --init --recursive
-```
-
 Install dependencies
 
 ```sh
 yarn install
 ```
 
-Create a binary for your platform
-
-```sh
-yarn build
-```
-
-## Developing
-
-Instead of building, you can run the app in development mode
+Run in development mode (with hot reload)
 
 ```sh
 yarn dev
@@ -39,15 +25,13 @@ yarn dev
 > [!CAUTION]
 >
 > `yarn dev` is currently not working (we'll fix soon). If you just want to
-> build from source and use the generated binary, use `yarn build` as described
-> above.
+> build from source and use the generated binary, use `yarn build`.
 
-This'll launch a development server to serve the pages loaded by the renderer
-process, and will hot reload on changes.
-
-If you also want hot reload for the main process, run this in a separate
-terminal:
+Or create a binary for your platform
 
 ```sh
-yarn watch
+yarn build
 ```
+
+That's the gist of it. For more development related documentation, see
+[docs](docs/README.md).

desktop/package.json

@@ -11,13 +11,13 @@
         "build-main:quick": "tsc && electron-builder --config.compression=store",
         "build-renderer": "cd ../web && yarn install && yarn build:photos && cd ../desktop && rm -f out && ln -sf ../web/apps/photos/out",
         "build:quick": "yarn build-renderer && yarn build-main:quick",
-        "dev": "concurrently \"yarn dev-main\" \"yarn dev-renderer\"",
+        "dev": "concurrently --names 'main,rndr,tscw' \"yarn dev-main\" \"yarn dev-renderer\" \"yarn dev-main-watch\"",
         "dev-main": "tsc && electron app/main.js",
+        "dev-main-watch": "tsc --watch --preserveWatchOutput",
         "dev-renderer": "cd ../web && yarn install && yarn dev:photos",
         "postinstall": "electron-builder install-app-deps",
         "lint": "yarn prettier --check . && eslint \"src/**/*.ts\"",
-        "lint-fix": "yarn prettier --write . && eslint --fix .",
-        "watch": "tsc -w"
+        "lint-fix": "yarn prettier --write . && eslint --fix ."
     },
     "dependencies": {
         "any-shell-escape": "^0.1.1",

desktop/src/main.ts

@@ -56,6 +56,11 @@ const setupMainHotReload = () => {
     }
 };
 
+/**
+ * The URL where the renderer HTML is being served from.
+ */
+export const rendererURL = "next://app";
+
 /**
  * next-electron-server allows up to directly use the output of `next build` in
  * production mode and `next dev` in development mode, whilst keeping the rest
@@ -70,7 +75,7 @@ const setupMainHotReload = () => {
  * https://github.com/HaNdTriX/next-electron-server/issues/5
  */
 const setupRendererServer = () => {
-    serveNextAt("next://app");
+    serveNextAt(rendererURL);
 };
 
 setupMainHotReload();

desktop/src/utils/createWindow.ts

@@ -7,7 +7,7 @@ import { logErrorSentry } from "../services/sentry";
 import { getHideDockIconPreference } from "../services/userPreference";
 import { isDev } from "./common";
 import { isPlatform } from "./common/platform";
-import { PROD_HOST_URL } from "./main";
+import { rendererURL } from "../main";
 
 export async function createWindow(): Promise<BrowserWindow> {
     const appImgPath = isDev
@@ -41,14 +41,14 @@ export async function createWindow(): Promise<BrowserWindow> {
 
     if (isDev) {
         splash.loadFile(`../resources/splash.html`);
-        mainWindow.loadURL(PROD_HOST_URL);
+        mainWindow.loadURL(rendererURL);
         // Open the DevTools.
         mainWindow.webContents.openDevTools();
     } else {
         splash.loadURL(
             `file://${path.join(process.resourcesPath, "splash.html")}`
         );
-        mainWindow.loadURL(PROD_HOST_URL);
+        mainWindow.loadURL(rendererURL);
     }
     mainWindow.webContents.on("did-fail-load", () => {
         splash.close();

desktop/src/utils/main.ts

@@ -4,6 +4,7 @@ import os from "os";
 import path from "path";
 import { existsSync } from "promise-fs";
 import util from "util";
+import { rendererURL } from "../main";
 import { setupAutoUpdater } from "../services/appUpdater";
 import autoLauncher from "../services/autoLauncher";
 import { getHideDockIconPreference } from "../services/userPreference";
@@ -43,7 +44,7 @@ export function handleDownloads(mainWindow: BrowserWindow) {
 
 export function handleExternalLinks(mainWindow: BrowserWindow) {
     mainWindow.webContents.setWindowOpenHandler(({ url }) => {
-        if (!url.startsWith("next://app")) {
+        if (!url.startsWith(rendererURL)) {
             require("electron").shell.openExternal(url);
             return { action: "deny" };
         } else {