Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue #22 Added Favicon and Loading Splash Screen #32

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Issue #22 Added Favicon and Loading Splash Screen #32

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion ayurveda/public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/ayurveda/public/ayurveda-gpt-favicon-color.png" />
<link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet">
<link rel="icon" href="ayurveda-gpt-high-resolution-logo-transparent.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="AyurGenius - Your Ayurvedic Companion" />
Expand Down
17 changes: 15 additions & 2 deletions ayurveda/src/components/About.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,21 @@
import React from 'react';
import React, { useEffect, useState } from 'react';
import '../App.css';
import Loading from './Loading';

const About = () => {
return (
const [loading, setLoading] = useState(true);//added check for page loaded

useEffect(() => {//loading functionality with timeout to ensure it happens smoothly and in sync
const timeout = setTimeout(() => {
setLoading(false);
}, 300);

return () => clearTimeout(timeout);
}, []);

return loading ? (
<Loading />
) : (
<div className="about-section">
<h1>About Us</h1>
<p>
Expand Down
160 changes: 87 additions & 73 deletions ayurveda/src/components/AyurvedaBooks.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,79 +1,93 @@
import React from "react";
import React, { useEffect, useState } from "react";
import styles from "../styles/App.module.css";
import Loading from './Loading';

function AyurvedaBooks() {
const data = [
{
title: "The Ayurvedic Pharmacopoeia Of INDIA",
author: "Ministry of Family Health And Welfare ,New Delhi",
img: "book1.png",
description:
"Though Ayurveda has under gone many changes in the course of its long history, it still remains the mainstay of medical relief to a large section of population of the nation. Due to urbanization and dwindling of forests, the Vaidya by and large is no longer a self contained unit collecting and preparing his own medicines as before.",
link: "https://drive.google.com/file/d/1Nt1DNaKjI214ml918b2hrHbYoCrj4dog/view?usp=sharing",
},
{
title: "Materia Medica of Ayurveda",
author: "Vaidhya Bhagwan Dash",
img: "book2.png",
description:
"This book explains the Every details of Ayurveda in 20 different chapters written by Vaidhya Bhagwan Dash available in English ",
link: "https://drive.google.com/file/d/1CzHx_IvvNJup6NImp7VqKupbvY4Ctzai/view?usp=sharing",
},
{
title: "Ayurveda Ancient Wisdom for a Modern Lifestyle ",
author: "Dr. Suhas Kshirsagar",
img: "book3.png",
description:
"In this Book, we’ll delve into the principles of Ayurveda, a Sanskrit word that translates to “the science of life.” We’ll also look at imbalances in the body/mind/spirit and how to use natural methods to gently move them back into balance..",
link: "https://drive.google.com/file/d/1zN84MeER-BQITMvgP-pDyXLlUXsah3Oz/view?usp=sharing",
},
{
title: "Classical Ayurvedic Prescriptions For Common Diseases",
author: "Dr M.M Padhi",
img: "book4.png",
description:
"This hand book enriched with multiple prescription option from classical texts, which are freely available in the market being manufactured by various companies and easily adopted by general practitioners in rural and urban India",
link: "https://lib.iim.cmb.ac.lk/wp-content/uploads/2019/04/Classical-Ayurvedic-Prescriptions-for-common-diseases.pdf",
},
{
title: "Ayurvedic Science Of Food and Nutrition ",
author: " Sanjeev Rastogi ",
img: "book5.png",
description:
"For centuries Ayurveda has emphasized the role of food in health and disease. Modern medicine started out by basing all its treatments on drug-based principles and focused on specifi c problems rather than on individuals and the food they ate. This book satisfies a long-felt need of many physicians and nutritionists who were aware of the immense knowledge that existed but never knew how to access that information",
link: "https://lib.iim.cmb.ac.lk/wp-content/uploads/2019/04/Ayurvedic-Science-of-Food-and-Nutrition-PDFDrive.com-.pdf",
},
{
title: "Everyday Ayurveda ",
author: " Danny Cavanagh & Carol Willis",
img: "book6.png",
description:
"This book has been compiled to provide a practical help guide to those interested in following a healthy Ayurvedic lifestyle. With complementary therapies and esoteric philosophies becoming much more widely accepted and available in the west many people are interested in finding out more. ",
link: "https://www.ayurveda.uk.com/s/Ch-1-10-Everyday-Ayurveda-book.pdf",
},
];
return (
<div>
<div className={styles["books-container"]}>
{data.map((book) => (
<div className={styles["book-container"]}>
<div>
<h1>{book.title}</h1>
<img src={book.img} alt="book" width={100} height={100} />
<h2>Author:{book.author}</h2>
<p>{book.description}</p>
</div>
<div>
<button className={styles["book-button"]}>
<a href={book.link} target="_blank" rel="noreferrer">
Explore
</a>
</button>
const [loading, setLoading] = useState(true);
const data = [
{
title: "The Ayurvedic Pharmacopoeia Of INDIA",
author: "Ministry of Family Health And Welfare, New Delhi",
img: "book1.png",
description:
"Though Ayurveda has undergone many changes in the course of its long history, it still remains the mainstay of medical relief to a large section of the population of the nation. Due to urbanization and dwindling of forests, the Vaidya by and large is no longer a self-contained unit collecting and preparing his own medicines as before.",
link: "https://drive.google.com/file/d/1Nt1DNaKjI214ml918b2hrHbYoCrj4dog/view?usp=sharing",
},
{
title: "Materia Medica of Ayurveda",
author: "Vaidhya Bhagwan Dash",
img: "book2.png",
description:
"This book explains every detail of Ayurveda in 20 different chapters written by Vaidhya Bhagwan Dash available in English.",
link: "https://drive.google.com/file/d/1CzHx_IvvNJup6NImp7VqKupbvY4Ctzai/view?usp=sharing",
},
{
title: "Ayurveda Ancient Wisdom for a Modern Lifestyle",
author: "Dr. Suhas Kshirsagar",
img: "book3.png",
description:
"In this book, we’ll delve into the principles of Ayurveda, a Sanskrit word that translates to 'the science of life.' We’ll also look at imbalances in the body/mind/spirit and how to use natural methods to gently move them back into balance.",
link: "https://drive.google.com/file/d/1zN84MeER-BQITMvgP-pDyXLlUXsah3Oz/view?usp=sharing",
},
{
title: "Classical Ayurvedic Prescriptions For Common Diseases",
author: "Dr. M.M Padhi",
img: "book4.png",
description:
"This handbook is enriched with multiple prescription options from classical texts, which are freely available in the market being manufactured by various companies and easily adopted by general practitioners in rural and urban India.",
link: "https://lib.iim.cmb.ac.lk/wp-content/uploads/2019/04/Classical-Ayurvedic-Prescriptions-for-common-diseases.pdf",
},
{
title: "Ayurvedic Science Of Food and Nutrition",
author: "Sanjeev Rastogi",
img: "book5.png",
description:
"For centuries, Ayurveda has emphasized the role of food in health and disease. Modern medicine started out by basing all its treatments on drug-based principles and focused on specific problems rather than on individuals and the food they ate. This book satisfies a long-felt need of many physicians and nutritionists who were aware of the immense knowledge that existed but never knew how to access that information.",
link: "https://lib.iim.cmb.ac.lk/wp-content/uploads/2019/04/Ayurvedic-Science-of-Food-and-Nutrition-PDFDrive.com-.pdf",
},
{
title: "Everyday Ayurveda",
author: "Danny Cavanagh & Carol Willis",
img: "book6.png",
description:
"This book has been compiled to provide a practical help guide to those interested in following a healthy Ayurvedic lifestyle. With complementary therapies and esoteric philosophies becoming much more widely accepted and available in the west, many people are interested in finding out more.",
link: "https://www.ayurveda.uk.com/s/Ch-1-10-Everyday-Ayurveda-book.pdf",
},
];

useEffect(() => {//loading functionality
const timeout = setTimeout(() => {
setLoading(false);
}, 300);

return () => clearTimeout(timeout);
}, []);

return loading ? (
<Loading />
) : (
<div>
<div className={styles["books-container"]}>
{data.map((book, index) => (
<div key={index} className={styles["book-container"]}>
<div>
<h1>{book.title}</h1>
<img src={book.img} alt="book" width={100} height={100} />
<h2>Author: {book.author}</h2>
<p>{book.description}</p>
</div>
<div>
<button className={styles["book-button"]}>
<a href={book.link} target="_blank" rel="noreferrer">
Explore
</a>
</button>
</div>
</div>
))}
</div>
</div>
))}
</div>
</div>
);
</div>
);
}

export default AyurvedaBooks;
95 changes: 49 additions & 46 deletions ayurveda/src/components/ChatScreen.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,91 +1,94 @@
import React, { useState } from 'react';
import { Link } from 'react-router-dom';
import axios from 'axios';
import React, { useEffect, useState } from 'react';
import { Link, useLocation } from 'react-router-dom';
import styles from '../styles/ChatScreen.module.css';
import Loading from './Loading';

const ChatScreen = () => {
const [messages, setMessages] = useState([]);
const [newMessage, setNewMessage] = useState('');
const [loading, setLoading] = useState(false);
const [isload, setIsload]=useState(false);
const location = useLocation();

useEffect(() => {//loading functionality, differently named so as to avoid clashes with loading of GPT response
setIsload(true);
const timeout = setTimeout(() => setIsload(false), 300);
return () => clearTimeout(timeout);
}, [location]);

const handleSendMessage = async () => {
if (newMessage.trim() === '') return;

// Add user's message to the chat
const updatedMessages = [...messages, { text: newMessage, sender: 'user' }];
setMessages(updatedMessages);
setNewMessage(''); // Clear input after sending
setNewMessage('');

// Call OpenAI API to get GPT response
await getGPTResponse(newMessage);
};

const getGPTResponse = async (userMessage) => {
setLoading(true); // Show loading while waiting for response
setLoading(true);

try {
const response = await axios.post(
'https://api.openai.com/v1/chat/completions',
{
model: 'gpt-3.5-turbo',
messages: [
{ role: 'system', content: 'You are a helpful assistant.' },
{ role: 'user', content: userMessage }
],
max_tokens: 150,
'https://api.openai.com/v1/chat/completions',
{
model: 'gpt-3.5-turbo',
messages: [
{ role: 'system', content: 'You are a helpful assistant.' },
{ role: 'user', content: userMessage }
],
max_tokens: 150,
},
{
headers: {
'Authorization': `Bearer ${process.env.REACT_APP_OPENAI_API_KEY}`,
'Content-Type': 'application/json',
},
{
headers: {
'Authorization': `Bearer ${process.env.REACT_APP_OPENAI_API_KEY}`,
'Content-Type': 'application/json',
},
}
}
);


const gptMessage = response.data.choices[0].message.content;

// Add GPT response to chat
const newMessages = [...messages, { text: gptMessage, sender: 'gpt' }];
setMessages(newMessages);
} catch (error) {
console.error('Error fetching GPT response:', error);
// Handle error (optional)
} finally {
setLoading(false);
}
};


const handleKeyPress = (e) => {
if (e.key === 'Enter') {
handleSendMessage();
}
};

return (
<div className={styles['chat-screen']}>
<div className={styles['chat-messages']}>
{messages.map((msg, index) => (
<div key={index} className={msg.sender === 'user' ? styles['user-message'] : styles['gpt-message']}>
{msg.text}
</div>
))}
{loading && <div className={styles['loading']}>GPT is typing...</div>}
</div>
<div className={styles['chat-input']}>
<input
type="text"
value={newMessage}
onChange={(e) => setNewMessage(e.target.value)}
onKeyPress={handleKeyPress}
placeholder="Type your message..."
disabled={loading}
/>
<button onClick={handleSendMessage} disabled={loading}>Send</button>
<Link to="/">Back to Home</Link>
</div>
return (isload? <Loading /> :(
<div className={styles['chat-screen']}>
<div className={styles['chat-messages']}>
{messages.map((msg, index) => (
<div key={index} className={msg.sender === 'user' ? styles['user-message'] : styles['gpt-message']}>
{msg.text}
</div>
))}
{loading && <div className={styles['loading']}>GPT is typing...</div>}
</div>
<div className={styles['chat-input']}>
<input
type="text"
value={newMessage}
onChange={(e) => setNewMessage(e.target.value)}
onKeyPress={handleKeyPress}
placeholder="Type your message..."
disabled={loading}
/>
<button onClick={handleSendMessage} disabled={loading}>Send</button>
<Link to="/">Back to Home</Link>
</div>
</div>)
);
};

Expand Down
Loading