update frontend structure

.github/workflows/maven.yml

@@ -28,8 +28,7 @@ jobs:
         distribution: 'temurin'
         cache: maven
     - name: Build with Maven
-      run: mvn -B package --file pom.xml
+      run: mvn -B clean compile --file pom.xml
+    - name: Test with Maven
+      run: mvn -B test --file pom.xml
 
-    # Optional: Uploads the full dependency graph to GitHub to improve the quality of Dependabot alerts this repository can receive
-    - name: Update dependency graph
-      uses: advanced-security/maven-dependency-submission-action@571e99aab1055c2e71a1e2309b9691de18d6b7d6

.gitignore

@@ -1,2 +1,4 @@
-backend/target
+target
 backend/.idea
+.idea
+

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 Gerard Chaba, Vladislavs Kirilovics, Zixuan Zhu, Mohammed Elzobair Eltayeb, Weifan Liu
+Copyright (c) 2024 Gerard Chaba, Vladislavs Kirilovics, Zixuan Zhu, Mohammed Elzobair Eltayeb, Weifan Liu, Siyuan Zhang 
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -7,6 +7,7 @@
 - [Project Structure](#project-structure)
 - [Tech Stack](#tech-stack)
 - [User Instructions](#user-instructions)
+- [Chatbot Interaction Flow](#chatbot-interaction-flow)
 - [Developer Instructions](#developer-instructions)
 - [Team Members](#team-members)
 
@@ -83,17 +84,29 @@ As a university student, I want the AI chatbot to explain course concepts and fo
 ## Project Structure:
 Below is an overview of the key components of the system:
 
-- docs: Contains all project-related documentation. Notable files include:
-  - ETHICS.md
-- LICENSE: Includes the project's MIT license file.
+- [workflows](/.github/workflows): Contains Maven Continuous Integration.
+- [docs](/docs): Contains all project-related documentation. Notable files include:
+  - [ETHICS.md](/docs/ETHICS.md): Includes the date of the ethics pre-approval request.
+  - All diagrams/flowcharts.
+- [frontend](/frontend): Contains all of the front-end code (in Vue 3 and Yarn) and documents (not used in the MVP stage):
+  - [api](/frontend/api): Includes the cookies API.
+  - [public](/frontend/public): Includes some front-end documents.
+  - [src](/frontend/src): Includes the front-end code.
+- [src](/src): Contains all of the back-end code (in Java) and documents:
+  - [main](/src/main): Includes the back-end code.
+  - [static](/src/main/resources/static): Includes all static documents, including index.html of the front-end.
+  - [test/java/com/UoB/AILearningTool](/src/test/java/com/UoB/AILearningTool): Includes all of the unit tests. 
+- [LICENSE](/LICENSE): Includes the project's MIT license file.
+- [mvnw](/mvnw) and [pom.xml](/pom.xml): Documents for Maven.
 
 ## Tech Stack:
 ### Frontend
-The frontend is a JavaScript Vue 3-based web application. It makes requests to the backend using HTTP requests.
+The front end is a JavaScript Vue 3-based web application. It makes requests to the backend using HTTP requests.
 ### Backend
 The backend is based on Spring Boot (open-source Java framework).
 Data will be stored in a MariaDB database.
-User prompts for the chatbot will be sent using API requests from the Spring Boot backend to the IBM Watsonx language model.\
+User prompts for the chatbot will be sent using API requests from the Spring Boot backend to the IBM Watsonx language model.
+
 ![Architecture diagram, showing the technologies used in the project.](/docs/architecture_diagram.png)
 
 ## User Instructions:
@@ -134,6 +147,12 @@ User prompts for the chatbot will be sent using API requests from the Spring Boo
 
    If you accepted the optional cookies, your conversation history will be saved for 30 days. You can return to the web app at any time within that period to continue where you left off or ask follow-up questions based on previous conversations.
 
+## Chatbot Interaction Flow:
+
+This flowchart outlines the interaction pathways within the chatbot, guiding users through key topics such as SkillsBuild courses, university life questions, and IBM SkillsBuild platform information. Each pathway details the chatbot's prompts, and user responses, providing an overview of the chatbot’s functionality.
+
+![watson_flow](/docs/watson_flow.png)
+
 ## Developer Instructions:
 To get started with developing or contributing to this project, follow the steps below:
 
@@ -151,12 +170,25 @@ To get started with developing or contributing to this project, follow the steps
 4. **Install Maven**:
    This project uses Maven as the build automation tool. If you don't have Maven installed, download the latest stable release [here](https://maven.apache.org/download.cgi).
 
+5. **Install Vue and Yarn**:
+   The front end of this project is built using Vue 3 and Yarn, so make sure you have them installed: 
+   - Vue 3 installation guide [here](https://v3.ru.vuejs.org/guide/installation.html)
+   - Yarn installation guide [here](https://classic.yarnpkg.com/lang/en/docs/install/#windows-stable)
+
 6. **Open the Project in Your IDE**:
    Open the cloned repository in your preferred Integrated Development Environment (IDE) (we recommend IntelliJ) for further development.
 
+7. **Test and Run the Server**:
+   - To run the unit tests, use the command ```mvn test```
+   - To start the server, use the command ```mvn spring-boot:run```
+
 ## Team Members:
-Vlad Kirlovics (fi23561) \
-Gerard Chaba (tl23383) \
-Mohammed Elzobair (yi23484) \
-Weifan Liu (au22116) \
-Zixuan Zhu (kh23199) 
+
+| Name              | GitHub                                                      						| Email                 |
+|-------------------|-----------------------------------------------------------------------------------------------------------|-----------------------|                           
+| Vlad Kirilovics   | [vladislav-k1](https://github.com/vladislav-k1) and [kirilovich-vlad](https://github.com/kirilovich-vlad) | fi23561@bristol.ac.uk |
+| Gerard Chaba      | [GerardChabaBristol](https://github.com/GerardChabaBristol) 						| tl23383@bristol.ac.uk |  
+| Mohammed Elzobair | [yi23484](https://github.com/yi23484)	                  						| yi23484@bristol.ac.uk | 
+| Weifan Liu 	    | [Liuwf4319](https://github.com/Liuwf4319)		          						| au22116@bristol.ac.uk |
+| Zixuan Zhu 	    | [RainBOY-ZZX](https://github.com/RainBOY-ZZX)	          						| kh23199@bristol.ac.uk | 
+| Siyuan Zhang 	    | [Siyuan106](https://github.com/Siyuan106)		          						| gr23994@bristol.ac.uk |

docs/backendHTTPMethods.drawio

@@ -0,0 +1,67 @@
+<mxfile host="app.diagrams.net" agent="Mozilla/5.0 (X11; Linux x86_64; rv:132.0) Gecko/20100101 Firefox/132.0" version="24.8.4">
+  <diagram name="Page-1" id="D5iIy3KWxEPgB1KizNsA">
+    <mxGraphModel dx="1468" dy="892" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
+      <root>
+        <mxCell id="0" />
+        <mxCell id="1" parent="0" />
+        <mxCell id="2koVdJtbBCh85IIp-lrr-1" value="&lt;font style=&quot;font-size: 15px;&quot;&gt;GET /signup&lt;font&gt;&lt;br&gt;&lt;/font&gt;&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="74" y="375" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-2" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;optionalConsent cookie&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="74" y="415" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-5" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;userID cookie&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="74" y="495" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-6" value="&lt;font size=&quot;3&quot;&gt;GET /revokeConsent&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="314" y="375" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-7" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;optionalConsent cookie&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="314" y="415" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-8" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;userID cookie&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="314" y="495" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-9" value="&lt;font size=&quot;3&quot;&gt;GET /createChat&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="554" y="375" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-10" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;userID cookie&lt;/div&gt;&lt;div&gt;initialMessage string&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="554" y="415" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-11" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;chatID text/plain&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="554" y="495" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-12" value="&lt;font size=&quot;3&quot;&gt;GET /sendMessage&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="74" y="655" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-13" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;userID cookie&lt;/div&gt;&lt;div&gt;newMessage string&lt;/div&gt;&lt;div&gt;chatID string&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="74" y="695" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-14" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;responseText text/plain&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="74" y="775" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-15" value="&lt;font style=&quot;font-size: 14px;&quot;&gt;GET /sendIncognitoMessage&lt;br&gt;&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="314" y="655" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-16" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;userID cookie&lt;/div&gt;&lt;div&gt;inputString string&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="314" y="695" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-17" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;responseText text/plain&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="314" y="775" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-18" value="&lt;font style=&quot;font-size: 14px;&quot;&gt;GET /getChatHistory&lt;br&gt;&lt;/font&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fontSize=24;fillColor=#E6E6E6;" vertex="1" parent="1">
+          <mxGeometry x="554" y="655" width="200" height="40" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-19" value="&lt;div&gt;Receives:&lt;/div&gt;&lt;div&gt;userID cookie&lt;/div&gt;&lt;div&gt;chatID string&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="554" y="695" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-20" value="&lt;div&gt;Returns:&lt;/div&gt;&lt;div&gt;responseText text/plain&lt;br&gt;&lt;/div&gt;" style="rounded=0;whiteSpace=wrap;html=1;strokeWidth=3;fillColor=#E6E6E6;fontSize=15;" vertex="1" parent="1">
+          <mxGeometry x="554" y="775" width="200" height="80" as="geometry" />
+        </mxCell>
+        <mxCell id="2koVdJtbBCh85IIp-lrr-21" value="&lt;font style=&quot;font-size: 32px;&quot;&gt;Backend HTTP methods&lt;br&gt;&lt;/font&gt;" style="text;html=1;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;" vertex="1" parent="1">
+          <mxGeometry x="240" y="210" width="360" height="30" as="geometry" />
+        </mxCell>
+      </root>
+    </mxGraphModel>
+  </diagram>
+</mxfile>

docs/pull_request_template.md

@@ -0,0 +1,18 @@
+### Issue(s):
+#issueNumber
+
+### Type of change: (choose required ones)
+- Bug fix
+- New feature
+- Breaking change
+- Documentation update
+- Refactor/Optimization
+
+### Description:
+One or more sentences of description.
+
+### Additional context:
+Some additional, important things about the code (eg. the code contains a temporary solution that will soon be refactored).
+
+### Testing instructions:
+Commands and other guidance on how to test your new code.