From 702faa5036dd5409ae1ffbf8121293231987411d Mon Sep 17 00:00:00 2001
From: SuperDev <supernova@supers0ft.us>
Date: Sat, 27 Apr 2024 09:49:10 -0500
Subject: [PATCH] Add API key retrieval from cookies in SearchBar

The code now tries to retrieve the OpenAI API key from the user's cookies during a search. If the API key is not present, a modal is launched to request it. This provides a seamless experience when the API key is not available, preventing unnecessary search attempts.
---
 components/SearchBar.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/components/SearchBar.tsx b/components/SearchBar.tsx
index 7b092e0..4316b03 100644
--- a/components/SearchBar.tsx
+++ b/components/SearchBar.tsx
@@ -1,6 +1,8 @@
 import React, {useState} from 'react';
 import Message from './Message';
 import {Tooltip, TooltipContent, TooltipProvider, TooltipTrigger} from "@/components/ui/tooltip";
+import {useModal} from "@/hooks/use-modal-store";
+import {parse} from "cookie";
 
 const SearchBar: React.FC = () => {
     const [searchDisabled, setSearchDisabled] = React.useState(false);
@@ -8,12 +10,23 @@ const SearchBar: React.FC = () => {
     const [isLoading, setIsLoading] = useState<boolean>(false);
     const [response, setResponse] = useState<string | null>(null);
     const [showSearch, setShowSearch] = useState<boolean>(true);
+    const { onOpen } = useModal();
 
     const handleSearch = async (event: React.FormEvent<HTMLFormElement>) => {
         event.preventDefault();
         setIsLoading(true);
 
         try {
+            // Retrieve API key from cookies
+            const cookies = parse(document.cookie);
+            const apiKey = cookies.openaiApiKey || null;
+
+            if (!apiKey) {
+                // Open the API modal if the API Key is not present.
+                setIsLoading(false);
+                onOpen("api");
+                return;
+            }
             setSearchDisabled(true)
             const res = await fetch('/api/search', {
                 method: 'POST',