## Inspiration

A cultural obsession with cute animal videos and fluffy creatures doing human things drastically contrasts with the amount of irresponsible pet ownership, animal rights violations, and significant populations of abandoned pets in American cities. As we head into a future with an widening wealth gap, it becomes increasingly apparent that responsible ownership of living creatures is a privilege for those who already have their necessities met and possess the financial bandwidth to care and provide - and to LEARN how to care and provide - for a furry dependent. If that wasn't bad enough, there is a pandemic of loneliness that is hitting people all over the world due to poor work life balance, urbanization creating smaller and smaller living spaces, and advancing technology that is distancing us from even the people next to us. That's where Petsi comes in - a way to connect people with the professionals with the know-how in an innovative way. Petsi is meant for people who are interested in a caring for an animal companion and want to connect with the professionals that are looking to home animals that are in need of love and safety. However, its not an easy process since people are imperfect and pet ownership is a big commitment, not to mention picky potential owners.

## What it does

Petsi is a React multi-page webapp that securely logs you in after the landing page and takes you to available animals in the form of swipe cards that you can swipe through. Then once you find a potential pet and swipe right, Petsi sends you to the decentralized chat app portion of the site to communicate your interest in your chosen animal and learn about the adoption and ownership process with a partnered rescue or shelter. People can use Petsi to quickly navigate through available animals in need of a home and learn about what it takes to make them apart of the family in an accessible, less time-consuming, and less intimidating platform. Petsi a way to adopt for the next generation of pet owners.

## How we built it

We used JavaScript, Next.js, React, Chakra UI, Auth0, IPFS, and CSS to design, build, and serve Petsi.

## Challenges we ran into

For the entire team, we had to learn what a decentralized app is and how it works, build one that works, and finally deploy a chat app within a React app. Additionally, React and creating authentication was brand new to many members. Half of our team was international which required adapting ourselves to different time zones.

## Accomplishments that we're proud of

We are proud that we came together as a group of strangers and were able to learn new technologies, make new friends across cultures and distance, and create an awesome project that has the potential to impact society positively and bring society closer together.

## What we learned

We learned how to design a multi-page web app using React and implement interactive features. Utilizing JavaScript, HTML, CSS, and React, we were able learn how to design a customize web applications that are easy and intuitive to use. Additionally, we learned how to incorporate a IPFS to connect users of our web app to places that have the knowledge, the professionals and the animals they are looking for. Lastly, we learned how to capitalize on Auth0 to create an easy way for people to log into our app with their preexisting email.

## What's next for Petsi

So, we've made a drop in the bucket in addressing the crisis of abandoned animals across the nation. Doomed to suffering fates, unsightly and dangerous to our health and our communities, and a financial burden to people and to local government, that frankly, is difficult to take on when there are what seem like more pressing issues everywhere. So the next step for Petsi would be to add a two pronged revenue producing plan to the existing app. The first would be monetize the app with Coil and replace images of animals with a quick video of that animal so as to keep the attention of the perusing viewer that perhaps isn't ready to go through with a connection, but the time they spend on the site with help the medical, training, and maintenance expenses of these animals. Contingent on the cooperation of animal rescues and animal protection agencies, a booking and appointments feature would be added to Petsi to allow for the leasing services of furry companions on a sliding scale. This would fill the void in market of single, young professionals or financially strained families or lonely people who are all seeking that endorphin rush that comes from a furry member of the family but aren't in a position to make a lifelong commitment. By reducing the barriers to adoption, reducing the costs of animal care and maintenance, and striving to make a self-sustaining model, we would want Petsi to help alleviate animal suffering and human mental health struggles well into the future.
# Pawsome: Revolutionizing Pet Health and Fitness

Welcome to Pawsome, the cutting-edge platform dedicated to enhancing the health and fitness of our beloved pets. Combining a deep love for pets with the latest in technology, we provide personalized wellness plans to ensure every pet gets the care they deserve.

