├── .DS_Store ├── .gitattributes ├── CODE_OF_CONDUCT.md ├── LICENSE ├── README.md ├── Server ├── .env ├── .vscode │ └── settings.json ├── controllers │ ├── friendsController.js │ ├── messageController.js │ └── userController.js ├── db.js ├── index.js ├── middleware │ └── cookieJwtAuth.js ├── model │ ├── messageModel.js │ ├── readme.md │ └── userModel.js ├── package-lock.json ├── package.json └── routes │ ├── friendsRoutes.js │ ├── messageRoutes.js │ └── userRoutes.js ├── client ├── .gitignore ├── .vscode │ └── settings.json ├── README.md ├── client.zip ├── package-lock.json ├── package.json ├── postcss.config.js ├── public │ ├── index.html │ └── manifest.json └── src │ ├── App.js │ ├── components │ ├── Friends │ │ ├── Friends.jsx │ │ ├── addFriends.jsx │ │ ├── blackbg.jpg │ │ └── style.css │ ├── Home │ │ ├── Home.jsx │ │ ├── bgimg.jpg │ │ └── style.css │ ├── Messages │ │ ├── Messages.jsx │ │ └── style.css │ └── NavBar │ │ ├── NavBar.css │ │ └── NavBar.jsx │ ├── firebase │ └── firebaseConfig.js │ ├── index.css │ ├── index.js │ ├── pages │ ├── Chat │ │ ├── Chat.jsx │ │ └── style.css │ ├── Login │ │ ├── Login.jsx │ │ ├── background_image.jpg │ │ ├── google-icon.png.png │ │ └── style.css │ └── Register │ │ ├── Register.jsx │ │ └── style.css │ └── utils │ └── APIRoutes.js ├── package-lock.json ├── package.json ├── postcss.config.js └── tailwind.config.js /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/.DS_Store -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | We as members, contributors, and leaders pledge to make participation in our 6 | community a harassment-free experience for everyone, regardless of age, body 7 | size, visible or invisible disability, ethnicity, sex characteristics, gender 8 | identity and expression, level of experience, education, socio-economic status, 9 | nationality, personal appearance, race, religion, or sexual identity 10 | and orientation. 11 | 12 | We pledge to act and interact in ways that contribute to an open, welcoming, 13 | diverse, inclusive, and healthy community. 14 | 15 | ## Our Standards 16 | 17 | Examples of behavior that contributes to a positive environment for our 18 | community include: 19 | 20 | * Demonstrating empathy and kindness toward other people 21 | * Being respectful of differing opinions, viewpoints, and experiences 22 | * Giving and gracefully accepting constructive feedback 23 | * Accepting responsibility and apologizing to those affected by our mistakes, 24 | and learning from the experience 25 | * Focusing on what is best not just for us as individuals, but for the 26 | overall community 27 | 28 | Examples of unacceptable behavior include: 29 | 30 | * The use of sexualized language or imagery, and sexual attention or 31 | advances of any kind 32 | * Trolling, insulting or derogatory comments, and personal or political attacks 33 | * Public or private harassment 34 | * Publishing others' private information, such as a physical or email 35 | address, without their explicit permission 36 | * Other conduct which could reasonably be considered inappropriate in a 37 | professional setting 38 | 39 | ## Enforcement Responsibilities 40 | 41 | Community leaders are responsible for clarifying and enforcing our standards of 42 | acceptable behavior and will take appropriate and fair corrective action in 43 | response to any behavior that they deem inappropriate, threatening, offensive, 44 | or harmful. 45 | 46 | Community leaders have the right and responsibility to remove, edit, or reject 47 | comments, commits, code, wiki edits, issues, and other contributions that are 48 | not aligned to this Code of Conduct, and will communicate reasons for moderation 49 | decisions when appropriate. 50 | 51 | ## Scope 52 | 53 | This Code of Conduct applies within all community spaces, and also applies when 54 | an individual is officially representing the community in public spaces. 55 | Examples of representing our community include using an official e-mail address, 56 | posting via an official social media account, or acting as an appointed 57 | representative at an online or offline event. 58 | 59 | ## Enforcement 60 | 61 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 62 | reported to the community leaders responsible for enforcement at 63 | ankitrout2903@gmail.com. 64 | All complaints will be reviewed and investigated promptly and fairly. 65 | 66 | All community leaders are obligated to respect the privacy and security of the 67 | reporter of any incident. 68 | 69 | ## Enforcement Guidelines 70 | 71 | Community leaders will follow these Community Impact Guidelines in determining 72 | the consequences for any action they deem in violation of this Code of Conduct: 73 | 74 | ### 1. Correction 75 | 76 | **Community Impact**: Use of inappropriate language or other behavior deemed 77 | unprofessional or unwelcome in the community. 78 | 79 | **Consequence**: A private, written warning from community leaders, providing 80 | clarity around the nature of the violation and an explanation of why the 81 | behavior was inappropriate. A public apology may be requested. 82 | 83 | ### 2. Warning 84 | 85 | **Community Impact**: A violation through a single incident or series 86 | of actions. 87 | 88 | **Consequence**: A warning with consequences for continued behavior. No 89 | interaction with the people involved, including unsolicited interaction with 90 | those enforcing the Code of Conduct, for a specified period of time. This 91 | includes avoiding interactions in community spaces as well as external channels 92 | like social media. Violating these terms may lead to a temporary or 93 | permanent ban. 94 | 95 | ### 3. Temporary Ban 96 | 97 | **Community Impact**: A serious violation of community standards, including 98 | sustained inappropriate behavior. 99 | 100 | **Consequence**: A temporary ban from any sort of interaction or public 101 | communication with the community for a specified period of time. No public or 102 | private interaction with the people involved, including unsolicited interaction 103 | with those enforcing the Code of Conduct, is allowed during this period. 104 | Violating these terms may lead to a permanent ban. 105 | 106 | ### 4. Permanent Ban 107 | 108 | **Community Impact**: Demonstrating a pattern of violation of community 109 | standards, including sustained inappropriate behavior, harassment of an 110 | individual, or aggression toward or disparagement of classes of individuals. 111 | 112 | **Consequence**: A permanent ban from any sort of public interaction within 113 | the community. 114 | 115 | ## Attribution 116 | 117 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], 118 | version 2.0, available at 119 | https://www.contributor-covenant.org/version/2/0/code_of_conduct.html. 120 | 121 | Community Impact Guidelines were inspired by [Mozilla's code of conduct 122 | enforcement ladder](https://github.com/mozilla/diversity). 123 | 124 | [homepage]: https://www.contributor-covenant.org 125 | 126 | For answers to common questions about this code of conduct, see the FAQ at 127 | https://www.contributor-covenant.org/faq. Translations are available at 128 | https://www.contributor-covenant.org/translations. 129 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 Ankit Rout 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

Swingyy: Real-Time Chat Application 🚀

2 |
3 | 4 | 5 | 6 |
7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 |
15 |
16 |
17 |

Swingyy is a robust chat application that enables real-time messaging between users. It comes with a range of features including user authentication, friends list management, and message status tracking.

