Backend GKE Deploy, access key for backend

- Configs and automation for deploying backend to GKE
- First steps to adding an optional token check for requests to backend
- First steps frontend sending optional token to backend when configured

ui/components/ChatWindow.tsx

@@ -6,6 +6,7 @@ import Navbar from './Navbar';
 import Chat from './Chat';
 import EmptyChat from './EmptyChat';
 import { toast } from 'sonner';
+import { clientFetch } from '@/lib/utils';
 
 export type Message = {
   id: string;
@@ -34,8 +35,8 @@ const useSocket = (url: string) => {
           !embeddingModel ||
           !embeddingModelProvider
         ) {
-          const providers = await fetch(
-            `${process.env.NEXT_PUBLIC_API_URL}/models`,
+          const providers = await clientFetch(
+            '/models',
             {
               headers: {
                 'Content-Type': 'application/json',

ui/components/SearchImages.tsx

@@ -4,6 +4,7 @@ import { useState } from 'react';
 import Lightbox from 'yet-another-react-lightbox';
 import 'yet-another-react-lightbox/styles.css';
 import { Message } from './ChatWindow';
+import { clientFetch } from '@/lib/utils';
 
 type Image = {
   url: string;
@@ -33,8 +34,8 @@ const SearchImages = ({
             const chatModelProvider = localStorage.getItem('chatModelProvider');
             const chatModel = localStorage.getItem('chatModel');
 
-            const res = await fetch(
-              `${process.env.NEXT_PUBLIC_API_URL}/images`,
+            const res = await clientFetch(
+              '/images',
               {
                 method: 'POST',
                 headers: {

ui/components/SearchVideos.tsx

@@ -4,6 +4,7 @@ import { useState } from 'react';
 import Lightbox, { GenericSlide, VideoSlide } from 'yet-another-react-lightbox';
 import 'yet-another-react-lightbox/styles.css';
 import { Message } from './ChatWindow';
+import { clientFetch } from '@/lib/utils';
 
 type Video = {
   url: string;
@@ -46,8 +47,8 @@ const Searchvideos = ({
             const chatModelProvider = localStorage.getItem('chatModelProvider');
             const chatModel = localStorage.getItem('chatModel');
 
-            const res = await fetch(
-              `${process.env.NEXT_PUBLIC_API_URL}/videos`,
+            const res = await clientFetch(
+              '/videos',
               {
                 method: 'POST',
                 headers: {

ui/components/SettingsDialog.tsx

@@ -1,6 +1,7 @@
 import { Dialog, Transition } from '@headlessui/react';
 import { CloudUpload, RefreshCcw, RefreshCw } from 'lucide-react';
 import React, { Fragment, useEffect, useState } from 'react';
+import { clientFetch } from '@/lib/utils';
 
 interface SettingsType {
   chatModelProviders: {
@@ -42,7 +43,7 @@ const SettingsDialog = ({
     if (isOpen) {
       const fetchConfig = async () => {
         setIsLoading(true);
-        const res = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/config`, {
+        const res = await clientFetch('/config', {
           headers: {
             'Content-Type': 'application/json',
           },
@@ -102,7 +103,7 @@ const SettingsDialog = ({
     setIsUpdating(true);
 
     try {
-      await fetch(`${process.env.NEXT_PUBLIC_API_URL}/config`, {
+      await clientFetch('/config', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',