![treehacks](https://github.com/mounika2000/Treehacks/assets/46564084/c19b5611-30e6-4406-ad5e-2436f4ea7ebc)

## About Pawsome

Pawsome isn't just a project—it's a mission to ensure the well-being of pets worldwide. Our platform offers tools and resources for pet owners to maintain and improve their pet's health and fitness, featuring interactive consultations and tailored fitness schedules.

### Our Vision

We envision a world where every pet enjoys a happy, healthy life. Our goal is to prioritize pets' health and wellness, offering accessible, reliable solutions for their care.

## Technology Stack

To deliver a seamless, efficient user experience, Pawsome leverages a comprehensive and robust stack:

* **Frontend**:

	+ React: A JavaScript library for building user interfaces.
	+ Next.js: A React framework for production; it makes building scalable applications easier.
	+ JavaScript: A programming language that allows you to implement complex features on web pages.
	+ TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
	+ HTML: The standard markup language for documents designed to be displayed in a web browser.
	+ CSS: The language used to describe the presentation of a document written in HTML.
	+ Tailwind CSS: A utility-first CSS framework for rapidly building custom designs.
* **Backend**:

	+ Flask: A micro web framework written in Python.
	+ Python: A programming language that lets you work quickly and integrate systems more effectively.
* **Integrations**:

	+ Fetch.ai: An artificial intelligence lab working on creating a decentralized digital world.

Agent 1 Using Fetch AI

* ![treehacks](https://github.com/mounika2000/Treehacks/assets/55689594/0769a85a-7da7-460c-bd24-6736047d5f68)

Agent 2 Using Fetch AI

* ![treehacks](https://github.com/mounika2000/Treehacks/assets/55689594/f724cd3f-a713-48fd-9ec7-25ca500fce49)

Agent 3 Using Fetch AI

* ![treehacks](https://github.com/mounika2000/Treehacks/assets/55689594/c535ea0f-8f59-4ba3-bbeb-d32cbd1ceca1)
* Together.ai: A platform that provides AI-based solutions.
* Postman: An API platform for building and using APIs. Postman simplifies each step of the API lifecycle and streamlines collaboration.
* Bun: Bun is an all-in-one JavaScript runtime & toolkit designed for speed, complete with a bundler, test runner, and Node.js-compatible package manager. It served as a JavaScript runtime optimizer for our project.

These technologies are carefully chosen to ensure that Pawsome is not only cutting-edge but also robust and scalable, catering to the dynamic needs of pet owners and their beloved pets.

This tech combination enables dynamic, responsive interactions and complex data processing across our platform.

## Features

### Interactive Pet Wellness AI

Pawsome features a chat button for users to interact with our pet wellness AI. Depending on user needs, it offers appointment booking, medicine orders, or grooming session scheduling.

![treehacks](https://github.com/mounika2000/Treehacks/assets/46564084/cad4921e-dbcd-44d5-b118-6055161ae889)

### Customized Fitness Center

Our Fitness Center allows pet owners to input details like breed, weight, and health, creating a custom fitness plan tailored to their pet's needs, and promoting a holistic wellness approach.

### Custom Push Notifications

To ensure pets and their owners stay on track with their wellness routines, Pawsome sends custom push notifications via email, reminding users of upcoming activities and schedules.

## Future Enhancements

We're committed to continuously improving Pawsome with several key initiatives:

* **Data-Driven Personalization**: By gathering more data, we aim to make even more personalized recommendations, enhancing the effectiveness of wellness plans.
* **E-commerce Platform**: Developing a one-stop destination for all pet needs, from food to toys, ensuring pet owners have access to high-quality products.
* **Network of Veterinarians**: Establishing a network of doctors available for consultations and emergencies, providing peace of mind for pet owners.

## Getting Started

1. Clone repo
`git clone https://github.com/mounika2000/treehacks.git
cd Treehacks
yarn`
2. Install dependencies

`npm install`

3.Then, you can run locally in development mode with live reload:
`yarn dev`

## Contributing

Contributions are welcome! Whether you're a developer, designer, or pet wellness enthusiast, there are many ways to contribute to Pawsome. Please see our contributing guidelines for more details.

## Contact Us

Sai Mounika Peteti: [saimounika.peteti@sjsu.edu](mailto:saimounika.peteti@sjsu.edu)

Chinmay Nilesh Mahagaonkar: [chinmaynilesh.mahagaonkar@sjsu.edu](mailto:chinmaynilesh.mahagaonkar@sjsu.edu)

Sanket Kulkarni: [sanket.kulkarni@sjsu.edu](mailto:sanket.kulkarni@sjsu.edu)

Tanay Godse: [tanay.godse@sjsu.edu](mailto:tanay.godse@sjsu.edu)
## Inspiration

According to the Toronto Animal Services (TAS), the number of pets in Toronto pet shelters has risen by **75%** this year compared to last year (Wilson, 2022). As dog enthusiasts ourselves, it is quite difficult to select a breed to adopt because there are countless to choose from. Therefore, we created Adopt A Dog, a webpage that allows users to select the perfect canine to become their new fuzzy best friend!

Source: [link](https://toronto.ctvnews.ca/pets-surrendered-to-toronto-shelters-up-75-per-cent-from-last-year-due-to-return-to-office-rising-costs-1.5974531)

## What it does

Adopt A Dog scours the database from Dog.ceo [link](https://dog.ceo/dog-api/about) to display up to one hundred random images of dogs to encourage pet lovers to adopt a certain breed. Users are able to "like" and "dislike" each photo and with each selection, Adopt A Dog will store this information and **dynamically recommend photos** based on the user's preference. Each dog photo will contain the specific breed of that dog. For example, if a user likes a certain photo, that certain breed of dog will be more likely to show up in consecutive photos and vice versa. After the user has judged at least ten dogs, Adopt A Dog will **generate a report** of all photos that the user liked, the breed of each dog, and its like to dislike ratio. This information encourages the user to adopt their most liked breed, with links to pet shelters provided by the website.

## How we built it

To give us maximum flexibility and customizability we used **Webpack** as the bundler for our project. The majority of our actual code base was built using **React**. For the UI, we used **MaterialUI** to speed up our design process. Furthermore, we also used **REST APIs** to fetch dog images that we can display to users. Lastly, for the rendering/routing we wanted to try out and learn client-side rendering/routing and we used **React Router** for this.

## Challenges we ran into

Overall, the entire project was a challenge as the majority of our team had **little to no experience** with React. Furthermore, the only person who had previously worked with React had never worked with either React Router or MaterialUI.

In terms of specific challenges, one challenge we faced was determining how we could determine which breed was the most suitable pick for the user. Since the dataset we used had more than a hundred breeds of dogs, we had to keep a tally of each breed that the user preferred, and ultimately recommend them a breed to adopt based on their decisions.

Also, one factor that we had to consider was recommending different breeds of dogs to the user depending on their choices. For example, if the user disliked one breed, it would be counter-intuitive to continue recommending those breeds to them. The same logic applies to those who liked certain breeds as they are more likely to show up in the next images they selected. In the end, we developed a custom probability model to suggest certain types of breeds for the user depending on their dog preferences to enhance the user experience.

## Accomplishments that we're proud of

We successfully displayed a summary page that included the photo of each dog that the user liked, the dog's breed, and its "like" percentage.

We created a responsive user interface that utilized REST API calls to fetch images from an external source and implemented it into our application using new technologies and frameworks of React and MaterialUI.

We successfully implemented **Client Side Routing (CSR)** with React Router which allows users to navigate through our webpage without any issues.

## What we learned

Since all members of the group were novices at using React, MaterialUI and React Router, this was a huge leap in terms of learning these frameworks and technologies. The fact that we were able to utilize API calling and storing that information was also a new and challenging experience for all. Learning how to design an aesthetically pleasing and responsive website with MaterialUI and React Router (with Client Side Routing and Rendering) was crucial in allowing the user to smoothly interact with our application and effectively displaying the processed information based on the user's preferences.

## What's next for Adopt A Dog

* Implement a DataBase to store user preferences
* Develop a Mobile App version with React Native
* Develop AI Algorithms/Model to give users the best recommendations
* Link to a Map API to locate the nearest animal shelter to promote animal adoption
* Link to PetFinder API to give users the best chance to find their preferred breed of dog
* Utilize user information to show relevant facts depending on the most liked breed of dog
* Increase the number of stats for each dog, e.g. the cost to adopt and raise each breed
* Improve the aesthetics of the website