├── .env.example
├── .eslintrc.json
├── .gitignore
├── README.md
├── app
    ├── api
    │   └── chat
    │   │   └── route.ts
    ├── favicon.ico
    ├── globals.css
    ├── hooks
    │   └── useConfiguration.ts
    ├── layout.tsx
    └── page.tsx
├── components
    ├── Bubble.tsx
    ├── Configure.tsx
    ├── Dropdown.tsx
    ├── Footer.tsx
    ├── PromptSuggestions
    │   ├── PromptSuggestionButton.tsx
    │   └── PromptSuggestionsRow.tsx
    ├── ThemeButton.tsx
    └── Toggle.tsx
├── next-env.d.ts
├── next.config.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── scripts
    ├── populateDb.ts
    └── sample_data.json
├── tailwind.config.js
└── tsconfig.json


/.env.example:
--------------------------------------------------------------------------------
1 | OPENAI_API_KEY=REPLACE_ME
2 | ASTRA_DB_ID=REPLACE_ME
3 | ASTRA_DB_REGION=REPLACE_ME
4 | ASTRA_DB_APPLICATION_TOKEN=REPLACE_ME
5 | ASTRA_DB_NAMESPACE=default_keyspace
6 | 


--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 |     "extends": ["next", "prettier"]
3 | }


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | # Byte-compiled / optimized / DLL files
  2 | __pycache__/
  3 | *.py[cod]
  4 | *$py.class
  5 | 
  6 | # C extensions
  7 | *.so
  8 | 
  9 | # Distribution / packaging
 10 | .Python
 11 | build/
 12 | develop-eggs/
 13 | dist/
 14 | downloads/
 15 | eggs/
 16 | .eggs/
 17 | lib64/
 18 | parts/
 19 | sdist/
 20 | var/
 21 | wheels/
 22 | share/python-wheels/
 23 | *.egg-info/
 24 | .installed.cfg
 25 | *.egg
 26 | MANIFEST
 27 | 
 28 | # PyInstaller
 29 | #  Usually these files are written by a python script from a template
 30 | #  before PyInstaller builds the exe, so as to inject date/other infos into it.
 31 | *.manifest
 32 | *.spec
 33 | 
 34 | # Installer logs
 35 | pip-log.txt
 36 | pip-delete-this-directory.txt
 37 | 
 38 | # Unit test / coverage reports
 39 | htmlcov/
 40 | .tox/
 41 | .nox/
 42 | .coverage
 43 | .coverage.*
 44 | .cache
 45 | nosetests.xml
 46 | coverage.xml
 47 | *.cover
 48 | *.py,cover
 49 | .hypothesis/
 50 | .pytest_cache/
 51 | cover/
 52 | 
 53 | # Translations
 54 | *.mo
 55 | *.pot
 56 | 
 57 | # Django stuff:
 58 | *.log
 59 | local_settings.py
 60 | db.sqlite3
 61 | db.sqlite3-journal
 62 | 
 63 | # Flask stuff:
 64 | instance/
 65 | .webassets-cache
 66 | 
 67 | # Scrapy stuff:
 68 | .scrapy
 69 | 
 70 | # Sphinx documentation
 71 | docs/_build/
 72 | 
 73 | # PyBuilder
 74 | .pybuilder/
 75 | target/
 76 | 
 77 | # Jupyter Notebook
 78 | .ipynb_checkpoints
 79 | 
 80 | # IPython
 81 | profile_default/
 82 | ipython_config.py
 83 | 
 84 | # pyenv
 85 | #   For a library or package, you might want to ignore these files since the code is
 86 | #   intended to run in multiple environments; otherwise, check them in:
 87 | # .python-version
 88 | 
 89 | # pipenv
 90 | #   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
 91 | #   However, in case of collaboration, if having platform-specific dependencies or dependencies
 92 | #   having no cross-platform support, pipenv may install dependencies that don't work, or not
 93 | #   install all needed dependencies.
 94 | #Pipfile.lock
 95 | 
 96 | # poetry
 97 | #   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
 98 | #   This is especially recommended for binary packages to ensure reproducibility, and is more
 99 | #   commonly ignored for libraries.
100 | #   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
101 | #poetry.lock
102 | 
103 | # pdm
104 | #   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
105 | #pdm.lock
106 | #   pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
107 | #   in version control.
108 | #   https://pdm.fming.dev/#use-with-ide
109 | .pdm.toml
110 | 
111 | # PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
112 | __pypackages__/
113 | 
114 | # Celery stuff
115 | celerybeat-schedule
116 | celerybeat.pid
117 | 
118 | # SageMath parsed files
119 | *.sage.py
120 | 
121 | # Environments
122 | .env
123 | .venv
124 | env/
125 | venv/
126 | ENV/
127 | env.bak/
128 | venv.bak/
129 | 
130 | # Spyder project settings
131 | .spyderproject
132 | .spyproject
133 | 
134 | # Rope project settings
135 | .ropeproject
136 | 
137 | # mkdocs documentation
138 | /site
139 | 
140 | # mypy
141 | .mypy_cache/
142 | .dmypy.json
143 | dmypy.json
144 | 
145 | # Pyre type checker
146 | .pyre/
147 | 
148 | # pytype static type analyzer
149 | .pytype/
150 | 
151 | # Cython debug symbols
152 | cython_debug/
153 | 
154 | # PyCharm
155 | #  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
156 | #  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
157 | #  and can be added to the global gitignore or merged into this file.  For a more nuclear
158 | #  option (not recommended) you can uncomment the following to ignore the entire idea folder.
159 | .idea/
160 | 
161 | node_modules
162 | .next


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # RAGBot Starter
 2 | 
 3 | This project is a starter for creating a chatbot using Astra DB and OpenAI. It's designed to be easy to deploy and use, with a focus on performance and usability.
 4 | 
 5 | ## Features
 6 | 
 7 | - **Astra DB Integration**: Store and retrieve data from your Astra DB database with ease.
 8 | - **OpenAI Integration**: Leverage the power of OpenAI to generate intelligent responses.
 9 | - **Easy Deployment**: Deploy your chatbot to Vercel with just a few clicks.
