diff --git a/README.md b/README.md index f4437a6..fe02ce6 100644 --- a/README.md +++ b/README.md @@ -29,11 +29,11 @@ to store the to-do list items. ## Explore the app's codebase -- In `src/environments/environments.ts`, you can find important configuration values: +- In `src/bootstrap.js`, you can find important configuration values: - Within `firebase`, find the values needed to connect your app to Firebase (most importantly `apiKey`, `projectId`, and `appId`). - - Find your Gemini API key (`gemini_api_key`). + - Find your Gemini API key (`geminiApiKey`). Note that if you [run the sample app in IDX](https://github.com/FirebaseExtended/make-it-so-angular/main/README.md#set-up-and-run-the-app), @@ -105,12 +105,12 @@ to complete some manual setup steps. c. Create a new Firebase web app in your new project. You can skip setting up Firebase Hosting. d. Copy your Firebase config object, and replace the placeholder values in the - `src/environments/environments.ts` file of the sample app. + `src/bootstrap.js` file of the sample app. 2. Set up the Gemini API: a. [Get a Gemini API key](https://aistudio.google.com/app/apikey) in Google AI Studio. Use the Firebase project you just created. - b. Add your Gemini API key into the `src/environments/environments.ts` file of the sample app. + b. Add your Gemini API key into the `src/bootstrap.js` file of the sample app. 3. Run `npm install` to install the app's dependencies. @@ -173,7 +173,7 @@ your Firebase project (as described below). view and delete your Gemini API key. - In the sample app's codebase, delete references to the Gemini API key in the following places: - `google_apikeys_key` resource entry in `main.tf` - - `gemini_api_key` in both `src/environments/environments.ts` and `src/environments/environments.ts.tmpl` + - `geminiApiKey` in both `src/bootstrap.js` and `src/bootstrap.js.tmpl` - If you're no longer using the Google AI Gemini API, then disable it in your project and delete references to it in your sample app's codebase: diff --git a/angular.json b/angular.json index 60de887..069f3f8 100644 --- a/angular.json +++ b/angular.json @@ -34,7 +34,12 @@ } ], "styles": ["src/styles.scss"], - "scripts": [] + "scripts": [ + { + "input": "src/bootstrap.js", + "inject": false + } + ] }, "configurations": { "production": { diff --git a/idx-template.json b/idx-template.json index fe11836..8ec2f4e 100644 --- a/idx-template.json +++ b/idx-template.json @@ -14,6 +14,12 @@ "name": "Firebase Project ID", "type": "string", "required": true + }, + { + "id": "bootstrapJs", + "name": "Sample App Bootstrap", + "type": "string", + "required": false } ] } diff --git a/idx-template.nix b/idx-template.nix index 2103491..62ac1c0 100644 --- a/idx-template.nix +++ b/idx-template.nix @@ -1,12 +1,18 @@ -{ pkgs, projectId, ... }: +{ pkgs, projectId, bootstrapJs, ... }: { bootstrap = '' cp -rf ${./.} "$out/" chmod -R +w "$out" - + echo 'bootstrapJs was set to: ${bootstrapJs}' # Apply project ID to configs - sed -e 's//${projectId}/' ${.idx/dev.nix} > "$out/.idx/dev.nix" - + if [ -z '${bootstrapJs}' ] || [ '${bootstrapJs}' = 'false' ] + then + sed -e 's//${projectId}/' ${.idx/dev.nix} > "$out/.idx/dev.nix" + else + sed -e 's//${projectId}/' ${.idx/dev.nix} | sed -e 's/terraform init/# terraform init/' | sed -e 's/terraform apply/# terraform apply/' > "$out/.idx/dev.nix" + echo '${bootstrapJs}' > "$out/src/bootstrap.js" + echo '{"projects":{"default":"${projectId}"}}' > "$out/.firebaserc" + fi # Remove the template files themselves and any connection to the template's # Git repository rm -rf "$out/.git" "$out/idx-template".{nix,json} "$out/node_modules" diff --git a/main.tf b/main.tf index 7185fcc..06dcaae 100644 --- a/main.tf +++ b/main.tf @@ -71,7 +71,7 @@ resource "google_apikeys_key" "generativelanguage" { project = var.project name = "gemini-api-key" - display_name = "Gemini API Key" + display_name = "Generative language Gemini API Key" restrictions { api_targets { @@ -118,7 +118,7 @@ resource "google_firebaserules_release" "firestore" { resource "google_firebase_web_app" "example" { project = var.project - display_name = "Make It So AI!" + display_name = "Sample Firebase AI App" } data "google_firebase_web_app_config" "example" { @@ -144,7 +144,7 @@ resource "local_file" "firebaserc" { } resource "local_file" "environment_ts" { - content = templatefile("${path.module}/src/environments/environments.ts.tmpl", merge( + content = templatefile("${path.module}/src/bootstrap.js.tmpl", merge( data.google_firebase_web_app_config.example, { project_id = data.google_project.project.project_id, @@ -152,5 +152,5 @@ resource "local_file" "environment_ts" { debug_token = "" # Use local.uuid4 in when using Vertex AI in Firebase } )) - filename = "${path.module}/src/environments/environments.ts" + filename = "${path.module}/src/bootstrap.js" } diff --git a/package.json b/package.json index 551ae96..b3bc991 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@angular/platform-browser": "^18.1.0", "@angular/platform-browser-dynamic": "^18.1.0", "@google/generative-ai": "^0.19.0", + "backoff-rxjs": "^7.0.0", "firebase": "^10.13.0", "rxjs": "~7.8.0", "tslib": "^2.3.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 912630a..3a8b2c9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -31,7 +31,7 @@ importers: version: 18.2.1(@angular/common@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(@angular/platform-browser@18.2.1(@angular/animations@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/common@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10)))(rxjs@7.8.1) '@angular/material': specifier: ^18.1.4 - version: 18.2.1(xf4bg26sxibjwctkyum75pshta) + version: 18.2.1(c6a7869e627edbc40a6bd515b10aebf0) '@angular/platform-browser': specifier: ^18.1.0 version: 18.2.1(@angular/animations@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10)))(@angular/common@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10)) @@ -41,6 +41,9 @@ importers: '@google/generative-ai': specifier: ^0.19.0 version: 0.19.0 + backoff-rxjs: + specifier: ^7.0.0 + version: 7.0.0(rxjs@7.8.1) firebase: specifier: ^10.13.0 version: 10.13.0 @@ -2158,6 +2161,11 @@ packages: peerDependencies: '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0 + backoff-rxjs@7.0.0: + resolution: {integrity: sha512-ZLxc3iR7f6V4qngxL8CTBjIvQj1VCVK/EaQ26a2Xcrq0lXtSsl1ESvFFjMTSqcL93c9gcSinPf6xg/Sm+zYckg==} + peerDependencies: + rxjs: ^7.0.0 + balanced-match@1.0.2: resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==} @@ -5082,7 +5090,7 @@ snapshots: rxjs: 7.8.1 tslib: 2.7.0 - '@angular/material@18.2.1(xf4bg26sxibjwctkyum75pshta)': + '@angular/material@18.2.1(c6a7869e627edbc40a6bd515b10aebf0)': dependencies: '@angular/animations': 18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10)) '@angular/cdk': 18.2.1(@angular/common@18.2.1(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1))(@angular/core@18.2.1(rxjs@7.8.1)(zone.js@0.14.10))(rxjs@7.8.1) @@ -7157,6 +7165,10 @@ snapshots: transitivePeerDependencies: - supports-color + backoff-rxjs@7.0.0(rxjs@7.8.1): + dependencies: + rxjs: 7.8.1 + balanced-match@1.0.2: {} base64-js@1.5.1: {} diff --git a/src/app/app.component.html b/src/app/app.component.html index 533e54c..54e5f3b 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,5 +1,5 @@ -
+ @if (viewCodeLink) { +
+ +
+ } +
Icon -

+

Planning with the Gemini API

-
+
- + Add a prompt