Bugfixes & Improvements (#11)

* Fix: Button loading state not reset on 'back'

* Feat: search post processing to filter by average score

* Feat: Updated api status error handling

* Feat: Updated error handling & timeout duration

* Refactored imports & moved global vars to constants.py

* Feat: Updated dockerfile to install llama-cpp-python with openblas support by default

* Add .env file and update gitignore, pipeline name, robots.txt, middleware, layout, page, sitemap, and navlink components

* Fixed Pipeline Name

* Updated Check File Size workflow

* Updated Homepage to add GSC verification metadata tag

* Updated check-file-size.yml action to run on push

* Added Deployment Template & Contributing.md

.github/workflows/check-file-size.yml

@@ -1,8 +1,12 @@
 name: Check file size
 
-on:               # or directly `on: [push]` to run the action on every push on any branch
+on:
+  # On pull requests to the main branch
   pull_request:
     branches: [main]
+  # On pushes to the main branch
+  push:
+    branches: [main]
   # to run this workflow manually from the Actions tab
   workflow_dispatch:
   # to run this workflow from another workflow

CONTRIBUTING.md

@@ -0,0 +1,43 @@
+# Contributing
+
+Thank you for considering contributing to this project! Your time and effort in helping to make this project better is very much appreciated.
+
+## Table of Contents
+
+- [Getting Started](#getting-started)
+- [Contributing Guidelines](#contributing-guidelines)
+- [Code of Conduct](#code-of-conduct)
+- [License](#license)
+
+## Getting Started
+
+To get started with contributing, please follow these steps:
+
+1. Fork the repository and clone it to your local machine.
+2. Install any necessary dependencies.
+3. Create a new branch for your changes.
+4. Make your desired changes and commit them.
+5. Push your changes to your forked repository.
+6. Open a pull request to the main repository.
+
+## Contributing Guidelines
+
+Please follow these guidelines when contributing to this project:
+
+- Before starting work on a new feature or bug fix, check the existing issues and pull requests to avoid duplication of effort.
+- Make sure your code follows the project's coding style and conventions.
+- Write clear and concise commit messages.
+- Include tests for any new functionality or bug fixes.
+- Document any changes or additions to the project's documentation.
+
+## Code of Conduct
+
+We expect all contributors to adhere to our [Code of Conduct](CODE_OF_CONDUCT.md). Please read it carefully before making any contributions.
+
+## License
+
+This project is licensed under the [MIT License](LICENSE). By contributing to this project, you agree to abide by the terms of this license.
+
+---
+
+We welcome contributions from everyone, regardless of their experience level or background. If you have any questions or need assistance, please don't hesitate to reach out. Happy contributing!

DEPLOYMENT.md

@@ -0,0 +1,40 @@
+# Smart Retrieval
+
+## Deployment Instructions
+
+### Prerequisites
+
+- [List any prerequisites or dependencies required for deployment]
+
+### Deployment Steps
+
+1. [Step 1: Describe the first step to deploy the project]
+2. [Step 2: Describe the second step to deploy the project]
+3. [Step 3: Describe the third step to deploy the project]
+    - [Sub-step or additional information if necessary]
+4. [Step 4: Describe the fourth step to deploy the project]
+    - [Sub-step or additional information if necessary]
+
+### Configuration
+
+- [List any configuration settings or environment variables required for deployment]
+
+### Usage
+
+- [Provide instructions on how to use or access the deployed project]
+
+### Troubleshooting
+
+- [List common issues or errors that may occur during deployment and how to resolve them]
+
+### Contributing
+
+- [Provide information on how others can contribute to the project]
+
+### License
+
+- [Specify the project's license]
+
+### Contact
+
+- [Provide contact information for support or inquiries]

README.md

@@ -41,7 +41,7 @@ pinned: false
 - [Getting Started](#getting_started)
 - [Deployment](#deployment)
 - [Built Using](#built_using)
-- [Contributing](../CONTRIBUTING.md)
+- [Contributing](#contributing)
 - [Authors](#authors)
 - [Acknowledgments](#acknowledgement)
 
@@ -64,7 +64,9 @@ These instructions will get you a copy of the project up and running on your loc
 
 ## 🚀 Deployment <a name = "deployment"></a>
 
-How to deploy this on a live system.
+Deploy this on a live system.
+
+For more information, see the [DEPLOYMENT.md](./DEPLOYMENT.md).
 
 ## ⛏️ Built Using <a name = "built_using"></a>
 
@@ -75,9 +77,15 @@ How to deploy this on a live system.
 - [FastAPI](https://fastapi.tiangolo.com/) - Backend API Web Framework
 - [LlamaIndex](https://www.llamaindex.ai/) - Data Framework for LLM
 
+## 📑 Contributing <a name = "contributing"></a>
+
+Contributions, issues and feature requests are welcome!
+
+Read the [CONTRIBUTING.md](./CONTRIBUTING.md) for details and the process for submitting pull requests.
+
 ## ✍️ Authors <a name = "authors"></a>
 
-- [@xkhronoz](https://github.com/xkhronoz) - Initial work
+- [@xkhronoz](https://github.com/xkhronoz)
 
 See also the list of [contributors](https://github.com/digitalbuiltenvironment/Smart-Retrieval/contributors) who participated in this project.
 

frontend/app/components/header.tsx

@@ -6,7 +6,7 @@ import { useTheme } from "next-themes";
 import { useEffect, useState } from "react";
 import { useMedia } from 'react-use';
 import useSWR from 'swr';
-import logo from '../../public/smart-retrieval-logo.webp';
+import logo from '@/public/smart-retrieval-logo.webp';
 import { HeaderNavLink } from './ui/navlink';
 import { MobileMenu } from './ui/mobilemenu';
 
@@ -44,7 +44,7 @@ export default function Header() {
   const { theme, setTheme } = useTheme();
   // Use SWR for API status fetching
   const healthcheck_api = process.env.NEXT_PUBLIC_HEALTHCHECK_API;
-  const { data: apiStatus, error: apiError } = useSWR(healthcheck_api, async (url) => {
+  const { data, error: apiError } = useSWR(healthcheck_api, async (url) => {
     try {
       // Fetch the data
       const response = await fetch(url, {
@@ -71,8 +71,6 @@ export default function Header() {
     else {
       console.error('[Header] Error fetching Backend API Status:', apiError.message);
     }
-  } else {
-    console.log('[Header] API Status:', apiStatus);
   }
 
   useEffect(() => {

frontend/app/components/ui/home/client-component.tsx

@@ -0,0 +1,49 @@
+"use client";
+
+import Image from 'next/image';
+import Link from 'next/link';
+import { useState } from 'react';
+import { IconSpinner } from '@/app/components/ui/icons';
+import logo from '@/public/smart-retrieval-logo.webp';
+
+export default function Home() {
+    const [isLoading, setIsLoading] = useState(false);
+
+    return (
+        <div className="rounded-xl shadow-xl p-4 max-w-5xl w-full">
+            <div className="max-w-2xl mx-auto p-4 text-center">
+                <div className="flex flex-col items-center mb-4 bg-gradient-to-r from-blue-500 to-indigo-500 text-white p-8 rounded-lg shadow-lg">
+                    <div className="flex flex-col md:flex-row items-center md:items-start">
+                        <Image
+                            src={logo}
+                            alt="Smart Retrieval Logo"
+                            width={150}
+                            height={150}
+                            priority
+                            className="rounded-lg mb-4 md:mb-0 md:mr-4"
+                        />
+                        <div className='flex flex-col mt-4'>
+                            <h1 className="text-4xl font-bold mb-2 md:text-5xl">Smart Retrieval</h1>
+                            <p className="text-lg md:text-xl text-gray-200">
+                                Your intelligent solution for quick and accurate information retrieval.
+                            </p>
+                        </div>
+                    </div>
+                </div>
+                <div className="flex flex-col mt-8 text-center items-center max-w-full">
+                    <p id='get-started-paragraph' className="text-xl text-gray-700 dark:text-gray-200 mb-4">
+                        Experience the power of Smart Retrieval today!
+                    </p>
+                    <Link href="/chat" onClick={() => { setIsLoading(true); }}>
+                        <div className="flex text-center items-center text-xl bg-blue-500 text-white px-6 py-3 rounded-md font-bold transition duration-300 ease-in-out transform hover:scale-125">
+                            {isLoading ? (
+                                <IconSpinner className="mr-2 animate-spin" />
+                            ) : null}
+                            Get Started
+                        </div>
+                    </Link>
+                </div>
+            </div>
+        </div>
+    );
+}

frontend/app/page.tsx

@@ -1,49 +1,12 @@
-"use client";
+import Home from '@/app/components/ui/home/client-component';
+import { Metadata } from 'next';
 
-import Image from 'next/image';
-import Link from 'next/link';
-import { useState } from 'react';
-import { IconSpinner } from '@/app/components/ui/icons';
-import logo from '../public/smart-retrieval-logo.webp';
+export const metadata: Metadata = {
+    // Google Search Console HTML Tag Verification
+    verification: {
+        google: process.env.GSC_TAG_VERIFICATION,
+        // Add more verification providers here. Refer: https://nextjs.org/docs/app/api-reference/functions/generate-metadata#verification
+    },
+};
 
-export default function Home() {
-  const [isLoading, setIsLoading] = useState(false);
-
-  return (
-    <div className="rounded-xl shadow-xl p-4 max-w-5xl w-full">
-      <div className="max-w-2xl mx-auto p-4 text-center">
-        <div className="flex flex-col items-center mb-4 bg-gradient-to-r from-blue-500 to-indigo-500 text-white p-8 rounded-lg shadow-lg">
-          <div className="flex flex-col md:flex-row items-center md:items-start">
-            <Image
-              src={logo}
-              alt="Smart Retrieval Logo"
-              width={150}
-              height={150}
-              priority
-              className="rounded-lg mb-4 md:mb-0 md:mr-4"
-            />
-            <div className='flex flex-col mt-4'>
-              <h1 className="text-4xl font-bold mb-2 md:text-5xl">Smart Retrieval</h1>
-              <p className="text-lg md:text-xl text-gray-200">
-                Your intelligent solution for quick and accurate information retrieval.
-              </p>
-            </div>
-          </div>
-        </div>
-        <div className="flex flex-col mt-8 text-center items-center max-w-full">
-          <p id='get-started-paragraph' className="text-xl text-gray-700 dark:text-gray-200 mb-4">
-            Experience the power of Smart Retrieval today!
-          </p>
-          <Link href="/chat" onClick={() => { setIsLoading(true); }}>
-            <div className="flex text-center items-center text-xl bg-blue-500 text-white px-6 py-3 rounded-md font-bold transition duration-300 ease-in-out transform hover:scale-125">
-              {isLoading ? (
-                <IconSpinner className="mr-2 animate-spin" />
-              ) : null}
-              Get Started
-            </div>
-          </Link>
-        </div>
-      </div>
-    </div>
-  );
-}
+export default Home;

frontend/example.env

@@ -1,3 +1,7 @@
+# Google Search Console HTML Tag Verification
+# Select URL prefix property type and copy the string of characters from the HTML tag section
+GSC_TAG_VERIFICATION=string-of-characters-from-Google-Search-Console
+
 # AUTH URL (set to canonical URL of your app in production e.g. https://www.example.com)
 NEXTAUTH_URL=http://localhost:3000
 
@@ -23,4 +27,14 @@ SGID_CLIENT_SECRET=sgid-client-secret
 
 # Chat API Endpoint (where the backend is running)
 # (set to canonical URL of your app in production e.g. https://www.example.com)
-CHAT_API=http://localhost:8000/api/chat
+NEXT_PUBLIC_CHAT_API=http://127.0.0.1:8000/api/chat
+# Query API Endpoint (where the backend is running)
+# (set to canonical URL of your app in production e.g. https://www.example.com)
+NEXT_PUBLIC_QUERY_API=http://127.0.0.1:8000/api/query
+# Search API Endpoint (where the backend is running)
+# (set to canonical URL of your app in production e.g. https://www.example.com)
+NEXT_PUBLIC_SEARCH_API=http://127.0.0.1:8000/api/search
+# Healthcheck API Endpoint (where the backend is running)
+# (set to canonical URL of your app in production e.g. https://www.example.com)
+NEXT_PUBLIC_HEALTHCHECK_API=http://127.0.0.1:8000/api/healthcheck
+