18 |
19 | 20 | 21 | ## Table of Contents 📚 22 | 23 | - [Features](#features) 24 | - [Technologies](#technologies) 25 | - [Installation](#installation) 26 | - [Usage](#usage) 27 | - [Screenshots](#screenshots) 28 | - [License](#license) 29 | 30 | ## Features 🌟 31 | 32 | - **User Authentication**: Sign up, log in, and log out functionalities. 33 | - **Friends List**: View and manage your list of friends. 34 | - **Real-Time Messaging**: Send and receive messages instantly. 35 | - **Message Status**: Mark messages as seen or unseen. 36 | - **User Status**: Monitor the online/offline status of friends. 37 | - **Profile Management**: Upload and display your profile picture. 38 | 39 | ## Technologies 💻 40 | 41 | ### Frontend 42 | 43 | - React 44 | - React Router 45 | - Axios 46 | - Socket.IO Client 47 | 48 | ### Backend 49 | 50 | - Node.js 51 | - Express.js 52 | - MySQL 53 | - Socket.IO 54 | - Docker 55 | 56 | ### Styling 🎨 57 | 58 | - CSS 59 | 60 | ### Cloud Services (Google Cloud Platform) ☁️ 61 | 62 | - Cloud Build: CI/CD pipeline 63 | - Cloud Run: Serverless deployment 64 | - Cloud SQL: MySQL database 65 | - Firebase: Google Authentication 66 | - Artifact Registry: Docker container registry 67 | - Cloud Storage: File storage 68 | - Docker 🐳 69 | 70 | ## Installation 71 | 72 | 1. **Clone the Repository** 73 | 74 | ```bash 75 | git clone https://github.com/your-username/Swingyy.git 76 | ``` 77 | 78 | 2. **Navigate to Project Directory** 79 | 80 | ```bash 81 | cd chat-app 82 | ``` 83 | 84 | 3. **Install Dependencies** 85 | 86 | - Frontend: 87 | ```bash 88 | cd client 89 | npm install 90 | ``` 91 | - Backend: 92 | ```bash 93 | cd Server 94 | npm install 95 | ``` 96 | 97 | 98 | 4. **Configuration** 99 | 100 | - Update MySQL connection details in `backend/config/db.js`. 101 | - Update Socket.IO server URL in `frontend/src/utils/socket.js`. 102 | 103 | 5. **Start Development Servers** 104 | 105 | - Backend: 106 | ```bash 107 | cd client 108 | npm start 109 | ``` 110 | - Frontend: 111 | ```bash 112 | cd Server 113 | npm start 114 | ``` 115 | 116 | Open `http://localhost:3000` in your browser. 117 | 118 | ## Usage 119 | 120 | 1. Sign up or log in. 121 | 2. You'll be redirected to the chat interface. 122 | 3. Your friends list appears on the left; click a friend to start chatting. 123 | 4. Messages are real-time and auto-scroll to the latest. 124 | 5. Click messages to mark as seen or unseen. 125 | 6. Log out via the "Logout" button in the top-right corner. 126 | 127 | ## Screenshots 128 | 129 | ![Chat Interface](https://github.com/ankitrout2903/Swingyy2/assets/88599131/164577c8-77f5-4d13-88cb-078da8907e5b.png) 130 | ![Additional Screenshot](https://github.com/ankitrout2903/Swingyy/assets/88599131/1031d934-5db1-416e-bec3-d62c6d8ce476.png) 131 | 132 | 133 |
134 | 135 | 136 | 137 |
138 | 139 | ## License 140 | 141 | This project is licensed under the MIT License. 142 | -------------------------------------------------------------------------------- /Server/.env: -------------------------------------------------------------------------------- 1 | PORT=3001 2 | MONGO_URL="your mongo url" 3 | TOKEN_KEY="replace with your own key" 4 | password ="your db password" 5 | DB_HOST="your db public ip" 6 | DB_NAME="your db name" 7 | DB_USER="db user name" 8 | DB_PASS="db user password" 9 | DB_PORT=3306 10 | -------------------------------------------------------------------------------- /Server/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | } -------------------------------------------------------------------------------- /Server/controllers/friendsController.js: -------------------------------------------------------------------------------- 1 | const connection = require('../db'); 2 | 3 | 4 | /** 5 | * @param {*} req from->to. each row contains a mapping from user_id to friend_id. 6 | * Controller method to add a new friend 7 | */ 8 | module.exports.addFriend = async (req, res, next) => { 9 | try { 10 | const { from, to} = req.body; 11 | 12 | // Create a new friend in the database 13 | const insertQuery = ` 14 | INSERT INTO friend_table (user_id, friend_id) 15 | VALUES (?, ?); 16 | `; 17 | const values = [from, to]; 18 | 19 | connection.query(insertQuery, values, (err, result) => { 20 | if (err) { 21 | console.error('Error adding friend: ', err); 22 | return res.json({ msg: 'Failed to add friend' }); 23 | } 24 | 25 | return res.json({ msg: 'Friend added successfully' }); 26 | }); 27 | } catch (ex) { 28 | next(ex); 29 | } 30 | }; 31 | 32 | /** 33 | * Controller method to retrieve all friends of a user 34 | * @param {id} req id of the user 35 | */ 36 | module.exports.getFriends = async (req, res, next) => { 37 | try { 38 | const { id } = req.params; 39 | 40 | // Get all friends of the user 41 | const selectQuery = ` 42 | SELECT u.id, u.username, u.email, u.photo_url 43 | FROM user_table u 44 | INNER JOIN friend_table f ON u.id = f.friend_id 45 | WHERE f.user_id = ?; 46 | `; 47 | connection.query(selectQuery, [id], (err, rows) => { 48 | if (err) { 49 | console.error('Error retrieving friends: ', err); 50 | return res.json({ msg: 'Failed to retrieve friends' }); 51 | } 52 | 53 | // Return the list of friends 54 | return res.json({ msg: 'Friends retrieved successfully', friends: rows }); 55 | }); 56 | } catch (ex) { 57 | next(ex); 58 | } 59 | } 60 | 61 | module.exports.getPossibleFriends = async (req, res, next) => { 62 | // get all users that are not friends and not the user. 63 | try { 64 | const { id } = req.params; 65 | 66 | const selectQuery = ` 67 | SELECT id, username FROM user_table 68 | WHERE id != ? AND id NOT IN (SELECT friend_id FROM friend_table WHERE user_id = ?) 69 | `; 70 | connection.query(selectQuery, [id, id], (err, rows) => { 71 | if (err) { 72 | console.error('Error retrieving friends: ', err); 73 | return res.json({ msg: 'Failed to retrieve friends' }); 74 | } 75 | 76 | // return a list of name, id pairs using these ids 77 | console.log(rows[0]); 78 | 79 | return res.json({ msg: 'Friends retrieved successfully', friends: rows }); 80 | }); 81 | } catch (ex) { 82 | next(ex); 83 | } 84 | 85 | } -------------------------------------------------------------------------------- /Server/controllers/messageController.js: -------------------------------------------------------------------------------- 1 | const connection = require('../db') 2 | 3 | // Controller method to add a new message1 4 | module.exports.addMessage = async (req, res, next) => { 5 | try { 6 | const { from, to, message, createdAt} = req.body; 7 | 8 | // Create a new message in the database 9 | const insertQuery = ` 10 | INSERT INTO message_table (message, sender_mail, reciever_mail, createdAt) 11 | VALUES (?, ?, ?, ?); 12 | `; 13 | const values = [message, from, to, createdAt]; 14 | 15 | connection.query(insertQuery, values, (err, result) => { 16 | if (err) { 17 | console.error('Error adding message: ', err); 18 | return res.json({ msg: 'Failed to add message' }); 19 | } 20 | 21 | return res.json({ msg: 'Message added successfully' }); 22 | }); 23 | } catch (ex) { 24 | next(ex); // Pass the error to the next error-handling middleware 25 | } 26 | }; 27 | 28 | // Controller method to retrieve messages between two users 29 | module.exports.getMessage = async (req, res, next) => { 30 | try { 31 | const { from, to } = req.body; 32 | 33 | // Find messages between the specified users, sorted by updatedAt in ascending order 34 | const selectQuery = ` 35 | SELECT m.message AS message, m.createdAt AS time, 36 | (m.sender_mail = ?) AS fromSelf 37 | FROM message_table m 38 | WHERE (m.sender_mail = ? OR m.sender_mail = ?) 39 | ORDER BY m.createdAt ASC; 40 | `; 41 | const values = [from, from, to]; 42 | 43 | connection.query(selectQuery, values, (err, rows) => { 44 | if (err) { 45 | console.error('Error retrieving messages: ', err); 46 | return res.json([]); 47 | } 48 | 49 | // Map the retrieved messages to a new format for response 50 | const projectMessages = rows.map((row) => ({ 51 | fromSelf: row.fromSelf, 52 | message: row.message, 53 | time: row.time, 54 | })); 55 | 56 | res.json(projectMessages); 57 | }); 58 | } catch (ex) { 59 | next(ex); // Pass the error to the next error-handling middleware 60 | } 61 | }; -------------------------------------------------------------------------------- /Server/controllers/userController.js: -------------------------------------------------------------------------------- 1 | const bcrypt = require('bcrypt'); 2 | const jwt = require('jsonwebtoken'); 3 | const connection = require('../db') 4 | 5 | // Controller method to register a new user 6 | module.exports.register = async (req, res, next) => { 7 | try { 8 | const { username, mail, password, uid } = req.body; 9 | 10 | /** 11 | * I changed the DB a little bit, I have removed the NOT NULL requirement in password because if you're signing in with google, you won't have their password. 12 | * the password field can be checked for not null if you create a separate login page though. 13 | */ 14 | 15 | // Create a new user in the database 16 | const insertQuery = 'INSERT INTO user_table (email, username, password, uuid) VALUES (?, ?, ?, ?)'; 17 | const values = [mail, username, password, uid]; 18 | 19 | connection.query(insertQuery, values, (err, result) => { 20 | if (err) { 21 | console.error('Error adding user: ', err); 22 | return res.json({ msg: 'Failed to register user', status: false }); 23 | } 24 | //if registration is successful, return the user object 25 | return res.json({ status: true, user: { username , mail, password, _id: result.insertId },message : "User registered successfully" }); 26 | 27 | }); 28 | } catch (ex) { 29 | next(ex); // Pass the error to the next error-handling middleware 30 | } 31 | }; 32 | 33 | /** 34 | * 35 | * @param {mail} req mail of the user 36 | * @param {boolean} res status: boolean, user: {username, email, _id} 37 | * @param {*} next 38 | */ 39 | module.exports.checkUser = async (req, res, next) => { 40 | try { 41 | const { mail } = req.body; 42 | const values = [mail]; 43 | 44 | // Find the user by email 45 | const selectQuery = 'SELECT * FROM user_table WHERE email = ?'; 46 | connection.query(selectQuery, values, (err, rows) => { 47 | if (err) { 48 | console.error('Error retrieving user: ', err); 49 | return res.json({ msg: 'An error occurred', status: false }); 50 | } 51 | const user = rows[0]; 52 | 53 | if (user) { 54 | return res.json({ status: true, user: { username: user.username, email: user.email, _id: user.id }, message: 'User exists' }); 55 | } else { 56 | return res.json({ status: false, message: 'User does not exist' }); 57 | } 58 | }); 59 | } catch (ex) { 60 | next(ex); 61 | } 62 | } 63 | 64 | // Controller method to authenticate user login 65 | module.exports.login = async (req, res, next) => { 66 | try { 67 | const { username, password } = req.body; 68 | 69 | // Find the user by username 70 | const selectQuery = 'SELECT * FROM user_table WHERE username = ?'; 71 | connection.query(selectQuery, [username], (err, rows) => { 72 | if (err) { 73 | console.error('Error retrieving user: ', err); 74 | return res.json({ msg: 'An error occurred', status: false }); 75 | } 76 | 77 | if (rows.length === 0) { 78 | return res.json({ msg: 'Invalid username/password', status: false }); 79 | } 80 | 81 | const user = rows[0]; 82 | 83 | // Compare the provided password with the stored hashed password 84 | bcrypt.compare(password, user.password, (err, isValidPassword) => { 85 | if (err) { 86 | console.error('Error comparing passwords: ', err); 87 | return res.json({ msg: 'An error occurred', status: false }); 88 | } 89 | 90 | if (!isValidPassword) { 91 | return res.json({ msg: 'Invalid username/password', status: false }); 92 | } 93 | 94 | // Generate JWT token 95 | const token = jwt.sign({ username, _id: user.id }, process.env.TOKEN_KEY, { 96 | expiresIn: 300, 97 | }); 98 | 99 | // Set the token as a cookie 100 | res.cookie('token', token, { 101 | httpOnly: true, 102 | }); 103 | 104 | // Remove the password field from the user object 105 | const returnedUser = { 106 | username, 107 | _id: user.id, 108 | }; 109 | 110 | return res.json({ status: true, returnedUser }); 111 | }); 112 | }); 113 | } catch (ex) { 114 | next(ex); // Pass the error to the next error-handling middleware 115 | } 116 | }; 117 | 118 | // Controller method to get all users except the current user 119 | module.exports.getAllUsers = async (req, res, next) => { 120 | try { 121 | const { email } = req.params; 122 | 123 | // Retrieve all users except the current user 124 | // const selectQuery = 'SELECT email, username , photo_url FROM swingyy.user_table WHERE email != ?'; 125 | 126 | const selectQuery = 'SELECT * FROM swingyy.user_table;'; 127 | connection.query(selectQuery, [email], (err, rows) => { 128 | if (err) { 129 | console.error('Error retrieving users: ', err); 130 | return res.json([]); 131 | } 132 | console.log(rows); 133 | 134 | // Sort the users by username in ascending order 135 | rows.sort((a, b) => a.username.localeCompare(b.username)); 136 | 137 | 138 | return res.json(rows); 139 | 140 | }); 141 | } catch (ex) { 142 | next(ex); // Pass the error to the next error-handling middleware 143 | } 144 | }; 145 | -------------------------------------------------------------------------------- /Server/db.js: -------------------------------------------------------------------------------- 1 | const mysql = require('mysql'); 2 | // const credentials = require('./credentials.json'); 3 | require('dotenv').config(); 4 | 5 | var config = { 6 | user: process.env.DB_USER, 7 | database: process.env.DB_NAME, 8 | password: process.env.DB_PASS, 9 | host: process.env.DB_HOST, 10 | port: process.env.DB_PORT, 11 | charset: 'utf8mb4', 12 | // credential: credentials, 13 | }; 14 | 15 | // Later on when running from Google Cloud, env variables will be passed in container cloud connection config 16 | if (process.env.NODE_ENV === 'production') { 17 | console.log('Running from cloud. Connecting to DB through GCP socket.'); 18 | config.socketPath = `/cloudsql/${process.env.INSTANCE_CONNECTION_NAME}`; 19 | } 20 | 21 | // When running from localhost, get the config from .env 22 | else { 23 | console.log('Running from localhost. Connecting to DB directly.'); 24 | config.host = process.env.DB_HOST; 25 | } 26 | 27 | let connection = mysql.createConnection(config); 28 | 29 | connection.connect(function (err) { 30 | if (err) { 31 | console.error('Error connecting: ' + err.stack); 32 | return; 33 | } 34 | console.log('Connected as thread id: ' + connection.threadId); 35 | }); 36 | 37 | module.exports = connection; -------------------------------------------------------------------------------- /Server/index.js: -------------------------------------------------------------------------------- 1 | // Import necessary dependencies 2 | const express = require("express"); 3 | const cors = require("cors"); 4 | const mongoose = require("mongoose"); 5 | const http = require("http"); 6 | const socketIO = require("socket.io"); 7 | const cookieParser = require("cookie-parser"); 8 | const connection = require("./db"); 9 | const app = express(); 10 | 11 | // Set up CORS to allow requests from the client 12 | app.use(cors({ origin: "http://localhost:3000", credentials: true })); 13 | 14 | // Load environment variables from the .env file 15 | require("dotenv").config(); 16 | 17 | // Import route files 18 | const userRoutes = require("./routes/userRoutes"); 19 | const messageRoutes = require("./routes/messageRoutes"); 20 | const friendsRoutes = require("./routes/friendsRoutes"); 21 | 22 | // Create an instance of the Express application 23 | 24 | const server = http.createServer(app); 25 | // const io = socketIO(server); 26 | const io = require("socket.io")(server, { 27 | cors: { 28 | origin: "http://localhost:3000", 29 | methods: ["GET", "POST"], 30 | }, 31 | }); 32 | 33 | // Set up middleware and configuration 34 | app.use(express.json()); 35 | app.use(cookieParser()); 36 | 37 | // Define routes 38 | 39 | app.use("/api/auth", userRoutes); 40 | app.use("/api/messages", messageRoutes); 41 | app.use("/api/friends", friendsRoutes); 42 | app.get("/api/test", (req, res) => { 43 | connection.query('SELECT * FROM user_table', function (error, results, fields) { 44 | if (error) throw error; 45 | 46 | console.log('The solution is: ', results); 47 | res.json(results); 48 | }); 49 | }); 50 | 51 | 52 | // Set up Socket.IO server and define event handlers for real-time chat 53 | io.on("connection", (socket) => { 54 | socket.on("add-user", (userId) => { 55 | socket.join(userId); // Join a room with the user's ID for private messaging 56 | }); 57 | 58 | socket.on("send-msg", (data) => { 59 | io.to(data.to).emit("msg-received", data.message); // Emit the message to the specified user's room 60 | }); 61 | }); 62 | 63 | // Start the server 64 | const port = process.env.PORT || 3001; 65 | server.listen(port, () => { 66 | console.log(`Server connected on port: ${port}`); 67 | }); 68 | -------------------------------------------------------------------------------- /Server/middleware/cookieJwtAuth.js: -------------------------------------------------------------------------------- 1 | const jwt = require('jsonwebtoken'); 2 | 3 | // Middleware for cookie-based JWT authentication 4 | exports.cookieJwtAuth = (req, res, next) => { 5 | const token = req.cookies.token; 6 | 7 | try { 8 | // Verify the JWT token 9 | const user = jwt.verify(token, process.env.TOKEN_KEY); 10 | req.user = user; // Attach the user object to the request for further use 11 | next(); // Proceed to the next middleware or route handler 12 | } catch (err) { 13 | res.clearCookie("token"); // Clear the token cookie on verification failure 14 | return res.json({ status: false }); // Respond with status:false indicating authentication failure 15 | } 16 | }; 17 | -------------------------------------------------------------------------------- /Server/model/messageModel.js: -------------------------------------------------------------------------------- 1 | const mongoose = require("mongoose"); 2 | 3 | // Define the message schema 4 | const messageSchema = new mongoose.Schema( 5 | { 6 | message: { 7 | text: { 8 | type: String, 9 | required: true, 10 | }, 11 | }, 12 | users: { 13 | type: Array, 14 | required: true, 15 | }, 16 | sender: { 17 | type: mongoose.Schema.Types.ObjectId, 18 | ref: "User", 19 | required: true, 20 | }, 21 | }, 22 | { 23 | timestamps: true, // Automatically add createdAt and updatedAt timestamps 24 | } 25 | ); 26 | 27 | // Create and export the Message model based on the message schema 28 | module.exports = mongoose.model("Message", messageSchema); 29 | -------------------------------------------------------------------------------- /Server/model/readme.md: -------------------------------------------------------------------------------- 1 | #User, message and friends schema 2 | 3 | CREATE TABLE user_table ( 4 | id INT AUTO_INCREMENT PRIMARY KEY, 5 | uuid VARCHAR(50), 6 | username VARCHAR(20) NOT NULL UNIQUE, 7 | email VARCHAR(50) NOT NULL UNIQUE, 8 | password VARCHAR(255), 9 | photo_url VARCHAR(255), 10 | created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, 11 | updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP 12 | ); 13 | 14 | CREATE TABLE message_table ( 15 | id INT AUTO_INCREMENT PRIMARY KEY, 16 | message_text TEXT NOT NULL, 17 | sender_id INT NOT NULL, 18 | created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP, 19 | updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP, 20 | FOREIGN KEY (sender_id) REFERENCES user_table (id) 21 | ); 22 | 23 | CREATE TABLE friend_table ( 24 | id INT AUTO_INCREMENT PRIMARY KEY, 25 | user_id INT NOT NULL, 26 | friend_id INT NOT NULL, 27 | FOREIGN KEY (user_id) REFERENCES user_table(id), 28 | FOREIGN KEY (friend_id) REFERENCES user_table(id) 29 | ); 30 | -------------------------------------------------------------------------------- /Server/model/userModel.js: -------------------------------------------------------------------------------- 1 | const mongoose = require("mongoose"); 2 | 3 | // Define the user schema 4 | const userSchema = new mongoose.Schema({ 5 | username: { 6 | type: String, 7 | required: true, 8 | min: 3, // Minimum length of 3 characters for the username 9 | max: 20, // Maximum length of 20 characters for the username 10 | unique: true, // Ensure usernames are unique 11 | }, 12 | email: { 13 | type: String, 14 | required: true, 15 | min: 8, // Minimum length of 8 characters for the email 16 | max: 50, // Maximum length of 50 characters for the email 17 | unique: true, // Ensure emails are unique 18 | }, 19 | password: { 20 | type: String, 21 | required: true, 22 | min: 8, // Minimum length of 8 characters for the password 23 | }, 24 | }); 25 | 26 | // Create and export the User model based on the user schema 27 | module.exports = mongoose.model("User", userSchema); 28 | -------------------------------------------------------------------------------- /Server/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "server", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "start": "nodemon index.js" 9 | }, 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "bcrypt": "^5.1.0", 14 | "cookie-parser": "^1.4.6", 15 | "cors": "^2.8.5", 16 | "dotenv": "^16.0.3", 17 | "express": "^4.18.2", 18 | "jsonwebtoken": "^9.0.0", 19 | "mongoose": "^7.2.0", 20 | "mysql": "^2.18.1", 21 | "socket.io": "^4.6.1" 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /Server/routes/friendsRoutes.js: -------------------------------------------------------------------------------- 1 | const { addFriend, getFriends, getPossibleFriends } = require('../controllers/friendsController'); 2 | 3 | const router = require('express').Router(); 4 | 5 | router.post('/addFriend', addFriend); 6 | router.get('/getFriends/:id', getFriends); 7 | router.get('/getPossibleFriends/:id', getPossibleFriends) 8 | 9 | module.exports = router; -------------------------------------------------------------------------------- /Server/routes/messageRoutes.js: -------------------------------------------------------------------------------- 1 | const {addMessage, getMessage} = require("../controllers/messageController"); 2 | const {cookieJwtAuth} = require("../middleware/cookieJwtAuth"); 3 | 4 | const router = require("express").Router(); 5 | 6 | router.post("/addmsg",addMessage); 7 | router.post("/getmsg", getMessage); 8 | 9 | 10 | module.exports = router; -------------------------------------------------------------------------------- /Server/routes/userRoutes.js: -------------------------------------------------------------------------------- 1 | const {register, login, getAllUsers, checkUser} = require("../controllers/userController"); 2 | const {cookieJwtAuth} = require("../middleware/cookieJwtAuth"); 3 | 4 | const router = require("express").Router(); 5 | 6 | router.post("/register",register); 7 | router.post("/login", login); 8 | router.get("/allUsers/:id", getAllUsers); 9 | router.post("/getUser", checkUser) 10 | 11 | module.exports = router; -------------------------------------------------------------------------------- /client/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /client/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | } -------------------------------------------------------------------------------- /client/README.md: -------------------------------------------------------------------------------- 1 | # Chat App 2 | 3 | This is a simple chat application that allows users to send and receive messages in real-time. 4 | 5 | ## Features 6 | 7 | - User authentication: Users can sign up, log in, and log out. 8 | - Friends list: Users can view their list of friends. 9 | - Real-time messaging: Users can send and receive messages in real-time. 10 | - Seen and unseen messages: Messages can be marked as seen or unseen. 11 | - User status: Users can see the online/offline status of their friends. 12 | - Profile picture: Users can upload and display their profile picture. 13 | 14 | ## Technologies Used 15 | 16 | - Frontend: React, React Router, Axios, Socket.IO Client 17 | - Backend: Node.js, Express.js, MySQL, Socket.IO 18 | - Styling: CSS 19 | 20 | ## Installation 21 | 22 | 1. Clone the repository: 23 | 24 | ```shell 25 | git clone https://github.com/your-username/Swingyy.git 26 | Navigate to the project directory: 27 | ``` 28 | 29 | shell 30 | Copy code 31 | cd chat-app 32 | Install the dependencies for both the frontend and backend: 33 | 34 | Configure dotenv and firebase.config file accordingly if you want it to run on your local machine 35 | 36 | shell 37 | Copy code 38 | 39 | # Install frontend dependencies 40 | 41 | cd frontend 42 | npm install 43 | 44 | # Install backend dependencies 45 | 46 | cd ../backend 47 | npm install 48 | Configuration: 49 | 50 | Create a MySQL database and update the connection details in the backend/config/db.js file. 51 | Update the Socket.IO server URL in the frontend/src/utils/socket.js file. 52 | Start the development server: 53 | 54 | shell 55 | Copy code 56 | 57 | # Start the backend server (runs on http://localhost:3001) 58 | 59 | cd backend 60 | npm start 61 | 62 | # Start the frontend development server (runs on http://localhost:3000) 63 | 64 | cd ../frontend 65 | npm start 66 | Open your browser and visit http://localhost:3000 to access the chat app. 67 | 68 | Usage 69 | Sign up with a new account or log in with an existing account. 70 | After logging in, you will be redirected to the chat interface. 71 | On the left side, you will see your list of friends. Click on a friend to start a conversation. 72 | In the conversation view, you can send and receive messages in real-time. 73 | New messages will appear instantly, and the chat will be scrolled to the latest message. 74 | You can mark messages as seen or unseen by clicking on them. 75 | You can log out by clicking the "Logout" button in the top right corner. 76 | Screenshots 77 | 78 | Chat App Screenshot 79 | ![WhatsApp Image 2023-05-30 at 02 33 36](https://github.com/ankitrout2903/Swingyy2/assets/88599131/164577c8-77f5-4d13-88cb-078da8907e5b) 80 | 81 | License 82 | This project is licensed under the MIT License. 83 | 84 | vbnet 85 | Copy code 86 | 87 | Feel free to customize and enhance the README file based on your specific chat app's features and requirements. 88 | -------------------------------------------------------------------------------- /client/client.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/client/client.zip -------------------------------------------------------------------------------- /client/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "web-chat-app", 3 | "version": "0.1.0", 4 | "private": true, 5 | "dependencies": { 6 | "@testing-library/jest-dom": "^5.16.5", 7 | "@testing-library/react": "^13.4.0", 8 | "@testing-library/user-event": "^13.5.0", 9 | "axios": "^1.3.3", 10 | "date-fns": "^2.30.0", 11 | "emoji-picker-react": "^4.4.8", 12 | "firebase": "^9.22.1", 13 | "react": "^18.2.0", 14 | "react-dom": "^18.2.0", 15 | "react-icons": "^4.11.0", 16 | "react-router": "^6.8.1", 17 | "react-router-dom": "^6.8.1", 18 | "react-scripts": "5.0.1", 19 | "react-toastify": "^9.1.1", 20 | "socket.io-client": "^4.6.0", 21 | "uuid": "^9.0.0", 22 | "web-vitals": "^2.1.4" 23 | }, 24 | "scripts": { 25 | "start": "react-scripts start", 26 | "build": "react-scripts build", 27 | "test": "react-scripts test", 28 | "eject": "react-scripts eject" 29 | }, 30 | "eslintConfig": { 31 | "extends": [ 32 | "react-app", 33 | "react-app/jest" 34 | ] 35 | }, 36 | "browserslist": { 37 | "production": [ 38 | ">0.2%", 39 | "not dead", 40 | "not op_mini all" 41 | ], 42 | "development": [ 43 | "last 1 chrome version", 44 | "last 1 firefox version", 45 | "last 1 safari version" 46 | ] 47 | }, 48 | "devDependencies": { 49 | "autoprefixer": "^10.4.16", 50 | "postcss": "^8.4.31" 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /client/postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /client/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 12 | Chat App 13 | 19 | 20 | 21 | 22 |
23 | 28 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /client/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /client/src/App.js: -------------------------------------------------------------------------------- 1 | import Register from "./pages/Register/Register"; 2 | import Login from "./pages/Login/Login"; 3 | import Chat from "./pages/Chat/Chat"; 4 | import { BrowserRouter, Routes, Route } from "react-router-dom"; 5 | 6 | function App() { 7 | return ( 8 |
9 | 10 | 11 | }> 12 | }> 13 | }> 14 | 15 | 16 |
17 | ); 18 | } 19 | 20 | export default App; 21 | -------------------------------------------------------------------------------- /client/src/components/Friends/Friends.jsx: -------------------------------------------------------------------------------- 1 | import { useState, useEffect } from "react"; 2 | import { BsFillPersonFill } from "react-icons/bs"; 3 | import "./style.css"; 4 | 5 | export default function Friends({ friends, changeChat }) { 6 | const [curFriendSelected, setCurFriendSelected] = useState(undefined); 7 | console.log(friends); 8 | function changeCurChat(index, friend) { 9 | setCurFriendSelected(index); 10 | changeChat(friend); 11 | } 12 | 13 | return ( 14 |
15 | {friends.map((friend, index) => { 16 | return ( 17 |
changeCurChat(index, friend)} 23 | > 24 |
25 | profile-pic 34 |

{friend.username}

35 |
36 |
37 | ); 38 | })} 39 |
40 | ); 41 | } 42 | -------------------------------------------------------------------------------- /client/src/components/Friends/addFriends.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from "react"; 2 | import { 3 | addFriendsRoute, 4 | getPossibleFriendsRoute, 5 | } from "../../utils/APIRoutes"; 6 | import axios from "axios"; 7 | 8 | /** 9 | * I am sorry I haven't done css on this, I am not a UI person. 10 | * @param {*} param0 11 | * @returns 12 | */ 13 | const FriendsPopup = ({ userId }) => { 14 | const [showPopup, setShowPopup] = useState(false); 15 | const [potentialFriends, setPotentialFriends] = useState([]); 16 | const [selectedFriends, setSelectedFriends] = useState([]); 17 | 18 | // Fetch potential friends 19 | useEffect(() => { 20 | const fetchPotentialFriends = async () => { 21 | try { 22 | const response = await axios.get( 23 | `${getPossibleFriendsRoute}/${userId}` 24 | ); 25 | setPotentialFriends(response.data.friends); 26 | } catch (error) { 27 | console.error("Error fetching potential friends:", error); 28 | } 29 | }; 30 | fetchPotentialFriends(); 31 | }, [userId]); 32 | 33 | const togglePopup = () => { 34 | setShowPopup(!showPopup); 35 | }; 36 | 37 | const handleFriendSelect = (friendId) => { 38 | setSelectedFriends((prevSelected) => { 39 | if (prevSelected.includes(friendId)) { 40 | return prevSelected.filter((id) => id !== friendId); 41 | } 42 | return [...prevSelected, friendId]; 43 | }); 44 | }; 45 | 46 | const addFriends = async () => { 47 | try { 48 | console.log("Adding friends:", selectedFriends); 49 | console.log("userId:", userId); 50 | const friendId = selectedFriends[0]; 51 | await axios.post(`${addFriendsRoute}`, { 52 | from: userId, 53 | to: friendId, 54 | }); 55 | setSelectedFriends([]); //clean up 56 | 57 | setShowPopup(false); 58 | } catch (error) { 59 | console.error("Error adding friends:", error); 60 | } 61 | }; 62 | 63 | return ( 64 |
65 | 66 | {showPopup && ( 67 |
68 |

Add Friends

69 | 82 | 83 |
84 | )} 85 |
86 | ); 87 | }; 88 | 89 | export default FriendsPopup; 90 | -------------------------------------------------------------------------------- /client/src/components/Friends/blackbg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/client/src/components/Friends/blackbg.jpg -------------------------------------------------------------------------------- /client/src/components/Friends/style.css: -------------------------------------------------------------------------------- 1 | .friends-container { 2 | width: 30%; 3 | height: 99%; 4 | overflow: scroll; 5 | overflow-x: hidden; 6 | overflow-wrap: break-word; 7 | } 8 | 9 | .friend-container { 10 | width: 100%; 11 | height: 10%; 12 | background-color: #f4f4f4; 13 | display: flex; 14 | align-items: left; 15 | justify-content: left; 16 | color: #333333; 17 | } 18 | 19 | .friend-info { 20 | display: flex; 21 | align-items: center; 22 | justify-content: start; 23 | margin-left: 15px; 24 | width: 150px; 25 | gap: 10px; 26 | cursor: pointer; 27 | } 28 | 29 | .friend-icon { 30 | font-size: 24px; 31 | } 32 | 33 | .selected { 34 | color: #007bff; 35 | } 36 | .friend-profile-pic { 37 | width: 50px; 38 | height: 50px; 39 | border-radius: 50%; 40 | object-fit: cover; 41 | margin-right: 10px; 42 | } 43 | -------------------------------------------------------------------------------- /client/src/components/Home/Home.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | export const Home = () => { 4 | return
Home
; 5 | }; 6 | export default Home; 7 | -------------------------------------------------------------------------------- /client/src/components/Home/bgimg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/client/src/components/Home/bgimg.jpg -------------------------------------------------------------------------------- /client/src/components/Home/style.css: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /client/src/components/Messages/Messages.jsx: -------------------------------------------------------------------------------- 1 | import { useState, useEffect, useRef } from 'react'; 2 | import axios from 'axios'; 3 | import { v4 as uuidv4 } from 'uuid'; 4 | import { getMsgsRoute, sendMsgRoute } from '../../utils/APIRoutes'; 5 | import { FaPaperPlane } from 'react-icons/fa'; 6 | import './style.css'; 7 | import { useNavigate } from 'react-router-dom'; 8 | 9 | export default function Messages({ curUser, curChat, socket }) { 10 | const [msg, setMsg] = useState(""); 11 | const [msgs, setMsgs] = useState([]); 12 | const [arrivalMsgs, setArrivalMsgs] = useState([]); 13 | const navigate = useNavigate(); 14 | const scrollRef = useRef(); 15 | 16 | async function fetchData() { 17 | if (curChat) { 18 | try { 19 | const res = await axios.post(getMsgsRoute, { 20 | from: curUser.email, 21 | to: curChat.email, 22 | }); 23 | if (res.data.status === false) { 24 | localStorage.clear(); 25 | navigate('/login'); 26 | } 27 | setMsgs(res.data); 28 | } catch (error) { 29 | console.error("Error fetching messages:", error); 30 | } 31 | } 32 | } 33 | 34 | useEffect(() => { 35 | fetchData(); 36 | }, [curChat]); 37 | 38 | async function handleSend(e) { 39 | e.preventDefault(); 40 | if (msg.length > 0) { 41 | try { 42 | const res = await axios.post(sendMsgRoute, { 43 | from: curUser.email, 44 | to: curChat.email, 45 | message: msg, 46 | createdAt: Date.now(), 47 | }); 48 | if (res.data.status === false) { 49 | localStorage.clear(); 50 | navigate('/login'); 51 | } 52 | socket.current.emit("send-msg", { 53 | to: curChat.email, 54 | from: curUser.email, 55 | type: "text", 56 | message: msg, 57 | }); 58 | const newMsg = { fromSelf: true, message: msg }; 59 | setMsgs((prevMsgs) => [...prevMsgs, newMsg]); 60 | setMsg(""); 61 | } catch (error) { 62 | console.error("Error sending message:", error); 63 | } 64 | } 65 | } 66 | 67 | useEffect(() => { 68 | if (socket.current) { 69 | socket.current.on("msg-recieved", (msg) => { 70 | if (msg.type === "text") { 71 | setArrivalMsgs((prevArrivalMsgs) => [...prevArrivalMsgs, msg]); 72 | } 73 | }); 74 | } 75 | }, [socket.current]); 76 | 77 | useEffect(() => { 78 | setMsgs((prevMsgs) => [...prevMsgs, ...arrivalMsgs]); 79 | setArrivalMsgs([]); 80 | }, [arrivalMsgs]); 81 | 82 | useEffect(() => { 83 | scrollRef.current?.scrollIntoView({ behavior: "smooth" }); 84 | }, [msgs]); 85 | 86 | return ( 87 |
88 | {curChat && ( 89 |
90 |
91 |
92 | {msgs.map((message) => ( 93 |
94 |
97 |

{message.message}

98 | {message.time && ( 99 |
100 |

101 | {new Date(parseInt(message.time)).toLocaleString()} 102 |

103 |
104 | )} 105 | 106 |
107 |
108 | ))} 109 |
110 |
111 |
112 | setMsg(e.target.value)} 119 | /> 120 | 123 |
124 |
125 | )} 126 |
127 | ); 128 | } 129 | -------------------------------------------------------------------------------- /client/src/components/Messages/style.css: -------------------------------------------------------------------------------- 1 | :root { 2 | --primary-light-gray: #f5f5f5; 3 | --primary-navy-blue: #0088cc; 4 | --primary-dark-green: #2d6a4f; 5 | --secondary-bright-blue: #5d9cec; 6 | --primary-off-white: #ffffff; 7 | } 8 | 9 | * { 10 | margin: 0; 11 | padding: 0; 12 | box-sizing: border-box; 13 | } 14 | 15 | .messages-container { 16 | width: 100%; 17 | height: 100%; 18 | } 19 | 20 | .message-area { 21 | display: flex; 22 | flex-direction: column; 23 | } 24 | 25 | .messages { 26 | overflow: scroll; 27 | overflow-x: hidden; 28 | overflow-wrap: break-word; 29 | width: 100%; 30 | height: 80vh; 31 | } 32 | 33 | .message { 34 | width: min-content; 35 | margin: 5px 5px; 36 | padding: 5px 15px; 37 | max-width: 50%; 38 | min-width: 5%; 39 | background-color: var(--secondary-bright-blue); 40 | color: var(--primary-off-white); 41 | text-indent: 10px; 42 | text-align: center; 43 | border-radius: 12px; 44 | margin-bottom: 5px; 45 | } 46 | 47 | .message-text { 48 | /* padding: 6px; */ 49 | font-size: 20px; 50 | } 51 | 52 | 53 | .message-date { 54 | font-size: 12px; 55 | color: var(--primary-navy-blue); 56 | text-align: right; 57 | } 58 | 59 | 60 | .message-form { 61 | width: 100%; 62 | height: 100px; 63 | display: flex; 64 | align-items: center; 65 | justify-content: center; 66 | border-top: 2px solid var(--primary-dark-green); 67 | } 68 | 69 | .message-input { 70 | width: 70%; 71 | height: 50px; 72 | outline: 1px solid var(--primary-navy-blue); 73 | border: 1px solid var(--primary-navy-blue); 74 | } 75 | 76 | .message-btn { 77 | width: 20%; 78 | height: 56px; 79 | background-color: var(--primary-navy-blue); 80 | color: var(--primary-light-gray); 81 | outline: none; 82 | border: none; 83 | } 84 | 85 | .message-btn:hover { 86 | cursor: pointer; 87 | background-color: var(--primary-off-white); 88 | color: var(--primary-navy-blue); 89 | border: 2px solid var(--primary-navy-blue); 90 | } 91 | 92 | .home { 93 | display: flex; 94 | align-items: center; 95 | justify-content: center; 96 | width: 100%; 97 | height: 100%; 98 | } 99 | 100 | .sent { 101 | margin-left: auto; 102 | margin-right: 2%; 103 | } 104 | 105 | .message { 106 | background-color: var(--primary-light-gray); 107 | color: var(--primary-navy-blue); 108 | text-align: left; 109 | align-items: start; 110 | justify-content: left; 111 | /* margin: 0; */ 112 | } 113 | 114 | .sent.message { 115 | background-color: var(--primary-dark-green); 116 | color: var(--primary-off-white); 117 | text-align: right; 118 | } 119 | -------------------------------------------------------------------------------- /client/src/components/NavBar/NavBar.css: -------------------------------------------------------------------------------- 1 | .custom-ul { 2 | list-style-type: none; 3 | padding: 0; 4 | margin: 0; 5 | } 6 | -------------------------------------------------------------------------------- /client/src/components/NavBar/NavBar.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Link } from "react-router-dom"; 3 | import { useNavigate } from "react-router-dom"; 4 | 5 | function logout(navigate) { 6 | localStorage.clear(); 7 | navigate("/login"); 8 | } 9 | 10 | function NavBar(props) { 11 | const navigate = useNavigate(); 12 | 13 | return ( 14 | 90 | ); 91 | } 92 | 93 | export default NavBar; 94 | -------------------------------------------------------------------------------- /client/src/firebase/firebaseConfig.js: -------------------------------------------------------------------------------- 1 | // Import the functions you need from the SDKs you need 2 | import { initializeApp } from "firebase/app"; 3 | import { getAuth } from "firebase/auth"; 4 | // TODO: Add SDKs for Firebase products that you want to use 5 | // https://firebase.google.com/docs/web/setup#available-libraries 6 | 7 | // Your web app's Firebase configuration 8 | const firebaseConfig = { 9 | apiKey: "AIzaSyDOqtrfYucQaxz-HznHdBGNPnUNwnzgC2w", 10 | authDomain: "chat-app-1bf83.firebaseapp.com", 11 | projectId: "chat-app-1bf83", 12 | storageBucket: "chat-app-1bf83.appspot.com", 13 | messagingSenderId: "1002936329052", 14 | appId: "1:1002936329052:web:7995ef61d8832ce96f5799" 15 | }; 16 | 17 | // Initialize Firebase 18 | const app = initializeApp(firebaseConfig); 19 | const auth = getAuth(app); 20 | export {auth}; -------------------------------------------------------------------------------- /client/src/index.css: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Poppins&display=swap"); 2 | 3 | @tailwind base; 4 | @tailwind components; 5 | @tailwind utilities; 6 | 7 | :root { 8 | --primary-navy-blue: #008fe2; 9 | --primary-light-blue: #c7e1fc; 10 | --primary-off-white: #f6f6f6; 11 | --primary-light-gray: #d3d3d3; 12 | --primary-dark-gray: #333333; 13 | --primary-black: #000000; 14 | 15 | --secondary-bright-blue: #1982fc; 16 | --secondary-pale-yellow: #fffdd0; 17 | } 18 | 19 | body { 20 | margin: 0; 21 | font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", 22 | "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", 23 | "Helvetica Neue", sans-serif; 24 | -webkit-font-smoothing: antialiased; 25 | -moz-osx-font-smoothing: grayscale; 26 | color: var(--primary-black); 27 | } 28 | 29 | code { 30 | font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", 31 | monospace; 32 | } 33 | 34 | h1 { 35 | font-size: 28px; 36 | } 37 | 38 | h2 { 39 | font-size: 24px; 40 | } 41 | 42 | .App { 43 | width: 90vw; 44 | height: 90vh; 45 | display: flex; 46 | justify-content: center; 47 | align-items: center; 48 | /* background-color: var(--primary-light-blue); */ 49 | } 50 | 51 | .form-row { 52 | display: flex; 53 | gap: 15px; 54 | width: inherit; 55 | height: 100px; 56 | align-items: center; 57 | justify-content: center; 58 | } 59 | 60 | .form-input { 61 | width: 60%; 62 | height: 55px; 63 | text-indent: 15px; 64 | border-radius: 24px; 65 | border: none; 66 | font-size: 18px; 67 | outline: none; 68 | } 69 | 70 | .form-input::placeholder { 71 | color: var(--primary-navy-blue); 72 | } 73 | 74 | input { 75 | color: var(--primary-navy-blue); 76 | } 77 | 78 | .form-icon { 79 | color: var(--primary-navy-blue); 80 | width: 45px; 81 | height: 45px; 82 | padding: 10px; 83 | background-color: var(--primary-off-white); 84 | border-radius: 100%; 85 | } 86 | 87 | .form-btn { 88 | color: var(--primary-navy-blue); 89 | background-color: white; 90 | font-size: 20px; 91 | filter: drop-shadow(1px 2px 1px var(--secondary-bright-blue)); 92 | text-indent: 0px; 93 | border: none; 94 | outline: none; 95 | padding: 10px 20px; 96 | border-radius: 24px; 97 | transition: background-color 0.3s, color 0.3s; 98 | } 99 | 100 | .form-btn:hover { 101 | background-color: var(--primary-navy-blue); 102 | color: var(--primary-off-white); 103 | cursor: pointer; 104 | } 105 | 106 | .form-footer { 107 | color: var(--primary-navy-blue); 108 | } 109 | 110 | .custom-toast { 111 | height: 125px; 112 | width: 275px; 113 | } 114 | 115 | .scroll-style::-webkit-scrollbar-track { 116 | background-color: var(--primary-light-green); 117 | } 118 | 119 | .scroll-style::-webkit-scrollbar { 120 | width: 12px; 121 | background-color: var(--primary-light-gray); 122 | } 123 | 124 | .scroll-style::-webkit-scrollbar-thumb { 125 | background-color: var(--primary-navy-blue); 126 | } 127 | -------------------------------------------------------------------------------- /client/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import './index.css'; 4 | import App from './App'; 5 | 6 | const root = ReactDOM.createRoot(document.getElementById('root')); 7 | root.render( 8 | 9 | 10 | 11 | ); 12 | 13 | -------------------------------------------------------------------------------- /client/src/pages/Chat/Chat.jsx: -------------------------------------------------------------------------------- 1 | import Friends from "../../components/Friends/Friends"; 2 | import FriendsPopup from "../../components/Friends/addFriends"; 3 | import { useState, useEffect, useRef } from "react"; 4 | import { useNavigate } from "react-router-dom"; 5 | import axios from "axios"; 6 | import { host, getFriendsRoute } from "../../utils/APIRoutes"; 7 | import Home from "../../components/Home/Home"; 8 | import Messages from "../../components/Messages/Messages"; 9 | import { io } from "socket.io-client"; 10 | import "./style.css"; 11 | import NavBar from "../../components/NavBar/NavBar"; 12 | 13 | export default function Chat() { 14 | const socket = useRef(); 15 | const navigate = useNavigate(); 16 | const [curUser, setCurUser] = useState(undefined); 17 | const [curChat, setCurChat] = useState(undefined); 18 | const [friends, setFriends] = useState([]); 19 | const [isLoaded, setIsLoaded] = useState(false); 20 | 21 | // the API is using this id to get friends. 22 | const uid = JSON.parse(localStorage.getItem("_id")); 23 | 24 | async function fetchUser() { 25 | if (!localStorage.getItem("react-chat-user")) { 26 | navigate("/login"); 27 | } else { 28 | setCurUser(await JSON.parse(localStorage.getItem("react-chat-user"))); 29 | setIsLoaded(true); 30 | } 31 | } 32 | 33 | async function fetchData() { 34 | if (curUser) { 35 | const res = await axios.get(`${getFriendsRoute}/${uid}`); 36 | if (res.data.status === false) { 37 | localStorage.clear(); 38 | navigate("/login"); 39 | } 40 | setFriends(res.data.friends); 41 | } 42 | } 43 | 44 | useEffect(() => { 45 | fetchUser(); 46 | }, []); 47 | 48 | useEffect(() => { 49 | if (curUser) { 50 | socket.current = io(host); 51 | socket.current.emit("add-user", curUser.email); 52 | } 53 | }, [curUser]); 54 | 55 | useEffect(() => { 56 | fetchData(); 57 | }, [curUser]); 58 | 59 | function handleChatChange(chat) { 60 | setCurChat(chat); 61 | } 62 | 63 | return ( 64 |
65 | {curUser && ( 66 |
67 | 68 |
69 | )} 70 | 71 |
72 | 73 | 74 | {isLoaded && curChat === undefined ? ( 75 | 76 | ) : ( 77 | 78 | )} 79 |
80 |
81 | ); 82 | } 83 | -------------------------------------------------------------------------------- /client/src/pages/Chat/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: Arial, sans-serif; 3 | margin: 0; 4 | padding: 0; 5 | } 6 | 7 | .logout-btn { 8 | margin-left: auto; 9 | width: 10%; 10 | height: 80%; 11 | font-size: 20px; 12 | margin-right: 10px; 13 | background-color: var(--primary-navy-blue); 14 | color: var(--primary-off-white); 15 | border: none; 16 | outline: none; 17 | border-radius: 12px; 18 | transition: background-color 0.3s, color 0.3s, border 0.3s; 19 | } 20 | 21 | .logout-btn:hover { 22 | background-color: var(--primary-off-white); 23 | color: var(--primary-navy-blue); 24 | border: 2px solid var(--primary-navy-blue); 25 | cursor: pointer; 26 | } 27 | 28 | .chat-container { 29 | width: 100%; 30 | height: 100%; 31 | /* max-width: 800px; */ 32 | /* height: 600px; */ 33 | background-color: var(--primary-off-white); 34 | border: 2px solid var(--primary-navy-blue); 35 | margin: 0 auto; 36 | display: flex; 37 | flex-direction: column; 38 | justify-content: space-between; 39 | box-shadow: 0 0 10px var(--primary-navy-blue); 40 | } 41 | 42 | .chat-navbar { 43 | display: flex; 44 | align-items: center; 45 | justify-content: space-between; 46 | padding: 0 20px; 47 | height: 75px; 48 | font-size: 26px; 49 | border-bottom: 2px solid var(--primary-navy-blue); 50 | } 51 | 52 | .chat-header { 53 | color: var(--primary-navy-blue); 54 | } 55 | 56 | .chat-main { 57 | flex: 1; 58 | display: flex; 59 | justify-content: center; 60 | align-items: center; 61 | /* font-size: 20px; */ 62 | color: var(black); 63 | background: radial-gradient( 64 | circle, 65 | rgb(243, 208, 208) 0%, 66 | rgba(39, 187, 255, 0.5) 50%, 67 | rgb(1, 174, 255) 100% 68 | ); 69 | } 70 | 71 | @media screen and (max-width: 800px) { 72 | .chat-container { 73 | height: 100vh; 74 | } 75 | 76 | .chat-navbar { 77 | height: 10vh; 78 | font-size: 20px; 79 | } 80 | 81 | .chat-main { 82 | font-size: 16px; 83 | } 84 | 85 | .logout-btn { 86 | margin-right: 0px; 87 | width: 30%; 88 | height: 50%; 89 | font-size: 15px; 90 | } 91 | 92 | .chat-header { 93 | font-size: 15px; 94 | } 95 | 96 | .chat-main { 97 | font-size: 16px; 98 | } 99 | } 100 | -------------------------------------------------------------------------------- /client/src/pages/Login/Login.jsx: -------------------------------------------------------------------------------- 1 | import { useEffect } from 'react'; 2 | import { json, useNavigate } from 'react-router-dom'; 3 | import { toast, ToastContainer } from 'react-toastify'; 4 | import 'react-toastify/dist/ReactToastify.css'; 5 | import { signInWithPopup, GoogleAuthProvider } from 'firebase/auth'; 6 | import { auth } from '../../firebase/firebaseConfig'; 7 | import axios from 'axios'; 8 | import googleIcon from './google-icon.png.png'; // Import the Google icon image 9 | import './style.css'; 10 | import { checkUserRoute, loginRoute, registerRoute } from "../../utils/APIRoutes"; 11 | import { FcGoogle } from 'react-icons/fc' 12 | 13 | export default function Login () { 14 | const navigate = useNavigate(); 15 | const provider = new GoogleAuthProvider(); 16 | var username = null; 17 | var user = null; 18 | var uid = null; 19 | var pass = null; 20 | var mail = null; 21 | var existing = null 22 | const toastProps = { 23 | className: "custom-toast", 24 | draggable: false, 25 | autoClose: 7000, 26 | position: toast.POSITION.BOTTOM_RIGHT, 27 | theme: "colored", 28 | }; 29 | 30 | async function validate ({ username, uid, password, mail }) { 31 | existing = await axios.post(checkUserRoute, { //check if the user exists 32 | mail, 33 | }, { 34 | withCredentials: true 35 | }); 36 | if (existing.data.status === false) { 37 | const data = await axios.post(registerRoute, { //if not create one. 38 | username, 39 | mail, 40 | password, 41 | uid, 42 | }, { 43 | withCredentials: true 44 | }); 45 | localStorage.setItem("id", JSON.stringify(data.data.user._id)); 46 | } else { 47 | console.log('existing'); 48 | const existUser = existing.data.user; 49 | const _id = existUser._id; 50 | console.log(_id); 51 | console.log(existing.data) 52 | localStorage.setItem("_id", JSON.stringify(_id)); //if yes, add data to localstorage 53 | // localStorage.setItem("react-chat-user", JSON.stringify(existing.returnedUser)); 54 | } 55 | } 56 | 57 | const signInWithGoogle = async () => { 58 | signInWithPopup(auth, provider) 59 | .then((result) => { 60 | console.log('in results:' + result); 61 | console.log(result.user); 62 | user = result.user; 63 | uid = user.uid; 64 | mail = user.email; 65 | username = user.displayName; 66 | 67 | result.user 68 | .getIdToken() 69 | .then((token) => { 70 | // the idea is to add the user to our DB if they login with google, because otherwise we can't really do anything. 71 | validate({ username, uid, pass, mail }); 72 | console.log('Tokens: ' + token); 73 | }) 74 | .catch((error) => { 75 | console.log(error); 76 | }); 77 | 78 | localStorage.setItem('react-chat-user', JSON.stringify(result.user)); 79 | console.log("User registered"); 80 | navigate("/"); 81 | }) 82 | .catch((error) => { 83 | console.log(error); 84 | }); 85 | }; 86 | 87 | useEffect(() => { 88 | if (localStorage.getItem('react-chat-user')) { 89 | navigate("/"); 90 | } 91 | }, []); 92 | 93 | return ( 94 |
95 | 96 |