10 | - **Customizable**: Modify and extend the chatbot to suit your needs.
11 | 
12 | ## Getting Started
13 | 
14 | ### Prerequisites
15 | 
16 | - An Astra DB account. You can [create one here](https://astra.datastax.com/register).
17 |     - An Astra Vector Database
18 | - An OpenAI account. You can [create one here](https://platform.openai.com/).
19 | 
20 | ## Deployment
21 | 
22 | Easily deploy your chatbot to Vercel by clicking the button below:
23 | 
24 | [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/datastax/ragbot-starter&integration-ids=oac_HrgeXUSyqANAtm3MAOaTJ43a&env=OPENAI_API_KEY)
25 | 
26 | Configure the Astra DB integration and add your `OPENAI_API_KEY` environment variable.
27 | 
28 | Note: Before you deploying to prod, you will want to remove seed script (`npm run seed`) from the build step.
29 | 
30 | ### Local Development
31 | 
32 | 1. Clone this repository to your local machine.
33 | 2. Install the dependencies by running `npm install` in your terminal.
34 | 3. Set up the following environment variables in your IDE or `.env` file:
35 |     - `OPENAI_API_KEY`: Your API key for OpenAI
36 |     - `ASTRA_DB_API_ENDPOINT`: Your Astra DB vector database endpoint
37 |     - `ASTRA_DB_APPLICATION_TOKEN`: The generated app token for your Astra database
38 |         - To create a new token go to your database's `Connect` tab and click `Generate Token`. (your Application Token begins with `AstraCS:...`)
39 |     - `ASTRA_DB_NAMESPACE`: (Optional) The existing Astra Namespace/Keyspace **_in a vector-enabled DB_**
40 | 4. Populate your database with sample data by running `npm run seed` in your terminal.
41 | 
42 | ### Running the Project
43 | 
44 | To start the development server, run `npm run dev` in your terminal. Open [http://localhost:3000](http://localhost:3000) to view the chatbot in your browser.
45 | 


--------------------------------------------------------------------------------
/app/api/chat/route.ts:
--------------------------------------------------------------------------------
 1 | import OpenAI from 'openai';
 2 | import {OpenAIStream, StreamingTextResponse} from 'ai';
 3 | import {AstraDB} from "@datastax/astra-db-ts";
 4 | 
 5 | const openai = new OpenAI({
 6 |   apiKey: process.env.OPENAI_API_KEY,
 7 | });
 8 | 
 9 | const astraDb = new AstraDB(process.env.ASTRA_DB_APPLICATION_TOKEN, process.env.ASTRA_DB_API_ENDPOINT, process.env.ASTRA_DB_NAMESPACE);
10 | 
11 | export async function POST(req: Request) {
12 |   try {
13 |     const {messages, useRag, llm, similarityMetric} = await req.json();
14 | 
15 |     const latestMessage = messages[messages?.length - 1]?.content;
16 | 
17 |     let docContext = '';
18 |     if (useRag) {
19 |       const {data} = await openai.embeddings.create({input: latestMessage, model: 'text-embedding-ada-002'});
20 | 
21 |       const collection = await astraDb.collection(`chat_${similarityMetric}`);
22 | 
23 |       const cursor= collection.find(null, {
24 |         sort: {
25 |           $vector: data[0]?.embedding,
26 |         },
27 |         limit: 5,
28 |       });
29 |       
30 |       const documents = await cursor.toArray();
31 |       
32 |       docContext = `
33 |         START CONTEXT
34 |         ${documents?.map(doc => doc.content).join("\n")}
35 |         END CONTEXT
36 |       `
37 |     }
38 |     const ragPrompt = [
39 |       {
40 |         role: 'system',
41 |         content: `You are an AI assistant answering questions about Cassandra and Astra DB. Format responses using markdown where applicable.
42 |         ${docContext} 
43 |         If the answer is not provided in the context, the AI assistant will say, "I'm sorry, I don't know the answer".
44 |       `,
45 |       },
46 |     ]
47 | 
48 | 
49 |     const response = await openai.chat.completions.create(
50 |       {
51 |         model: llm ?? 'gpt-3.5-turbo',
52 |         stream: true,
53 |         messages: [...ragPrompt, ...messages],
54 |       }
55 |     );
56 |     const stream = OpenAIStream(response);
57 |     return new StreamingTextResponse(stream);
58 |   } catch (e) {
59 |     throw e;
60 |   }
61 | }
62 | 


--------------------------------------------------------------------------------
/app/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/datastax/ragbot-starter/fc0e279dbb79565e400d0b18b0d7f2b645461e75/app/favicon.ico


--------------------------------------------------------------------------------
/app/globals.css:
--------------------------------------------------------------------------------
  1 | @tailwind base;
  2 | @tailwind components;
  3 | @tailwind utilities;
  4 | 
  5 | :root {
  6 |   --text-primary: #FFFFFF;
  7 |   --text-primary-inverse: #090909;
  8 |   --text-primary-main: #7724AA;
  9 |   --text-secondary: #A6AAAE;
 10 |   --text-secondary-inverse: #494A4D;
 11 |   --background-bubble-primary: #611C9B;
 12 |   --background-bubble-secondary: #F7F7F7;
 13 |   --border-primary: #CED0D2;
 14 |   --background-soft: #F3E5F5;
 15 |   --background-start-rgb: 214, 219, 220;
 16 |   --background-end-rgb: 255, 255, 255;
 17 |   --text-tertiary: #6B6F73;
 18 |   --shadow-primary: 0px 6px 16px 0px #0A0A0A1F, 0px 4px 14px 0px #0A0A0A14, 0px 8px 10px 0px #0A0A0A14;
 19 |   --processing-dot-size: 4px;
 20 | }
 21 | 
 22 | 
 23 | .dark {
 24 |   --text-primary: #090909;
 25 |   --text-primary-inverse: #FFFFFF;
 26 |   --text-primary-main: #9946B9;
 27 |   --text-secondary: #494A4D;
 28 |   --text-secondary-inverse: #A6AAAE;
 29 |   --background-bubble-primary: #BA68C8;
 30 |   --background-bubble-secondary: #232324;
 31 |   --background-soft: #200033;
 32 |   --border-primary: #262626;
 33 |   --background-start-rgb: 23, 23, 23;
 34 |   --background-end-rgb: 28, 28, 28;
 35 | }
 36 | 
 37 | 
 38 | body {
 39 |   background: linear-gradient(to bottom,
 40 |       transparent,
 41 |       rgb(var(--background-end-rgb))) rgb(var(--background-start-rgb));
 42 | }
 43 | 
 44 | .chatbot-section {
 45 |   background-color: var(--text-primary);
 46 |   box-shadow: var(--shadow-primary);
 47 |   border: 1px solid var(--border-primary);
 48 | }
 49 | 
 50 | .chatbot-header {
 51 |   border-bottom: 1px solid var(--border-primary);;
 52 | }
 53 | 
 54 | .chatbot-header svg {
 55 |   fill: var(--text-primary-inverse);
 56 | }
 57 | 
 58 | .chatbot-text-primary {
 59 |   color: var(--text-primary-inverse);
 60 | }
 61 | 
 62 | .chatbot-text-secondary {
 63 |   color: var(--text-secondary);
 64 | }
 65 | 
 66 | .chatbot-text-secondary-inverse {
 67 |   color: var(--text-secondary-inverse);
 68 | }
 69 | 
 70 | .chatbot-text-tertiary {
 71 |   color: var(--text-tertiary);
 72 | }
 73 | 
 74 | .chatbot-input {
 75 |   color: var(--text-primary-inverse);
 76 |   border: 1px solid var(--border-primary);
 77 | }
 78 | 
 79 | .chatbot-input::placeholder {
 80 |   color: var(--text-secondary);
 81 | }
 82 | 
 83 | .chatbot-send-button {
 84 |   background-color: var(--text-primary-inverse);
 85 |   color: var(--text-primary);
 86 | }
 87 | 
 88 | .chatbot-send-button svg {
 89 |   fill: var(--text-primary);
 90 | }
 91 | 
 92 | .chatbot-button-primary {
 93 |   background-color: var(--text-primary-inverse);
 94 |   color: var(--text-primary);
 95 | }
 96 | 
 97 | .chatbot-button-secondary {
 98 |   border: 1px solid var(--border-primary);
 99 |   color: var(--text-primary-inverse);
100 | }
101 | 
102 | .chatbot-faq-link {
103 |   border: 1px solid var(--border-primary);
104 |   border-radius: 24px;
105 |   color: var(--background-bubble-primary);
106 | }
107 | 
108 | .chatbot-faq-link svg {
109 |   fill: var(--text-tertiary);
110 | }
111 | 
112 | .talk-bubble {
113 |   text-align: left;
114 |   display: inline-block;
115 |   position: relative;
116 |   color: var(--text-secondary-inverse);
117 |   background-color: var(--background-bubble-secondary);
118 |   border-radius: 10px;
119 |   border-bottom-left-radius: 0px;
120 | }
121 | 
122 | .talk-bubble.user {
123 |   text-align: right;
124 |   color: var(--text-primary);
125 |   background-color: var(--background-bubble-primary);
126 |   border-radius: 10px;
127 |   border-bottom-right-radius: 0px;
128 | }
129 | 
130 | .talk-bubble svg {
131 |   position: absolute;
132 |   left: -1px;
133 |   bottom: 2px;
134 |   transform: translateY(100%) rotateY(180deg);
135 |   fill: var(--background-bubble-secondary);
136 | }
137 | 
138 | .talk-bubble.user svg {
139 |   right: -1px;
140 |   left: auto;
141 |   bottom: 2px;
142 |   transform: translateY(100%);
143 |   fill: var(--background-bubble-primary);
144 | }
145 | 
146 | .dot-flashing {
147 |   position: relative;
148 |   /* padding-left: 8px; */
149 |   /* padding-right: 8px; */
150 |   width: var(--processing-dot-size);
151 |   height: var(--processing-dot-size);
152 |   border-radius: 100%;
153 |   background-color: var(--text-tertiary);
154 |   color: var(--text-tertiary);
155 |   animation: dot-flashing 1s infinite linear alternate;
156 |   animation-delay: 0.5s;
157 | }
158 | 
159 | .dot-flashing::before,
160 | .dot-flashing::after {
161 |   content: "";
162 |   display: inline-block;
163 |   position: absolute;
164 |   top: 0;
165 | }
166 | 
167 | .dot-flashing::before {
168 |   left: -6px;
169 |   width: var(--processing-dot-size);
170 |   height: var(--processing-dot-size);
171 |   border-radius: 100%;
172 |   background-color: var(--text-tertiary);
173 |   color: var(--text-tertiary);
174 |   animation: dot-flashing 1s infinite alternate;
175 |   animation-delay: 0s;
176 | }
177 | 
178 | .dot-flashing::after {
179 |   left: 6px;
180 |   width: var(--processing-dot-size);
181 |   height: var(--processing-dot-size);
182 |   border-radius: 100%;
183 |   background-color: var(--text-tertiary);
184 |   color: var(--text-tertiary);
185 |   animation: dot-flashing 1s infinite alternate;
186 |   animation-delay: 1s;
187 | }
188 | 
189 | @keyframes dot-flashing {
190 |   0% {
191 |     background-color: var(--text-tertiary);
192 |   }
193 | 
194 |   50%,
195 |   100% {
196 |     background-color: rgba(152, 128, 255, 0.2);
197 |   }
198 | }
199 | 
200 | .prompt-button {
201 |   background-color: var(--background-soft);
202 |   color: var(--text-primary-main);
203 | }
204 | 
205 | /* Toggle Styles */
206 | .toggle-background {
207 |   background-color: var(--background-bubble-primary);
208 | }
209 | 
210 | .toggle-boarder {
211 |   border: 1px solid var(--background-bubble-primary);
212 | }
213 | 
214 | .vercel-link {
215 |   color: var(--text-primary-inverse);
216 |   background-color: var(--text-primary);
217 |   border-color: var(--border-primary);
218 | }
219 | 
220 | .vercel-link hr {
221 |   border-color: var(--border-primary);
222 | }


--------------------------------------------------------------------------------
/app/hooks/useConfiguration.ts:
--------------------------------------------------------------------------------
 1 | "use client"
 2 | 
 3 | import { useState, useEffect } from 'react';
 4 | 
 5 | export type SimilarityMetric = "cosine" | "euclidean" | "dot_product";
 6 | 
 7 | const useConfiguration = () => {
 8 |   // Safely get values from localStorage
 9 |   const getLocalStorageValue = (key: string, defaultValue: any) => {
10 |     if (typeof window !== 'undefined') {
11 |       const storedValue = localStorage.getItem(key);
12 |       if (storedValue !== null) {
13 |         return storedValue;
14 |       }
15 |     }
16 |     return defaultValue;
17 |   };
18 | 
19 |   const [useRag, setUseRag] = useState<boolean>(() => getLocalStorageValue('useRag', 'true') === 'true');
20 |   const [llm, setLlm] = useState<string>(() => getLocalStorageValue('llm', 'gpt-3.5-turbo'));
21 |   const [similarityMetric, setSimilarityMetric] = useState<SimilarityMetric>(
22 |     () => getLocalStorageValue('similarityMetric', 'cosine') as SimilarityMetric
23 |   );
24 | 
25 |   const setConfiguration = (rag: boolean, llm: string, similarityMetric: SimilarityMetric) => {
26 |     setUseRag(rag);
27 |     setLlm(llm);
28 |     setSimilarityMetric(similarityMetric);
29 |   }
30 | 
31 |   // Persist to localStorage
32 |   useEffect(() => {
33 |     if (typeof window !== 'undefined') {
34 |       localStorage.setItem('useRag', JSON.stringify(useRag));
35 |       localStorage.setItem('llm', llm);
36 |       localStorage.setItem('similarityMetric', similarityMetric);
37 |     }
38 |   }, [useRag, llm, similarityMetric]);
39 | 
40 |   return {
41 |     useRag,
42 |     llm,
43 |     similarityMetric,
44 |     setConfiguration,
45 |   };
46 | }
47 | 
48 | export default useConfiguration;
49 | 


--------------------------------------------------------------------------------
/app/layout.tsx:
--------------------------------------------------------------------------------
 1 | import { GeistSans } from "geist/font/sans";
 2 | import "./globals.css";
 3 | 
 4 | export const metadata = {
 5 |   title: "RAGBot Starter",
 6 |   description: "RAGBot Starter - Powered by DataStax and Vercel",
 7 | };
 8 | 
 9 | export default function RootLayout({ children }) {
10 |   return (
11 |     <html lang="en" className={GeistSans.variable}>
12 |       <body>{children}</body>
13 |     </html>
14 |   );
15 | }
16 | 


--------------------------------------------------------------------------------
/app/page.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | import {useEffect, useRef, useState} from 'react';
 3 | import Bubble from '../components/Bubble'
 4 | import { useChat, Message } from 'ai/react';
 5 | import Footer from '../components/Footer';
 6 | import Configure from '../components/Configure';
 7 | import PromptSuggestionRow from '../components/PromptSuggestions/PromptSuggestionsRow';
 8 | import ThemeButton from '../components/ThemeButton';
 9 | import useConfiguration from './hooks/useConfiguration';
10 | 
11 | 
12 | export default function Home() {
13 |   const { append, messages, input, handleInputChange, handleSubmit } = useChat();
14 |   const { useRag, llm, similarityMetric, setConfiguration } = useConfiguration();
15 | 
16 |   const messagesEndRef = useRef(null);
17 |   const [configureOpen, setConfigureOpen] = useState(false);
18 | 
19 |   const scrollToBottom = () => {
20 |     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
21 |   };
22 | 
23 |   useEffect(() => {
24 |     scrollToBottom();
25 |   }, [messages]);
26 | 
27 |   const handleSend = (e) => {
28 |     handleSubmit(e, { options: { body: { useRag, llm, similarityMetric}}});
29 |   }
30 | 
31 |   const handlePrompt = (promptText) => {
32 |     const msg: Message = { id: crypto.randomUUID(),  content: promptText, role: 'user' };
33 |     append(msg, { options: { body: { useRag, llm, similarityMetric}}});
34 |   };
35 | 
36 |   return (
37 |     <>
38 |     <main className="flex h-screen flex-col items-center justify-center">
39 |       <section className='chatbot-section flex flex-col origin:w-[800px] w-full origin:h-[735px] h-full rounded-md p-2 md:p-6'>
40 |         <div className='chatbot-header pb-6'>
41 |           <div className='flex justify-between'>
42 |             <div className='flex items-center gap-2'>
43 |               <svg width="24" height="25" viewBox="0 0 24 25">
44 |                 <path d="M20 9.96057V7.96057C20 6.86057 19.1 5.96057 18 5.96057H15C15 4.30057 13.66 2.96057 12 2.96057C10.34 2.96057 9 4.30057 9 5.96057H6C4.9 5.96057 4 6.86057 4 7.96057V9.96057C2.34 9.96057 1 11.3006 1 12.9606C1 14.6206 2.34 15.9606 4 15.9606V19.9606C4 21.0606 4.9 21.9606 6 21.9606H18C19.1 21.9606 20 21.0606 20 19.9606V15.9606C21.66 15.9606 23 14.6206 23 12.9606C23 11.3006 21.66 9.96057 20 9.96057ZM7.5 12.4606C7.5 11.6306 8.17 10.9606 9 10.9606C9.83 10.9606 10.5 11.6306 10.5 12.4606C10.5 13.2906 9.83 13.9606 9 13.9606C8.17 13.9606 7.5 13.2906 7.5 12.4606ZM16 17.9606H8V15.9606H16V17.9606ZM15 13.9606C14.17 13.9606 13.5 13.2906 13.5 12.4606C13.5 11.6306 14.17 10.9606 15 10.9606C15.83 10.9606 16.5 11.6306 16.5 12.4606C16.5 13.2906 15.83 13.9606 15 13.9606Z" />
45 |               </svg>
46 |               <h1 className='chatbot-text-primary text-xl md:text-2xl font-medium'>Chatbot</h1>
47 |             </div>
48 |             <div className='flex gap-1'>
49 |               <ThemeButton />
50 |               <button onClick={() => setConfigureOpen(true)}>
51 |                 <svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
52 |                   <path d="M19.14 13.4006C19.18 13.1006 19.2 12.7906 19.2 12.4606C19.2 12.1406 19.18 11.8206 19.13 11.5206L21.16 9.94057C21.34 9.80057 21.39 9.53057 21.28 9.33057L19.36 6.01057C19.24 5.79057 18.99 5.72057 18.77 5.79057L16.38 6.75057C15.88 6.37057 15.35 6.05057 14.76 5.81057L14.4 3.27057C14.36 3.03057 14.16 2.86057 13.92 2.86057H10.08C9.83999 2.86057 9.64999 3.03057 9.60999 3.27057L9.24999 5.81057C8.65999 6.05057 8.11999 6.38057 7.62999 6.75057L5.23999 5.79057C5.01999 5.71057 4.76999 5.79057 4.64999 6.01057L2.73999 9.33057C2.61999 9.54057 2.65999 9.80057 2.85999 9.94057L4.88999 11.5206C4.83999 11.8206 4.79999 12.1506 4.79999 12.4606C4.79999 12.7706 4.81999 13.1006 4.86999 13.4006L2.83999 14.9806C2.65999 15.1206 2.60999 15.3906 2.71999 15.5906L4.63999 18.9106C4.75999 19.1306 5.00999 19.2006 5.22999 19.1306L7.61999 18.1706C8.11999 18.5506 8.64999 18.8706 9.23999 19.1106L9.59999 21.6506C9.64999 21.8906 9.83999 22.0606 10.08 22.0606H13.92C14.16 22.0606 14.36 21.8906 14.39 21.6506L14.75 19.1106C15.34 18.8706 15.88 18.5506 16.37 18.1706L18.76 19.1306C18.98 19.2106 19.23 19.1306 19.35 18.9106L21.27 15.5906C21.39 15.3706 21.34 15.1206 21.15 14.9806L19.14 13.4006ZM12 16.0606C10.02 16.0606 8.39999 14.4406 8.39999 12.4606C8.39999 10.4806 10.02 8.86057 12 8.86057C13.98 8.86057 15.6 10.4806 15.6 12.4606C15.6 14.4406 13.98 16.0606 12 16.0606Z" />
53 |                 </svg>
54 |               </button>
55 |             </div>
56 |           </div>
57 |           <p className="chatbot-text-secondary-inverse text-sm md:text-base mt-2 md:mt-4">Chatting with the Astra chatbot is a breeze! Simply type your questions or requests in a clear and concise manner. Responses are sourced from Astra documentation and a link for further reading is provided.</p>
58 |         </div>
59 |         <div className='flex-1 relative overflow-y-auto my-4 md:my-6'>
60 |           <div className='absolute w-full overflow-x-hidden'>
61 |             {messages.map((message, index) => <Bubble ref={messagesEndRef} key={`message-${index}`} content={message} />)}
62 |           </div>
63 |         </div>
64 |         {!messages || messages.length === 0 && (
65 |           <PromptSuggestionRow onPromptClick={handlePrompt} />
66 |         )}
67 |         <form className='flex h-[40px] gap-2' onSubmit={handleSend}>
68 |           <input onChange={handleInputChange} value={input} className='chatbot-input flex-1 text-sm md:text-base outline-none bg-transparent rounded-md p-2' placeholder='Send a message...' />
69 |           <button type="submit" className='chatbot-send-button flex rounded-md items-center justify-center px-2.5 origin:px-3'>
70 |             <svg width="20" height="20" viewBox="0 0 20 20">
71 |               <path d="M2.925 5.025L9.18333 7.70833L2.91667 6.875L2.925 5.025ZM9.175 12.2917L2.91667 14.975V13.125L9.175 12.2917ZM1.25833 2.5L1.25 8.33333L13.75 10L1.25 11.6667L1.25833 17.5L18.75 10L1.25833 2.5Z" />
72 |             </svg>
73 |             <span className='hidden origin:block font-semibold text-sm ml-2'>Send</span>
74 |           </button>
75 |         </form>
76 |         <Footer />
77 |       </section>
78 |     </main>
79 |     <Configure
80 |       isOpen={configureOpen}
81 |       onClose={() => setConfigureOpen(false)}
82 |       useRag={useRag}
83 |       llm={llm}
84 |       similarityMetric={similarityMetric}
85 |       setConfiguration={setConfiguration}
86 |     />
87 |     </>
88 |   )
89 | }


--------------------------------------------------------------------------------
/components/Bubble.tsx:
--------------------------------------------------------------------------------
 1 | import Link from "next/link";
 2 | import {forwardRef, JSXElementConstructor, useMemo, RefObject} from "react";
 3 | import Markdown from "react-markdown";
 4 | import remarkGfm from "remark-gfm";
 5 | 
 6 | const Bubble:JSXElementConstructor<any> = forwardRef(function Bubble({ content }, ref) {
 7 |   const { role } = content;
 8 |   const isUser = role === "user"
 9 | 
10 |   return (
11 |     <div ref={ref  as RefObject<HTMLDivElement>} className={`block mt-4 md:mt-6 pb-[7px] clear-both ${isUser ? 'float-right' : 'float-left'}`}>
12 |       <div className="flex justify-end">
13 |         <div className={`talk-bubble${isUser ? ' user' : ''} p-2 md:p-4`}>
14 |           {content.processing ? (
15 |             <div className="w-6 h-6 flex items-center justify-center">
16 |               <div className="dot-flashing" />
17 |             </div>
18 |           ) : (
19 |             <Markdown
20 |               remarkPlugins={[remarkGfm]}
21 |               components={{
22 |                 code({ node, children, ...props }) {
23 |                   return (
24 |                     <code {...props}>
25 |                        {children}
26 |                    </code>
27 |                    )
28 |                 }
29 |               }}
30 |             >
31 |               {content?.content}
32 |             </Markdown>
33 |           )}
34 |           <svg width="12" height="7" viewBox="0 0 12 7" fill="none" xmlns="http://www.w3.org/2000/svg">
35 |             <path d="M0.730278 0.921112C-3.49587 0.921112 12 0.921112 12 0.921112V5.67376C12 6.8181 9.9396 7.23093 9.31641 6.27116C6.83775 2.45382 3.72507 0.921112 0.730278 0.921112Z" />
36 |           </svg>
37 |         </div>
38 |       </div>
39 |       {content.url ? (
40 |         <div className="flex justify-end mt-3">
41 |           <div className="flex items-center gap-2">
42 |             <span className="text-sm">Source:</span>
43 |             <Link href={content?.url} target="_blank">
44 |               <div className="chatbot-faq-link flex items-center px-2 py-0.5">
45 |                 <svg width="14" height="7" viewBox="0 0 14 7" fill="none" xmlns="http://www.w3.org/2000/svg">
46 |                   <path d="M10.3333 0.127197H7.66665V1.46053H10.3333C11.4333 1.46053 12.3333 2.36053 12.3333 3.46053C12.3333 4.56053 11.4333 5.46053 10.3333 5.46053H7.66665V6.79386H10.3333C12.1733 6.79386 13.6666 5.30053 13.6666 3.46053C13.6666 1.62053 12.1733 0.127197 10.3333 0.127197ZM6.33331 5.46053H3.66665C2.56665 5.46053 1.66665 4.56053 1.66665 3.46053C1.66665 2.36053 2.56665 1.46053 3.66665 1.46053H6.33331V0.127197H3.66665C1.82665 0.127197 0.333313 1.62053 0.333313 3.46053C0.333313 5.30053 1.82665 6.79386 3.66665 6.79386H6.33331V5.46053ZM4.33331 2.79386H9.66665V4.1272H4.33331V2.79386Z" />
47 |                 </svg>
48 |                 <span className="text-xs font-semibold pl-1.5">Astra DB FAQs</span>
49 |               </div>
50 |             </Link>
51 |           </div>
52 |         </div>
53 |       ) :
54 |         null
55 |       }
56 |     </div>
57 |   )
58 | })
59 | 
60 | export default Bubble;


--------------------------------------------------------------------------------
/components/Configure.tsx:
--------------------------------------------------------------------------------
 1 | import { useState } from "react";
 2 | import Dropdown from "./Dropdown";
 3 | import Toggle from "./Toggle";
 4 | import Footer from "./Footer";
 5 | import { SimilarityMetric } from "../app/hooks/useConfiguration";
 6 | 
 7 | interface Props {
 8 |   isOpen: boolean;
 9 |   onClose: () => void;
10 |   useRag: boolean;
11 |   llm: string;
12 |   similarityMetric: SimilarityMetric;
13 |   setConfiguration: (useRag: boolean, llm: string, similarityMetric: SimilarityMetric) => void;
14 | }
15 | 
16 | const Configure = ({ isOpen, onClose, useRag, llm, similarityMetric, setConfiguration }: Props) => {
17 |   const [rag, setRag] = useState(useRag);
18 |   const [selectedLlm, setSelectedLlm] = useState(llm);
19 |   const [selectedSimilarityMetric, setSelectedSimilarityMetric] = useState<SimilarityMetric>(similarityMetric);
20 |   
21 |   if (!isOpen) return null;
22 | 
23 |   const llmOptions = [
24 |     { label: 'GPT 3.5 Turbo', value: 'gpt-3.5-turbo' },
25 |     { label: 'GPT 4', value: 'gpt-4' }
26 |   ];
27 | 
28 |   const similarityMetricOptions = [
29 |     { label: 'Cosine Similarity', value: 'cosine' },
30 |     { label: 'Euclidean Distance', value: 'euclidean' },
31 |     { label: 'Dot Product', value: 'dot_product' }
32 |   ];
33 | 
34 |   const handleSave = () => {
35 |     setConfiguration(
36 |         rag,
37 |         selectedLlm,
38 |         selectedSimilarityMetric
39 |     );
40 |     onClose();
41 |   };
42 | 
43 |   return (
44 |     <div className="fixed inset-0 bg-gray-600 bg-opacity-75 flex items-center justify-center z-50">
45 |       <div className="chatbot-section flex flex-col origin:w-[800px] w-full origin:h-[735px] h-full p-6 rounded shadow-lg overflow-auto">
46 |         <div className="grow">
47 |           <div className='pb-6 flex justify-between'>
48 |             <h1 className='chatbot-text-primary text-xl md:text-2xl font-medium'>Configure</h1>
49 |             <button
50 |               onClick={onClose}
51 |               className="chatbot-text-primary text-4xl font-thin leading-8"
52 |             >
53 |               <span aria-hidden>×</span>
54 |             </button>
55 |           </div>
56 |           <div className="flex mb-4">
57 |             <Dropdown
58 |               fieldId="llm"
59 |               label="LLM"
60 |               options={llmOptions}
61 |               value={selectedLlm}
62 |               onSelect={setSelectedLlm}
63 |             />
64 |             <Toggle enabled={rag} label="Enable vector content (RAG)" onChange={() => setRag(!rag)} />
65 |           </div>
66 |           <Dropdown
67 |             fieldId="similarityMetric"
68 |             label="Similarity Metric"
69 |             options={similarityMetricOptions}
70 |             value={selectedSimilarityMetric}
71 |             onSelect={setSelectedSimilarityMetric}
72 |           />
73 |         </div>
74 |         <div className="self-end w-full">
75 |           <div className="flex justify-end gap-2">
76 |             <button
77 |               className='chatbot-button-secondary flex rounded-md items-center justify-center px-2.5 py-3'
78 |               onClick={onClose}
79 |             >
80 |               Cancel
81 |             </button>
82 |             <button
83 |               className='chatbot-button-primary flex rounded-md items-center justify-center px-2.5 py-3'
84 |               onClick={handleSave}
85 |             >
86 |               Save Configuration
87 |             </button>
88 |           </div>
89 |           <Footer />
90 |         </div>
91 |       </div>
92 |     </div>
93 |   );
94 | };
95 | 
96 | export default Configure;
97 | 


--------------------------------------------------------------------------------
/components/Dropdown.tsx:
--------------------------------------------------------------------------------
 1 | const Dropdown = ({ fieldId, label, options, value, onSelect }) => {
 2 |   return (
 3 |     <div className="relative inline-block w-full text-gray-700">
 4 |       {label && (
 5 |         <label htmlFor={fieldId} className="chatbot-text-primary block text-sm font-medium mb-2">
 6 |           {label}
 7 |         </label>
 8 |       )}
 9 |       <div className="relative">
10 |         <select
11 |           id={fieldId}
12 |           value={value}
13 |           onChange={(e) => onSelect(e.target.value)}
14 |           className="block appearance-none w-full bg-white border border-gray-300 hover:border-gray-400 px-4 py-2 pr-8 rounded shadow leading-tight focus:outline-none focus:border-blue-500"
15 |         >
16 |           {options.map((option, idx) => (
17 |             <option key={idx} value={option.value}>
18 |               {option.label}
19 |             </option>
20 |           ))}
21 |         </select>
22 |         <div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2 text-gray-700">
23 |           <svg className="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
24 |             <path d="M5.3 7.7a1 1 0 011.4 0l3.3 3.3 3.3-3.3a1 1 0 111.4 1.4l-4 4a1 1 0 01-1.4 0l-4-4a1 1 0 010-1.4z" />
25 |           </svg>
26 |         </div>
27 |       </div>
28 |     </div>
29 |   );
30 | };
31 | 
32 | export default Dropdown;
33 | 


--------------------------------------------------------------------------------
/components/Footer.tsx:
--------------------------------------------------------------------------------
 1 | 
 2 | const Footer = () => {
 3 |   return (
 4 |     <footer className="chatbot-text-tertiary flex justify-between text-sm mt-6">
 5 |       <a
 6 |         className=" vercel-link flex h-8 w-max flex-none items-center justify-center border rounded-md text-xs"
 7 |         aria-label="Deploy on Vercel"
 8 |         href="https://vercel.com/templates/next.js/ragbot-starter"
 9 |       >
10 |         <span className="px-3">▲</span>
11 |         <hr className="h-full border-r" />
12 |         <span className="px-3">Deploy</span>
13 |       </a>
14 |       <div className="ml-auto flex flex-row items-center">
15 |         <span className="mr-1">Powered by</span>
16 |         <svg aria-label="DataStax logotype" width="87" height="9" viewBox="0 0 87 9" fill="none" xmlns="http://www.w3.org/2000/svg">
17 |           <g clipPath="url(#clip0_209_2925)">
18 |           <g clipPath="url(#clip1_209_2925)">
19 |           <g clipPath="url(#clip2_209_2925)">
20 |           <path d="M52.1707 1.9231V0.539429H45.5293L43.7258 1.9231V3.82314L45.5293 5.20681H51.3174V7.15719H44.0845V8.53943H50.9052L52.7087 7.15719V5.20681L50.9052 3.82314H45.1172V1.9231H52.1707Z" fill="#6B6F73"/>
21 |           <path d="M17.4079 0.539429H16.1409L11.494 8.53943H13.1008L16.7773 2.21221L20.4494 8.53943H22.0548L17.4079 0.539429Z" fill="#6B6F73"/>
22 |           <path d="M31.2213 0.539429H22.2384V1.9231H26.0349V8.53943H27.4248V1.9231H31.2213V0.539429Z" fill="#6B6F73"/>
23 |           <path d="M63.9232 0.539429H54.9418V1.9231H58.7368V8.53943H60.1281V1.9231H63.9232V0.539429Z" fill="#6B6F73"/>
24 |           <path d="M7.93033 0.539429H0.750977V8.53943H7.93033L9.73385 7.15575V1.9231L7.93033 0.539429ZM2.1423 1.9231H8.34252V7.15719H2.1423V1.9231Z" fill="#6B6F73"/>
25 |           <path d="M80.353 4.53943L79.5489 3.15575V3.15719L78.0288 0.539429H76.422L78.7462 4.53943L76.422 8.53943H78.0288L79.5489 5.9231L80.353 4.53943Z" fill="#6B6F73"/>
26 |           <path d="M82.6382 4.53943L83.4423 3.15575V3.15719L84.9638 0.539429H86.5692L84.2465 4.53943L86.5692 8.53943H84.9638L83.4423 5.9231L82.6382 4.53943Z" fill="#6B6F73"/>
27 |           <path d="M36.0519 0.539429H37.3189L41.9658 8.53943H40.359L36.6825 2.21221L33.0104 8.53943H31.405L36.0519 0.539429Z" fill="#6B6F73"/>
28 |           <path d="M68.7538 0.539429H70.0208L74.6677 8.53943H73.0623L69.3844 2.21221L65.7138 8.53943H64.1069L68.7538 0.539429Z" fill="#6B6F73"/>
29 |           </g>
30 |           </g>
31 |           </g>
32 |           <defs>
33 |           <clipPath id="clip0_209_2925">
34 |           <rect width="85.8182" height="8" fill="white" transform="translate(0.750977 0.539429)"/>
35 |           </clipPath>
36 |           <clipPath id="clip1_209_2925">
37 |           <rect width="85.8388" height="8" fill="white" transform="translate(0.750977 0.539429)"/>
38 |           </clipPath>
39 |           <clipPath id="clip2_209_2925">
40 |           <rect width="85.8182" height="8" fill="white" transform="translate(0.750977 0.539429)"/>
41 |           </clipPath>
42 |           </defs>
43 |         </svg>
44 |         <span className="mx-1">and</span>
45 |         <svg aria-label="Vercel logotype" width="53" height="13" viewBox="0 0 53 13" fill="none" xmlns="http://www.w3.org/2000/svg">
46 |           <g clipPath="url(#clip0_209_2927)">
47 |           <path d="M26.7255 3.53942C24.6874 3.53942 23.2178 4.86865 23.2178 6.86249C23.2178 8.85634 24.872 10.1856 26.9101 10.1856C28.1415 10.1856 29.2271 9.69819 29.8991 8.87665L28.4868 8.06065C28.1138 8.46865 27.5471 8.7068 26.9101 8.7068C26.0258 8.7068 25.2745 8.24526 24.9957 7.5068H30.1686C30.2092 7.30003 30.2332 7.08588 30.2332 6.86065C30.2332 4.86865 28.7637 3.53942 26.7255 3.53942ZM24.9791 6.21634C25.2098 5.47973 25.8412 5.01634 26.7237 5.01634C27.608 5.01634 28.2394 5.47973 28.4683 6.21634H24.9791ZM46.6049 3.53942C44.5668 3.53942 43.0972 4.86865 43.0972 6.86249C43.0972 8.85634 44.7514 10.1856 46.7895 10.1856C48.0209 10.1856 49.1064 9.69819 49.7784 8.87665L48.3661 8.06065C47.9932 8.46865 47.4265 8.7068 46.7895 8.7068C45.9052 8.7068 45.1538 8.24526 44.8751 7.5068H50.048C50.0886 7.30003 50.1126 7.08588 50.1126 6.86065C50.1126 4.86865 48.6431 3.53942 46.6049 3.53942ZM44.8603 6.21634C45.0911 5.47973 45.7225 5.01634 46.6049 5.01634C47.4892 5.01634 48.1206 5.47973 48.3495 6.21634H44.8603ZM37.6548 6.86249C37.6548 7.97019 38.3785 8.70865 39.5009 8.70865C40.2615 8.70865 40.832 8.36342 41.1255 7.80034L42.5434 8.61819C41.9563 9.59665 40.856 10.1856 39.5009 10.1856C37.4609 10.1856 35.9932 8.85634 35.9932 6.86249C35.9932 4.86865 37.4628 3.53942 39.5009 3.53942C40.856 3.53942 41.9545 4.12834 42.5434 5.1068L41.1255 5.92465C40.832 5.36157 40.2615 5.01634 39.5009 5.01634C38.3803 5.01634 37.6548 5.7548 37.6548 6.86249ZM52.8818 1.50865V10.001H51.2203V1.50865H52.8818ZM7.50892 0.585571L14.3305 12.401H0.687378L7.50892 0.585571ZM24.5637 1.50865L19.448 10.3702L14.3323 1.50865H16.2505L19.448 7.04711L22.6455 1.50865H24.5637ZM35.4394 3.72403V5.51296C35.2548 5.45942 35.0591 5.42249 34.8486 5.42249C33.776 5.42249 33.0025 6.16096 33.0025 7.26865V10.001H31.3409V3.72403H33.0025V5.42249C33.0025 4.48465 34.0935 3.72403 35.4394 3.72403Z" fill="#6B6F73"/>
48 |           </g>
49 |           <defs>
50 |           <clipPath id="clip0_209_2927">
51 |           <rect width="52.4308" height="12" fill="white" transform="translate(0.569214 0.539429)"/>
52 |           </clipPath>
53 |           </defs>
54 |         </svg>
55 |       </div>
56 |     </footer>
57 |   );
58 | };
59 | 
60 | export default Footer;
61 | 


--------------------------------------------------------------------------------
/components/PromptSuggestions/PromptSuggestionButton.tsx:
--------------------------------------------------------------------------------
 1 | 
 2 | const PromptSuggestionButton = ({ text, onClick }) => {
 3 |   return (
 4 |     <button
 5 |       onClick={onClick}
 6 |       className="prompt-button text-sm py-2 px-4 rounded-lg overflow-hidden whitespace-nowrap focus:outline-none focus:shadow-outline"
 7 |     >
 8 |       {text}
 9 |     </button>
10 |   );
11 | };
12 | 
13 | export default PromptSuggestionButton;
14 | 


--------------------------------------------------------------------------------
/components/PromptSuggestions/PromptSuggestionsRow.tsx:
--------------------------------------------------------------------------------
 1 | import PromptSuggestionButton from "./PromptSuggestionButton";
 2 | 
 3 | const PromptSuggestionRow = ({ onPromptClick }) => {
 4 |   const prompts = [
 5 |     'How does similarity search work with a Vector DB?',
 6 |     'What is DataStax Enterprise?',
 7 |     'How does CassIO work?',
 8 |     'What are some common FAQs about Astra?',
 9 |   ];
10 | 
11 |   return (
12 |     <div className="flex flex-row flex-wrap justify-start items-center py-4 gap-2">
13 |       {prompts.map((prompt, index) => (
14 |         <PromptSuggestionButton key={`suggestion-${index}`} text={prompt} onClick={() => onPromptClick(prompt)} />
15 |       ))}
16 |     </div>
17 |   );
18 | };
19 | 
20 | export default PromptSuggestionRow;
21 | 


--------------------------------------------------------------------------------
/components/ThemeButton.tsx:
--------------------------------------------------------------------------------
 1 | import { useEffect, useState } from "react";
 2 | 
 3 | const ToggleButton = () => {
 4 |   const [theme, setTheme] = useState<string | null>(null);
 5 | 
 6 |   useEffect(() => {
 7 |     const getLocalValue = () => {
 8 |       const storedValue = localStorage.getItem('theme');
 9 |       if (storedValue !== null) {
10 |         return storedValue;
11 |       }
12 |       return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
13 |     };
14 | 
15 |     const initialTheme = getLocalValue();
16 |     setTheme(initialTheme);
17 | 
18 |     if (initialTheme === 'dark') {
19 |       document.documentElement.classList.add('dark');
20 |     } else {
21 |       document.documentElement.classList.remove('dark');
22 |     }
23 |   }, []);
24 | 
25 |   useEffect(() => {
26 |     if (theme !== null) {
27 |       localStorage.setItem('theme', theme);
28 |       if (theme === 'dark') {
29 |         document.documentElement.classList.add('dark');
30 |       } else {
31 |         document.documentElement.classList.remove('dark');
32 |       }
33 |     }
34 |   }, [theme]);
35 | 
36 |   const handleToggle = () => {
37 |     setTheme(theme === 'dark' ? 'light' : 'dark');
38 |   };
39 | 
40 |   if (theme === null) {
41 |     return null;
42 |   }
43 | 
44 |   return (
45 |     <button onClick={handleToggle}>
46 |       {theme === 'dark' ? (
47 |           <svg aria-label="Light Mode" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
48 |             <path d="M12 7C9.24 7 7 9.24 7 12C7 14.76 9.24 17 12 17C14.76 17 17 14.76 17 12C17 9.24 14.76 7 12 7ZM2 13H4C4.55 13 5 12.55 5 12C5 11.45 4.55 11 4 11H2C1.45 11 1 11.45 1 12C1 12.55 1.45 13 2 13ZM20 13H22C22.55 13 23 12.55 23 12C23 11.45 22.55 11 22 11H20C19.45 11 19 11.45 19 12C19 12.55 19.45 13 20 13ZM11 2V4C11 4.55 11.45 5 12 5C12.55 5 13 4.55 13 4V2C13 1.45 12.55 1 12 1C11.45 1 11 1.45 11 2ZM11 20V22C11 22.55 11.45 23 12 23C12.55 23 13 22.55 13 22V20C13 19.45 12.55 19 12 19C11.45 19 11 19.45 11 20ZM5.99 4.58C5.6 4.19 4.96 4.19 4.58 4.58C4.19 4.97 4.19 5.61 4.58 5.99L5.64 7.05C6.03 7.44 6.67 7.44 7.05 7.05C7.43 6.66 7.44 6.02 7.05 5.64L5.99 4.58ZM18.36 16.95C17.97 16.56 17.33 16.56 16.95 16.95C16.56 17.34 16.56 17.98 16.95 18.36L18.01 19.42C18.4 19.81 19.04 19.81 19.42 19.42C19.81 19.03 19.81 18.39 19.42 18.01L18.36 16.95ZM19.42 5.99C19.81 5.6 19.81 4.96 19.42 4.58C19.03 4.19 18.39 4.19 18.01 4.58L16.95 5.64C16.56 6.03 16.56 6.67 16.95 7.05C17.34 7.43 17.98 7.44 18.36 7.05L19.42 5.99ZM7.05 18.36C7.44 17.97 7.44 17.33 7.05 16.95C6.66 16.56 6.02 16.56 5.64 16.95L4.58 18.01C4.19 18.4 4.19 19.04 4.58 19.42C4.97 19.8 5.61 19.81 5.99 19.42L7.05 18.36Z" />
49 |           </svg>
50 |         ): (
51 |           <svg aria-label="Dark Mode" width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
52 |             <path d="M12 3.46057C7.03 3.46057 3 7.49057 3 12.4606C3 17.4306 7.03 21.4606 12 21.4606C16.97 21.4606 21 17.4306 21 12.4606C21 12.0006 20.96 11.5406 20.9 11.1006C19.92 12.4706 18.32 13.3606 16.5 13.3606C13.52 13.3606 11.1 10.9406 11.1 7.96057C11.1 6.15057 11.99 4.54057 13.36 3.56057C12.92 3.50057 12.46 3.46057 12 3.46057Z" />
53 |           </svg>
54 |         )
55 |       }
56 |     </button>
57 |   )
58 | };
59 | 
60 | export default ToggleButton;
61 | 


--------------------------------------------------------------------------------
/components/Toggle.tsx:
--------------------------------------------------------------------------------
 1 | const Toggle = ({ enabled, label, onChange }) => {
 2 |   return (
 3 |     <div className="flex items-center justify-center w-full self-end">
 4 |       <label htmlFor="toggle" className="flex items-center cursor-pointer py-2">
 5 |         <div className="relative">
 6 |           {/* Toggle Line */}
 7 |           <div className={`w-10 h-6 bg-gray-400 rounded-full shadow-inner ${enabled ? 'toggle-background' : ''}`}></div>
 8 |           {/* Toggle Circle */}
 9 |           <div className={`absolute -left-1 -top-0 transition transform bg-white border-2 rounded-full w-6 h-6 ${enabled ? 'translate-x-full toggle-boarder' : 'border-gray-400'}`}></div>
10 |         </div>
11 |         <input
12 |           id="toggle"
13 |           type="checkbox"
14 |           className="hidden"
15 |           checked={enabled}
16 |           onChange={onChange}
17 |         />
18 |         <div className="chatbot-text-primary ml-3 font-medium">
19 |           {label}
20 |         </div>
21 |       </label>
22 |     </div>
23 |   );
24 | };
25 | 
26 | export default Toggle;
27 | 


--------------------------------------------------------------------------------
/next-env.d.ts:
--------------------------------------------------------------------------------
1 | /// <reference types="next" />
2 | /// <reference types="next/image-types/global" />
3 | 
4 | // NOTE: This file should not be edited
5 | // see https://nextjs.org/docs/basic-features/typescript for more information.
6 | 


--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | }


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "ragbot-starter",
 3 |   "version": "0.1.0",
 4 |   "private": true,
 5 |   "scripts": {
 6 |     "dev": "next dev",
 7 |     "build": "next build && npm run seed",
 8 |     "start": "next start",
 9 |     "seed": "ts-node ./scripts/populateDb.ts",
10 |     "lint": "next lint"
11 |   },
12 |   "dependencies": {
13 |     "@datastax/astra-db-ts": "0.1.4",
14 |     "@types/node": "^20.8.10",
15 |     "ai": "^2.2.20",
16 |     "geist": "^1.1.0",
17 |     "langchain": "^0.0.179",
18 |     "next": "14.0.1",
19 |     "openai": "^4.14.2",
20 |     "react": "^18",
21 |     "react-dom": "^18",
22 |     "react-markdown": "^9.0.0",
23 |     "remark-gfm": "^4.0.0",
24 |     "ts-node": "^10.9.1",
25 |     "typescript": "5.2.2"
26 |   },
27 |   "devDependencies": {
28 |     "@types/react": "^18.2.37",
29 |     "autoprefixer": "^10",
30 |     "dotenv": "^16.3.1",
31 |     "eslint": "^8",
32 |     "eslint-config-next": "13.5.5",
33 |     "eslint-config-prettier": "^9.0.0",
34 |     "postcss": "^8",
35 |     "tailwindcss": "^3"
36 |   }
37 | }
38 | 


--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: {
3 |     tailwindcss: {},
4 |     autoprefixer: {},
5 |   },
6 | }
7 | 


