feat: ✨ create button for database build and update in frontend

Mekcyed · Nov 2, 2023 · 5edbb34 · 5edbb34
1 parent 10e7267
commit 5edbb34
Showing 1 changed file with 34 additions and 4 deletions.
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
@@ -3,6 +3,7 @@
 
 	import { onMount } from 'svelte';
 	import Button from './Button.svelte';
+	let backendEndpoint = 'http://localhost:5555';
 	let name = '';
 	let questionQueue = [];
 	let currentQuestionIndex = 0; 
@@ -13,6 +14,7 @@
 	let collection = "";
 	let collections = [];
 	let loading_question = false;
+	let loading_database = false;
 	let embeddings = ""; 
 	let filename = "";
 	let pageNumber = "";
@@ -39,7 +41,7 @@
 
 	async function fetchCollections() {
 		try {
-			const result = await fetch('http://localhost:5555/api/get/collections');
+			const result = await fetch(`${backendEndpoint}/api/get/collections`);
 			const data = await result.json();
 			
 			// Check if the data contains a 'collections' object and then if the expected sub-structures are present
@@ -74,7 +76,7 @@
 			alert("Please enter a topic or filename and page number.");
 		}
 		try {
-			const result = await fetch(`http://localhost:5555/api/get/question/${questionQuantity}/${collection}/${criteria}/${element}`);
+			const result = await fetch(`${backendEndpoint}/api/get/question/${questionQuantity}/${collection}/${criteria}/${element}`);
 			const data = await result.json();
 			if (data?.response && data?.response?.embeddings && data?.response?.questions) {
 				console.log(data.response);
@@ -98,6 +100,30 @@
 		}
 	}
 
+	async function updateDatabase(){
+		startCounter();
+		loading_database = true;
+		try {
+			const result = await fetch(`${backendEndpoint}/api/update/database`);
+			const data = await result.json();
+			if (data?.response) {
+				alert(data.response);
+			} else {
+				if (data?.error){
+					alert(data.error);
+				} else {
+					alert("Invalid API response.");
+				}
+			}
+		} catch (error) {
+			console.error("Error fetching data:", error);
+		} finally {
+			loading_database = false;
+			stopCounter();
+		}
+
+	}
+
 	function loadNextQuestion() {
 		if (currentQuestionIndex < questionQueue.length) {
 			explanationText = ""; 
@@ -200,9 +226,13 @@
 		<Button handleClick={() => document.body.classList.toggle('dark-mode')}>
 			Toggle Dark Mode
 		</Button>
-		<Button handleClick={() => console.log("Hello")}>
-			Hello
+		<Button handleClick={() => updateDatabase()}>
+			Update Database
 		</Button>
+		{#if loading_database}
+			<div class="loader"></div>
+			<div class="counter">Time elapsed: {counter} seconds</div>
+		{/if}
 	</div>
 </div>