Plotter_App/README.md

# Setting up

## Step 1:
### Backend setup
* Use __"cd Quote_Manager_server"__
    * to open server folder.
* Use __"python3 -m venv env_name" or "python -m venv env_name"__ 
    * to create environment.
* Use __(bash) "source env_name/bin/activate" or (cmd) "env_name\Scripts\activate.bat"__ to 
    * activate environment.
* Use __"pip install -r requirements.txt"__ to install needed libraries
* Use __"uvicorn api_main:app --reload"__ to start app 
    * or __"uvicorn api_main:app --reload --port (enter port number)"__ only if you want to use a 
    * different port from 8000.
## All contents are in the root folder.

## Step 2:
### Frontend Setup
* Use __"cd quote_plotter_client"__ to open vite folder.
* Use __"npm install"__ to install all dependencies.
* use __"npm run dev"__ to start app.

## Editable contents are in:
```
src/components/(chartComponents.tsx, dropDownComponents.tsx, tableComponents.tsx(only if needed, else delete)),
src/context(querycontent.tsx),
src/QueryOptions(apiQueryOptions.tsx, dataTypes.tsx).
```

### How to upload quote to the database

* Step 1: Open the server folder source, create the /archives file as in the image below.
![alt text](readmeimg/5.png) 
* Step 2: After creating the archives folder, paste your zip files containing the quotes to be ingested inside the 
* /archives folder, as in the image below.
![alt text](readmeimg/6.png) 
* Step 3: The format for each quotes file should be as in the example file below, this is just a test file as directed to use a * * test file for configuring. If a real sample file available for use, drop it and i will reconfigure the pipeline to the format.
![alt text](readmeimg/7.png) 
* Step 4: On the command interface, navigate to the server folder ((venv) samman@samman:~/Documents/My_CodeBase/Quote_Plotter_App/* Quote_Manager_server$) this is my example CI, might be diffferent on a windows. check the image below for example.
* Then run the code "python3 batch_ingest.py" to activate the ingestion.
![alt text](readmeimg/8.png) 
* Step 5: You get a success message on CI.
* INFO:quote_db:Quotes inserted successfully for session 20_test2 (2004 quotes)
* INFO:ingest:Ingestion completed for archive file: 02.07.2025_10.07.2025
* Ignore "Skipping empty row: {'Ts': '', 'Bid': '', 'Ask': '', 'Type': ''}" error for now. it ingests the quotes nonetheless,
* though i am working on clearing the error which i think stems from me editing the original excel file in other to add the type 
* column.
![alt text](readmeimg/9.png)

* Note: confirm that the excel file format is same as in the example. CHeck excel file ? Same format : send sample to reconfigure.

### How to run the Application

* Step 1: Run the apps (front end and backend)
![alt text](readmeimg/1.png)
* Step 2: This image shows the prompt to start the backend app
![alt text](readmeimg/2.png) 
* Step 3: This image shows the prompt to start the frontend app, then follow the link http://127.0.0.1:8000 to open in browser
![alt text](readmeimg/3.png) 
* Step 3: This is the initial view for the app on your browser
![alt text](readmeimg/4.png)
* Step 4: This is the chart view after selecting brokers and symbols