Merge pull request #210 from priyanshuverma-dev/bug-auth-headers

fixes: authentication headers and 422 error
kom-senapati · Oct 28, 2024 · a689396 · a689396
2 parents 43e5fec + e08ab5f
commit a689396
Show file tree

Hide file tree

Showing 9 changed files with 88 additions and 25 deletions.
diff --git a/client/src/components/modals/create-chatbot-modal.tsx b/client/src/components/modals/create-chatbot-modal.tsx
@@ -29,7 +29,6 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { SERVER_URL } from "@/lib/utils";
 import { Loader2 } from "lucide-react";
 import { Textarea } from "../ui/textarea";
-import { authHeaders } from "@/lib/queries";
 import { useQueryClient } from "@tanstack/react-query";
 import { useCopilotAction } from "@copilotkit/react-core";
 
@@ -72,6 +71,11 @@ export default function CreateChatbotModal() {
 
   async function onSubmit(values: z.infer<typeof createChatbotSchema>) {
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       setLoading(true);
       const response = await axios.post(
         `${SERVER_URL}/api/create_chatbot`,

diff --git a/client/src/components/modals/delete-chatbot-modal.tsx b/client/src/components/modals/delete-chatbot-modal.tsx
@@ -8,7 +8,6 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
 } from "@/components/ui/alert-dialog";
-import { authHeaders } from "@/lib/queries";
 import { SERVER_URL } from "@/lib/utils";
 import { useDeleteChatbotModal } from "@/stores/modal-store";
 import { useQueryClient } from "@tanstack/react-query";
@@ -22,7 +21,11 @@ export default function DeleteChatbotModal() {
     try {
       const { id } = modal.extras;
       if (!id) return;
+      const token = localStorage.getItem("token");
 
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       const response = await axios.post(
         `${SERVER_URL}/api/chatbot/${id}/delete`,
         {},

diff --git a/client/src/components/modals/update-chatbot-modal.tsx b/client/src/components/modals/update-chatbot-modal.tsx
@@ -28,7 +28,6 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { SERVER_URL } from "@/lib/utils";
 import { Loader2 } from "lucide-react";
 import { Textarea } from "../ui/textarea";
-import { authHeaders } from "@/lib/queries";
 import { useQueryClient } from "@tanstack/react-query";
 
 export default function UpdateChatbotModal() {
@@ -48,6 +47,11 @@ export default function UpdateChatbotModal() {
 
   async function onSubmit(values: z.infer<typeof createChatbotSchema>) {
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       setLoading(true);
       const response = await axios.post(
         `${SERVER_URL}/api/chatbot/${id}/update`,

diff --git a/client/src/components/modals/update-profile-modal.tsx b/client/src/components/modals/update-profile-modal.tsx
@@ -28,7 +28,6 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { SERVER_URL } from "@/lib/utils";
 import { Loader2 } from "lucide-react";
 import { Textarea } from "../ui/textarea";
-import { authHeaders } from "@/lib/queries";
 import { useQueryClient } from "@tanstack/react-query";
 
 export default function UpdateProfileModal() {
@@ -49,6 +48,11 @@ export default function UpdateProfileModal() {
 
   async function onSubmit(values: z.infer<typeof updateProfileSchema>) {
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       setLoading(true);
       const response = await axios.post(
         `${SERVER_URL}/api/profile/edit`,

diff --git a/client/src/lib/queries.ts b/client/src/lib/queries.ts
@@ -11,15 +11,14 @@ interface ProfileResponse {
   contribution_score: number;
 }
 
-const token = localStorage.getItem("token");
-
-export const authHeaders = {
-  Authorization: `Bearer ${token || ""}`,
-};
-
 export const fetchProfileData = async (
   username: string
 ): Promise<ProfileResponse> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.get(`${SERVER_URL}/api/user/${username}`, {
     headers: authHeaders,
   });
@@ -29,24 +28,40 @@ export const fetchProfileData = async (
 export const fetchChatbotData = async (
   id: string
 ): Promise<ChatbotResponse> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.get(`${SERVER_URL}/api/chatbot/${id}`, {
     headers: authHeaders,
   });
   return data;
 };
+
 export const fetchChatbotViewData = async (
   id: string
 ): Promise<{
   bot: Chatbot;
   comments: ChatbotComment[];
 }> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.get(`${SERVER_URL}/api/chatbot_data/${id}`, {
     headers: authHeaders,
   });
   return data;
 };
 
 export const fetchImagesData = async (): Promise<ImageGen[]> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.get(`${SERVER_URL}/api/imagine`, {
     headers: authHeaders,
   });
@@ -56,6 +71,11 @@ export const fetchImagesData = async (): Promise<ImageGen[]> => {
 export const publishChatbot = async (
   id: number
 ): Promise<boolean | undefined> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.post(
     `${SERVER_URL}/api/chatbot/${id}/publish`,
     {},
@@ -67,6 +87,11 @@ export const publishChatbot = async (
 };
 
 export const deleteAllChats = async (id: string): Promise<void> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.post(
     `${SERVER_URL}/api/chatbot/${id}/clear`,
     {},
@@ -86,6 +111,11 @@ export const likeAndReport = async ({
   type: "image" | "chatbot" | "user" | "comment";
   action: "like" | "report";
 }): Promise<void> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const { data } = await axios.post(
     `${SERVER_URL}/api/actions/${type}/${id}/${action}`,
     {},
@@ -130,6 +160,11 @@ export const fetchData = async ({
   queues: ValidQueue[];
   uid?: number;
 }): Promise<DataResponse> => {
+  const token = localStorage.getItem("token");
+
+  const authHeaders = {
+    Authorization: `Bearer ${token || ""}`,
+  };
   const queuesParam = queues.join(",");
   const { data } = await axios.get(
     `${SERVER_URL}/api/data?queues=${queuesParam}${uid ? `&uid=${uid}` : ""}`,

diff --git a/client/src/pages/Anonymous.tsx b/client/src/pages/Anonymous.tsx
@@ -9,7 +9,6 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { useSettings } from "@/contexts/settings-context";
-import { authHeaders } from "@/lib/queries";
 import { messageSchema } from "@/lib/schemas";
 import { SERVER_URL } from "@/lib/utils";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -40,16 +39,19 @@ export default function AnonymousPage() {
     }
 
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+        Apikey: currentConfig.apiKey,
+        engine: currentConfig.engine,
+      };
       setLoading(true);
       const response = await axios.post(
         `${SERVER_URL}/api/anonymous`,
         { ...values, prev: messages },
         {
-          headers: {
-            ...authHeaders,
-            Apikey: currentConfig.apiKey,
-            engine: currentConfig.engine,
-          },
+          headers: authHeaders,
         }
       );
       if (response.data?.success) {

diff --git a/client/src/pages/Chatbot.tsx b/client/src/pages/Chatbot.tsx
@@ -8,7 +8,7 @@ import {
   FormMessage,
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
-import { authHeaders, deleteAllChats, fetchChatbotData } from "@/lib/queries";
+import { deleteAllChats, fetchChatbotData } from "@/lib/queries";
 import { messageSchema } from "@/lib/schemas";
 import { SERVER_URL } from "@/lib/utils";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -55,17 +55,19 @@ export default function ChatbotPage() {
         toast.error("Please Select AI engine in settings");
         return;
       }
+      const token = localStorage.getItem("token");
 
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+        Apikey: currentConfig.apiKey,
+        engine: currentConfig.engine,
+      };
       setLoading(true);
       const response = await axios.post(
         `${SERVER_URL}/api/chatbot/${id}`,
         values,
         {
-          headers: {
-            ...authHeaders,
-            Apikey: currentConfig.apiKey,
-            engine: currentConfig.engine,
-          },
+          headers: authHeaders,
         }
       );
       if (response.data?.success) {

diff --git a/client/src/pages/ChatbotView.tsx b/client/src/pages/ChatbotView.tsx
@@ -14,7 +14,6 @@ import { Skeleton } from "@/components/ui/skeleton";
 import { Textarea } from "@/components/ui/textarea";
 import { useAuth } from "@/contexts/auth-context";
 import {
-  authHeaders,
   fetchChatbotViewData,
   likeAndReport,
   publishChatbot,
@@ -62,14 +61,19 @@ export default function ChatbotViewPage() {
     }
 
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       const response = await axios.post(
         `${SERVER_URL}/api/chatbot/comment`,
         {
           name,
           message: comment,
           chatbotId: chatbotId,
         },
-        { headers: { ...authHeaders } }
+        { headers: authHeaders }
       );
 
       if (response.status == 200) {

diff --git a/client/src/pages/Imagine.tsx b/client/src/pages/Imagine.tsx
@@ -8,7 +8,7 @@ import {
   FormMessage,
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
-import { authHeaders, fetchImagesData } from "@/lib/queries";
+import { fetchImagesData } from "@/lib/queries";
 import { messageSchema } from "@/lib/schemas";
 import { imageSrc, SERVER_URL } from "@/lib/utils";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -37,6 +37,11 @@ export default function ImaginePage() {
 
   async function onSubmit(values: z.infer<typeof messageSchema>) {
     try {
+      const token = localStorage.getItem("token");
+
+      const authHeaders = {
+        Authorization: `Bearer ${token || ""}`,
+      };
       setLoading(true);
       const response = await axios.post(`${SERVER_URL}/api/imagine`, values, {
         headers: authHeaders,