Design update

README.md

@@ -24,6 +24,9 @@ Next, we'll add the `ai` package:
 npm install ai
 ```
 
+This command is used to install the `ai` package which is necessary for the chatbot functionality.
+
+
 You can use the [full list](https://github.com/pinecone-io/pinecone-vercel-example/blob/main/package.json) of dependencies if you'd like to build along with the tutorial.
 
 ## Step 2: Create the Chatbot

package.json

@@ -11,32 +11,39 @@
  "test:show": "playwright show-report"
  },
  "dependencies": {
+ "@emotion/react": "^11.11.3",
+ "@emotion/styled": "^11.11.0",
+ "@material-tailwind/react": "^2.1.8",
+ "@mui/material": "^5.15.3",
  "@pinecone-database/doc-splitter": "^0.0.1",
- "@pinecone-database/pinecone": "^1.1.0",
- "@types/node": "20.4.0",
- "@types/react": "18.2.14",
- "@types/react-dom": "18.2.6",
- "ai": "^2.1.16",
+ "@pinecone-database/pinecone": "^1.1.2",
+ "@types/uuid": "^9.0.7",
+ "ai": "^2.2.30",
  "cheerio": "^1.0.0-rc.12",
- "eslint": "8.44.0",
- "eslint-config-next": "13.4.9",
  "md5": "^2.3.0",
- "next": "13.4.9",
+ "next": "14.0.4",
  "node-html-markdown": "^1.3.0",
- "openai-edge": "^1.2.0",
+ "openai-edge": "^1.2.2",
  "react": "18.2.0",
  "react-dom": "18.2.0",
- "react-icons": "^4.10.1",
- "react-markdown": "^8.0.7",
+ "react-icons": "^4.12.0",
+ "react-markdown": "^9.0.1",
+ "react-spinners": "^0.13.8",
  "sswr": "^2.0.0",
- "svelte": "^4.2.0",
- "tailwindcss": "3.3.2",
- "typescript": "5.1.6",
- "unified": "^10.1.2",
- "vue": "^3.3.4"
+ "svelte": "^4.2.8",
+ "tailwindcss": "3.4.0",
+ "typescript": "5.3.3",
+ "unified": "^11.0.4",
+ "uuid": "^9.0.1",
+ "vue": "^3.3.13"
  },
  "devDependencies": {
- "@playwright/test": "^1.38.0",
- "@types/md5": "^2.3.2"
+ "@playwright/test": "^1.40.1",
+ "@types/md5": "^2.3.5",
+ "@types/node": "20.10.5",
+ "@types/react": "18.2.45",
+ "@types/react-dom": "18.2.18",
+ "eslint": "8.56.0",
+ "eslint-config-next": "14.0.4"
  }
-}
+}