feat: setup builds for console

apps/console-electron/Makefile

@@ -0,0 +1,69 @@
+# Define commands for each task
+.PHONY: next_dev next_build next_start next_lint format postinstall electron_dist electron_dist_deb electron_build build dist dev electron_build_watch electron_dev
+
+# Define the default target
+default: help
+
+# Next.js tasks
+next_dev:
+	yarn next dev --turbo
+
+next_build:
+	NODE_ENV=production yarn next build
+
+next_start:
+	yarn next start
+
+next_lint:
+	yarn next lint
+
+# Formatting task
+format:
+	yarn dprint fmt
+
+# Electron tasks
+postinstall:
+	yarn electron-builder install-app-deps
+
+electron_dist:
+	yarn electron-builder --dir
+
+electron_dist_deb:
+	yarn electron-builder --linux deb
+
+electron_build:
+	yarn tsup
+
+electron_build_watch:
+	yarn tsup --watch
+
+electron_dev:
+	yarn cross-env NODE_ENV='development' nodemon
+
+# Composite tasks
+build:
+	make next_build && make electron_build
+
+dist:
+	make next_build && make electron_dist
+
+dev:
+	make next_dev & make electron_dev & make electron_build_watch
+
+# Help task to list available tasks
+help:
+	@echo "Available tasks:"
+	@echo "  make next_dev           - Development server for Next.js"
+	@echo "  make next_build         - Build Next.js project"
+	@echo "  make next_start         - Start Next.js project"
+	@echo "  make next_lint          - Lint Next.js project"
+	@echo "  make format             - Format code"
+	@echo "  make postinstall        - Install app dependencies for Electron"
+	@echo "  make electron_dist      - Build Electron for distribution in directory mode"
+	@echo "  make electron_dist_deb  - Build Electron for Debian distribution"
+	@echo "  make electron_build     - Build Electron using tsup"
+	@echo "  make build              - Build both Next.js and Electron projects"
+	@echo "  make dist               - Distribute both Next.js and Electron projects"
+	@echo "  make dev                - Development mode for both Electron and Next.js"
+	@echo "  make electron_build_watch - Watch mode for Electron with tsup"
+	@echo "  make electron_dev       - Development mode for Electron"

apps/console-electron/README.md

@@ -0,0 +1,46 @@
+# Console
+
+DiceDB Console is a management tool for DiceDB. It is a desktop application that allows you to manage your DiceDB instances, run load tests, view results, and manage observability. It will also enable you to prototype your queries before you include it in your apps.
+
+
+> [!CAUTION]
+> DiceDB Console is currently in active development. Please report any issues you encounter.
+
+## Development
+
+### Install
+
+To install DiceDB Console, run the following command:
+
+```bash
+cd alloy
+yarn install
+```
+
+### Develop
+
+To develop DiceDB Console, run the following command:
+
+```bash
+cd alloy
+yarn dev:console
+```
+
+### Build
+
+To build DiceDB Console, run the following command:
+
+```bash
+cd alloy
+yarn build:console
+```
+
+
+### Architecture
+
+DiceDB Console is built using [Electron](https://www.electronjs.org/), [Next.js](https://nextjs.org/), and [React](https://reactjs.org/). It uses [TypeScript](https://www.typescriptlang.org/) for type safety and [Jest](https://jestjs.io/) for testing.
+
+The nextjs frontend is used as the renderer process and the electron main process spawns the nextjs server. The main process also communicates with the renderer process using IPC.
+
+This enables us to develop the app as if it's just a mordern NextJS 14 app, with both client and server features, and also have the power of Electron to access the file system, spawn processes, etc.
+

apps/console-electron/app/dashboard/Counter.tsx

@@ -0,0 +1,14 @@
+'use client';
+import { incrementCounter } from './actions';
+
+export default function Counter({ count }: { count: number }) {
+  const handleClick = async () => {
+    await incrementCounter();
+  };
+  return (
+    <div>
+      <p>Counter: {count}</p>
+      <button onClick={handleClick}>Increment</button>
+    </div>
+  );
+}

apps/console-electron/app/dashboard/actions.ts

@@ -0,0 +1,14 @@
+'use server';
+
+import { revalidatePath } from 'next/cache';
+
+let counter = 0;
+
+export async function incrementCounter() {
+  counter++;
+  revalidatePath('/dashboard');
+}
+
+export async function getCounter() {
+  return counter;
+}

apps/console-electron/app/dashboard/page.tsx

@@ -1,12 +1,17 @@
 import Link from 'next/link';
+import { getCounter } from './actions';
+import Counter from './Counter';
 
-export default function Another() {
+export default async function Another() {
+  const count = await getCounter();
   return (
     <div
       className={`grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]`}
     >
       <Link href="/">Go back</Link>
       <p>Dashboard Page</p>
+
+      <Counter count={count} />
     </div>
   );
 }

apps/console-electron/electron/main.ts

@@ -0,0 +1,71 @@
+import { is } from '@electron-toolkit/utils';
+import { app, BrowserWindow, ipcMain } from 'electron';
+import { getPort } from 'get-port-please';
+import { startServer } from 'next/dist/server/lib/start-server';
+import { join } from 'path';
+
+const createWindow = () => {
+  const mainWindow = new BrowserWindow({
+    width: 900,
+    height: 670,
+    webPreferences: {
+      preload: join(__dirname, 'preload.js'),
+      nodeIntegration: true,
+    },
+  });
+
+  mainWindow.on('ready-to-show', () => mainWindow.show());
+
+  const loadURL = async () => {
+    if (is.dev) {
+      mainWindow.loadURL('http://localhost:3000');
+    } else {
+      try {
+        const port = await startNextJSServer();
+        console.log('Next.js server started on port:', port);
+        mainWindow.loadURL(`http://localhost:${port}`);
+      } catch (error) {
+        console.error('Error starting Next.js server:', error);
+      }
+    }
+  };
+
+  loadURL();
+  return mainWindow;
+};
+
+const startNextJSServer = async () => {
+  try {
+    const nextJSPort = await getPort({ portRange: [30_011, 50_000] });
+    const webDir = join(app.getAppPath(), 'app');
+
+    await startServer({
+      dir: webDir,
+      isDev: false,
+      hostname: 'localhost',
+      port: nextJSPort,
+      customServer: true,
+      allowRetry: false,
+      keepAliveTimeout: 5000,
+      minimalMode: true,
+    });
+
+    return nextJSPort;
+  } catch (error) {
+    console.error('Error starting Next.js server:', error);
+    throw error;
+  }
+};
+
+app.whenReady().then(() => {
+  createWindow();
+
+  ipcMain.on('ping', () => console.log('pong'));
+  app.on('activate', () => {
+    if (BrowserWindow.getAllWindows().length === 0) createWindow();
+  });
+});
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') app.quit();
+});