97 | Swingyy 98 |

99 |
100 |

101 | Swingyy is a real-time chat application that allows users to connect 102 | and communicate with their friends instantly. With Swingyy, you can 103 | send and receive messages in real-time, mark messages as seen or 104 | unseen, and stay updated with the online/offline status of your 105 | friends. 106 |

107 |
108 |
109 |
110 | 115 | 116 |
117 |

Login Now

118 |
119 |
120 | 121 |
122 | 127 | 128 |
129 |

Sign up

130 |
131 |
132 |
133 |
134 | ); 135 | } 136 | -------------------------------------------------------------------------------- /client/src/pages/Login/background_image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/client/src/pages/Login/background_image.jpg -------------------------------------------------------------------------------- /client/src/pages/Login/google-icon.png.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ankitrout2903/Swingyy/a68cde7caa242734ff32e7e32b63afb7803a8e53/client/src/pages/Login/google-icon.png.png -------------------------------------------------------------------------------- /client/src/pages/Login/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; 6 | } 7 | body { 8 | display: flex; 9 | justify-content: center; 10 | align-items: center; 11 | min-height: 100vh; 12 | background: url(background_image.jpg) no-repeat fixed; 13 | background-size: cover; 14 | background-position: center; 15 | } 16 | .wrapper { 17 | position: relative; 18 | width: 50%; 19 | right: 10px; 20 | top: 10px; 21 | background: transparent; 22 | border: 2px solid rgba(255, 255, 255, 0.2); 23 | backdrop-filter: blur(20px); 24 | box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 25 | color: #fff; 26 | border-radius: 10px; 27 | padding: 30px 40px; 28 | } 29 | .wrapper h1 { 30 | font-size: 36px; 31 | text-align: center; 32 | } 33 | .wrapper h1 span { 34 | color: rgb(0, 255, 234); 35 | } 36 | .wrapper .description { 37 | width: 100%; 38 | height: 100%; 39 | position: relative; 40 | margin-top: 20px; 41 | margin-bottom: 20px; 42 | } 43 | .wrapper .btn { 44 | max-width: 100%; 45 | display: block; 46 | margin: auto; 47 | width: 60px; 48 | height: 58px; 49 | background: #fff; 50 | border: none; 51 | outline: none; 52 | border-radius: 40px; 53 | box-shadow: 0 0 20px rgb(0, 255, 234); 54 | cursor: pointer; 55 | font-size: 50px; 56 | } 57 | .wrapper .btn:hover { 58 | scale: 1.1; 59 | } 60 | .wrapper .text { 61 | font-size: 15px; 62 | font-weight: 700; 63 | text-align: center; 64 | margin-top: 10px; 65 | } 66 | 67 | .signIn-container { 68 | display: flex; 69 | justify-content: space-around; 70 | align-items: center; 71 | } 72 | @media screen and (max-width: 800px) { 73 | .wrapper { 74 | width: 100%; 75 | } 76 | } -------------------------------------------------------------------------------- /client/src/pages/Register/Register.jsx: -------------------------------------------------------------------------------- 1 | import {BsArrowRight, BsEnvelopeFill, BsFillPersonFill, BsLockFill} from 'react-icons/bs'; 2 | import {useState, useEffect} from 'react'; 3 | import {Link, useNavigate} from 'react-router-dom'; 4 | import {ToastContainer, toast} from 'react-toastify'; 5 | import 'react-toastify/dist/ReactToastify.css'; 6 | import {registerRoute} from '../../utils/APIRoutes' 7 | import axios from 'axios'; 8 | import './style.css'; 9 | 10 | export default function Register(){ 11 | const navigate = useNavigate(); 12 | 13 | const [userInfo, setUserInfo] = useState({ 14 | username: "", 15 | email: "", 16 | password: "", 17 | confirmPassword: "", 18 | }) 19 | 20 | const toastProps = { 21 | className: "custom-toast", 22 | autoClose: 7000, 23 | draggable: false, 24 | position: toast.POSITION.BOTTOM_RIGHT, 25 | theme: "colored", 26 | }; 27 | 28 | useEffect(() => { 29 | if (localStorage.getItem('react-chat-user')){ 30 | navigate("/"); 31 | } 32 | }, []); 33 | 34 | function handleChange(e){ 35 | setUserInfo({...userInfo, [e.target.name]:e.target.value}); 36 | } 37 | 38 | async function handleSubmit(e){ 39 | e.preventDefault(); 40 | if (validate()){ 41 | const {username, email, password} = userInfo; 42 | const {data} = await axios.post(registerRoute, { 43 | username, 44 | email, 45 | password, 46 | },{ 47 | //AxiosRequestConfig parameter 48 | withCredentials: true //correct 49 | }); 50 | if (data.status === false){ 51 | toast.warning("Username/Email are unavailable", toastProps); 52 | console.log(data.msg); 53 | } 54 | if (data.status === true){ 55 | localStorage.setItem("react-chat-user", JSON.stringify(data.returnedUser)); 56 | navigate("/"); 57 | } 58 | }else{ 59 | console.log("Failed to register account"); 60 | } 61 | } 62 | 63 | function validate(){ 64 | const {username, email, password, confirmPassword} = userInfo; 65 | if (username.length < 3){ 66 | toast.warning('username must be atleast 3 characters', toastProps); 67 | return false; 68 | } 69 | if (email.length < 8){ 70 | toast.warning('email must be atleast 8 characters', toastProps); 71 | return false; 72 | } 73 | if (password.length < 8){ 74 | toast.warning('password must be atleast 8 characters', toastProps); 75 | return false; 76 | } 77 | if (password !== confirmPassword){ 78 | toast.warning('passwords must match', toastProps); 79 | return false; 80 | } 81 | 82 | return true; 83 | } 84 | 85 | 86 | return ( 87 |
88 |

Welcome!

89 |

Enter your information to register

90 |
91 |
92 | 93 | 100 |
101 |
102 | 103 | 110 |
111 |
112 | 113 | 120 |
121 |
122 | 123 | 130 |
131 |
132 | 133 | 137 |
138 | Press Here to Login Instead 139 |
140 | 141 |
142 | ) 143 | } -------------------------------------------------------------------------------- /client/src/pages/Register/style.css: -------------------------------------------------------------------------------- 1 | .register-container{ 2 | text-align: center; 3 | color: var(--secondary-bright-blue); 4 | } 5 | 6 | .register-form{ 7 | display: flex; 8 | flex-direction: column; 9 | width: 500px; 10 | height: 600px; 11 | align-items: center; 12 | justify-content: center; 13 | } -------------------------------------------------------------------------------- /client/src/utils/APIRoutes.js: -------------------------------------------------------------------------------- 1 | export const host = "http://localhost:3001"; 2 | export const registerRoute = `${host}/api/auth/register`; 3 | export const loginRoute = `${host}/api/auth/login`; 4 | export const allUsersRoute = `${host}/api/auth/allUsers`; 5 | export const sendMsgRoute = `${host}/api/messages/addmsg`; 6 | export const getMsgsRoute = `${host}/api/messages/getmsg`; 7 | export const checkUserRoute = `${host}/api/auth/getUser`; //to check if the user exists in the database 8 | export const addFriendsRoute = `${host}/api/friends/addFriend`; 9 | export const getFriendsRoute = `${host}/api/friends/getFriends`; 10 | export const getPossibleFriendsRoute = `${host}/api/friends/getPossibleFriends`; //to get all the users except the current user and friends of the current user. -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Swingyy", 3 | "lockfileVersion": 3, 4 | "requires": true, 5 | "packages": { 6 | "": { 7 | "devDependencies": { 8 | "autoprefixer": "^10.4.16", 9 | "daisyui": "^3.8.2", 10 | "postcss": "^8.4.31", 11 | "tailwindcss": "^3.3.3" 12 | } 13 | }, 14 | "node_modules/@alloc/quick-lru": { 15 | "version": "5.2.0", 16 | "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", 17 | "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==", 18 | "dev": true, 19 | "engines": { 20 | "node": ">=10" 21 | }, 22 | "funding": { 23 | "url": "https://github.com/sponsors/sindresorhus" 24 | } 25 | }, 26 | "node_modules/@jridgewell/gen-mapping": { 27 | "version": "0.3.3", 28 | "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", 29 | "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==", 30 | "dev": true, 31 | "dependencies": { 32 | "@jridgewell/set-array": "^1.0.1", 33 | "@jridgewell/sourcemap-codec": "^1.4.10", 34 | "@jridgewell/trace-mapping": "^0.3.9" 35 | }, 36 | "engines": { 37 | "node": ">=6.0.0" 38 | } 39 | }, 40 | "node_modules/@jridgewell/resolve-uri": { 41 | "version": "3.1.1", 42 | "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz", 43 | "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==", 44 | "dev": true, 45 | "engines": { 46 | "node": ">=6.0.0" 47 | } 48 | }, 49 | "node_modules/@jridgewell/set-array": { 50 | "version": "1.1.2", 51 | "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz", 52 | "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==", 53 | "dev": true, 54 | "engines": { 55 | "node": ">=6.0.0" 56 | } 57 | }, 58 | "node_modules/@jridgewell/sourcemap-codec": { 59 | "version": "1.4.15", 60 | "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz", 61 | "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==", 62 | "dev": true 63 | }, 64 | "node_modules/@jridgewell/trace-mapping": { 65 | "version": "0.3.19", 66 | "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.19.tgz", 67 | "integrity": "sha512-kf37QtfW+Hwx/buWGMPcR60iF9ziHa6r/CZJIHbmcm4+0qrXiVdxegAH0F6yddEVQ7zdkjcGCgCzUu+BcbhQxw==", 68 | "dev": true, 69 | "dependencies": { 70 | "@jridgewell/resolve-uri": "^3.1.0", 71 | "@jridgewell/sourcemap-codec": "^1.4.14" 72 | } 73 | }, 74 | "node_modules/@nodelib/fs.scandir": { 75 | "version": "2.1.5", 76 | "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", 77 | "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", 78 | "dev": true, 79 | "dependencies": { 80 | "@nodelib/fs.stat": "2.0.5", 81 | "run-parallel": "^1.1.9" 82 | }, 83 | "engines": { 84 | "node": ">= 8" 85 | } 86 | }, 87 | "node_modules/@nodelib/fs.stat": { 88 | "version": "2.0.5", 89 | "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", 90 | "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", 91 | "dev": true, 92 | "engines": { 93 | "node": ">= 8" 94 | } 95 | }, 96 | "node_modules/@nodelib/fs.walk": { 97 | "version": "1.2.8", 98 | "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", 99 | "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", 100 | "dev": true, 101 | "dependencies": { 102 | "@nodelib/fs.scandir": "2.1.5", 103 | "fastq": "^1.6.0" 104 | }, 105 | "engines": { 106 | "node": ">= 8" 107 | } 108 | }, 109 | "node_modules/any-promise": { 110 | "version": "1.3.0", 111 | "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", 112 | "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==", 113 | "dev": true 114 | }, 115 | "node_modules/anymatch": { 116 | "version": "3.1.3", 117 | "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz", 118 | "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==", 119 | "dev": true, 120 | "dependencies": { 121 | "normalize-path": "^3.0.0", 122 | "picomatch": "^2.0.4" 123 | }, 124 | "engines": { 125 | "node": ">= 8" 126 | } 127 | }, 128 | "node_modules/arg": { 129 | "version": "5.0.2", 130 | "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz", 131 | "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==", 132 | "dev": true 133 | }, 134 | "node_modules/autoprefixer": { 135 | "version": "10.4.16", 136 | "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz", 137 | "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==", 138 | "dev": true, 139 | "funding": [ 140 | { 141 | "type": "opencollective", 142 | "url": "https://opencollective.com/postcss/" 143 | }, 144 | { 145 | "type": "tidelift", 146 | "url": "https://tidelift.com/funding/github/npm/autoprefixer" 147 | }, 148 | { 149 | "type": "github", 150 | "url": "https://github.com/sponsors/ai" 151 | } 152 | ], 153 | "dependencies": { 154 | "browserslist": "^4.21.10", 155 | "caniuse-lite": "^1.0.30001538", 156 | "fraction.js": "^4.3.6", 157 | "normalize-range": "^0.1.2", 158 | "picocolors": "^1.0.0", 159 | "postcss-value-parser": "^4.2.0" 160 | }, 161 | "bin": { 162 | "autoprefixer": "bin/autoprefixer" 163 | }, 164 | "engines": { 165 | "node": "^10 || ^12 || >=14" 166 | }, 167 | "peerDependencies": { 168 | "postcss": "^8.1.0" 169 | } 170 | }, 171 | "node_modules/balanced-match": { 172 | "version": "1.0.2", 173 | "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", 174 | "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", 175 | "dev": true 176 | }, 177 | "node_modules/binary-extensions": { 178 | "version": "2.2.0", 179 | "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", 180 | "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", 181 | "dev": true, 182 | "engines": { 183 | "node": ">=8" 184 | } 185 | }, 186 | "node_modules/brace-expansion": { 187 | "version": "1.1.11", 188 | "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", 189 | "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", 190 | "dev": true, 191 | "dependencies": { 192 | "balanced-match": "^1.0.0", 193 | "concat-map": "0.0.1" 194 | } 195 | }, 196 | "node_modules/braces": { 197 | "version": "3.0.2", 198 | "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", 199 | "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", 200 | "dev": true, 201 | "dependencies": { 202 | "fill-range": "^7.0.1" 203 | }, 204 | "engines": { 205 | "node": ">=8" 206 | } 207 | }, 208 | "node_modules/browserslist": { 209 | "version": "4.22.1", 210 | "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.1.tgz", 211 | "integrity": "sha512-FEVc202+2iuClEhZhrWy6ZiAcRLvNMyYcxZ8raemul1DYVOVdFsbqckWLdsixQZCpJlwe77Z3UTalE7jsjnKfQ==", 212 | "dev": true, 213 | "funding": [ 214 | { 215 | "type": "opencollective", 216 | "url": "https://opencollective.com/browserslist" 217 | }, 218 | { 219 | "type": "tidelift", 220 | "url": "https://tidelift.com/funding/github/npm/browserslist" 221 | }, 222 | { 223 | "type": "github", 224 | "url": "https://github.com/sponsors/ai" 225 | } 226 | ], 227 | "dependencies": { 228 | "caniuse-lite": "^1.0.30001541", 229 | "electron-to-chromium": "^1.4.535", 230 | "node-releases": "^2.0.13", 231 | "update-browserslist-db": "^1.0.13" 232 | }, 233 | "bin": { 234 | "browserslist": "cli.js" 235 | }, 236 | "engines": { 237 | "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" 238 | } 239 | }, 240 | "node_modules/camelcase-css": { 241 | "version": "2.0.1", 242 | "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz", 243 | "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==", 244 | "dev": true, 245 | "engines": { 246 | "node": ">= 6" 247 | } 248 | }, 249 | "node_modules/caniuse-lite": { 250 | "version": "1.0.30001541", 251 | "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001541.tgz", 252 | "integrity": "sha512-bLOsqxDgTqUBkzxbNlSBt8annkDpQB9NdzdTbO2ooJ+eC/IQcvDspDc058g84ejCelF7vHUx57KIOjEecOHXaw==", 253 | "dev": true, 254 | "funding": [ 255 | { 256 | "type": "opencollective", 257 | "url": "https://opencollective.com/browserslist" 258 | }, 259 | { 260 | "type": "tidelift", 261 | "url": "https://tidelift.com/funding/github/npm/caniuse-lite" 262 | }, 263 | { 264 | "type": "github", 265 | "url": "https://github.com/sponsors/ai" 266 | } 267 | ] 268 | }, 269 | "node_modules/chokidar": { 270 | "version": "3.5.3", 271 | "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", 272 | "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", 273 | "dev": true, 274 | "funding": [ 275 | { 276 | "type": "individual", 277 | "url": "https://paulmillr.com/funding/" 278 | } 279 | ], 280 | "dependencies": { 281 | "anymatch": "~3.1.2", 282 | "braces": "~3.0.2", 283 | "glob-parent": "~5.1.2", 284 | "is-binary-path": "~2.1.0", 285 | "is-glob": "~4.0.1", 286 | "normalize-path": "~3.0.0", 287 | "readdirp": "~3.6.0" 288 | }, 289 | "engines": { 290 | "node": ">= 8.10.0" 291 | }, 292 | "optionalDependencies": { 293 | "fsevents": "~2.3.2" 294 | } 295 | }, 296 | "node_modules/chokidar/node_modules/glob-parent": { 297 | "version": "5.1.2", 298 | "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", 299 | "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", 300 | "dev": true, 301 | "dependencies": { 302 | "is-glob": "^4.0.1" 303 | }, 304 | "engines": { 305 | "node": ">= 6" 306 | } 307 | }, 308 | "node_modules/colord": { 309 | "version": "2.9.3", 310 | "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz", 311 | "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==", 312 | "dev": true 313 | }, 314 | "node_modules/commander": { 315 | "version": "4.1.1", 316 | "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", 317 | "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==", 318 | "dev": true, 319 | "engines": { 320 | "node": ">= 6" 321 | } 322 | }, 323 | "node_modules/concat-map": { 324 | "version": "0.0.1", 325 | "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", 326 | "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", 327 | "dev": true 328 | }, 329 | "node_modules/css-selector-tokenizer": { 330 | "version": "0.8.0", 331 | "resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.8.0.tgz", 332 | "integrity": "sha512-Jd6Ig3/pe62/qe5SBPTN8h8LeUg/pT4lLgtavPf7updwwHpvFzxvOQBHYj2LZDMjUnBzgvIUSjRcf6oT5HzHFg==", 333 | "dev": true, 334 | "dependencies": { 335 | "cssesc": "^3.0.0", 336 | "fastparse": "^1.1.2" 337 | } 338 | }, 339 | "node_modules/cssesc": { 340 | "version": "3.0.0", 341 | "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", 342 | "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", 343 | "dev": true, 344 | "bin": { 345 | "cssesc": "bin/cssesc" 346 | }, 347 | "engines": { 348 | "node": ">=4" 349 | } 350 | }, 351 | "node_modules/daisyui": { 352 | "version": "3.8.2", 353 | "resolved": "https://registry.npmjs.org/daisyui/-/daisyui-3.8.2.tgz", 354 | "integrity": "sha512-Dxq4AzYPfUOhrqqs1wdKLE4GUVGc3mJf8asdY7AHoI5QVBgqItU3fsd1idpHDnOJNdaTHmZGo0jvQtXr5IOejw==", 355 | "dev": true, 356 | "dependencies": { 357 | "colord": "^2.9", 358 | "css-selector-tokenizer": "^0.8", 359 | "postcss": "^8", 360 | "postcss-js": "^4", 361 | "tailwindcss": "^3" 362 | }, 363 | "engines": { 364 | "node": ">=16.9.0" 365 | }, 366 | "funding": { 367 | "type": "opencollective", 368 | "url": "https://opencollective.com/daisyui" 369 | } 370 | }, 371 | "node_modules/didyoumean": { 372 | "version": "1.2.2", 373 | "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz", 374 | "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==", 375 | "dev": true 376 | }, 377 | "node_modules/dlv": { 378 | "version": "1.1.3", 379 | "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", 380 | "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==", 381 | "dev": true 382 | }, 383 | "node_modules/electron-to-chromium": { 384 | "version": "1.4.537", 385 | "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.537.tgz", 386 | "integrity": "sha512-W1+g9qs9hviII0HAwOdehGYkr+zt7KKdmCcJcjH0mYg6oL8+ioT3Skjmt7BLoAQqXhjf40AXd+HlR4oAWMlXjA==", 387 | "dev": true 388 | }, 389 | "node_modules/escalade": { 390 | "version": "3.1.1", 391 | "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", 392 | "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==", 393 | "dev": true, 394 | "engines": { 395 | "node": ">=6" 396 | } 397 | }, 398 | "node_modules/fast-glob": { 399 | "version": "3.3.1", 400 | "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.1.tgz", 401 | "integrity": "sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==", 402 | "dev": true, 403 | "dependencies": { 404 | "@nodelib/fs.stat": "^2.0.2", 405 | "@nodelib/fs.walk": "^1.2.3", 406 | "glob-parent": "^5.1.2", 407 | "merge2": "^1.3.0", 408 | "micromatch": "^4.0.4" 409 | }, 410 | "engines": { 411 | "node": ">=8.6.0" 412 | } 413 | }, 414 | "node_modules/fast-glob/node_modules/glob-parent": { 415 | "version": "5.1.2", 416 | "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", 417 | "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", 418 | "dev": true, 419 | "dependencies": { 420 | "is-glob": "^4.0.1" 421 | }, 422 | "engines": { 423 | "node": ">= 6" 424 | } 425 | }, 426 | "node_modules/fastparse": { 427 | "version": "1.1.2", 428 | "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz", 429 | "integrity": "sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==", 430 | "dev": true 431 | }, 432 | "node_modules/fastq": { 433 | "version": "1.15.0", 434 | "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz", 435 | "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==", 436 | "dev": true, 437 | "dependencies": { 438 | "reusify": "^1.0.4" 439 | } 440 | }, 441 | "node_modules/fill-range": { 442 | "version": "7.0.1", 443 | "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", 444 | "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", 445 | "dev": true, 446 | "dependencies": { 447 | "to-regex-range": "^5.0.1" 448 | }, 449 | "engines": { 450 | "node": ">=8" 451 | } 452 | }, 453 | "node_modules/fraction.js": { 454 | "version": "4.3.6", 455 | "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.6.tgz", 456 | "integrity": "sha512-n2aZ9tNfYDwaHhvFTkhFErqOMIb8uyzSQ+vGJBjZyanAKZVbGUQ1sngfk9FdkBw7G26O7AgNjLcecLffD1c7eg==", 457 | "dev": true, 458 | "engines": { 459 | "node": "*" 460 | }, 461 | "funding": { 462 | "type": "patreon", 463 | "url": "https://github.com/sponsors/rawify" 464 | } 465 | }, 466 | "node_modules/fs.realpath": { 467 | "version": "1.0.0", 468 | "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", 469 | "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", 470 | "dev": true 471 | }, 472 | "node_modules/fsevents": { 473 | "version": "2.3.3", 474 | "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", 475 | "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", 476 | "dev": true, 477 | "hasInstallScript": true, 478 | "optional": true, 479 | "os": [ 480 | "darwin" 481 | ], 482 | "engines": { 483 | "node": "^8.16.0 || ^10.6.0 || >=11.0.0" 484 | } 485 | }, 486 | "node_modules/function-bind": { 487 | "version": "1.1.1", 488 | "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", 489 | "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==", 490 | "dev": true 491 | }, 492 | "node_modules/glob": { 493 | "version": "7.1.6", 494 | "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz", 495 | "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==", 496 | "dev": true, 497 | "dependencies": { 498 | "fs.realpath": "^1.0.0", 499 | "inflight": "^1.0.4", 500 | "inherits": "2", 501 | "minimatch": "^3.0.4", 502 | "once": "^1.3.0", 503 | "path-is-absolute": "^1.0.0" 504 | }, 505 | "engines": { 506 | "node": "*" 507 | }, 508 | "funding": { 509 | "url": "https://github.com/sponsors/isaacs" 510 | } 511 | }, 512 | "node_modules/glob-parent": { 513 | "version": "6.0.2", 514 | "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", 515 | "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==", 516 | "dev": true, 517 | "dependencies": { 518 | "is-glob": "^4.0.3" 519 | }, 520 | "engines": { 521 | "node": ">=10.13.0" 522 | } 523 | }, 524 | "node_modules/has": { 525 | "version": "1.0.3", 526 | "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", 527 | "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", 528 | "dev": true, 529 | "dependencies": { 530 | "function-bind": "^1.1.1" 531 | }, 532 | "engines": { 533 | "node": ">= 0.4.0" 534 | } 535 | }, 536 | "node_modules/inflight": { 537 | "version": "1.0.6", 538 | "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", 539 | "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==", 540 | "dev": true, 541 | "dependencies": { 542 | "once": "^1.3.0", 543 | "wrappy": "1" 544 | } 545 | }, 546 | "node_modules/inherits": { 547 | "version": "2.0.4", 548 | "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", 549 | "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", 550 | "dev": true 551 | }, 552 | "node_modules/is-binary-path": { 553 | "version": "2.1.0", 554 | "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", 555 | "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", 556 | "dev": true, 557 | "dependencies": { 558 | "binary-extensions": "^2.0.0" 559 | }, 560 | "engines": { 561 | "node": ">=8" 562 | } 563 | }, 564 | "node_modules/is-core-module": { 565 | "version": "2.13.0", 566 | "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.0.tgz", 567 | "integrity": "sha512-Z7dk6Qo8pOCp3l4tsX2C5ZVas4V+UxwQodwZhLopL91TX8UyyHEXafPcyoeeWuLrwzHcr3igO78wNLwHJHsMCQ==", 568 | "dev": true, 569 | "dependencies": { 570 | "has": "^1.0.3" 571 | }, 572 | "funding": { 573 | "url": "https://github.com/sponsors/ljharb" 574 | } 575 | }, 576 | "node_modules/is-extglob": { 577 | "version": "2.1.1", 578 | "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", 579 | "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", 580 | "dev": true, 581 | "engines": { 582 | "node": ">=0.10.0" 583 | } 584 | }, 585 | "node_modules/is-glob": { 586 | "version": "4.0.3", 587 | "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", 588 | "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", 589 | "dev": true, 590 | "dependencies": { 591 | "is-extglob": "^2.1.1" 592 | }, 593 | "engines": { 594 | "node": ">=0.10.0" 595 | } 596 | }, 597 | "node_modules/is-number": { 598 | "version": "7.0.0", 599 | "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", 600 | "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", 601 | "dev": true, 602 | "engines": { 603 | "node": ">=0.12.0" 604 | } 605 | }, 606 | "node_modules/jiti": { 607 | "version": "1.20.0", 608 | "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.20.0.tgz", 609 | "integrity": "sha512-3TV69ZbrvV6U5DfQimop50jE9Dl6J8O1ja1dvBbMba/sZ3YBEQqJ2VZRoQPVnhlzjNtU1vaXRZVrVjU4qtm8yA==", 610 | "dev": true, 611 | "bin": { 612 | "jiti": "bin/jiti.js" 613 | } 614 | }, 615 | "node_modules/lilconfig": { 616 | "version": "2.1.0", 617 | "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz", 618 | "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==", 619 | "dev": true, 620 | "engines": { 621 | "node": ">=10" 622 | } 623 | }, 624 | "node_modules/lines-and-columns": { 625 | "version": "1.2.4", 626 | "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", 627 | "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", 628 | "dev": true 629 | }, 630 | "node_modules/merge2": { 631 | "version": "1.4.1", 632 | "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", 633 | "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", 634 | "dev": true, 635 | "engines": { 636 | "node": ">= 8" 637 | } 638 | }, 639 | "node_modules/micromatch": { 640 | "version": "4.0.5", 641 | "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz", 642 | "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==", 643 | "dev": true, 644 | "dependencies": { 645 | "braces": "^3.0.2", 646 | "picomatch": "^2.3.1" 647 | }, 648 | "engines": { 649 | "node": ">=8.6" 650 | } 651 | }, 652 | "node_modules/minimatch": { 653 | "version": "3.1.2", 654 | "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", 655 | "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", 656 | "dev": true, 657 | "dependencies": { 658 | "brace-expansion": "^1.1.7" 659 | }, 660 | "engines": { 661 | "node": "*" 662 | } 663 | }, 664 | "node_modules/mz": { 665 | "version": "2.7.0", 666 | "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz", 667 | "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==", 668 | "dev": true, 669 | "dependencies": { 670 | "any-promise": "^1.0.0", 671 | "object-assign": "^4.0.1", 672 | "thenify-all": "^1.0.0" 673 | } 674 | }, 675 | "node_modules/nanoid": { 676 | "version": "3.3.6", 677 | "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.6.tgz", 678 | "integrity": "sha512-BGcqMMJuToF7i1rt+2PWSNVnWIkGCU78jBG3RxO/bZlnZPK2Cmi2QaffxGO/2RvWi9sL+FAiRiXMgsyxQ1DIDA==", 679 | "dev": true, 680 | "funding": [ 681 | { 682 | "type": "github", 683 | "url": "https://github.com/sponsors/ai" 684 | } 685 | ], 686 | "bin": { 687 | "nanoid": "bin/nanoid.cjs" 688 | }, 689 | "engines": { 690 | "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" 691 | } 692 | }, 693 | "node_modules/node-releases": { 694 | "version": "2.0.13", 695 | "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.13.tgz", 696 | "integrity": "sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==", 697 | "dev": true 698 | }, 699 | "node_modules/normalize-path": { 700 | "version": "3.0.0", 701 | "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", 702 | "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", 703 | "dev": true, 704 | "engines": { 705 | "node": ">=0.10.0" 706 | } 707 | }, 708 | "node_modules/normalize-range": { 709 | "version": "0.1.2", 710 | "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz", 711 | "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==", 712 | "dev": true, 713 | "engines": { 714 | "node": ">=0.10.0" 715 | } 716 | }, 717 | "node_modules/object-assign": { 718 | "version": "4.1.1", 719 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 720 | "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", 721 | "dev": true, 722 | "engines": { 723 | "node": ">=0.10.0" 724 | } 725 | }, 726 | "node_modules/object-hash": { 727 | "version": "3.0.0", 728 | "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz", 729 | "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==", 730 | "dev": true, 731 | "engines": { 732 | "node": ">= 6" 733 | } 734 | }, 735 | "node_modules/once": { 736 | "version": "1.4.0", 737 | "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", 738 | "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==", 739 | "dev": true, 740 | "dependencies": { 741 | "wrappy": "1" 742 | } 743 | }, 744 | "node_modules/path-is-absolute": { 745 | "version": "1.0.1", 746 | "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", 747 | "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==", 748 | "dev": true, 749 | "engines": { 750 | "node": ">=0.10.0" 751 | } 752 | }, 753 | "node_modules/path-parse": { 754 | "version": "1.0.7", 755 | "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", 756 | "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", 757 | "dev": true 758 | }, 759 | "node_modules/picocolors": { 760 | "version": "1.0.0", 761 | "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", 762 | "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", 763 | "dev": true 764 | }, 765 | "node_modules/picomatch": { 766 | "version": "2.3.1", 767 | "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", 768 | "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", 769 | "dev": true, 770 | "engines": { 771 | "node": ">=8.6" 772 | }, 773 | "funding": { 774 | "url": "https://github.com/sponsors/jonschlinkert" 775 | } 776 | }, 777 | "node_modules/pify": { 778 | "version": "2.3.0", 779 | "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", 780 | "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==", 781 | "dev": true, 782 | "engines": { 783 | "node": ">=0.10.0" 784 | } 785 | }, 786 | "node_modules/pirates": { 787 | "version": "4.0.6", 788 | "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz", 789 | "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==", 790 | "dev": true, 791 | "engines": { 792 | "node": ">= 6" 793 | } 794 | }, 795 | "node_modules/postcss": { 796 | "version": "8.4.31", 797 | "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz", 798 | "integrity": "sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==", 799 | "dev": true, 800 | "funding": [ 801 | { 802 | "type": "opencollective", 803 | "url": "https://opencollective.com/postcss/" 804 | }, 805 | { 806 | "type": "tidelift", 807 | "url": "https://tidelift.com/funding/github/npm/postcss" 808 | }, 809 | { 810 | "type": "github", 811 | "url": "https://github.com/sponsors/ai" 812 | } 813 | ], 814 | "dependencies": { 815 | "nanoid": "^3.3.6", 816 | "picocolors": "^1.0.0", 817 | "source-map-js": "^1.0.2" 818 | }, 819 | "engines": { 820 | "node": "^10 || ^12 || >=14" 821 | } 822 | }, 823 | "node_modules/postcss-import": { 824 | "version": "15.1.0", 825 | "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz", 826 | "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==", 827 | "dev": true, 828 | "dependencies": { 829 | "postcss-value-parser": "^4.0.0", 830 | "read-cache": "^1.0.0", 831 | "resolve": "^1.1.7" 832 | }, 833 | "engines": { 834 | "node": ">=14.0.0" 835 | }, 836 | "peerDependencies": { 837 | "postcss": "^8.0.0" 838 | } 839 | }, 840 | "node_modules/postcss-js": { 841 | "version": "4.0.1", 842 | "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz", 843 | "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==", 844 | "dev": true, 845 | "dependencies": { 846 | "camelcase-css": "^2.0.1" 847 | }, 848 | "engines": { 849 | "node": "^12 || ^14 || >= 16" 850 | }, 851 | "funding": { 852 | "type": "opencollective", 853 | "url": "https://opencollective.com/postcss/" 854 | }, 855 | "peerDependencies": { 856 | "postcss": "^8.4.21" 857 | } 858 | }, 859 | "node_modules/postcss-load-config": { 860 | "version": "4.0.1", 861 | "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.1.tgz", 862 | "integrity": "sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==", 863 | "dev": true, 864 | "dependencies": { 865 | "lilconfig": "^2.0.5", 866 | "yaml": "^2.1.1" 867 | }, 868 | "engines": { 869 | "node": ">= 14" 870 | }, 871 | "funding": { 872 | "type": "opencollective", 873 | "url": "https://opencollective.com/postcss/" 874 | }, 875 | "peerDependencies": { 876 | "postcss": ">=8.0.9", 877 | "ts-node": ">=9.0.0" 878 | }, 879 | "peerDependenciesMeta": { 880 | "postcss": { 881 | "optional": true 882 | }, 883 | "ts-node": { 884 | "optional": true 885 | } 886 | } 887 | }, 888 | "node_modules/postcss-nested": { 889 | "version": "6.0.1", 890 | "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz", 891 | "integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==", 892 | "dev": true, 893 | "dependencies": { 894 | "postcss-selector-parser": "^6.0.11" 895 | }, 896 | "engines": { 897 | "node": ">=12.0" 898 | }, 899 | "funding": { 900 | "type": "opencollective", 901 | "url": "https://opencollective.com/postcss/" 902 | }, 903 | "peerDependencies": { 904 | "postcss": "^8.2.14" 905 | } 906 | }, 907 | "node_modules/postcss-selector-parser": { 908 | "version": "6.0.13", 909 | "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz", 910 | "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==", 911 | "dev": true, 912 | "dependencies": { 913 | "cssesc": "^3.0.0", 914 | "util-deprecate": "^1.0.2" 915 | }, 916 | "engines": { 917 | "node": ">=4" 918 | } 919 | }, 920 | "node_modules/postcss-value-parser": { 921 | "version": "4.2.0", 922 | "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", 923 | "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", 924 | "dev": true 925 | }, 926 | "node_modules/queue-microtask": { 927 | "version": "1.2.3", 928 | "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", 929 | "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", 930 | "dev": true, 931 | "funding": [ 932 | { 933 | "type": "github", 934 | "url": "https://github.com/sponsors/feross" 935 | }, 936 | { 937 | "type": "patreon", 938 | "url": "https://www.patreon.com/feross" 939 | }, 940 | { 941 | "type": "consulting", 942 | "url": "https://feross.org/support" 943 | } 944 | ] 945 | }, 946 | "node_modules/read-cache": { 947 | "version": "1.0.0", 948 | "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", 949 | "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==", 950 | "dev": true, 951 | "dependencies": { 952 | "pify": "^2.3.0" 953 | } 954 | }, 955 | "node_modules/readdirp": { 956 | "version": "3.6.0", 957 | "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", 958 | "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", 959 | "dev": true, 960 | "dependencies": { 961 | "picomatch": "^2.2.1" 962 | }, 963 | "engines": { 964 | "node": ">=8.10.0" 965 | } 966 | }, 967 | "node_modules/resolve": { 968 | "version": "1.22.6", 969 | "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.6.tgz", 970 | "integrity": "sha512-njhxM7mV12JfufShqGy3Rz8j11RPdLy4xi15UurGJeoHLfJpVXKdh3ueuOqbYUcDZnffr6X739JBo5LzyahEsw==", 971 | "dev": true, 972 | "dependencies": { 973 | "is-core-module": "^2.13.0", 974 | "path-parse": "^1.0.7", 975 | "supports-preserve-symlinks-flag": "^1.0.0" 976 | }, 977 | "bin": { 978 | "resolve": "bin/resolve" 979 | }, 980 | "funding": { 981 | "url": "https://github.com/sponsors/ljharb" 982 | } 983 | }, 984 | "node_modules/reusify": { 985 | "version": "1.0.4", 986 | "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", 987 | "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==", 988 | "dev": true, 989 | "engines": { 990 | "iojs": ">=1.0.0", 991 | "node": ">=0.10.0" 992 | } 993 | }, 994 | "node_modules/run-parallel": { 995 | "version": "1.2.0", 996 | "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", 997 | "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", 998 | "dev": true, 999 | "funding": [ 1000 | { 1001 | "type": "github", 1002 | "url": "https://github.com/sponsors/feross" 1003 | }, 1004 | { 1005 | "type": "patreon", 1006 | "url": "https://www.patreon.com/feross" 1007 | }, 1008 | { 1009 | "type": "consulting", 1010 | "url": "https://feross.org/support" 1011 | } 1012 | ], 1013 | "dependencies": { 1014 | "queue-microtask": "^1.2.2" 1015 | } 1016 | }, 1017 | "node_modules/source-map-js": { 1018 | "version": "1.0.2", 1019 | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", 1020 | "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==", 1021 | "dev": true, 1022 | "engines": { 1023 | "node": ">=0.10.0" 1024 | } 1025 | }, 1026 | "node_modules/sucrase": { 1027 | "version": "3.34.0", 1028 | "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.34.0.tgz", 1029 | "integrity": "sha512-70/LQEZ07TEcxiU2dz51FKaE6hCTWC6vr7FOk3Gr0U60C3shtAN+H+BFr9XlYe5xqf3RA8nrc+VIwzCfnxuXJw==", 1030 | "dev": true, 1031 | "dependencies": { 1032 | "@jridgewell/gen-mapping": "^0.3.2", 1033 | "commander": "^4.0.0", 1034 | "glob": "7.1.6", 1035 | "lines-and-columns": "^1.1.6", 1036 | "mz": "^2.7.0", 1037 | "pirates": "^4.0.1", 1038 | "ts-interface-checker": "^0.1.9" 1039 | }, 1040 | "bin": { 1041 | "sucrase": "bin/sucrase", 1042 | "sucrase-node": "bin/sucrase-node" 1043 | }, 1044 | "engines": { 1045 | "node": ">=8" 1046 | } 1047 | }, 1048 | "node_modules/supports-preserve-symlinks-flag": { 1049 | "version": "1.0.0", 1050 | "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", 1051 | "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", 1052 | "dev": true, 1053 | "engines": { 1054 | "node": ">= 0.4" 1055 | }, 1056 | "funding": { 1057 | "url": "https://github.com/sponsors/ljharb" 1058 | } 1059 | }, 1060 | "node_modules/tailwindcss": { 1061 | "version": "3.3.3", 1062 | "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.3.tgz", 1063 | "integrity": "sha512-A0KgSkef7eE4Mf+nKJ83i75TMyq8HqY3qmFIJSWy8bNt0v1lG7jUcpGpoTFxAwYcWOphcTBLPPJg+bDfhDf52w==", 1064 | "dev": true, 1065 | "dependencies": { 1066 | "@alloc/quick-lru": "^5.2.0", 1067 | "arg": "^5.0.2", 1068 | "chokidar": "^3.5.3", 1069 | "didyoumean": "^1.2.2", 1070 | "dlv": "^1.1.3", 1071 | "fast-glob": "^3.2.12", 1072 | "glob-parent": "^6.0.2", 1073 | "is-glob": "^4.0.3", 1074 | "jiti": "^1.18.2", 1075 | "lilconfig": "^2.1.0", 1076 | "micromatch": "^4.0.5", 1077 | "normalize-path": "^3.0.0", 1078 | "object-hash": "^3.0.0", 1079 | "picocolors": "^1.0.0", 1080 | "postcss": "^8.4.23", 1081 | "postcss-import": "^15.1.0", 1082 | "postcss-js": "^4.0.1", 1083 | "postcss-load-config": "^4.0.1", 1084 | "postcss-nested": "^6.0.1", 1085 | "postcss-selector-parser": "^6.0.11", 1086 | "resolve": "^1.22.2", 1087 | "sucrase": "^3.32.0" 1088 | }, 1089 | "bin": { 1090 | "tailwind": "lib/cli.js", 1091 | "tailwindcss": "lib/cli.js" 1092 | }, 1093 | "engines": { 1094 | "node": ">=14.0.0" 1095 | } 1096 | }, 1097 | "node_modules/thenify": { 1098 | "version": "3.3.1", 1099 | "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz", 1100 | "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==", 1101 | "dev": true, 1102 | "dependencies": { 1103 | "any-promise": "^1.0.0" 1104 | } 1105 | }, 1106 | "node_modules/thenify-all": { 1107 | "version": "1.6.0", 1108 | "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz", 1109 | "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==", 1110 | "dev": true, 1111 | "dependencies": { 1112 | "thenify": ">= 3.1.0 < 4" 1113 | }, 1114 | "engines": { 1115 | "node": ">=0.8" 1116 | } 1117 | }, 1118 | "node_modules/to-regex-range": { 1119 | "version": "5.0.1", 1120 | "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", 1121 | "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", 1122 | "dev": true, 1123 | "dependencies": { 1124 | "is-number": "^7.0.0" 1125 | }, 1126 | "engines": { 1127 | "node": ">=8.0" 1128 | } 1129 | }, 1130 | "node_modules/ts-interface-checker": { 1131 | "version": "0.1.13", 1132 | "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", 1133 | "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==", 1134 | "dev": true 1135 | }, 1136 | "node_modules/update-browserslist-db": { 1137 | "version": "1.0.13", 1138 | "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz", 1139 | "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==", 1140 | "dev": true, 1141 | "funding": [ 1142 | { 1143 | "type": "opencollective", 1144 | "url": "https://opencollective.com/browserslist" 1145 | }, 1146 | { 1147 | "type": "tidelift", 1148 | "url": "https://tidelift.com/funding/github/npm/browserslist" 1149 | }, 1150 | { 1151 | "type": "github", 1152 | "url": "https://github.com/sponsors/ai" 1153 | } 1154 | ], 1155 | "dependencies": { 1156 | "escalade": "^3.1.1", 1157 | "picocolors": "^1.0.0" 1158 | }, 1159 | "bin": { 1160 | "update-browserslist-db": "cli.js" 1161 | }, 1162 | "peerDependencies": { 1163 | "browserslist": ">= 4.21.0" 1164 | } 1165 | }, 1166 | "node_modules/util-deprecate": { 1167 | "version": "1.0.2", 1168 | "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", 1169 | "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", 1170 | "dev": true 1171 | }, 1172 | "node_modules/wrappy": { 1173 | "version": "1.0.2", 1174 | "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", 1175 | "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==", 1176 | "dev": true 1177 | }, 1178 | "node_modules/yaml": { 1179 | "version": "2.3.2", 1180 | "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.3.2.tgz", 1181 | "integrity": "sha512-N/lyzTPaJasoDmfV7YTrYCI0G/3ivm/9wdG0aHuheKowWQwGTsK0Eoiw6utmzAnI6pkJa0DUVygvp3spqqEKXg==", 1182 | "dev": true, 1183 | "engines": { 1184 | "node": ">= 14" 1185 | } 1186 | } 1187 | } 1188 | } 1189 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "devDependencies": { 3 | "autoprefixer": "^10.4.16", 4 | "daisyui": "^3.8.2", 5 | "postcss": "^8.4.31", 6 | "tailwindcss": "^3.3.3" 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | export default { 3 | content: [ 4 | "./index.html", 5 | "./src/**/*.{js,ts,jsx,tsx}", 6 | ], 7 | theme: { 8 | extend: {}, 9 | }, 10 | plugins: [require("daisyui")], 11 | } --------------------------------------------------------------------------------