Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add call gemini for v2 #1134

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions Node/call-gemini/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# Don't accidentally push Discord Webhook URL to prod
functions/.env
31 changes: 31 additions & 0 deletions Node/call-gemini/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
# Quickstart: Send Firebase Alerts to Discord

This quickstart demonstrates how to trigger a function based on a Firebase Alert, and send information about the alert to a channel in a Discord server.

<img width="639" alt="Screen Shot 2022-04-29 at 11 12 12 AM" src="https://user-images.githubusercontent.com/3759507/165973290-2f6e6937-7c07-4006-b52d-813aa195e7cf.png">

## Set up and Deploy

### Discord Webhook URL

The sample uses [Discord Webhooks](https://support.discord.com/hc/en-us/articles/228383668-Intro-to-Webhooks) to send alerts to a Discord channel. You'll need to create a Webhook and hook it up the function by [creating an environment variable](https://firebase.google.com/docs/functions/config-env#env-variables):

1. Follow the "MAKING A WEBHOOK" instructions in the [Discord docs](https://support.discord.com/hc/en-us/articles/228383668-Intro-to-Webhooks).
1. Copy the Webhook URL
1. Create a `.env` file in the `functions` directory
1. Add the `DISCORD_WEBHOOK_URL` variable and set it to your Webhook URL:
```bash
DISCORD_WEBHOOK_URL="<your webhook url>"
```

### Deploy
Deploy functions using the Firebase CLI:

```bash
$ firebase deploy
```

## License

© Google, 2022. Licensed under an [Apache-2](../../../LICENSE) license.

20 changes: 20 additions & 0 deletions Node/call-gemini/app/.eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
module.exports = {
root: true,
env: { browser: true, es2020: true },
extends: [
'eslint:recommended',
'plugin:react/recommended',
'plugin:react/jsx-runtime',
'plugin:react-hooks/recommended',
],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
settings: { react: { version: '18.2' } },
plugins: ['react-refresh'],
rules: {
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
}
24 changes: 24 additions & 0 deletions Node/call-gemini/app/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
8 changes: 8 additions & 0 deletions Node/call-gemini/app/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
# React + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
12 changes: 12 additions & 0 deletions Node/call-gemini/app/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Call Gemini</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.jsx"></script>
</body>
</html>
27 changes: 27 additions & 0 deletions Node/call-gemini/app/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
{
"name": "app",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"
},
"dependencies": {
"firebase": "^10.11.1",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@types/react": "^18.2.43",
"@types/react-dom": "^18.2.17",
"@vitejs/plugin-react": "^4.2.1",
"eslint": "^8.55.0",
"eslint-plugin-react": "^7.33.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-react-refresh": "^0.4.5",
"vite": "^5.0.8"
}
}
6 changes: 6 additions & 0 deletions Node/call-gemini/app/src/App.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
#root {
max-width: 1280px;
margin: 0 auto;
padding: 2rem;
text-align: center;
}
35 changes: 35 additions & 0 deletions Node/call-gemini/app/src/App.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { useState } from "react";
import { getFunctions, httpsCallable, connectFunctionsEmulator } from "firebase/functions";
import { initializeApp } from "firebase/app";
import "./App.css";

function App() {
initializeApp({
// Your Firebase app configs here
});

const functions = getFunctions();
connectFunctionsEmulator(functions, "127.0.0.1", 5001);
const callGemini = httpsCallable(functions, "callGemini");
const [geminiResponse, setGeminiResponse] = useState();

return (
<>
<div>
<button
onClick={() =>
callGemini().then((result) => {
const data = result.data;
setGeminiResponse(data);
})
}
>
Call Gemini
</button>
<p>{JSON.stringify(geminiResponse?.text)}</p>
</div>
</>
);
}

export default App;
63 changes: 63 additions & 0 deletions Node/call-gemini/app/src/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
:root {
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;

color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #242424;

font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}

body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}

button {
border-radius: 8px;
border: 1px solid transparent;
padding: 0.6em 1.2em;
font-size: 1em;
font-weight: 500;
font-family: inherit;
background-color: #1a1a1a;
cursor: pointer;
transition: border-color 0.25s;
}
button:hover {
border-color: #646cff;
}
button:focus,
button:focus-visible {
outline: 4px auto -webkit-focus-ring-color;
}