--------------------------------------------------------------------------------
/scripts/populateDb.ts:
--------------------------------------------------------------------------------
 1 | import { AstraDB } from "@datastax/astra-db-ts";
 2 | import { RecursiveCharacterTextSplitter } from "langchain/text_splitter";
 3 | import 'dotenv/config'
 4 | import sampleData from './sample_data.json';
 5 | import OpenAI from 'openai';
 6 | import { SimilarityMetric } from "../app/hooks/useConfiguration";
 7 | 
 8 | const openai = new OpenAI({
 9 |   apiKey: process.env.OPENAI_API_KEY,
10 | });
11 | 
12 | const {ASTRA_DB_APPLICATION_TOKEN, ASTRA_DB_API_ENDPOINT, ASTRA_DB_NAMESPACE } = process.env;
13 | 
14 | const astraDb = new AstraDB(ASTRA_DB_APPLICATION_TOKEN, ASTRA_DB_API_ENDPOINT, ASTRA_DB_NAMESPACE);
15 | 
16 | const splitter = new RecursiveCharacterTextSplitter({
17 |   chunkSize: 1000,
18 |   chunkOverlap: 200,
19 | });
20 | 
21 | const similarityMetrics: SimilarityMetric[] = [
22 |   'cosine',
23 |   'euclidean',
24 |   'dot_product',
25 | ]
26 | 
27 | const createCollection = async (similarity_metric: SimilarityMetric = 'cosine') => {
28 |   try {
29 |     const res = await astraDb.createCollection(`chat_${similarity_metric}`, {
30 |       vector: {
31 |         dimension: 1536,
32 |         metric: similarity_metric,
33 |       }
34 |     });
35 |     console.log(res);
36 |   } catch (e) {
37 |     console.log(`chat_${similarity_metric} already exists`);
38 |   }
39 | };
40 | 
41 | const loadSampleData = async (similarity_metric: SimilarityMetric = 'cosine') => {
42 |   const collection = await astraDb.collection(`chat_${similarity_metric}`);
43 |   for await (const { url, title, content} of sampleData) {
44 |     const chunks = await splitter.splitText(content);
45 |     let i = 0;
46 |     for await (const chunk of chunks) {
47 |       const {data} = await openai.embeddings.create({input: chunk, model: 'text-embedding-ada-002'});
48 | 
49 |       const res = await collection.insertOne({
50 |         document_id: `${url}-${i}`,
51 |         $vector: data[0]?.embedding,
52 |         url,
53 |         title,
54 |         content: chunk
55 |       });
56 |       i++;
57 |     }
58 |   }
59 |   console.log('data loaded');
60 | };
61 | 
62 | similarityMetrics.forEach(metric => {
63 |   createCollection(metric).then(() => loadSampleData(metric));
64 | });
65 | 


