Add nix config to js-chatbot

samples/idx-template.json

@@ -15,6 +15,7 @@
       "default": "js-character-generator",
       "options": {
         "js-character-generator": "Simple Character Generator",
+        "js-chatbot": "A chatbot using Vertex and Llama 3.1 or Gemini Flash",
         "js-coffee-shop": "Coffeeshop w Several types of Prompt",
         "js-schoolAgent": "A Multi-Agent School Assistant",
         "js-prompts": "A sample with various prompt styles",

samples/js-chatbot/.idx/dev.nix

@@ -0,0 +1,48 @@
+## Default Nix Environment for Typescript + Gemini Examples
+## Requires the sample to be started with npx run genkit:dev
+
+# To learn more about how to use Nix to configure your environment
+# see: https://developers.google.com/idx/guides/customize-idx-env
+{ pkgs, ... }: {
+  # Which nixpkgs channel to use.
+  channel = "stable-24.05"; # or "unstable"
+  # Use https://search.nixos.org/packages to find packages
+  packages = [
+    pkgs.nodejs_20
+    pkgs.util-linux
+  ];
+  # Sets environment variables in the workspace
+  env = {
+  };
+  idx = {
+    # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
+    extensions = [
+    ];
+
+    # Workspace lifecycle hooks
+    workspace = {
+      # Runs when a workspace is first created
+      onCreate = {
+        npm-install = "npm run setup";
+        default.openFiles = [ "README.md" "server/src/index.ts" ];
+      };
+      onStart = {
+        npm-run-server = "npm run start:server:idx";
+      };
+    };
+
+    previews = {
+      enable = true;
+      previews = {
+        web = {
+          cwd = "genkit-app";
+          command = ["npm" "run" "start" "--" "--port" "$PORT"];
+          env = {
+            PORT = "$PORT";
+          };
+          manager = "web";
+        };
+      };
+    };
+  };
+}

samples/js-chatbot/README.md

@@ -4,11 +4,11 @@ This is a simple chatbot. You can pick which model to use.
 
 Prerequisite
 
-- Google Cloud project with Vertex AI API enabled (https://cloud.google.com/apis/library/aiplatform.googleapis.com)
+- Google Cloud project with Vertex AI API enabled (https://console.cloud.google.com/apis/api/aiplatform.googleapis.com)
 - gcloud CLI installed (https://cloud.google.com/sdk/docs/install-sdk)
 - to use Llama 3.1 405b enable it in the Vertex AI [Model Garden](https://console.cloud.google.com/vertex-ai/publishers/meta/model-garden/llama3-405b-instruct-maas)
 
-The sample is using Vertex AI, so you'll need to auth:
+The sample is using Vertex AI, so you'll need to auth (you can skip this if running on IDX)
 
 ```bash
 gcloud auth login

samples/js-chatbot/genkit-app/package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
+    "start": "ng serve --port $PORT",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test"

samples/js-chatbot/genkit-app/src/app/samples/chatbot/chatbot.component.ts

@@ -30,7 +30,7 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatInputModule } from '@angular/material/input';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
 import { MatRadioModule } from '@angular/material/radio';
-import { streamFlow } from 'genkit/client';
+import { streamFlow } from 'genkit/beta/client';
 import { MarkdownModule } from 'ngx-markdown';
 
 const url = 'http://127.0.0.1:3400/chatbotFlow';

samples/js-chatbot/package.json

@@ -2,17 +2,18 @@
   "scripts": {
     "start": "concurrently npm:start:server npm:start:ng",
     "setup": "npm i && cd server && npm i && cd ../genkit-app && npm i",
+    "start:server:idx": "echo -e '\\033[1mChoose a Cloud Project with the Vertex APIs enabled\\033[0m in the popup\nSee https://console.cloud.google.com/apis/api/aiplatform.googleapis.com/metrics?project=veo-testing' && npm run start:server",
     "start:server": "cd server && npm run genkit:dev",
     "start:ng": "cd genkit-app && npm start"
   },
-  "name": "js-angular",
-  "version": "1.0.0",
-  "description": "This is a simple UI for streaming RPG character generator.",
+  "name": "js-chatbot",
+  "version": "0.1.0",
+  "description": "This is a simple chatbot app build with Genkit and Angular",
   "keywords": [],
   "author": "",
   "license": "ISC",
   "devDependencies": {
     "concurrently": "^8.2.2",
-    "genkit-cli": "^1.0.0-rc.15"
+    "genkit-cli": "1.0.0-rc.16"
   }
 }

samples/js-chatbot/server/package.json

@@ -2,7 +2,7 @@
   "main": "lib/index.js",
   "scripts": {
     "start": "node lib/index.js",
-    "genkit:dev": "genkit start -- npm run dev",
+    "genkit:dev": "npx genkit start -- npm run dev",
     "dev": "tsx --watch src/index.ts",
     "build": "tsc",
     "build:watch": "tsc --watch",
@@ -16,14 +16,14 @@
   "license": "ISC",
   "dependencies": {
     "genkit": "^1.0.0-rc.15",
-    "@genkit-ai/vertexai": "^1.0.0-rc.15",
-    "@genkit-ai/express": "^1.0.0-rc.15",
+    "@genkit-ai/vertexai": "^1.0.0-rc.16",
+    "@genkit-ai/express": "^1.0.0-rc.16",
     "express": "^4.21.0",
     "partial-json": "^0.1.7",
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "genkit-cli": "^1.0.0-rc.15",
+    "genkit-cli": "^1.0.0-rc.16",
     "typescript": "^5.4.5",
     "tsx": "^4.19.2"
   }