@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}
10 changes: 10 additions & 0 deletions Node/call-gemini/app/src/main.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.jsx'
import './index.css'

ReactDOM.createRoot(document.getElementById('root')).render(
<React.StrictMode>
<App />
</React.StrictMode>,
)
7 changes: 7 additions & 0 deletions Node/call-gemini/app/vite.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
})
20 changes: 20 additions & 0 deletions Node/call-gemini/firebase.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
{
"functions": {
"codebase": "call-gemini",
"predeploy": [
"npm --prefix \"$RESOURCE_DIR\" run lint"
],
"source": "functions"
},
"hosting": {
"source": "app",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"frameworksBackend": {
"region": "us-central1"
}
}
}
30 changes: 30 additions & 0 deletions Node/call-gemini/functions/.eslintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
/**
* Copyright 2023 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

module.exports = {
root: true,
env: {
es2017: true,
node: true,
},
extends: [
"eslint:recommended",
"google",
],
rules: {
quotes: ["error", "double"],
},
};
2 changes: 2 additions & 0 deletions Node/call-gemini/functions/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
node_modules/
.secrets.local
39 changes: 39 additions & 0 deletions Node/call-gemini/functions/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
/**
* Copyright 2022 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
const {onCall, HttpsError} = require("firebase-functions/v2/https");
const {logger} = require("firebase-functions/v2");
const { GoogleGenerativeAI } = require("@google/generative-ai");
const { defineSecret } = require('firebase-functions/params');

const geminiToken = defineSecret("API_TOKEN", {
description: "Gemini API token. Created using " +
"https://ai.google.dev/tutorials/get_started_node#set-up-project",
});
HYACCCINT marked this conversation as resolved.
Show resolved Hide resolved

exports.callGemini = onCall({secrets: [geminiToken]}, async (request) => {

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Before calling Gemini, let's look for both appcheck and auth, but gate each with its own boolean parameter (https://firebase.google.com/docs/functions/config-env?gen=2nd#parameter_types) so devs can choose whether they want auth/app check or not.

Something like:

// ...imports

const appCheckRequired = defineBoolean("APP_CHECK_REQUIRED");
const authRequired = defineBoolean("AUTH_REQUIRED");

// ...other setup

exports.callGemini = onCall(
  {
    enforceAppCheck: appCheckRequired, // Reject requests with missing or invalid App Check tokens.
  },
  (request) => {
    if (authRequired.val() && !request.auth) {
      throw new HttpsError(
        "failed-precondition",
        "The function must be called while authenticated.",
      );
    }

    // ...call Gemini
  },
);

const genAI = new GoogleGenerativeAI(geminiToken.value());

// For text-only input, use the gemini-pro model
const model = genAI.getGenerativeModel({ model: "gemini-pro"});

const prompt = "Write a story about a magic backpack."

const result = await model.generateContent(prompt);
const response = await result.response;
const text = response.text();
return {text};
})
30 changes: 30 additions & 0 deletions Node/call-gemini/functions/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
{
"name": "call-gemini",
"description": "CAll Gemini endpoint to receive response.",
"scripts": {
"lint": "eslint .",
"serve": "firebase emulators:start --only functions",
"shell": "firebase functions:shell",
"start": "npm run shell",
"deploy": "firebase deploy --only functions",
"logs": "firebase functions:log",
"compile": "cp ../../../tsconfig.template.json ./tsconfig-compile.json && tsc --project tsconfig-compile.json"
},
"engines": {
"node": "18"
},
"main": "index.js",
"dependencies": {
"@google/generative-ai": "^0.5.0",
"firebase-admin": "^11.9.0",
"firebase-functions": "^4.4.1",
"node-fetch": "^2.6.7"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is node-fetch needed for this sample?

},
"devDependencies": {
"@types/node": "^17.0.45",
"eslint": "^8.40.0",
"eslint-config-google": "^0.14.0",
"firebase-functions-test": "^3.1.0"
},
"private": true
}
Loading
Loading