--------------------------------------------------------------------------------
/scripts/sample_data.json:
--------------------------------------------------------------------------------
1 | [{"url": "https://www.datastax.com/services/support/premium-support/faq", "title": "FAQ | DataStax Premium Support", "content": "What is DataStax Premium Support?\nPremium Support consists of three add-on offerings available to enhance your existing DataStax support experience\nThere are three Premium offerings currently available:\nPremium Cloud Engineer\nNamed Engineer\nTechnical Account Manager\nCan I purchase a Premium Support subscription for any DataStax product? \nYou can purchase Premium Support as an add-on to DataStax products that are generally available. Please contact PremiumSupport@datastax.com if you have any questions.\nWhat is included in each of the different DataStax technical support offerings?\nPlease refer to the DataStax \nSupport Comparison Matrix\n.\nCan I combine DataStax Premium Support options?\nYes.\nYou can combine add-on options to meet your business needs. The choice is entirely up to you.\nHow long is the Premium subscription period?\nTypical Premium subscriptions are annual.\nIf my support needs are different from what you currently offer, what should I do?\nContact \nPremiumSupport@datastax.com\n and we will be in touch with you to discuss possible alternatives."}, {"url": "https://www.datastax.com/blog/introducing-vector-search-empowering-cassandra-astra-db-developers-to-build-generative-ai-applications", "title": "Introducing Vector Search: Empowering Cassandra / Astra DB developers to build generative AI applications | DataStax", "content": "In the age of AI, Apache Cassandra\n\u00ae\n has emerged as a powerful and scalable distributed database solution. With its ability to handle massive amounts of data and provide high availability, Cassandra has become a go-to choice for many AI applications including \nUber\n, \nNetflix\n, and \nPriceline\n. However, with the introduction of generative AI and large language models (LLMs), new query capabilities are needed.\u00a0\nEnter vector search, a revolutionary new feature that empowers Cassandra with enhanced search and retrieval functionalities for generative AI applications. As a preview for our community, we\u2019ve made it available in DataStax Astra DB to try out and provide us with feedback. Get started by \nsigning up\n and then \ntrying the demo\n.\u00a0\nWhat is vector search?\nVector search\n is a cutting-edge approach to searching and retrieving data that leverages the power of vector similarity calculations. Unlike traditional keyword-based search, which matches documents based on the occurrence of specific terms, vector search focuses on the semantic meaning and similarity of data points. By representing data as vectors in a high-dimensional space, vector search enables more accurate and intuitive search results.\u00a0\nFor example, vector search easily identifies the semantics in these examples that term-based search would struggle with:\nFalse positive: \u201cMan bites dog\u201d and \u201cdog bites man\u201d include the same words but have opposite semantics.\nFalse negative: \u201cTourism numbers are collapsing\u201d and \u201cTravel industry fears Covid-19 crisis will cause more companies to enter bankruptcy\u201d have very similar meanings but different word choices and specificity.\nFalse negative: \u201cI need a new phone\u201d and \u201cMy old device is broken\u201d have related meanings but no common words.\nIntegrating vector search with Cassandra\nThe integration of vector search with Cassandra (for details, see \nCEP-30\n) offers several\u00a0 benefits. It opens up exciting possibilities for applications that require similarity-based queries\u2014and not just for text. Applications as diverse as recommendation systems, fraud detection, image recognition, and natural language processing can all benefit from vector search.\nHere are some key advantages of incorporating vector search into Cassandra:\nUnstructured data queries\nPrior to vector search, Cassandra was limited to searching structured data (floats, integers, or full strings). Vector search now opens the possibilities to query unstructured data, including text, audio, pictures, and videos. This makes Cassandra the one-stop-shop for high-scale database applications.\u00a0\nEnhanced search accuracy\nVector search allows for similarity-based queries, enabling more accurate and relevant search results. By considering the semantic meaning of data points, it can uncover hidden relationships and patterns that traditional keyword searches might miss.\nEfficient query processing\u00a0\nWith vector search, Cassandra can perform similarity calculations and ranking directly within the database. This eliminates the need to transfer large amounts of data to external systems, reducing latency and improving overall query performance. Furthermore, you can combine vector search with other Cassandra indexes for even more powerful queries to find exactly the data you need.\nScalability and distributed processing\nCassandra's distributed architecture aligns perfectly with vector search requirements. As data volumes grow, vector search can leverage Cassandra's scalability and distributed processing capabilities to handle large-scale similarity queries efficiently.\nBroad applicability\nVector search provides the flexibility to compute similarity across various types of data, including text, numerical values, images, and \nembeddings\n. This versatility enables developers to build advanced applications that span multiple domains and data types, all within the Cassandra ecosystem.\nVector search use cases\nIt seems that not a day goes by when a new, innovative application of generative AI is invented. Almost all generative AI use cases are enhanced by vector search because it allows developers to create more relevant prompts. Use cases of vector search for generative AI include:\nQuestion answering\u00a0\nConverting documents to text embeddings can be combined with modern natural language processing (NLP) to deliver full text answers to questions. This approach spares users from studying lengthy manuals and empowers your teams to provide answers more quickly. A \"question answering\" generative AI model can take the text-embedding representation for both the knowledge base of documents and your current question to deliver the closest match as an \"answer.\" (\ncode\n)\nSemantic search\nVector search powers semantic or similarity search. Because the meaning and context is captured in the embedding, vector search finds what users mean, without requiring an exact keyword match. It works with textual data (documents), images, and audio, to, for example, easily and quickly help users find products that are similar or related to their query.\nSemantic caching\u00a0\nAs your generative application grows in popularity and encounters higher traffic levels, the expenses related to LLM API calls can become substantial. Additionally, LLM services might exhibit slow response times, especially when dealing with a significant number of requests. Caching LLM responses can significantly increase response times, and lower the cost of using generative AI. However, to match the input of an LLM to previous input requires performing a semantic match rather than an exact match. Vector search provides users with that ability. (\ncode\n)\nA brief overview of transformers\u2014and their challenges\nTo gain deeper insight into the value of vector search in the domain of generative AI, it\u2019s important to understand what transformers are and what their limitations are. Transformers are designed to understand the context and semantics of language by taking in a sequence of tokens (words, or parts of words) and outputting a corresponding sequence. These models pay attention to each input token and the relationships between them, using a mechanism known as self-attention or scaled dot-product attention. This enables them to understand complex linguistic constructs and generate coherent and contextually accurate responses.\nDespite their capabilities, transformers face a significant challenge: the token limit. This constraint arises due to memory limitations in the computational hardware. With large input sequences, the self-attention mechanism requires storing each token's relationship with every other token, which can quickly exhaust available memory. As a result, transformers like GPT-3 or GPT-4 have a limit on the number of tokens they can process in a single pass; it\u2019s typically a few thousand tokens.\u00a0\nVector search solves this problem by retrieving the most semantically relevant data so that we can get the most value possible from the limited token window. Take for example a Q&A chatbot for a software product. Instead of passing the Q&A chatbot the entire Q&A repository for a software product, or using term-based search that can easily retrieve unrelated information, vector search enables you to selectively query for semantically relevant content to use the token limit effectively. (\ncode\n)\nAnother example is chat history. LLMs use chat history to give context to what the user has discussed with the LLM in the past. Simply using a fixed number of the last interactions to prevent going over the token limit would result in LLMs forgetting the previous context of the conversations. Vector search allows for only relevant historical conversations to be passed to the LLM (\ncode\n).\nBeyond the technical constraint, there's a cost aspect as well. Each token processed by the transformer uses computational resources, which directly translates into financial cost. Therefore, when using transformers in your applications, it's important to maximize the value extracted from each token within the given limit. Vector search reduces the cost aspect by first optimizing the content that is populated in the prompt, then also intelligently caching its responses.(\ncode\n)\nCassIO: integrating vector search into your generative AI app\nTo accelerate the integration of vector search into your app, we\u2019ve also created a library called CassIO. This software framework integrates seamlessly with popular LLM software such as \nLangChain\n, making it easy to leverage vector search in your database. CassIO can maintain chat history, create prompt templates, and cache LLM responses. To learn more, check out\u00a0 the \nCassIO website\n.\nGet started!\nCassandra and Astra DB developers can take a great leap forward with vector search. Today, Cassandra is the number one database for querying both structured and unstructured data. Understanding the strengths and limitations of transformers and using advanced data management technologies like DataStax can greatly enhance the effectiveness and cost-efficiency of generative AI applications. Try out a preview of vector search by \nsigning up\n now, and register for our \nJune 15 webinar on vector search\n.\nWant to go deeper with vector search, LLMs and GenAI? Join us on July 11, 2023, for a free virtual GenAI summit for architects and practitioners: \nAgent X: Architecture for GenAI\n. In two hours, we'll unpack and demonstrate how you can craft inspiring AI agents and GenAI experiences with your unique datasets."}, {"url": "https://www.datastax.com/legal/datastax-faq-direct-licensing", "title": "DataStax Licensing \u2013 FAQs | DataStax", "content": "How are software subscriptions licensed?\nDataStax Enterprise is available on a subscription basis: a subscription is the DataStax software licence for a specified term plus the right to receive support and maintenance during that same term.\nTo purchase a DataStax subscription you will need to sign an order schedule that itemizes your purchase (amount, start date, etc) and references our \nEnterprise Terms\n; this is your contract.\nNo license key is needed to get started with DataStax software \u2013 but customers will receive a welcome guide and on-boarding documentation confirming what they have purchased.\nWhat is the unit of measure for purchases of DataStax software?\nDataStax software Subscriptions are sold on a per-Node or per-Core basis. Each Node may run on a maximum of 16 Cores:\n\u201cNode\u201d means a Java Virtual Machine (a platform-independent execution environment that converts Java bytecode into machine language and executes it) that runs an instance of the software\n\u201cCore\u201d means an independent physical processing unit on a CPU responsible for executing programs\nVirtualised CPUs do not count as Cores for these purposes and so a Node may have any number of virtualised CPUs provided that the physical CPUs do not exceed 16\nFor DataStax Enterprise version 6.0 or higher, customers can use the system settings (tpc_cores:16) to comply with the above limitation.\nHow long is a subscription for DataStax Enterprise?\nDataStax software Subscriptions are typically offered for a subscription period of no less than one year, which is paid for up-front.\nDoes DataStax offer a trial or evaluation licence for DataStax Enterprise?\nYes: you can use unsupported DataStax Enterprise\u00a0once for free for a period of ninety (90) days (unless otherwise agreed to by DataStax in writing)\u00a0if you use it for non-production (test/development) purposes (please refer to our \u201cLimited No-Fee License\u201d terms available in the \nEnterprise Terms\n).\nDoes DataStax offer a free license for educational institutions or classroom use?\nEducational institutions may use DataStax Enterprise as part of a classroom curriculum with written permission from DataStax. Educators wishing to use DataStax Enterprise as part of their course instruction may contact DataStax using the information available \nhere\n. Other uses by educational institutions require a paid subscription.\nWhat usage of DataStax Software is permitted? What is prohibited?\nIf you have a DataStax Enterprise license you may:\ninstall and use DataStax Enterprise inside your organization\ninstall and use DataStax Enterprise on external servers that are hosted on your behalf (e.g. in AWS)\ntake advantage of the free \u2018bursting use\u2019 benefit, enabling you to increase your DataStax Enterprise usage by 20% for up to two months in each 12 month period\nspin up dedicated DataStax Enterprise clusters to store OpsCenter storage metrics at no additional cost\nYou may not:\nhave DSE clusters containing different types of DSE Subscription (i.e. all Nodes in each Cluster must be uniformly licensed to use the same level of DSE Subscription)\nincorporate DataStax Enterprise within a new software application that you distribute to other organizations\nuse DataStax Enterprise to provide a database-as-a-service product made available to other organizations\npurchase DataStax Enterprise on behalf of someone else\nThe above examples are indicative and for guidance purposes only \u2013 please refer to the full DataStax licence terms available \nhere\n.\nHow can I verify that I have the right number of subscriptions?\nCustomers that have purchased DataStax Enterprise will receive a welcome guide and on-boarding documentation that detail how many Nodes of subscriptions they have purchased, along with any applicable restrictions.\nYou are responsible for ensuring that your usage of DataStax Enterprise complies with the quantity and type of licenses you have purchased. If you think you may exceed or have exceeded your licensed usage, you should take one of the following steps:\nidentify any (additional) Nodes running DataStax Software and inform your DataStax relationship manager\nif this is not possible, request assistance from DataStax to enable you to run scanning tools to identify any (additional) Nodes running DataStax Enterprise within your organization.\nCustomers that are using free DataStax Software under the No-Fee Licence terms must comply with the relevant licence terms (please refer to question 4).\nPlease note that DataStax reserves the right to verify compliance, including by conducting audits on randomly selected users from time to time.\nCan I transfer subscriptions within my organization?\nAssignment of subscriptions to a member of the same corporate family is generally permitted on request (note that the assignor will have to delete the software). You should refer to the \nEnterprise Terms\n for more detail.\nWhat services, training and support does DataStax provide?\nServices.\n DataStax provides a range of services designed to help our customers be successful by accelerating adoption of the DataStax platform and features. For further information on the services we offer, see \nhere\n. Please note that DataStax does not provide custom application/code development.\nTraining.\n DataStax provides \ntraining\n for users of DataStax Enterprise, and Apache Cassandra at all levels. We offer online training via DataStax Academy and private training courses. For the current schedule of DataStax training and other events (including Cassandra events) see \nhere\n.\nSupport.\n All paid DataStax Software subscription customers benefit from expert DataStax Support. Support is provided remotely by DataStax experts based in the USA, UK, and Australia. Please note that the DataStax Support team does not have access to the data stored within customer\u2019s DataStax Enterprise databases other than data specifically provided by the customer. Customers should avoid including any personal, sensitive, or restrictive data in connection with any support requests.\nPremium Support.\n In addition to standard support, DataStax also offers DataStax Enterprise customers a premium support offering. More information is available \nhere\n.\nSupport for Apache Cassandra.\n DataStax also offers support for Apache Cassandra users. For more information, see the DataStax Luna \npage\n.\nWhat happens at the end of my subscription?\nDataStax will contact you to discuss the renewal of your subscription.\nIf your subscription is not renewed then you must delete the software at the end of the subscription period.\nWhat terms and conditions apply to usage of DataStax Software?\nDataStax Enterprise is made available under the DataStax \nEnterprise Terms\n. The Enterprise Terms also include:\nthe \nSupport Policy\n \u2013 which describes how support is provided; and\nthe \nService Terms\n \u2013 which describe how consultancy and training are provided, and describe the service packages offered by DataStax.\nWhat license terms apply to these DataStax software products: OpsCenter; DevCenter; Studio; Drivers?\nOpsCenter:\n OpsCenter is licensed as part of DataStax Enterprise, but it can also be downloaded and installed separately. When it is not used as part of a DataStax Enterprise subscription the applicable license terms can be found \nhere\n.\nDevCenter:\n DevCenter is licensed as part of DataStax Enterprise, but it can also be downloaded and installed separately. The license terms for DevCenter are part of our Enterprise Terms, and can be found \nhere\n.\nStudio:\n Studio is licensed as part of DataStax Enterprise, but it can also be downloaded and installed separately. When it is not used as part of a DataStax Enterprise subscription the applicable license terms can be found \nhere\n.\nDrivers:\n DataStax includes drivers as part of DataStax Enterprise, but many can also be downloaded and installed separately. For full information please refer to our drivers page \nhere\n.\nWhat is the US export classification of DataStax Enterprise?\nAs of July 6 2016 the US export classification of DataStax Enterprise is as set out below. The corresponding CCATS reference is G166668.\nProduct\nECCN\nLicense Exception\nAuthorized For Export (See Definitions List Below)\nEncryption Reporting Requirement\nDataStax Enterprise\n5D992.c\nNo License Required (\u201cNLR\u201d)\nAll countries, except Embargoed Countries, and the Crimea Region of Ukraine\nAnnual\nDataStax OpsCenter\n5D992.c\nNo License Required (\u201cNLR\u201d)\nAll countries, except Embargoed Countries, and the Crimea Region of Ukraine\nAnnual\nDataStax DevCenter\n5D992.c\nNo License Required (\u201cNLR\u201d)\nAll countries, except Embargoed Countries, and the Crimea Region of Ukraine\nAnnual\nDataStax Drivers and Utilities\n5D992.c\nNo License Required (\u201cNLR\u201d)\nAll countries, except Embargoed Countries, and the Crimea Region of Ukraine\nNone\nDataStax Source Code\n5D002.c1\nENC/(b)(2)\nAll countries, except: \u2013 Government End Users of Non-Supp3 Countries \u2013 Embargoed countries and the Crimea Region of Ukraine\nSemi-Annual\nDataStax Encryption Technology\n5E002(a)\nENC/(b)(2)\nAll countries, except: \u2013 Government End Users of non-Supp3 Countries \u2013 End Users in D:1 Countries (unless HQ\u2019ed in a Supp3 Country) \u2013 Embargoed Countries and the Crimea Region of Ukraine\nSemi-Annual\nIs DataStax software covered by patents?\nYes, the technology within DataStax\u2019s software is covered by patents (and pending patents).\nWhat third party software is contained in DataStax Enterprise?\nDataStax Enterprise incorporates open source components and other third party software (including \nApache Cassandra\u2122\n) that are scanned and approved in accordance with the DataStax Software Development Security Program (available \nhere\n). For a list of the included software including the applicable licenses please see \nhere\n.\nWhere is the documentation for DataStax Enterprise?\nDocumentation for DataStax Enterprise can be found \nhere\n. You will find document sets that include release notes, installation and configuration guides, and an overview of the latest features.\nDoes DataStax operate an anti-piracy program?\nDataStax audits the usage of its Software from time to time. Please refer to question 11 for further information.\nWhat is the relationship between DataStax and Apache Cassandra?\nApache Cassandra\u2122 is an operational database that is an \nopen source project\n. Cassandra has been an Apache Software Foundation top level project since \nFebruary 2010\n.\nDataStax takes the software developed by the community within the Apache Software Foundation, enhances it, does extensive quality assurance on it and adds enterprise features (e.g. Advanced security) before delivering it as a finished package (\nDataStax Enterprise\n) to our customers.\nWho can I contact with other questions?\nPlease contact us using the information available \nhere\n."}, {"url": "https://docs.datastax.com/en/mission-control/docs/overview/faq.html", "title": "Frequently Asked Questions (FAQ)s :: DataStax Project Mission Control", "content": "Frequently Asked Questions (FAQ)s\nContents\nWhat is DataStax Mission Control?\nWhat are the main components of DataStax Mission Control?\nWho is the target audience?\nWhat is the pricing model?\nIs there support available?\nWhat is a Control Plane Cluster?\nWhat is a Data Plane Cluster?\nWhat is a Kubernetes Cluster?\nWhat is a DataStax Enterprise Cluster?\nWhat is the mapping of Kubernetes terms to DataStax Enterprise / Apache Cassandra Terms?\nDataStax Mission Control is current in Private Preview. It is subject to the beta agreement executed between you and DataStax. DataStax Mission Control is not intended for production use, has not been certified for production workloads, and might contain bugs and other functional issues. There is no guarantee that DataStax Mission Control will ever become generally available. DataStax Mission Control is provided on an \u201cAS IS\u201d basis, without warranty or indemnity of any kind.\nIf you are interested in trying out DataStax Mission Control please contact your DataStax account team.\nWhat is DataStax Mission Control?\nDataStax Mission Control provides everything needed to run DSE clusters of any scale with reduced complexity and integrations with centralized services within the enterprise.\nDataStax Mission Control manages the entire operational surface of DataStax Enterprise, DSE, across a diverse array of hosting options, from self-managed bare-metal to cloud-provided virtual machines. DataStax Mission Control provides always-on, automated operations of DSE clusters based on expertise running DataStax Astra.  It assists DataStax customers with their own on-premises deployments. It vastly simplifies lifecycle management, observability, best practice configuration, and advanced operations.\nWhat are the main components of DataStax Mission Control?\nLifecycle Management\nSimplify deploying and configuring DataStax Enterprise (DSE) clusters in Kubernetes.\nObservability\nFollow logs and metrics and use monitoring tools to track the operations of your DSE system.\nHealth & Best Practices\nKubernetes uses kubelet to probe the need to restart a container, while deployments use readiness probes to check a pod\u2019s ability to receive traffic.\nSecurity\nSecure the build and restore processes from nodes to datacenters from the cloud.\nAdvanced Operations\nPerform node repairs, compaction, streaming, and backup & restore.\nWho is the target audience?\nExisting and new DataStax Enterprise (DSE) users.\nBrowser-Based User Interface\nUsers connect to a web service running within the DataStax Mission Control environment. From here they are presented with an Astra-like experience for deploying and managing services running within their infrastructure. Based on user permissions multiple views are available for various parts of the system including connection and health information for developers, advanced observability and operations controls for database administrators, and hardware capacity and usage for infrastructure engineers.\nKubernetes API Endpoints\nAny task that can be run within the DataStax Mission Control user interface is also available via Kubernetes APIs and Custom Resource Definitions (CRD). This allows any Kubernetes client or enabled project to automate and interface with DataStax Mission Control. From GitOps workflows with Flux and Argo to template-based Helm charts, DataStax Mission Control provides extreme flexibility for integration with existing systems.\nWhat is the pricing model?\nPricing for DataStax Mission Control is included in the DSE license and all existing DSE customers will get a free download to replace OpsCenter.\nIs there support available?\nYes. Contact your account team for a license file and download links if the welcome email is inaccessible. The links include a method to provide feedback to DataStax and ask questions.\nWhat is a \nControl Plane\n Cluster?\nA \nControl Plane\n is the management layer that establishes and controls all key operations related to management of database components, provides access to its functions via APIs, and handles the ongoing lifecycle of and health of the whole system.\nWhat is a \nData Plane\n Cluster?\nWhile the \nControl Plane\n establishes policies for all key operations, the \nData Plane\n is the remaining infrastructure architecture that carries out the operational policies. In Kubernetes, worker nodes, along with their pods and containers, comprise the \nData Plane\n. A Kubelet is a small application that runs on each node in the cluster and executes actions.\nWhat is a Kubernetes Cluster?\nIt is a set of nodes that run containerized applications.  An application is packaged into a container along with its dependencies and necessary services.\nIn Kubernetes, a pod is a wrapper around a single container, and that pod is what Kubernetes manages.\nWhat is a DataStax Enterprise Cluster?\nA cluster comprised of one or more nodes that exists as an always-on data platform for cloud applications that is powered by Apache Cassandra\nTM\n.  It uses the OpsCenter Web application to monitor and run administrative operations on the nodes. DataStax Mission Control is intended to supersede OpsCenter functionality as Kubernetes clusters move, in part or wholly, to the Cloud.\nWhat is the mapping of Kubernetes terms to DataStax Enterprise / Apache Cassandra Terms?\nTable 1. Mapping of Terms\nTerm\nDescription\nKubernetes\nApache Cassandra \nTM\nContainer\na way to package an application along with its libraries and its dependencies\n\u221a\n\u221a\nDocker\nmost popular contnainer runtime software running containerization of applications\n\u221a\n\u221a\nManifest\ntypically either a JSON or YAML file that specifies a desired state of a Kubernetes API object such as a pod, deployment, or service.\n\u221a\n\u221a\nNamespace\nEquivalent with virtual cluster, providing  a way to divide a physical cluster into multiple virtual clusters. It is also a way to provide organization to objects in a cluster.\n\u221a\n\u221a\nNode\neither physical or virtual machines in the cluster from which applications run\n\u221a controlled by the Kubernetes \nControl Plane\n\u221a\nLogging\nLogs are the list of events that are recorded by a cluster or application. They help us understand how data is flowing through applications as well as spot when and where errors occur.\n\u221a In Kubernetes your application should output logs to \nstdout\n and \nstderr\n.\n\u221a\nProxy\nA server that acts as an intermediary for a remote service, taking client requests and copying client data to the server, and sending the server replies to the client.\n\u221a  kube-proxy is the network proxy that performs Kubernetes networking services in and out of the cluster\n\u221a\nRBAC\nRole-Based Access Control uses roles which grant the required level of access to sets of users in the cluster.\n\u221a  Managed through the Kubernetes API\n\u221a\nSecret\nA kuberenetes object that stores sensitive information such as passwords, API keys, and ssh keys so that pods can use that information without the data being shown. Sensitive data is exposed to containers either as a file in a volume mount or through environment variables.\n\u221a\n\u221a\nRelease notes\nGet support\nRate this article"}, {"url": "https://docs.datastax.com/en/astra-classic/docs/migrate/faqs.html", "title": "Frequently Asked Questions :: DataStax Astra DB Classic Documentation", "content": "Frequently Asked Questions\nContents\nWhat is meant by Zero Downtime Migration?\nCan you illustrate the overall workflow and phases of a migration?\nDo you offer an interactive self-guided lab to help me learn about ZDM migrations at my own pace?\nWhat components are provided with ZDM?\nWhat exactly is ZDM Proxy?\nWhat are the benefits of Zero Downtime Migration and its use cases?\nWhich releases of Cassandra or DSE are supported for migrations?\nDoes ZDM migrate clusters?\nWhat challenges does ZDM solve?\nWhat is the pricing model?\nIs there support available if I have questions or issues during our migration?\nWhere are the public GitHub repos?\nDoes ZDM Proxy support Transport Layer Security (TLS)?\nHow does ZDM Proxy handle Lightweight Transactions (LWTs)?\nCan ZDM Proxy be deployed as a sidecar?\nWhat are the benefits of using a cloud-native database?\nIf you\u2019re new to the DataStax Zero Downtime Migration features, these FAQs are for you.\nWhat is meant by Zero Downtime Migration?\nZero Downtime Migration (ZDM) means the ability for you to reliably migrate client applications and data between CQL clusters with no interruption of service.\nZDM lets you accomplish migrations without the need to change your client application code, and with only minimal configuration changes. While in some cases you may need to make some minor changes at the client application level, these changes will be minimal and non-invasive, especially if your client application uses an externalized property configuration for contact points.\nThe suite of ZDM tools enables you to migrate the real-time activity generated by your client applications, as well as transfer your existing data, always with a simple rollback strategy that does not require any downtime.\nIt is important to note that the Zero Downtime Migration process requires you to be able to perform rolling restarts of your client applications during the migration.\nIn the context of migrating between clusters (client applications and data), the examples in this guide sometimes refer to the migration to our cloud-native database environment, DataStax Astra DB.\nHowever, it is important to emphasize that the ZDM Proxy can be freely used to migrate without downtime between any combination of CQL clusters of any type. In addition to Astra DB, examples include Apache Cassandra\u00ae or DataStax Enterprise (DSE).\nCan you illustrate the overall workflow and phases of a migration?\nSee the diagrams of the ZDM \nmigration phases\n.\nDo you offer an interactive self-guided lab to help me learn about ZDM migrations at my own pace?\nYes! Here\u2019s a fun way to learn.\nNow that you\u2019ve seen a conceptual overview of the process, let\u2019s put what you learned into practice.\nWe\u2019ve built a complementary learning resource that is a companion to this comprehensive ZDM documentation. It\u2019s the Zero Downtime Migration Interactive Lab, available for you here:\nhttps://www.datastax.com/dev/zdm\nAll you need is a browser and a GitHub account.\nThere\u2019s nothing to install for the lab, which opens in a pre-configured GitPod environment.\nYou\u2019ll learn about a full migration without leaving your browser!\nTo run the lab, all major browsers are supported, except Safari. For more, see the lab\u2019s \nstart page\n.\nWe encourage you to explore this free hands-on interactive lab from DataStax Academy. It\u2019s an excellent, detailed view of the migration process. The lab describes and demonstrates all the steps and automation performed to prepare for, and complete, a migration from any Cassandra/DSE/Astra DB database to another Cassandra/DSE/Astra DB database across clusters.\nThe interactive lab spans the pre-migration prerequisites and each of the five key migration phases.\nWhat components are provided with ZDM?\nDataStax Zero Downtime Migration includes the following:\nZDM Proxy\n is a service that operates between \nOrigin\n, which is your existing cluster, and \nTarget\n, which is the cluster to which you are migrating.\nZDM Proxy Automation\n is an Ansible-based tool that allows you to deploy and manage the ZDM Proxy instances and associated monitoring stack. To simplify its setup, the suite includes the ZDM Utility. This interactive utility creates a Docker container acting as the Ansible Control Host. The Ansible playbooks constitute the ZDM Proxy Automation.\nCassandra Data Migrator\n is designed to:\nConnect to your clusters and compare the data between Origin and Target\nReport differences in a detailed log file\nReconcile any missing records and fix any data inconsistencies between Origin and Target, if you enable \nautocorrect\n in a configuration file\nDSBulk Migrator\n is provided to migrate smaller amounts of data from Origin to Target\nWell-defined steps in this migration documentation, organized as a sequence of phases.\nWhat exactly is ZDM Proxy?\nZDM Proxy is a component designed to seamlessly handle the real-time client application activity while a migration is in progress. See \nhere\n for an overview.\nWhat are the benefits of Zero Downtime Migration and its use cases?\nMigrating client applications between clusters is a need that arises in many scenarios. For example, you may want to:\nMove to a cloud-native, managed service such as Astra DB.\nMigrate your client application to a brand new cluster, on a more recent version and perhaps on new infrastructure, or even a different CQL database entirely, without intermediate upgrade steps and ensuring that you always have an easy way to rollback in case of issues.\nSeparate out a client application from a shared cluster to a dedicated one.\nConsolidate client applications, currently running on separate clusters, into fewer clusters or even a single one.\nBottom line: You want to migrate your critical database infrastructure without risk or concern that your users' experiences will be affected.\nWhich releases of Cassandra or DSE are supported for migrations?\nOverall, you can use ZDM Proxy to migrate:\nFrom:\n Any Cassandra 2.1.6 or higher release, or from any DSE 4.7.1 or higher release\nTo:\n Any equivalent or higher release of Cassandra, or to any equivalent or higher release of DSE, or to Astra DB\nThere are many reasons why you may decide to migrate your data and client applications from one cluster to another, for example:\nMoving to a different type of CQL database, for example an on-demand cloud-based proposition such as Astra DB.\nUpgrading a cluster to a newer version, or newer infrastructure, in as little as one step while leaving your existing cluster untouched throughout the process.\nMoving one or more client applications out of a shared cluster and onto a dedicated one, in order to manage and configure each cluster independently.\nConsolidating client applications, which may be currently running on separate clusters, onto a shared one in order to reduce overall database footprint and maintenance overhead.\nHere are just a few examples of migration scenarios that are supported when moving from one type of CQL-based database to another:\nFrom an existing self-managed Cassandra or DSE cluster to cloud-native Astra DB. For example:\nCassandra 2.1.6+, 3.11.x, 4.0.x, or 4.1.x to Astra DB\nDSE 4.7.1+, 4.8.x, 5.1.x, 6.7.x or 6.8.x to Astra DB\nFrom an existing Cassandra or DSE cluster to another Cassandra or DSE cluster. For example:\nCassandra 2.1.6+ or 3.11.x to Cassandra 4.0.x or 4.1.x\nDSE 4.7.1+, 4.8.x, 5.1.x or 6.7.x to DSE 6.8.x\nCassandra 2.1.6+, 3.11.x, 4.0.x, or 4.1.x to DSE 6.8.x\nDSE 4.7.1+ or 4.8.x to Cassandra 4.0.x or 4.1.x\nFrom \nAstra DB Classic\n to \nAstra DB Serverless\nFrom any CQL-based database type/version to the equivalent CQL-based database type/version.\nDoes ZDM migrate clusters?\nZDM does not migrate clusters. With ZDM, we are migrating data and applications \nbetween clusters\n.  At the end of the migration, your application will be running on your new cluster, which will have been populated with all the relevant data.\nWhat challenges does ZDM solve?\nBefore DataStax Zero Downtime Migration was available, migrating client applications between clusters involved granular and intrusive client application code changes, extensive migration preparation, and a window of downtime to the client application\u2019s end users.\nZDM allows you to leverage mature migration tools that have been used with large scale enterprises and applications to make migrations easy and transparent to end users.\nWhat is the pricing model?\nThe suite of Zero Downtime Migration tools from DataStax is free and open-sourced.\nIs there support available if I have questions or issues during our migration?\nIf needed, ZDM Proxy and related software tools in the migration suite include technical assistance by \nDataStax Support\n, if you have a DataStax Luna service contract with DataStax.Luna\n is a subscription to the Apache Cassandra support and expertise at DataStax.\nFor any observed problems with the ZDM Proxy, submit a \nGitHub Issue\n in the ZDM Proxy GitHub repo.\nAdditional examples serve as templates, from which you can learn about migrations. DataStax does not assume responsibility for making the templates work for specific use cases.\nWhere are the public GitHub repos?\nAll the DataStax Zero Downtime Migration GitHub repos are public and open source. You are welcome to read the code and submit feedback via GitHub Issues per repo. In addition to sending feedback, you may submit Pull Requests (PRs) for potential inclusion. To submit PRs, you must for first agree to the \nDataStax Contribution License Agreement (CLA)\n.\nZDM Proxy\n repo for ZDM Proxy.\nZDM Proxy Automation\n repo for the Ansible-based ZDM Proxy Automation, which includes the ZDM Utility.\ncassandra-data-migrator\n repo for the tool that supports migrating larger data quantities as well as detailed verifications and reconciliation options.\ndsbulk-migrator\n repo for the tool that allows simple data migrations without validation and reconciliation capabilities.\nDoes ZDM Proxy support Transport Layer Security (TLS)?\nYes, and here\u2019s a summary:\nFor application-to-proxy TLS, the application is the TLS client and the ZDM Proxy is the TLS server. One-way TLS and Mutual TLS are both supported.\nFor proxy-to-cluster TLS, the ZDM Proxy acts as the TLS client and the cluster as the TLS server. One-way TLS and Mutual TLS are both supported.\nWhen the ZDM Proxy connects to Astra DB clusters, it always implicitly uses Mutual TLS. This is done through the Secure Connect Bundle (SCB) and does not require any extra configuration.\nFor TLS details, see \nConfigure Transport Layer Security (TLS)\n.\nHow does ZDM Proxy handle Lightweight Transactions (LWTs)?\nZDM Proxy handles LWTs as write operations. The proxy sends the LWT to Origin and Target clusters concurrently, and waits for a response from both. ZDM Proxy will return a \nsuccess\n status to the client if both Origin and Target send successful acknowledgements, or otherwise will return a \nfailure\n status if one or both do not return an acknowledgement.\nWhat sets LWTs apart from regular writes is that they are conditional. For important details, including the client context for a returned \napplied\n flag, see \nLightweight Transactions and the \napplied\n flag\n.\nCan ZDM Proxy be deployed as a sidecar?\nZDM Proxy should not be deployed as a sidecar.\nZDM Proxy was designed to mimic a Cassandra cluster. For this reason, we recommend deploying multiple ZDM Proxy instances, each running on a dedicated machine, instance, or VM.\nFor best performance, this deployment should be close to the client applications (ideally on the same local network) but not co-deployed on the same machines as the client applications. This way, each client application instance can connect to all ZDM Proxy instances, just as it would connect to all nodes in a Cassandra cluster (or datacenter).\nThis deployment model gives maximum resilience and failure tolerance guarantees and allows the client application driver to continue using the same load balancing and retry mechanisms that it would normally use.\nConversely, deploying a single ZDM Proxy instance would undermine this resilience mechanism and create a single point of failure, which could affect the client applications if one or more nodes of the underlying clusters (Origin or Target) go offline. In a sidecar deployment, each client application instance would be connecting to a single ZDM Proxy instance, and would therefore be exposed to this risk.\nFor more information, see \nChoosing where to deploy the proxy\n.\nWhat are the benefits of using a cloud-native database?\nWhen moving your client applications and data from on-premise Cassandra Query Language (CQL) based data stores (Cassandra or DSE) to a cloud-native database (CNDB) like Astra DB, it\u2019s important to acknowledge the fundamental differences ahead. With on-premise infrastructure, of course, you have total control of the datacenter\u2019s physical infrastructure, software configurations, and your custom procedures. At the same time, with on-premise clusters you take on the cost of infrastructure resources, maintenance, operations, and personnel.\nRanging from large enterprises to small teams, IT managers, operators, and developers are realizing that the Total Cost of Ownership (TCO) with cloud solutions is much lower than continuing to run on-prem physical data centers.\nA CNDB like Astra DB is a different environment. Running on proven cloud providers like AWS, Google Cloud, and Azure, Astra DB greatly reduces complexity and increases convenience by surfacing a subset of configurable settings, providing a well-designed UI known as Astra Portal, plus a set of APIs and commands to interact with your Astra DB organizations and databases.\nComponents\nPreliminary steps\nRate this article"}, {"url": "https://docs.datastax.com/en/astra-serverless/docs/astra-faq.html", "title": "Astra DB FAQs :: DataStax Astra DB Serverless Documentation", "content": "Astra DB FAQs\nContents\nWhat tools does Astra DB include?\nHow is Astra DB different from DSE?\nWhich version of Apache Cassandra\u2122 is compatible with Astra DB?\nWhat is a Vector Search?\nWhich cloud vendors does Astra DB support?\nHow do I connect to Astra DB databases?\nWhat does DataStax consider \u201crecent\u201d when listing Recent Resources?\nWhich DataStax drivers work with Astra DB?\nHow do I manage billing for Astra DB?\nWhat happens when my monthly credit runs out?\nWhere do I find the Database ID and Organization ID?\nHow do I navigate to a CQL shell?\nI am trying to create a keyspace in the CQL shell, and I am running into an error. How do I fix this?\nHow do I delete a keyspace?\nShould I use materialized views?\nShould I use Storage Attached Indexing?\nWhat is the practical limit for the amount of data stored in an Astra DB database?\nHow can I fix a \u201cMissing Correct Permission Error\u201d?\nI created my table in Astra Portal. Now, when I run a select statement I get an error. What do I do?\nI need help with the Workshop Project. Where do I go for help?\nWhere can I find Astra DB project tutorials?\nHow do I open a support ticket?\nCan I change the keyspace name?\nWhat if my CSV file is too large for the Data Loader?\nCan I use cfstats or nodetool?\nCan I use strict security settings, such as an ad blocker, with Astra DB?\nWhere can I find help?\nWhich cloud regions are currently available for serverless databases?\nIs VPC peering possible for serverless databases?\nHow is pricing calculated for serverless databases?\nHow do I create a token?\nHow do I know which role to choose for my token?\nWhere can I find the Client ID, Client Secret, and Token?\nWhat values do I pass to username and password when connecting to Astra Drivers?\nCan I restore my data if my database is suspended?\nWhich ports are used by serverless databases?\nWhat can I update with my avatar on Astra?\nFrequently asked questions about DataStax Astra DB.\nWhat tools does Astra DB include?\nStargate APIs:\n The Stargate APIs are available as the \nAstra DB APIs\n. Create an \napplication token\n and begin interacting with your database.\nCQLSH:\n Each Astra DB database includes an integrated CQL shell for interactive Cassandra Query Language (CQL) commands.\nUse CQLSH to create tables, insert data, and modify data in your keyspace.\nAstra DB Data Loader\n: From the console, use \nData Loader\n to load the following into your Astra DB database:\nCSV data\nExample datasets\nExtracted DynamoDB data that resides in an Amazon S3 bucket\nDataStax Bulk Loader:\n Use DataStax Bulk Loader (dsbulk) to \nload and unload\n data into your Astra DB database.\nYou can load data from a variety of sources and unload data from DSE database for transfer, use, or storage of data.\nMetrics dashboards:\n Use the integrated metrics dashboards to \nview health metrics\n that include information regarding latency and throughput to the database.\nThese metrics provide insights into the performance of the database and how workloads are distributed.\nIntegrations\n:\n Connect a third-party tool of your choice to Astra DB for data management, machine learning, analytics, and more.\nHow is Astra DB different from DSE?\nWhile you can run DataStax Enterprise (DSE) both on premises and in the cloud, Astra DB allows you to create databases in minutes, with reduced complexity, fewer operational concerns, and an approachable entry point for developing your applications.\nAstra DB is a true database-as-a-service (DBaaS) offering that provides simplified cluster management with flexible pricing.\nDSE also includes Advanced Workloads (DSE Search, Analytics, and Graph), which are not available in Astra DB. Read \nthis whitepaper\n for an in-depth understanding of the cloud-native architecture of Astra DB.\nWhich version of Apache Cassandra\u2122 is compatible with Astra DB?\nApache Cassandra version 3.11 is compatible with Astra DB databases.\nWhat is a Vector Search?\nA Vector Search reviews data on a database to determine the distance between the vectors. The closer they are, the more similar the data. The more the distance, the less similar the data.\nWhich cloud vendors does Astra DB support?\nAstra DB supports creating databases on Amazon Web Services (AWS), Google Cloud, and Microsoft Azure.\nHow do I connect to Astra DB databases?\nOptions\nDescription\nI don\u2019t want to create or manage a \nschema\n. Just let me get started.\nUse schemaless JSON Documents with the \nDocument API\n.\nI want to start using my database now with APIs.\nUse the \nREST API\n or \nGraphQL API\n to begin interacting with your database and self manage the \nschema\n.\nI have an application and want to use the DataStax drivers.\nInitialize one of the \nDataStax drivers\n to manage database connections for your application.\nI know CQL and want to connect quickly to use my database.\nUse the integrated CQL shell or the \nstandalone CQLSH tool\n to interact with your database using CQL.\nWhat does DataStax consider \u201crecent\u201d when listing Recent Resources?\nRecent Resources includes the five most recent databases and streaming tenants resources used by someone in your organization.\nWhich DataStax drivers work with Astra DB?\nEach of the supported DSE and Apache Cassandra drivers is compatible.\nChoose the DataStax driver for your preferred language and configure it to connect to your Astra DB database.\nSee \nConnecting to Astra DB databases using DataStax drivers\n.\nHow do I manage billing for Astra DB?\nAstra DB handles billing through an integration with Stripe, and displays all related billing information on the \nBilling Summary\n page.\nEnter a credit card number and associated billing information to begin creating Astra DB databases.\nSee \nBilling\n for more information.\nWhat happens when my monthly credit runs out?\nYou are prompted to add a credit card when your credit limit is running low. You also receive this notification by email and in Astra Portal.\nIf your application uses all $25 in credit, the database temporarily pauses until you add a credit card to re-start the database. Alternatively, you can wait until the next month for the $25 credit to reload.\nUnused credits do not rollover. A $25 credit is added to your organization on the 1st of every month.\nView your credit balance in the Dashboard:\nWhere do I find the Database ID and Organization ID?\nWhile logged in to Astra, view the URL:\nastra.datastax.com/\n{organization_id}\nNavigate to your database dashboard:\nastra.datastax.com/org/{organization_id}/database/\n{database_id}\nAlternatively, you can view your Database ID in the Databases listing on the Astra DB dashboard. Use the clipboard icon to copy the ID.\nIf you need the Datacenter ID (or IDs, if you have a multi-region database), click the database name to see its details and to locate the ID of each datacenter next to its name in the list.\nHow do I navigate to a CQL shell?\nSelect your current database on the left panel. Navigate to the CQL console tab.\nHere, you can run CQL commands. These are a few to test out\nUse <keyspace_name>;\n navigates to your keyspace\nDesc tables;\n describes the tables within your current keyspaces\nSelect * from <table_name> limit 10;\n selects all columns from table, 10 rows\nI am trying to create a keyspace in the CQL shell, and I am running into an error. How do I fix this?\nKeyspaces need to be created in Astra Portal. Navigate to the \nDashboard overview\n and select \nAdd Keyspace\n.\nHow do I delete a keyspace?\nWe do not allow users to delete the last keyspace to avoid accidental deletion of data. This is the error you will see in the CQL shell:\ntoken@cqlsh\n>\n drop keyspace test_db\n;Unauthorized: Error from server: \ncode\n=\n2100\n \n[\nUnauthorized\n]\n \nmessage\n=\n\"Missing correct permission on test_db.\"\nshell\nCopied!\nshell\nCopied!\nTo avoid any storage costs associated with the keyspace, you can drop tables from the keyspace by running:\ndrop table \n<\nkeyspace_name\n>\nshell\nCopied!\nshell\nCopied!\nShould I use materialized views?\nMaterialized views are not available on Astra Serverless.\nShould I use Storage Attached Indexing?\nStorage Attached Indexing is a great feature of our Astra Serverless. Storage-Attached Indexing (SAI) is a highly-scalable, globally-distributed index for Apache Cassandra\u00ae that is available for DataStax Astra and DataStax Enterprise (DSE) databases.\nExplore this deep dive on \nStorage Attached Indexing\n.\nWhat is the practical limit for the amount of data stored in an Astra DB database?\nThere is no practical limit to the number of bytes an Astra DB database can store.\nHow can I fix a \u201cMissing Correct Permission Error\u201d?\nA permission error occurs for two reasons.\nThe first reason is that Astra places certain limitations on the user with \nAstra DB database guardrails and limits\n.\nThe second reason is that you don\u2019t have the appropriate permissions on your account. Learn more information about \nuser permissions\n.\ntoken@cqlsh\n>\n \nselect\n * from test_db.data\nUnauthorized: Error from server: \ncode\n=\n2100\n \n[\nUnauthorized\n]\n \nmessage\n=\n\"No SELECT permission on <table test_db.data>\"\nshell\nCopied!\nshell\nCopied!\nI created my table in Astra Portal. Now, when I run a select statement I get an error. What do I do?\nThis is the error: \nInvalid Request: Error from server: code=2200 [Invalid query] message=\"table {table_name} does not exist\"\nWhen you upload a table through Astra Portal, any table name, keyspace name, or column name with case-sensitive characters can be accessed by using double quotes.\nFor example, see the select statement below:\ntoken@cqlsh:test\n>\n desc tables\n;token@cqlsh:test\n>\n \nselect\n * from \n\"Case_Sensitive\"\n;\nshell\nCopied!\nshell\nCopied!\nI need help with the Workshop Project. Where do I go for help?\nCheck the YouTube description for the Workshop you attended. Use the Discord group or the YouTube chat to ask questions.\nAdditional links:\nDataStaxDevs Discord: \nhttps://bit.ly/cassandra-workshop\nBackup Stream (alternative to YouTube): \nhttps://www.twitch.tv/datastaxdevs\nStackOverflow for dev-related questions: \nFollow the \ncassandra\n tag\nDBA StackExchange for admin/ops-related questions: \nFollow the \ncassandra\n tag\nEvent Alerts: \nSubscribe for news\nWhere can I find Astra DB project tutorials?\nYou can find sample projects in our Sample App Gallery located on the left hand side of your Astra dashboard or the \nGithub Repository\n.\nAdditionally, you can follow along to video tutorials on our DataStax Developers YouTube page: \nhttps://www.youtube.com/c/DataStaxDevs\nHow do I open a support ticket?\nOpen your Astra Portal, select the \nHelp Center\n. A panel for Health Center appears on the right side of the screen.\nOn the bottom right hand corner, select \nSubmit a Ticket\n. You are redirected to the DataStax Support portal.\nSelect \nSubmit a Request\n at the top. You must complete the fields marked with an asterisk. When finished, select \nCreate\n.\nFor more, see \nGet support for Astra DB\n.\nCan I change the keyspace name?\nNo, you cannot alter the keyspace name. You can create an entire new keyspace with a different name.\nWhat if my CSV file is too large for the Data Loader?\nIf the file is over 40 MB, you can upload data with our DSBulk Loader.\nFor more, see how to get started with \nDSBulk Loader\n.\nCan I use \ncfstats\n or \nnodetool\n?\nNo, Astra is a zero-operations database-as-a-service (DBaaS) offering. Some operational Cassandra tools are not relevant. We offer access to a limited set of database metrics. You can view them in the \nHealth\n tab in Astra Portal.\nFor more, see the \nAstra DB database guardrails and limits\n.\nCan I use strict security settings, such as an ad blocker, with Astra DB?\nIf you are using strict security settings in your web browser, you might not see everything in Astra Portal, such as messages and certainly functionalities that simplify your experience.\nWhere can I find help?\nThere are several places to get help:\nUse this product documentation to get answers about the capabilities of your database and information about how to use your databases.\nPractice using the Astra DB database with our \nsample apps\n and \nintegrations\n.\nWithin the Astra Portal Home, there are guides to help you get started easier, faster, and more efficiently. These guides include step-by-step instructions in the Astra Portal, along with prerequisites and procedures.\nTo send us feedback or get additional help, use the chat feature in Astra Portal.\nWhich cloud regions are currently available for serverless databases?\nAstra DB supports single-region and multi-region deployments. The \navailable serverless regions\n vary based on the selected cloud provider and more are added over time.\nWithin a region, data is replicated across three availability zones to ensure high availability.\nTo discuss region needs, use the chat icon in Astra Portal to talk with DataStax for guidance.\nIs VPC peering possible for serverless databases?\nVPC peering is not supported for serverless databases at this time. \nPrivate endpoints\n are available.\nHow is pricing calculated for serverless databases?\nPricing for DataStax Astra serverless databases is based on units of measure, cloud provider, and region. See \nPricing\n for more information.\nHow do I create a token?\nSelect your \nOrganization settings\n.\nNavigate to \nToken management\n.\nSelect a role.\nCreate a token.\nFor more, see \nManaging application tokens\n.\nHow do I know which role to choose for my token?\nDefault and \ncustom roles\n allow admins to manage unique permissions for users based on your organization and database requirements.\nFor more, see \nUser permissions\n.\nWhere can I find the \nClient ID\n, \nClient Secret\n, and \nToken\n?\nAfter generating a token, you can find the \nClient ID\n, \nClient Secret\n, and \nToken\n.\nYou can download the CSV only when you generate the token. Make sure to download the CSV and save it. Store these credentials in a secure location.\nWhat values do I pass to username and password when connecting to Astra Drivers?\nIf it is suggested to pass the username and password in the connect documents, use the \nClient ID\n for the username and the \nClient Secret\n for the password:\ncredentials: \n{     username: \n\"<CLIENT ID>\"\n,\n     password: \n\"<CLIENT SECRET>\"\n,\n   \n}\nshell\nCopied!\nshell\nCopied!\nCan I restore my data if my database is suspended?\nYes, your data will be restored when your database becomes active again. If your database is suspended, you must add a credit card or wait for your credits to be renewed before your database will be active again.\nWhich ports are used by serverless databases?\nIf you need to make firewall exceptions, the following ports are used by Astra services:\nAPIs such as REST and GraphQL, and the Astra DB Health dashboard: 443\nCQL: 29042\nMetadata service: 29080\nWhat can I update with my avatar on Astra?\nClick your avatar to review your current account settings, update your username, and reset your password.\nRelease notes\nAstra DB Architecture FAQ\nRate this article"}, {"url": "https://docs.datastax.com/en/dse68-security/docs/secFAQ.html", "title": "DSE Advanced Security FAQs :: DataStax Enterprise 6.8 Security Guide", "content": "DSE Advanced Security FAQs\nContents\nGeneral\nAuthentication and Authorization\nRow-level Access Control (RLAC)\nEncryption\nAuditing\nQuestions and answers about DSE Advanced Security are provided in these categories:\nGeneral\nAuthentication and Authorization\nEncryption\nAuditing\nGeneral\nWhat communication protocols are used?\n \nAll communication occurs over TCP sockets and can be secured by using the standard Java Security SSL/TLS implementation in the JVM.\nAdditional application specific protocols like gossip and the CQL Binary Protocol rely on these sockets for transport, for a list of ports used by DSE see \nSecuring DataStax Enterprise ports\n.\nAuthentication and Authorization\nWhat are the restrictions to the default cassandra user?\n \nThe cassandra default account has access to all database resources.\nWhen logging in or performing an action, DSE sets the consistency level to \nQUORUM\n for this account.\nIn a production environment, using the cassandra account may negatively affect performance and encounter failures.\nDataStax recommends \nAdding a superuser login\n immediately after enabling DSE Unified Authentication with role based access control.\nHow are user permissions managed?\n \nSuperuser permissions allow creation and deletion of other users, and the ability to grant or revoke permissions.\nUse the default cassandra user only to assist with the initial setup of new users and superusers, and then disable it.\nThe DSE Role Manager determines which roles to assign to authenticated users.\nSee \nAbout Role Based Access Control\n.\nHow are user groups supported?\n \nDSE supports role management based on LDAP group membership.\nAll permissions granted to roles that reflect LDAP groups to which the user\nbelongs \u2013 directly or indirectly \u2013 are \ninherited\n.\nThe inherited permissions include login permission, scheme permissions,\nproxy execution permissions, and object permissions.\nConfigure an LDAP scheme with group lookup, set the Role Management mode option to LDAP, and create roles that match the group names and then assign permissions.\nSee \nDefining an LDAP scheme\n.\nFor efficiency, DataStax recommends using the \nmemberof\n search method for group lookup; however DataStax also supports directory search.\nHow are user-action permissions supported?\n \nDSE supports standard object permission management to assign roles specific permissions at the table and row level.\nPermissions to access all keyspaces, a named keyspace, a table, function, or MBean can be granted to a role.\nSee \nSetting up logins and users\n.\nWhat authentication mechanisms are supported?\n \nInternal: Connections provide credentials for a role that has an internally stored password. No additional configuration is required. See \nSetting up logins and users\n.\nLDAP: Connections provide LDAP credentials. DSE passes the credentials for verification to LDAP. See \nDefining an LDAP scheme\n.\nKerberos: Connections provide a Kerberos ticket. DSE is configured as a Service Principal (see \nSetting up Kerberos\n) and passes the tickets to the Key Dsitribution Service (KDS) for verification. See \nDefining a Kerberos scheme\n.\nWhat LDAP servers are supported?\n \nMicrosoft Active Directory, OpenLDAP, and Oracle Directory Server Enterprise Edition. See \nDefining an LDAP scheme\n.\nCan access be restricted using IP accesslisting and blocklisting?\n \nIn general, arbitrary client programs do not access the database.\nDatabase access by the general user population is controlled at the application layer.\nApplication node to database node access should be controlled by using conventional firewall mechanisms, such as Linux iptables.\nHowever, database administrators are an exception to allow connections from DBA hosts.\nWhat granularity of access to specific elements of data is supported?\n \nAuthorization is granted or revoked at the row level for data.\nWhat is the difference between RBAC and RLAC\n \nRole-based access control (RBAC) refers to authorization to any database resource including row-level access control (RLAC).\nRow-level access control refers to the feature that allows permissions to be granted/revoked on rows within a table by filtering a text-based partition column.\nRow-level Access Control (RLAC)\nFor details, see \nsetting up row-level permissions\n.\nHow do I restrict access to a row?\n \nEach table can have a single UTF-8 partition key column on which you build filters to grant access (separate command) to rows within the table.\nRESTRICT only sets the filtering column name:\nRESTRICT ROWS ON [<keyspace_name>.]<table_name>\nUSING <partition_key>;\nAfter setting the column name, use the GRANT command to configure access to rows.\nCan I unrestrict access to rows in a table with RLAC authorization?\n \nThe partition key to filter on using GRANT can be unselected from the table:\nUNRESTRICT ROWS ON [<keyspace_name>.]<table_name>\nUSING <partition_key>;\nUse the LIST command on the table to display all roles that have been granted permissions.\nUnrestricting the column does not grant access to all columns within the table; it invalidates existing filters.\nUsers that are granted access with a filter are unable to access any rows within the table.\nTo grant permissions to all rows, grant permission on the table to the role.\nHow do I grant permissions for rows in a table?\n \nConfigure access to rows within a table by specifying a filtering string that is applied to the partition key column selected in the \nRESTRICT\n command.\nUse case-sensitive literal text in the filter string.\nRow-level authorization applies only to rows that exactly match the filtering_data.\nYou can create as many \nRLAC\n grant variations as required by your security policies.\nTo allow access to rows within a table:\nGRANT <permission>\non '<filtering_data>' ROWS IN <keyspace_name>.<table_name>\nto <role_name>;\nUse the LIST command to display all permissions a role has on a resource.\nHow do I revoke permissions for rows in a table?\n \nRow permissions are stored based on the filtering string, to remove a permission use the REVOKE command with the exact filtering string you want to remove:\nREVOKE <permission> on '<filtering_data>' ROWS IN <keyspace_name>.<table_name>;\nLIST ALL PERMISSIONS ON TABLE <table_name> shows all filters granted to roles.\nWhat happens if you run a RESTRICT command on a table that already has a restriction?\n \nTables have only a single restriction.\nRunning the \nRESTRICT\n command replaces the existing restriction.\nUse \nDESCRIBE TABLE\n to view the existing restrictions on the table.\nWhat happens if there a role has access to the keyspace/table level and I grant row access?\n \nPermission is hierarchical, if permission was also granted to the keyspace or table the user has access to all rows in the table.\nThe \nRLAC\n permissions have no affect.\nIs RLAC supported for use with DSE Graph?\n \nNo.\nAlthough permissions are shown and errors are not thrown with this statement:\nGRANT SELECT ON 'custom_key' ROWS IN graph_keyspace.graph_table to 'alice';\nPermissions are not enforced.\nRLAC is not supported for use with DSE Graph.\nGranting access on rows in a table provides access to data in all graph keyspaces.\nEncryption\nHow are encryption keys secured and managed?\n \nEncryption keys can be managed off-server or locally:\nKMIP\n (Key Management Interoperability Protocol) encryption for encryption keys stored on another server and are cached locally in the memory heap when used by DSE.\nUse \nlocal encryption\n keys and secure using Linux permissions to restrict access.\nCan the client-to-node encryption be configured as a two-way SSL?\n \nYes, although the client certificate DN is not used as a database user principal.\nClient-to-node encryption protects in-flight data from client machines to a\ndatabase cluster using SSL (Secure Sockets Layer) and establishes a secure\nchannel between the client and the coordinator node.\nHow is encryption of \nat-rest data\n supported?\n \nProtects sensitive at-rest data using a local encryption key file or remotely stored and managed Key Management Interoperability Protocol (KMIP) encryption key.\nCan encryption keys be changed for a particular table?\n \nYes, by designating transparent data encryption (TDE) on a per table basis.\nUsing encryption, your application can read and write to SSTables that use different encryption algorithms or use no encryption at all.\nUse a single \nALTER TABLE\n statement to set encryption and compression.\nWould encryption of EBS in AWS be a good replacement for using TDE, or is EBS better as a supplement to TDE (or neither)?\n \nEBS encryption is another way to encrypt the data files.\nEBS encryption ensures encryption of audit logs, system logs, and the SSTable index files, which have partition keys in plain text when using TDE.\nIn general, EBS encryption may be operationally simpler.\nPrimarily, use TDE when full-disk encryption is cost prohibitive or not feasible.\nIs encryption supported at granular data layers? For example record-level or column- or field-level?\n \nNo.\nDesignate transparent data encryption (TDE) only on a per table basis.\nAuditing\nWhich user actions and events are logged?\n \nWhen you \nconfigure audit logging\n, you can include or exclude categories of database activity such as querying or DML, see \nFiltering event categories\n.\nWhere are audit logs stored and who has access?\n \nAudit logs can be written to either file system log files using \nlogback\n, or to a database table.\nAudit events stored in database tables can be secured like any other database table using RBAC.\nFile-based audit logs are stored per-node and can be secured with standard Linux file system permissions.\nAbout DSE Advanced Security\nSecurity checklists\nRate this article"}]


