UI changes, workaround for domains in interface.js (.env wasn't worki…

…ng), still issues with codebases that don't have any JS files
codeday · Aug 24, 2024 · 5268b25 · 5268b25
1 parent 4c940b8
commit 5268b25
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 17 deletions.
diff --git a/frontend/src/components/Chatbot.css b/frontend/src/components/Chatbot.css
@@ -9,8 +9,8 @@
   height: 100vh;
   text-align: center;
   background:#777ed4; /* Fallback for old browsers */
-  background: -webkit-linear-gradient(to right, #6b90e0, #777ed4);  /* Chrome 10-25, Safari 5.1-6 */
-  background: linear-gradient(to right, #6b90e0, #777ed4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+  background: -webkit-linear-gradient(to right, #6b90e0, #8277d4);  /* Chrome 10-25, Safari 5.1-6 */
+  background: linear-gradient(to right, #6b90e0, #8277d4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
   opacity: 0.95;
   overflow-y: auto;
 }
@@ -160,3 +160,56 @@ h1 {
   opacity: 0.8;
   color: #eae4fe;
 }
+
+/* Light animation for title. Credit: https://codepen.io/zastrow/pen/PoJmzGJ */
+@keyframes lights {
+  0% {
+    color: hsl(230, 46%, 85%);
+    text-shadow:
+      0 0 1em hsla(320, 100%, 50%, 0.2),
+      0 0 0.125em hsla(320, 100%, 60%, 0.3),
+      -1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
+      1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
+  }
+
+  30% { 
+    color: hsl(231, 100%, 92%);
+    text-shadow:
+      0 0 1em hsla(320, 100%, 50%, 0.7),
+      0 0 0.125em hsla(320, 100%, 60%, 0.7),
+      -0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
+      0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
+  }
+
+  40% { 
+    color: hsl(0, 0%, 100%);
+    text-shadow:
+      0 0 1em hsla(283, 100%, 50%, 0.7),
+      0 0 0.125em hsla(320, 100%, 90%, 0.7),
+      -0.25em -0.125em 0.125em hsla(40, 100%, 60%, 0.2),
+      0.25em 0.125em 0.125em hsla(200, 100%, 60%, 0.4);
+  }
+
+  70% {
+    color: hsl(227, 70%, 94%);
+    text-shadow:
+      0 0 1em hsla(297, 100%, 50%, 0.7),
+      0 0 0.125em hsla(214, 100%, 85%, 0.88),
+      0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2),
+      -0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4);
+  }
+
+  100% {
+    color: hsl(232, 49%, 85%);
+    text-shadow:
+      0 0 1em hsla(320, 100%, 50%, 0.2),
+      0 0 0.125em hsla(320, 100%, 60%, 0.3),
+      1em -0.125em 0.5em hsla(40, 100%, 60%, 0),
+      -1em 0.125em 0.5em hsla(200, 100%, 60%, 0);
+  }
+
+}
+
+h1 {
+  animation: lights 5s 750ms linear infinite;
+}
diff --git a/frontend/src/domains.js b/frontend/src/domains.js
@@ -0,0 +1 @@
+export const apiURL = "http://localhost:3000";
diff --git a/frontend/src/interface.js b/frontend/src/interface.js
@@ -1,13 +1,11 @@
 import ReactDOM from "react-dom";
 import MarkdownRenderer from "./MarkdownRenderer";
+import {apiURL} from "./domains";
 
 let messageCounter = 0;
 
 // Download a codebase
 export async function downloadCodebase() {
-  const ec2 = "http://18.226.98.245:80";
-  const local = "http://localhost:3000";
-  const apiURL = "https://syntaxsorcerer-backend.fly.dev";
   const url = document.getElementById("codebase-url").value;
 
   const response = await fetch(`${apiURL}/api/download`, {
@@ -28,10 +26,6 @@ export async function downloadCodebase() {
 
 // Delete the existing codebase
 export async function deleteCodebase() {
-  const ec2 = "http://18.226.98.245:80";
-  const local = "http://localhost:3000";
-  const apiURL = "https://syntaxsorcerer-backend.fly.dev";
-
   const response = await fetch(`${apiURL}/api/delete`, {
     method: "POST",
     headers: {
@@ -130,10 +124,6 @@ export function appendMessage(sender, message) {
 
 // Fetch a response from the ChatGPT API
 export async function fetchChatGPTResponse(userInput) {
-  const ec2 = "https://18.226.98.245:443";
-  const local = "http://localhost:3000";
-  const apiURL = "https://syntaxsorcerer-backend.fly.dev";
-
   const response = await fetch(`${apiURL}/api/chatgpt`, {
     method: "POST",
     headers: {
@@ -152,10 +142,6 @@ export async function fetchChatGPTResponse(userInput) {
 
 // Fetch a response from the Pinecone API, generate an embedding from the user input
 export async function fetchPineconeResponse(userInput) {
-  const ec2 = "https://18.226.98.245:443";
-  const local = "http://localhost:3000";
-  const apiURL = "https://syntaxsorcerer-backend.fly.dev";
-
   const response = await fetch(`${apiURL}/api/pinecone`, {
     method: "POST",
     headers: {