apps/console-electron/electron/preload.ts

@@ -0,0 +1,10 @@
+import { contextBridge, ipcRenderer } from "electron";
+
+contextBridge.exposeInMainWorld("electron", {
+  ipcRenderer: {
+    send: (channel: string, data: any) => ipcRenderer.send(channel, data),
+    on: (channel: string, listener: (event: any, ...args: any[]) => void) =>
+      ipcRenderer.on(channel, listener),
+  },
+});
+

apps/console-electron/next.config.mjs

@@ -1,5 +1,6 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  output: "standalone",
   reactStrictMode: true,
 };
 

apps/console-electron/nodemon.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "https://json.schemastore.org/nodemon.json",
+  "exec": "electron .",
+  "watch": ["main"],
+  "ignore": ["build", "public/build"]
+}
+

apps/console-electron/package.json

@@ -2,32 +2,94 @@
   "name": "@dicedb/console-electron",
   "version": "0.1.0",
   "private": true,
-  "main": "main.js",
+  "main": "build/main.cjs",
   "type": "module",
   "scripts": {
-    "dev": "concurrently --kill-others \"next dev -p ${PORT:-4000}\" \"electron .\"",
-    "dev:next": "next dev",
-    "build": "next build",
-    "start": "next start",
-    "lint": "eslint ."
+    "lint": "eslint .",
+    "next:dev": "next dev",
+    "next:build": "next build",
+    "next:start": "next start",
+    "next:lint": "next lint",
+    "format": "dprint fmt",
+    "electron:dist": "electron-builder --dir",
+    "electron:dist:deb": "electron-builder --linux deb",
+    "electron:build": "tsup",
+    "build": "run-s next:build electron:build",
+    "dist": "run-s next:build electron:dist",
+    "dev": "npm-run-all --parallel electron:dev next:dev",
+    "electron:build_watch": "tsup --watch",
+    "electron:dev": "npm-run-all --parallel electron:build_watch electron:watch",
+    "electron:watch": "cross-env NODE_ENV='development' nodemon"
   },
   "dependencies": {
-    "next": "14.2.15",
-    "react": "^18",
-    "react-dom": "^18"
+    "@electron-toolkit/utils": "^3.0.0",
+    "get-port-please": "^3.1.2",
+    "next": "15.0.3",
+    "react": "19.0.0-rc-66855b96-20241106",
+    "react-dom": "19.0.0-rc-66855b96-20241106"
   },
   "devDependencies": {
     "@dicedb/eslint-config": "*",
     "@dicedb/typescript-config": "*",
     "@types/node": "^20",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
+    "@types/react": "npm:[email protected]",
+    "@types/react-dom": "npm:[email protected]",
     "concurrently": "^9.0.1",
-    "electron": "^32.2.0",
+    "cross-env": "^7.0.3",
+    "electron": "33.2.0",
+    "electron-builder": "^25.1.8",
     "eslint": "^8",
-    "eslint-config-next": "14.2.15",
+    "eslint-config-next": "15.0.3",
+    "nodemon": "^3.1.7",
+    "npm-run-all": "^4.1.5",
     "postcss": "^8",
     "tailwindcss": "^3.4.1",
+    "tsup": "^8.3.5",
     "typescript": "^5"
+  },
+  "build": {
+    "asar": true,
+    "executableName": "DicDBConsole",
+    "appId": "io.dicedb.console",
+    "asarUnpack": [
+      "node_modules/next",
+      "node_modules/@img",
+      "node_modules/sharp",
+      "**\\*.{node,dll}"
+    ],
+    "files": [
+      "build",
+      {
+        "from": ".next/standalone",
+        "to": "app",
+        "filter": [
+          "!**/.env",
+          "!**/package.json"
+        ]
+      },
+      {
+        "from": ".next/static",
+        "to": "app/.next/static"
+      },
+      {
+        "from": "public",
+        "to": "app/public"
+      }
+    ],
+    "win": {
+      "target": [
+        "nsis"
+      ]
+    },
+    "linux": {
+      "target": [
+        "deb"
+      ],
+      "category": "Development"
+    }
+  },
+  "resolutions": {
+    "@types/react": "npm:[email protected]",
+    "@types/react-dom": "npm:[email protected]"
   }
 }