--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('tailwindcss').Config} */
 2 | module.exports = {
 3 |   content: [
 4 |     "./components/**/*.{js,ts,jsx,tsx,mdx}",
 5 |     "./app/**/*.{js,ts,jsx,tsx,mdx}",
 6 |   ],
 7 |   future: {
 8 |     hoverOnlyWhenSupported: true,
 9 |   },
10 |   theme: {
11 |     extend: {
12 |       fontFamily: {
13 |         sans: ["var(--font-geist-sans)"],
14 |       },
15 |       screens: {
16 |         origin: "800px",
17 |       },
18 |     },
19 |   },
20 |   plugins: [],
21 | };
22 | 


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "compilerOptions": {
 3 |     "lib": [
 4 |       "dom",
 5 |       "dom.iterable",
 6 |       "esnext"
 7 |     ],
 8 |     "allowJs": true,
 9 |     "skipLibCheck": true,
10 |     "strict": false,
11 |     "noEmit": true,
12 |     "incremental": true,
13 |     "esModuleInterop": true,
14 |     "module": "esnext",
15 |     "moduleResolution": "node",
16 |     "resolveJsonModule": true,
17 |     "isolatedModules": true,
18 |     "jsx": "preserve",
19 |     "plugins": [
20 |       {
21 |         "name": "next"
22 |       }
23 |     ]
24 |   },
25 |   "include": [
26 |     "next-env.d.ts",
27 |     ".next/types/**/*.ts",
28 |     "**/*.ts",
29 |     "**/*.tsx"
30 |   ],
31 |   "ts-node": {
32 |     // these options are overrides used only by ts-node
33 |     // same as the --compilerOptions flag and the TS_NODE_COMPILER_OPTIONS environment variable
34 |     "compilerOptions": {
35 |       "module": "commonjs"
36 |     }
37 |   },
38 |   "exclude": [
39 |     "node_modules"
40 |   ]
41 | }
42 | 


--------------------------------------------------------------------------------