feat: Prepare to read from dotenv

Author: grossbart

.env-template

@@ -0,0 +1,4 @@
+# The full base URL of the Code Expert web application
+CX_WEB_URL="{{CX_WEB_URL}}"
+# The full base URL of the Code Expert API
+CX_API_URL="{{CX_API_URL}}"

.gitignore

@@ -7,6 +7,10 @@ dist
 build/
 *.tsbuildinfo
 
+### dotenv ###
+.env
+.env.*
+
 ### Yarn ###
 .yarn/*
 !.yarn/releases

package.json

@@ -3,32 +3,32 @@
   "version": "0.0.18",
   "description": "",
   "scripts": {
-    "setup": "yarn build:ts",
+    "setup": "scripts/setup",
     "clean:setup": "yarn cache clean && rm -f .yarn/install-state.gz && rm -rf node_modules && find . -type f -name '*.tsbuildinfo' -delete && find packages -type d -name 'build' -exec rm -rf '{}' + -depth",
     "build": "concurrently \"yarn:build:*\"",
-    "build:ts": "tsc --build",
-    "build:server": "vite build",
+    "build:ts": "dotenv -- tsc --build",
+    "build:server": "dotenv -- vite build",
     "clean:build": "rm -rf dist && rm -rf src-tauri/target",
-    "dev": "tauri dev",
+    "dev": "dotenv -- tauri dev",
     "=== TEST ===": "",
     "test": "yarn lint && yarn test:unit",
-    "test:unit": "vitest run",
-    "watch:test": "vitest watch",
+    "test:unit": "dotenv -- vitest run",
+    "watch:test": "dotenv -- vitest watch",
     "=== LINT ===": "",
     "lint": "concurrently \"yarn:lint:*\"",
     "lint:format": "prettier --check --cache  --cache-strategy content \"./src/**/*.{js,jsx,ts,tsx,json,less,html}\"",
     "lint:static": "eslint . --cache  --cache-strategy content --ext .js,.jsx,.ts,.tsx",
     "lint:ts": "yarn build:ts",
     "=== STORYBOOK ===": "",
-    "storybook": "storybook dev -p 6006",
-    "storybook:build": "storybook build",
+    "storybook": "dotenv -- storybook dev -p 6006",
+    "storybook:build": "dotenv -- storybook build",
     "storybook:test": "npx chromatic --project-token=af98efe0a6a9",
     "=== UTILITIES ===": "",
     "clean": "concurrently \"yarn:clean:*\"",
-    "dev:server": "vite",
-    "dev:preview": "vite preview",
+    "dev:server": "dotenv -- vite",
+    "dev:preview": "dotenv -- vite preview",
     "=== LIFE CYCLE HOOKS ===": "",
-    "postinstall": "yarn setup"
+    "postinstall": "SKIP_INSTALL=true yarn setup"
   },
   "license": "MIT",
   "resolutions": {
@@ -88,6 +88,7 @@
     "@vitejs/plugin-react": "^3.0.0",
     "chromatic": "^6.17.0",
     "concurrently": "^8.0.1",
+    "dotenv-cli": "^7.2.1",
     "eslint": "^8.34.0",
     "eslint-import-resolver-typescript": "^3.5.3",
     "eslint-plugin-import": "^2.27.5",

scripts/setup

@@ -0,0 +1,18 @@
+#!/usr/bin/env bash
+set -eu
+
+# Install Node modules unless skipped
+if [ "${SKIP_INSTALL:-false}" != "true" ]; then
+  yarn
+fi
+
+# Initialize dotenv files if none have been created yet
+if [ ! -f ".env" ]; then
+  sed \
+    -e 's|{{CX_WEB_URL}}|http://localhost:3000|' \
+    -e 's|{{CX_API_URL}}|http://localhost:3100|' \
+    .env-template > ".env"
+fi
+
+# Generate TS types
+yarn build:ts

src/api/index.ts

@@ -28,8 +28,6 @@ export interface Api {
   readConfigFile<T>(name: string, decoder: iots.Decoder<unknown, T>): taskOption.TaskOption<T>;
   hasConfigFile(name: string): task.Task<boolean>;
   logout(): taskOption.TaskOption<void>;
-  CXUrl: string;
-  APIUrl: string;
 }
 
 export const api: Api = {
@@ -77,7 +75,4 @@ export const api: Api = {
     ),
   hasConfigFile: (name) => () => exists(name, { dir: BaseDirectory.AppLocalData }),
   logout: () => api.settingWrite('accessToken', null),
-  //TODO how to switch to production during build??
-  CXUrl: 'http://localhost:3000',
-  APIUrl: 'http://localhost:3100',
 };

src/config.ts

@@ -0,0 +1,29 @@
+import { either, identity, iots, pipe } from '@code-expert/prelude';
+
+interface UrlBrand {
+  readonly Url: unique symbol;
+}
+
+const Url = iots.brand(
+  iots.string,
+  (s): s is iots.Branded<string, UrlBrand> => iots.string.is(s) && s.length > 0,
+  'Url',
+);
+
+const Config = iots.type({
+  CX_WEB_URL: Url,
+  CX_API_URL: Url,
+});
+
+export type Config = iots.TypeOf<typeof Config>;
+
+export const config: Config = pipe(
+  process.env,
+  Config.decode,
+  either.fold((errors) => {
+    throw new Error(
+      'Parsing environment variables failed. Did you create a .env file in the root directory?\n\n' +
+        iots.formatValidationErrors(errors).join('\n'),
+    );
+  }, identity),
+);

yarn.lock

@@ -5451,6 +5451,7 @@ __metadata:
     conditional-type-checks: ^1.0.6
     copy-to-clipboard: ^3.3.3
     date-fns: ^2.29.3
+    dotenv-cli: ^7.2.1
     eslint: ^8.34.0
     eslint-import-resolver-typescript: ^3.5.3
     eslint-plugin-import: ^2.27.5
@@ -6052,6 +6053,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"dotenv-cli@npm:^7.2.1":
+  version: 7.2.1
+  resolution: "dotenv-cli@npm:7.2.1"
+  dependencies:
+    cross-spawn: ^7.0.3
+    dotenv: ^16.0.0
+    dotenv-expand: ^10.0.0
+    minimist: ^1.2.6
+  bin:
+    dotenv: cli.js
+  checksum: 8ca27fd44ba261b974a0342ec831a714fa1cb6d6e98d4b5db8e94f111951af1fb129a64d007264b1901337c43a8ef877071f1836b6992944fd6970c16367aee0
+  languageName: node
+  linkType: hard
+
 "dotenv-expand@npm:^10.0.0":
   version: 10.0.0
   resolution: "dotenv-expand@npm:10.0.0"