fix(typesync): package client UI in dist and store data in .typesync.db

Author: marcusrein

apps/typesync/package.json

@@ -33,7 +33,7 @@
     "coverage": "vitest run --coverage",
     "copy-package-json": "tsx scripts/copy-package-json.ts",
     "copy-db-migrations": "cp ./src/migrations/_schema.sql ./dist/migrations/_schema.sql",
-    "copy-client-dist": "mkdir -p ./dist/client && cp -rp ./client/dist ./dist/client/dist",
+    "copy-client-dist": "tsx scripts/copy-client-dist.ts",
     "copy-all": "pnpm run copy-package-json && pnpm run copy-db-migrations && pnpm run copy-client-dist",
     "typesync": "pnpx tsx ./src/bin.ts studio"
   },

apps/typesync/scripts/copy-client-dist.ts

@@ -0,0 +1,18 @@
+import { cp, mkdir } from 'node:fs/promises';
+import { resolve } from 'node:path';
+
+(async () => {
+  try {
+    const src = resolve(process.cwd(), 'client', 'dist');
+    const dest = resolve(process.cwd(), 'dist', 'client', 'dist');
+
+    await mkdir(dest, { recursive: true });
+    // Node >=16.7 has cp with recursive
+    await cp(src, dest, { recursive: true });
+
+    console.info('[Build] Copied client/dist to dist/client/dist');
+  } catch (err) {
+    console.error('[Build] Failed to copy client/dist', err);
+    process.exitCode = 1;
+  }
+})();

apps/typesync/src/Database.ts

@@ -20,7 +20,7 @@ import * as TypesyncDomain from '../domain/Domain.js';
 import * as Domain from './Domain.js';
 
 const SqlLive = SqliteClient.layer({
-  filename: 'typesync.db',
+  filename: '.typesync.db',
 });
 const MigratorLive = Migrator.layer({
   loader: Migrator.fromFileSystem(fileURLToPath(new URL('migrations', import.meta.url))),

apps/typesync/src/Server.ts

@@ -1,24 +1,26 @@
 /** Defines the static file routes for serving the client dist directory with the built vite/react app */
 
+import * as NodePath from 'node:path';
+import { fileURLToPath } from 'node:url';
 import * as HttpMiddleware from '@effect/platform/HttpMiddleware';
 import * as HttpRouter from '@effect/platform/HttpRouter';
 import * as HttpServer from '@effect/platform/HttpServer';
 import * as HttpServerResponse from '@effect/platform/HttpServerResponse';
-import * as Path from '@effect/platform/Path';
 import * as Effect from 'effect/Effect';
 import * as Layer from 'effect/Layer';
 import * as Option from 'effect/Option';
 import * as Struct from 'effect/Struct';
 
 import * as Api from './Api.js';
 
-const FilesRouter = Effect.gen(function* () {
-  const path = yield* Path.Path;
+const __dirname = NodePath.dirname(fileURLToPath(import.meta.url));
+const CLIENT_DIST_DIR = NodePath.resolve(__dirname, 'client', 'dist');
 
+const FilesRouter = Effect.gen(function* () {
   return HttpRouter.empty.pipe(
     HttpRouter.get(
       '/',
-      HttpServerResponse.file(path.resolve('client', 'dist', 'index.html')).pipe(
+      HttpServerResponse.file(NodePath.join(CLIENT_DIST_DIR, 'index.html')).pipe(
         Effect.orElse(() => HttpServerResponse.empty({ status: 404 })),
       ),
     ),
@@ -31,8 +33,8 @@ const FilesRouter = Effect.gen(function* () {
           return HttpServerResponse.empty({ status: 404 });
         }
 
-        const assets = path.resolve('client', 'dist', 'assets');
-        const normalized = path.normalize(path.join(assets, ...file.value.split('/')));
+        const assets = NodePath.join(CLIENT_DIST_DIR, 'assets');
+        const normalized = NodePath.normalize(NodePath.join(assets, ...file.value.split('/')));
         if (!normalized.startsWith(assets)) {
           return HttpServerResponse.empty({ status: 404 });
         }