GGH/gg-backend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: file formatting

Browse Source
This commit is contained in:
Kailasdevdas
2026-05-26 15:48:01 +05:30
parent 8a21e0bf38
commit 78e2618a29
117 changed files with 12775 additions and 14638 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.prettierrc
+11 -11
View File
@@ -1,13 +1,13 @@
{
"printWidth": 120,
"useTabs": true,
"tabWidth": 2,
"trailingComma": "es5",
"semi": true,
"singleQuote": true,
"bracketSpacing": true,
"arrowParens": "always",
"jsxSingleQuote": false,
"bracketSameLine": false,
"endOfLine": "lf"
"printWidth": 120,
"useTabs": true,
"tabWidth": 2,
"trailingComma": "es5",
"semi": true,
"singleQuote": true,
"bracketSpacing": true,
"arrowParens": "always",
"jsxSingleQuote": false,
"bracketSameLine": false,
"endOfLine": "lf"
}
.vscode/settings.json
Vendored
+2 -2
View File
@@ -1,4 +1,4 @@
{
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
}
CLAUDE.md
+3
View File
@@ -35,6 +35,7 @@ npm run create-user <username> <password> [role] # role defaults to "admin"
```
In Docker, create an admin via:
```bash
docker exec -it gg-backend-api-backend-1 node src/utils/createUser.js <name> <password> <role>
```
@@ -86,6 +87,7 @@ Note the natural-key relations: `Appointment.doctorId` references `Doctor.doctor
## Environment variables
`backend/.env`:
```
DATABASE_URL=postgresql://user:password@db:5432/mydb
PORT=5008
@@ -97,6 +99,7 @@ EMAIL_FROM=admin@example.com
```
`frontend/.env`:
```
VITE_API_URL=http://localhost:5008/api
```
backend/prisma.config.js
+5 -5
View File
@@ -1,14 +1,14 @@
// This file was generated by Prisma, and assumes you have installed the following:
// npm install --save-dev prisma dotenv
import "dotenv/config";
import {defineConfig} from "prisma/config";
import 'dotenv/config';
import { defineConfig } from 'prisma/config';
export default defineConfig({
schema: "prisma/schema.prisma",
schema: 'prisma/schema.prisma',
migrations: {
path: "prisma/migrations",
path: 'prisma/migrations',
},
datasource: {
url: process.env["DATABASE_URL"],
url: process.env['DATABASE_URL'],
},
});
backend/src/app.js
+39 -39
View File
@@ -1,62 +1,62 @@
import express from "express";
import dotenv from "dotenv";
import cors from "cors";
import express from 'express';
import dotenv from 'dotenv';
import cors from 'cors';
import departmentRoutes from "./routes/department.routes.js";
import authRoutes from "./routes/auth.routes.js";
import blogRoutes from "./routes/blog.routes.js";
import uploadRoutes from "./routes/upload.routes.js";
import doctorRoutes from "./routes/doctor.routes.js";
import careerRoutes from "./routes/career.routes.js";
import candidateRoutes from "./routes/candidate.routes.js";
import appointmentRoutes from "./routes/appointment.routes.js";
import inquiryRoutes from "./routes/inquiry.routes.js";
import academicsResearchRoutes from "./routes/academicsResearch.routes.js";
import emailConfigRoutes from "./routes/emailConfig.routes.js";
import newsMediaRoutes from "./routes/newsMedia.routes.js";
import importRoutes from "./routes/importRoutes.js";
import healthCheckRoutes from "./routes/healthCheck.route.js";
import departmentRoutes from './routes/department.routes.js';
import authRoutes from './routes/auth.routes.js';
import blogRoutes from './routes/blog.routes.js';
import uploadRoutes from './routes/upload.routes.js';
import doctorRoutes from './routes/doctor.routes.js';
import careerRoutes from './routes/career.routes.js';
import candidateRoutes from './routes/candidate.routes.js';
import appointmentRoutes from './routes/appointment.routes.js';
import inquiryRoutes from './routes/inquiry.routes.js';
import academicsResearchRoutes from './routes/academicsResearch.routes.js';
import emailConfigRoutes from './routes/emailConfig.routes.js';
import newsMediaRoutes from './routes/newsMedia.routes.js';
import importRoutes from './routes/importRoutes.js';
import healthCheckRoutes from './routes/healthCheck.route.js';
dotenv.config();
const app = express();
app.use(express.json({ limit: "50mb" }));
app.use(express.urlencoded({ limit: "50mb", extended: true }));
app.use(express.json({ limit: '50mb' }));
app.use(express.urlencoded({ limit: '50mb', extended: true }));
const allowedOrigins = process.env.CORS_ALLOWED_ORIGINS
? process.env.CORS_ALLOWED_ORIGINS.split(" ")
: ["http://localhost:3001"];
? process.env.CORS_ALLOWED_ORIGINS.split(' ')
: ['http://localhost:3001'];
const corsOptions = {
origin: function (origin, callback) {
if (!origin || allowedOrigins.includes(origin)) {
callback(null, true);
} else {
callback(new Error("Not allowed by CORS"));
callback(new Error('Not allowed by CORS'));
}
},
methods: ["GET", "POST", "PUT", "DELETE", "PATCH"],
allowedHeaders: "*",
methods: ['GET', 'POST', 'PUT', 'DELETE', 'PATCH'],
allowedHeaders: '*',
};
app.use(cors(corsOptions));
app.use("/api/departments", departmentRoutes);
app.use("/api/auth", authRoutes);
app.use("/api/blogs", blogRoutes);
app.use("/uploads", express.static("uploads"));
app.use("/api/upload", uploadRoutes);
app.use("/api/doctors", doctorRoutes);
app.use("/api/careers", careerRoutes);
app.use("/api/candidates", candidateRoutes);
app.use("/api/appointments", appointmentRoutes);
app.use("/api/inquiry", inquiryRoutes);
app.use("/api/academics", academicsResearchRoutes);
app.use("/api/email", emailConfigRoutes);
app.use("/api/newsMedia", newsMediaRoutes);
app.use("/api/import", importRoutes);
app.use("/api/health-check", healthCheckRoutes);
app.use('/api/departments', departmentRoutes);
app.use('/api/auth', authRoutes);
app.use('/api/blogs', blogRoutes);
app.use('/uploads', express.static('uploads'));
app.use('/api/upload', uploadRoutes);
app.use('/api/doctors', doctorRoutes);
app.use('/api/careers', careerRoutes);
app.use('/api/candidates', candidateRoutes);
app.use('/api/appointments', appointmentRoutes);
app.use('/api/inquiry', inquiryRoutes);
app.use('/api/academics', academicsResearchRoutes);
app.use('/api/email', emailConfigRoutes);
app.use('/api/newsMedia', newsMediaRoutes);
app.use('/api/import', importRoutes);
app.use('/api/health-check', healthCheckRoutes);
const PORT = process.env.PORT || 5008;
app.listen(PORT, () => {
backend/src/controllers/academicsResearch.controller.js
+20 -21
View File
@@ -1,18 +1,17 @@
import prisma from "../prisma/client.js";
import { sendEmail } from "../utils/sendEmail.js";
import { getEmailsByType } from "../utils/getEmailByTypes.js";
import prisma from '../prisma/client.js';
import { sendEmail } from '../utils/sendEmail.js';
import { getEmailsByType } from '../utils/getEmailByTypes.js';
// CREATE ACADEMICS & RESEARCH
export const createAcademicsResearch = async (req, res) => {
try {
const { fullName, number, emailId, subject, courseName, message } =
req.body;
const { fullName, number, emailId, subject, courseName, message } = req.body;
if (!fullName || !number) {
return res.status(400).json({
success: false,
message: "Full name and number are required",
message: 'Full name and number are required',
});
}
@@ -28,12 +27,12 @@ export const createAcademicsResearch = async (req, res) => {
});
try {
const emailList = await getEmailsByType("ACADEMICS");
const emailList = await getEmailsByType('ACADEMICS');
if (emailList && emailList.length > 0) {
await sendEmail({
to: emailList,
subject: "New Academics & Research Inquiry",
subject: 'New Academics & Research Inquiry',
html: `
<div style="font-family: Arial, sans-serif; background-color: #f4f6f8; padding: 20px;">
@@ -63,15 +62,15 @@ export const createAcademicsResearch = async (req, res) => {
</tr>
<tr>
<td style="padding: 8px 0;"><b>Email:</b></td>
<td style="padding: 8px 0;">${emailId || "-"}</td>
<td style="padding: 8px 0;">${emailId || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Course:</b></td>
<td style="padding: 8px 0;">${courseName || "-"}</td>
<td style="padding: 8px 0;">${courseName || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Subject:</b></td>
<td style="padding: 8px 0;">${subject || "-"}</td>
<td style="padding: 8px 0;">${subject || '-'}</td>
</tr>
</table>
@@ -87,7 +86,7 @@ export const createAcademicsResearch = async (req, res) => {
word-break: break-word;
overflow-wrap: anywhere;
">
${message ? message.replace(/\n/g, "<br/>") : "-"}
${message ? message.replace(/\n/g, '<br/>') : '-'}
</div>
</div>
@@ -105,20 +104,20 @@ export const createAcademicsResearch = async (req, res) => {
});
}
} catch (err) {
console.error("Academics email failed:", err);
console.error('Academics email failed:', err);
}
res.status(200).json({
success: true,
status: 200,
data,
message: "Academics & Research added successfully",
message: 'Academics & Research added successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to add Academics & Research inquiry",
message: 'Failed to add Academics & Research inquiry',
});
}
};
@@ -129,7 +128,7 @@ export const getAcademicsResearch = async (req, res) => {
try {
const data = await prisma.academicsResearch.findMany({
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
});
@@ -140,7 +139,7 @@ export const getAcademicsResearch = async (req, res) => {
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to fetch records",
message: 'Failed to fetch records',
});
}
};
@@ -160,7 +159,7 @@ export const getSingleAcademicsResearch = async (req, res) => {
if (!data) {
return res.status(404).json({
success: false,
message: "Record not found",
message: 'Record not found',
});
}
@@ -171,7 +170,7 @@ export const getSingleAcademicsResearch = async (req, res) => {
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to fetch record",
message: 'Failed to fetch record',
});
}
};
@@ -190,12 +189,12 @@ export const deleteAcademicsResearch = async (req, res) => {
res.json({
success: true,
message: "Record deleted successfully",
message: 'Record deleted successfully',
});
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to delete record",
message: 'Failed to delete record',
});
}
};
backend/src/controllers/appointment.controller.js
+36 -39
View File
@@ -1,16 +1,15 @@
import prisma from "../prisma/client.js";
import { sendEmail } from "../utils/sendEmail.js";
import { getEmailsByType } from "../utils/getEmailByTypes.js";
import prisma from '../prisma/client.js';
import { sendEmail } from '../utils/sendEmail.js';
import { getEmailsByType } from '../utils/getEmailByTypes.js';
export const createAppointment = async (req, res) => {
try {
const { name, mobileNumber, email, message, date, doctorId, departmentId } =
req.body;
const { name, mobileNumber, email, message, date, doctorId, departmentId } = req.body;
if (!name || !mobileNumber || !doctorId || !departmentId || !date) {
return res.status(400).json({
success: false,
message: "Required fields missing",
message: 'Required fields missing',
});
}
@@ -31,12 +30,12 @@ export const createAppointment = async (req, res) => {
});
try {
const emailList = await getEmailsByType("APPOINTMENT");
const emailList = await getEmailsByType('APPOINTMENT');
if (emailList) {
await sendEmail({
to: emailList,
subject: "New Appointment Booked",
subject: 'New Appointment Booked',
html: `
<div style="font-family: Arial, sans-serif; background-color: #f4f6f8; padding: 20px;">
@@ -66,7 +65,7 @@ export const createAppointment = async (req, res) => {
</tr>
<tr>
<td style="padding: 8px 0;"><b>Email:</b></td>
<td style="padding: 8px 0;">${email || "-"}</td>
<td style="padding: 8px 0;">${email || '-'}</td>
</tr>
</table>
@@ -75,19 +74,19 @@ export const createAppointment = async (req, res) => {
<table style="width: 100%; border-collapse: collapse;">
<tr>
<td style="padding: 8px 0;"><b>Doctor:</b></td>
<td style="padding: 8px 0;">${appointment.doctor?.name || "-"}</td>
<td style="padding: 8px 0;">${appointment.doctor?.name || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Department:</b></td>
<td style="padding: 8px 0;">${appointment.department?.name || "-"}</td>
<td style="padding: 8px 0;">${appointment.department?.name || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Date:</b></td>
<td style="padding: 8px 0;">
${new Date(date).toLocaleDateString("en-GB", {
day: "2-digit",
month: "long",
year: "numeric",
${new Date(date).toLocaleDateString('en-GB', {
day: '2-digit',
month: 'long',
year: 'numeric',
})}
</td>
</tr>
@@ -105,7 +104,7 @@ export const createAppointment = async (req, res) => {
word-break: break-word;
overflow-wrap: anywhere;
">
${message ? message.replace(/\n/g, "<br/>") : "-"}
${message ? message.replace(/\n/g, '<br/>') : '-'}
</div>
</div>
@@ -123,19 +122,19 @@ export const createAppointment = async (req, res) => {
});
}
} catch (err) {
console.error("Email failed:", err);
console.error('Email failed:', err);
}
res.status(201).json({
success: true,
message: "Appointment booked successfully",
message: 'Appointment booked successfully',
data: appointment,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to create appointment",
message: 'Failed to create appointment',
});
}
};
@@ -152,11 +151,9 @@ export const getAppointments = async (req, res) => {
const where = {};
const hasSingleDate = date && date.trim() !== "";
const hasSingleDate = date && date.trim() !== '';
const hasRange =
(startDate && startDate.trim() !== "") ||
(endDate && endDate.trim() !== "");
const hasRange = (startDate && startDate.trim() !== '') || (endDate && endDate.trim() !== '');
if (hasSingleDate) {
const start = new Date(date);
@@ -174,14 +171,14 @@ export const getAppointments = async (req, res) => {
if (!hasSingleDate && hasRange) {
const dateFilter = {};
if (startDate && startDate.trim() !== "") {
if (startDate && startDate.trim() !== '') {
const start = new Date(startDate);
start.setHours(0, 0, 0, 0);
dateFilter.gte = start;
}
if (endDate && endDate.trim() !== "") {
if (endDate && endDate.trim() !== '') {
const end = new Date(endDate);
end.setHours(23, 59, 59, 999);
@@ -191,11 +188,11 @@ export const getAppointments = async (req, res) => {
where.date = dateFilter;
}
if (search && search.trim() !== "") {
if (search && search.trim() !== '') {
where.OR = [
{ name: { contains: search, mode: "insensitive" } },
{ name: { contains: search, mode: 'insensitive' } },
{ mobileNumber: { contains: search } },
{ email: { contains: search, mode: "insensitive" } },
{ email: { contains: search, mode: 'insensitive' } },
];
}
@@ -207,7 +204,7 @@ export const getAppointments = async (req, res) => {
department: true,
},
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
skip,
take: limit,
@@ -233,7 +230,7 @@ export const getAppointments = async (req, res) => {
res.status(500).json({
success: false,
message: "Failed to fetch appointments",
message: 'Failed to fetch appointments',
});
}
};
@@ -257,7 +254,7 @@ export const getAppointment = async (req, res) => {
if (!appointment) {
return res.status(404).json({
success: false,
message: "Appointment not found",
message: 'Appointment not found',
});
}
@@ -269,7 +266,7 @@ export const getAppointment = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch appointment",
message: 'Failed to fetch appointment',
});
}
};
@@ -289,7 +286,7 @@ export const getAppointmentsByDoctor = async (req, res) => {
department: true,
},
orderBy: {
date: "asc",
date: 'asc',
},
});
@@ -301,7 +298,7 @@ export const getAppointmentsByDoctor = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctor appointments",
message: 'Failed to fetch doctor appointments',
});
}
};
@@ -330,7 +327,7 @@ export const getAppointmentsByDepartment = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch department appointments",
message: 'Failed to fetch department appointments',
});
}
};
@@ -354,14 +351,14 @@ export const updateAppointment = async (req, res) => {
res.status(200).json({
success: true,
message: "Appointment updated successfully",
message: 'Appointment updated successfully',
data: appointment,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to update appointment",
message: 'Failed to update appointment',
});
}
};
@@ -380,13 +377,13 @@ export const deleteAppointment = async (req, res) => {
res.status(200).json({
success: true,
message: "Appointment deleted successfully",
message: 'Appointment deleted successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to delete appointment",
message: 'Failed to delete appointment',
});
}
};
backend/src/controllers/auth.controller.js
+15 -15
View File
@@ -1,24 +1,24 @@
import prisma from "../prisma/client.js";
import {generateToken} from "../utils/jwt.js";
import {hashPassword, comparePassword} from "../utils/password.js";
import prisma from '../prisma/client.js';
import { generateToken } from '../utils/jwt.js';
import { hashPassword, comparePassword } from '../utils/password.js';
/**
* REGISTER
* POST /api/auth/register
*/
export async function register(req, res) {
const {username, password, role} = req.body;
const { username, password, role } = req.body;
if (!username || !password) {
return res.status(400).json({error: "Username and password required"});
return res.status(400).json({ error: 'Username and password required' });
}
const existingUser = await prisma.user.findUnique({
where: {username},
where: { username },
});
if (existingUser) {
return res.status(409).json({error: "Username already exists"});
return res.status(409).json({ error: 'Username already exists' });
}
const hashedPassword = await hashPassword(password);
@@ -27,12 +27,12 @@ export async function register(req, res) {
data: {
username,
password: hashedPassword,
role: role || "admin",
role: role || 'admin',
},
});
res.status(201).json({
message: "User registered successfully",
message: 'User registered successfully',
user: {
id: user.id,
username: user.username,
@@ -46,24 +46,24 @@ export async function register(req, res) {
* POST /api/auth/login
*/
export async function login(req, res) {
const {username, password} = req.body;
const { username, password } = req.body;
if (!username || !password) {
return res.status(400).json({error: "Username and password required"});
return res.status(400).json({ error: 'Username and password required' });
}
const user = await prisma.user.findUnique({
where: {username},
where: { username },
});
if (!user) {
return res.status(401).json({error: "Invalid credentials"});
return res.status(401).json({ error: 'Invalid credentials' });
}
const isValid = await comparePassword(password, user.password);
if (!isValid) {
return res.status(401).json({error: "Invalid credentials"});
return res.status(401).json({ error: 'Invalid credentials' });
}
const token = generateToken({
@@ -72,5 +72,5 @@ export async function login(req, res) {
role: user.role,
});
res.json({token});
res.json({ token });
}
backend/src/controllers/blog.controller.js
+21 -21
View File
@@ -1,10 +1,10 @@
import prisma from "../prisma/client.js";
import slugify from "slugify";
import prisma from '../prisma/client.js';
import slugify from 'slugify';
/* CREATE BLOG */
export async function createBlog(req, res) {
const {title, writer, image, content, isActive} = req.body;
const { title, writer, image, content, isActive } = req.body;
try {
const blog = await prisma.blog.create({
@@ -20,7 +20,7 @@ export async function createBlog(req, res) {
res.json(blog);
} catch (error) {
res.status(500).json({error: "Blog creation failed"});
res.status(500).json({ error: 'Blog creation failed' });
}
}
@@ -29,13 +29,13 @@ export async function createBlog(req, res) {
export async function getBlogs(req, res) {
try {
const blogs = await prisma.blog.findMany({
where: {isActive: true},
orderBy: {createdAt: "desc"},
where: { isActive: true },
orderBy: { createdAt: 'desc' },
});
res.json(blogs);
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
@@ -44,12 +44,12 @@ export async function getBlogs(req, res) {
export async function getAllBlogs(req, res) {
try {
const blogs = await prisma.blog.findMany({
orderBy: {createdAt: "desc"},
orderBy: { createdAt: 'desc' },
});
res.json(blogs);
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
@@ -60,16 +60,16 @@ export async function getBlog(req, res) {
const slug = req.params.slug;
const blog = await prisma.blog.findUnique({
where: {slug},
where: { slug },
});
if (!blog) {
return res.status(404).json({error: "Blog not found"});
return res.status(404).json({ error: 'Blog not found' });
}
res.json(blog);
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
@@ -80,16 +80,16 @@ export async function getBlogForAdmin(req, res) {
const id = Number(req.params.id);
const blog = await prisma.blog.findUnique({
where: {id},
where: { id },
});
if (!blog) {
return res.status(404).json({error: "Blog not found"});
return res.status(404).json({ error: 'Blog not found' });
}
res.json(blog);
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
@@ -97,10 +97,10 @@ export async function getBlogForAdmin(req, res) {
export async function updateBlog(req, res) {
try {
const {title, writer, image, content} = req.body;
const { title, writer, image, content } = req.body;
const blog = await prisma.blog.update({
where: {id: Number(req.params.id)},
where: { id: Number(req.params.id) },
data: {
title,
writer,
@@ -111,7 +111,7 @@ export async function updateBlog(req, res) {
res.json(blog);
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
@@ -122,11 +122,11 @@ export async function deleteBlog(req, res) {
const id = Number(req.params.id);
await prisma.blog.delete({
where: {id},
where: { id },
});
res.json({message: "Blog deleted successfully"});
res.json({ message: 'Blog deleted successfully' });
} catch (error) {
res.status(500).json({error: error.message});
res.status(500).json({ error: error.message });
}
}
backend/src/controllers/candidate.controller.js
+24 -25
View File
@@ -1,19 +1,18 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
import { sendEmail } from "../utils/sendEmail.js";
import { getEmailsByType } from "../utils/getEmailByTypes.js";
import { sendEmail } from '../utils/sendEmail.js';
import { getEmailsByType } from '../utils/getEmailByTypes.js';
// CREATE CANDIDATE
export const createCandidate = async (req, res) => {
try {
const { fullName, mobile, email, subject, coverLetter, careerId } =
req.body;
const { fullName, mobile, email, subject, coverLetter, careerId } = req.body;
if (!fullName || !mobile || !email || !careerId) {
return res.status(400).json({
success: false,
message: "Required fields missing",
message: 'Required fields missing',
});
}
@@ -32,12 +31,12 @@ export const createCandidate = async (req, res) => {
});
try {
const emailList = await getEmailsByType("CANDIDATE");
const emailList = await getEmailsByType('CANDIDATE');
if (emailList && emailList.length > 0) {
await sendEmail({
to: emailList,
subject: "New Job Application Received",
subject: 'New Job Application Received',
html: `
<div style="font-family: Arial, sans-serif; background-color: #f4f6f8; padding: 20px;">
@@ -76,15 +75,15 @@ export const createCandidate = async (req, res) => {
<table style="width: 100%; border-collapse: collapse;">
<tr>
<td style="padding: 8px 0;"><b>Applied For:</b></td>
<td style="padding: 8px 0;">${candidate.career?.post || "-"}</td>
<td style="padding: 8px 0;">${candidate.career?.post || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Designation:</b></td>
<td style="padding: 8px 0;">${candidate.career?.designation || "-"}</td>
<td style="padding: 8px 0;">${candidate.career?.designation || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Subject:</b></td>
<td style="padding: 8px 0;">${subject || "-"}</td>
<td style="padding: 8px 0;">${subject || '-'}</td>
</tr>
</table>
@@ -100,7 +99,7 @@ export const createCandidate = async (req, res) => {
word-break: break-word;
overflow-wrap: anywhere;
">
${coverLetter ? coverLetter.replace(/\n/g, "<br/>") : "-"}
${coverLetter ? coverLetter.replace(/\n/g, '<br/>') : '-'}
</div>
</div>
@@ -118,19 +117,19 @@ export const createCandidate = async (req, res) => {
});
}
} catch (err) {
console.error("Candidate email failed:", err);
console.error('Candidate email failed:', err);
}
res.status(201).json({
success: true,
message: "Application submitted successfully",
message: 'Application submitted successfully',
data: candidate,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to create candidate",
message: 'Failed to create candidate',
});
}
};
@@ -144,7 +143,7 @@ export const getCandidates = async (req, res) => {
career: true,
},
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
});
@@ -156,7 +155,7 @@ export const getCandidates = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch candidates",
message: 'Failed to fetch candidates',
});
}
};
@@ -179,7 +178,7 @@ export const getCandidate = async (req, res) => {
if (!candidate) {
return res.status(404).json({
success: false,
message: "Candidate not found",
message: 'Candidate not found',
});
}
@@ -191,7 +190,7 @@ export const getCandidate = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch candidate",
message: 'Failed to fetch candidate',
});
}
};
@@ -210,7 +209,7 @@ export const getCandidatesByCareer = async (req, res) => {
career: true,
},
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
});
@@ -222,7 +221,7 @@ export const getCandidatesByCareer = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch candidates",
message: 'Failed to fetch candidates',
});
}
};
@@ -242,14 +241,14 @@ export const updateCandidate = async (req, res) => {
res.status(200).json({
success: true,
message: "Candidate updated successfully",
message: 'Candidate updated successfully',
data: candidate,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to update candidate",
message: 'Failed to update candidate',
});
}
};
@@ -268,13 +267,13 @@ export const deleteCandidate = async (req, res) => {
res.status(200).json({
success: true,
message: "Candidate deleted successfully",
message: 'Candidate deleted successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to delete candidate",
message: 'Failed to delete candidate',
});
}
};
backend/src/controllers/career.controller.js
+12 -22
View File
@@ -1,4 +1,4 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
// GET ALL CAREERS
@@ -7,8 +7,8 @@ export const getAllCareers = async (req, res) => {
const { admin } = req.query;
const careers = await prisma.career.findMany({
where: admin === "true" ? {} : { isActive: true },
orderBy: [{ sortOrder: "asc" }, { createdAt: "desc" }],
where: admin === 'true' ? {} : { isActive: true },
orderBy: [{ sortOrder: 'asc' }, { createdAt: 'desc' }],
});
const response = careers.map((c) => ({
@@ -32,7 +32,7 @@ export const getAllCareers = async (req, res) => {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to fetch careers",
message: 'Failed to fetch careers',
});
}
};
@@ -41,22 +41,12 @@ export const getAllCareers = async (req, res) => {
export const createCareer = async (req, res) => {
try {
const {
post,
designation,
qualification,
experienceNeed,
email,
number,
status,
isActive,
sortOrder,
} = req.body;
const { post, designation, qualification, experienceNeed, email, number, status, isActive, sortOrder } = req.body;
if (!post || !designation) {
return res.status(400).json({
success: false,
message: "Post and designation are required",
message: 'Post and designation are required',
});
}
@@ -76,14 +66,14 @@ export const createCareer = async (req, res) => {
return res.status(201).json({
success: true,
message: "Career created successfully",
message: 'Career created successfully',
data: career,
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to create career",
message: 'Failed to create career',
});
}
};
@@ -106,14 +96,14 @@ export const updateCareer = async (req, res) => {
return res.status(200).json({
success: true,
message: "Career updated successfully",
message: 'Career updated successfully',
data: career,
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to update career",
message: 'Failed to update career',
});
}
};
@@ -130,13 +120,13 @@ export const deleteCareer = async (req, res) => {
return res.status(200).json({
success: true,
message: "Career deleted successfully",
message: 'Career deleted successfully',
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to delete career",
message: 'Failed to delete career',
});
}
};
backend/src/controllers/department.controller.js
+36 -49
View File
@@ -1,23 +1,23 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
export const getAllDepartments = async (req, res) => {
try {
const {admin} = req.query;
const { admin } = req.query;
const departments = await prisma.department.findMany({
where: admin === "true" ? {} : {isActive: true},
orderBy: [{sortOrder: "asc"}, {name: "asc"}],
where: admin === 'true' ? {} : { isActive: true },
orderBy: [{ sortOrder: 'asc' }, { name: 'asc' }],
});
const response = departments.map((dep) => ({
departmentId: dep.departmentId,
name: dep.name,
image: dep.image ?? "",
para1: dep.para1 ?? "",
para2: dep.para2 ?? "",
para3: dep.para3 ?? "",
facilities: dep.facilities ?? "",
services: dep.services ?? "",
image: dep.image ?? '',
para1: dep.para1 ?? '',
para2: dep.para2 ?? '',
para3: dep.para3 ?? '',
facilities: dep.facilities ?? '',
services: dep.services ?? '',
isActive: dep.isActive,
sortOrder: dep.sortOrder,
}));
@@ -30,19 +30,19 @@ export const getAllDepartments = async (req, res) => {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to fetch departments",
message: 'Failed to fetch departments',
});
}
};
export const getDepartmentByName = async (req, res) => {
try {
const {name} = req.query;
const { name } = req.query;
if (!name) {
return res.status(400).json({
success: false,
message: "Department name is required",
message: 'Department name is required',
});
}
@@ -56,19 +56,19 @@ export const getDepartmentByName = async (req, res) => {
if (!department) {
return res.status(404).json({
success: false,
message: "Department not found or inactive",
message: 'Department not found or inactive',
});
}
const response = {
departmentId: department.departmentId,
name: department.name,
image: department.image ?? "",
para1: department.para1 ?? "",
para2: department.para2 ?? "",
para3: department.para3 ?? "",
facilities: department.facilities ?? "",
services: department.services ?? "",
image: department.image ?? '',
para1: department.para1 ?? '',
para2: department.para2 ?? '',
para3: department.para3 ?? '',
facilities: department.facilities ?? '',
services: department.services ?? '',
isActive: department.isActive,
sortOrder: department.sortOrder,
};
@@ -81,30 +81,17 @@ export const getDepartmentByName = async (req, res) => {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to fetch department",
message: 'Failed to fetch department',
});
}
};
export async function createDepartment(req, res) {
try {
const {
departmentId,
name,
image,
para1,
para2,
para3,
facilities,
services,
isActive,
sortOrder,
} = req.body;
const { departmentId, name, image, para1, para2, para3, facilities, services, isActive, sortOrder } = req.body;
if (!departmentId || !name) {
return res
.status(400)
.json({error: "departmentId and name are required"});
return res.status(400).json({ error: 'departmentId and name are required' });
}
const department = await prisma.department.create({
@@ -123,63 +110,63 @@ export async function createDepartment(req, res) {
});
res.status(201).json({
message: "Department created successfully",
message: 'Department created successfully',
data: department,
});
} catch (error) {
if (error.code === "P2002") {
return res.status(409).json({error: "Department already exists"});
if (error.code === 'P2002') {
return res.status(409).json({ error: 'Department already exists' });
}
console.error(error);
res.status(500).json({error: "Failed to create department"});
res.status(500).json({ error: 'Failed to create department' });
}
}
export const updateDepartment = async (req, res) => {
try {
const {departmentId} = req.params;
const updateData = {...req.body};
const { departmentId } = req.params;
const updateData = { ...req.body };
if (updateData.sortOrder !== undefined) {
updateData.sortOrder = Number(updateData.sortOrder);
}
const department = await prisma.department.update({
where: {departmentId},
where: { departmentId },
data: updateData,
});
return res.status(200).json({
success: true,
message: "Department updated successfully",
message: 'Department updated successfully',
data: department,
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to update department",
message: 'Failed to update department',
});
}
};
export const deleteDepartment = async (req, res) => {
try {
const {departmentId} = req.params;
const { departmentId } = req.params;
await prisma.department.delete({
where: {departmentId},
where: { departmentId },
});
return res.status(200).json({
success: true,
message: "Department deleted successfully",
message: 'Department deleted successfully',
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to delete department",
message: 'Failed to delete department',
});
}
};
backend/src/controllers/doctor.controller.js
+87 -97
View File
@@ -1,13 +1,13 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
// get doctors
export const getAllDoctors = async (req, res) => {
try {
const {admin} = req.query;
const { admin } = req.query;
const doctors = await prisma.doctor.findMany({
where: admin === "true" ? {} : {isActive: true},
where: admin === 'true' ? {} : { isActive: true },
include: {
seo: true,
departments: {
@@ -18,18 +18,18 @@ export const getAllDoctors = async (req, res) => {
},
specializations: {
orderBy: {
createdAt: "asc",
createdAt: 'asc',
},
},
},
orderBy: [{globalSortOrder: "asc"}, {name: "asc"}],
orderBy: [{ globalSortOrder: 'asc' }, { name: 'asc' }],
});
const formatted = doctors.map((doc, index) => ({
SL_NO: String(index + 1),
doctorId: doc.doctorId,
name: doc.name,
image: doc.image ?? "",
image: doc.image ?? '',
designation: doc.designation,
workingStatus: doc.workingStatus,
qualification: doc.qualification,
@@ -43,15 +43,15 @@ export const getAllDoctors = async (req, res) => {
description: item.description,
})),
seo: {
seoTitle: doc.seo?.seoTitle ?? "",
metaDescription: doc.seo?.metaDescription ?? "",
focusKeyphrase: doc.seo?.focusKeyphrase ?? "",
slug: doc.seo?.slug ?? "",
seoTitle: doc.seo?.seoTitle ?? '',
metaDescription: doc.seo?.metaDescription ?? '',
focusKeyphrase: doc.seo?.focusKeyphrase ?? '',
slug: doc.seo?.slug ?? '',
tags: doc.seo?.tags ?? [],
ogTitle: doc.seo?.ogTitle ?? "",
ogDescription: doc.seo?.ogDescription ?? "",
ogImage: doc.seo?.ogImage ?? "",
ogTitle: doc.seo?.ogTitle ?? '',
ogDescription: doc.seo?.ogDescription ?? '',
ogImage: doc.seo?.ogImage ?? '',
},
departments: doc.departments.map((d) => {
const t = d.timing || {};
@@ -69,7 +69,7 @@ export const getAllDoctors = async (req, res) => {
return {
departmentId: d.department.departmentId,
departmentName: d.department.name,
timing: timingArray.join(" & "),
timing: timingArray.join(' & '),
deptSortOrder: d.sortOrder,
};
}),
@@ -83,7 +83,7 @@ export const getAllDoctors = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctors",
message: 'Failed to fetch doctors',
});
}
};
@@ -92,10 +92,10 @@ export const getAllDoctors = async (req, res) => {
export const getDoctorByDoctorId = async (req, res) => {
try {
const {doctorId} = req.params;
const { doctorId } = req.params;
const doctor = await prisma.doctor.findUnique({
where: {doctorId},
where: { doctorId },
include: {
seo: true,
specializations: true,
@@ -111,28 +111,28 @@ export const getDoctorByDoctorId = async (req, res) => {
if (!doctor) {
return res.status(404).json({
success: false,
message: "Doctor not found",
message: 'Doctor not found',
});
}
const response = {
doctorId: doctor.doctorId,
name: doctor.name,
image: doctor.image ?? "",
image: doctor.image ?? '',
designation: doctor.designation,
workingStatus: doctor.workingStatus,
qualification: doctor.qualification,
experience: doctor.experience,
professionalSummary: doctor.professionalSummary,
seo: {
seoTitle: doctor.seo?.seoTitle ?? "",
metaDescription: doctor.seo?.metaDescription ?? "",
focusKeyphrase: doctor.seo?.focusKeyphrase ?? "",
slug: doctor.seo?.slug ?? "",
seoTitle: doctor.seo?.seoTitle ?? '',
metaDescription: doctor.seo?.metaDescription ?? '',
focusKeyphrase: doctor.seo?.focusKeyphrase ?? '',
slug: doctor.seo?.slug ?? '',
tags: doctor.seo?.tags ?? [],
ogTitle: doctor.seo?.ogTitle ?? "",
ogDescription: doctor.seo?.ogDescription ?? "",
ogImage: doctor.seo?.ogImage ?? "",
ogTitle: doctor.seo?.ogTitle ?? '',
ogDescription: doctor.seo?.ogDescription ?? '',
ogImage: doctor.seo?.ogImage ?? '',
},
specializations:
doctor.specializations?.map((item) => ({
@@ -155,7 +155,7 @@ export const getDoctorByDoctorId = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctor",
message: 'Failed to fetch doctor',
});
}
};
@@ -163,30 +163,30 @@ export const getDoctorByDoctorId = async (req, res) => {
// get doctors by department
export const getDoctorsByDepartmentId = async (req, res) => {
try {
const {Department_ID} = req.query;
const { Department_ID } = req.query;
if (!Department_ID) {
return res.status(400).json({
success: false,
message: "Department_ID is required",
message: 'Department_ID is required',
});
}
const department = await prisma.department.findUnique({
where: {departmentId: Department_ID},
where: { departmentId: Department_ID },
});
if (!department) {
return res.status(404).json({
success: false,
message: "Department not found",
message: 'Department not found',
});
}
const doctorsInDept = await prisma.doctorDepartment.findMany({
where: {
departmentId: department.id,
doctor: {isActive: true},
doctor: { isActive: true },
},
include: {
doctor: {
@@ -199,16 +199,16 @@ export const getDoctorsByDepartmentId = async (req, res) => {
},
},
},
orderBy: {sortOrder: "asc"},
orderBy: { sortOrder: 'asc' },
});
const result = doctorsInDept.map((d) => ({
GG_ID: d.doctor.doctorId,
Name: d.doctor.name,
image: d.doctor.image ?? "",
image: d.doctor.image ?? '',
designation: d.doctor.designation,
hierarchyOrder: d.sortOrder,
slug: d.doctor.seo?.slug ?? "",
slug: d.doctor.seo?.slug ?? '',
}));
res.status(200).json({
@@ -219,7 +219,7 @@ export const getDoctorsByDepartmentId = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctors",
message: 'Failed to fetch doctors',
});
}
};
@@ -251,18 +251,18 @@ export const createDoctor = async (req, res) => {
} = req.body;
const messages = [];
if (!doctorId) messages.push("Doctor ID is required");
if (!name?.trim()) messages.push("Doctor name is required");
if (!designation?.trim()) messages.push("Designation is required");
if (!qualification?.trim()) messages.push("Qualification is required");
if (!doctorId) messages.push('Doctor ID is required');
if (!name?.trim()) messages.push('Doctor name is required');
if (!designation?.trim()) messages.push('Designation is required');
if (!qualification?.trim()) messages.push('Qualification is required');
if (!departments || departments.length === 0) {
messages.push("At least one department is required");
messages.push('At least one department is required');
}
if (messages.length > 0) {
return res.status(400).json({
success: false,
message: messages.join(", "),
message: messages.join(', '),
});
}
const seo = await prisma.seo.create({
@@ -292,14 +292,13 @@ export const createDoctor = async (req, res) => {
professionalSummary,
seoId: seo.id,
isActive: isActive !== undefined ? isActive : true,
globalSortOrder:
globalSortOrder !== undefined ? Number(globalSortOrder) : 0,
globalSortOrder: globalSortOrder !== undefined ? Number(globalSortOrder) : 0,
},
});
for (const dep of departments) {
const department = await prisma.department.findUnique({
where: {departmentId: dep.departmentId},
where: { departmentId: dep.departmentId },
});
if (!department) continue;
@@ -335,13 +334,13 @@ export const createDoctor = async (req, res) => {
res.status(201).json({
success: true,
message: "Doctor created successfully",
message: 'Doctor created successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to create doctor",
message: 'Failed to create doctor',
});
}
};
@@ -349,7 +348,7 @@ export const createDoctor = async (req, res) => {
//update doctors
export const updateDoctor = async (req, res) => {
try {
const {doctorId, action} = req.params;
const { doctorId, action } = req.params;
const {
name,
designation,
@@ -375,17 +374,14 @@ export const updateDoctor = async (req, res) => {
if (!doctorId) {
return res.status(400).json({
success: false,
message: "Doctor ID is required",
message: 'Doctor ID is required',
});
}
const doctor = await prisma.doctor.findUnique({where: {doctorId}});
if (!doctor)
return res
.status(404)
.json({success: false, message: "Doctor not found"});
if (action === "toggleStatus") {
const doctor = await prisma.doctor.findUnique({ where: { doctorId } });
if (!doctor) return res.status(404).json({ success: false, message: 'Doctor not found' });
if (action === 'toggleStatus') {
await prisma.doctor.update({
where: {id: doctor.id},
where: { id: doctor.id },
data: {
isActive: !doctor.isActive,
},
@@ -393,31 +389,29 @@ export const updateDoctor = async (req, res) => {
return res.status(200).json({
success: true,
message: `Doctor has been ${
doctor.isActive ? "deactivated" : "activated"
} successfully`,
message: `Doctor has been ${doctor.isActive ? 'deactivated' : 'activated'} successfully`,
});
}
const messages = [];
if (!doctorId) messages.push("Doctor ID is required");
if (!name?.trim()) messages.push("Doctor name is required");
if (!qualification?.trim()) messages.push("Qualification is required");
if (!designation?.trim()) messages.push("Designation is required");
if (!doctorId) messages.push('Doctor ID is required');
if (!name?.trim()) messages.push('Doctor name is required');
if (!qualification?.trim()) messages.push('Qualification is required');
if (!designation?.trim()) messages.push('Designation is required');
if (!departments || departments.length === 0) {
messages.push("At least one department is required");
messages.push('At least one department is required');
}
if (messages.length > 0) {
return res.status(400).json({
success: false,
message: messages.join(", "),
message: messages.join(', '),
});
}
await prisma.doctor.update({
where: {id: doctor.id},
where: { id: doctor.id },
data: {
name,
designation,
@@ -427,8 +421,7 @@ export const updateDoctor = async (req, res) => {
isActive,
experience: experience ? Number(experience) : null,
professionalSummary,
globalSortOrder:
globalSortOrder !== undefined ? Number(globalSortOrder) : undefined,
globalSortOrder: globalSortOrder !== undefined ? Number(globalSortOrder) : undefined,
},
});
@@ -520,8 +513,7 @@ export const updateDoctor = async (req, res) => {
});
if (dep.timing && Object.keys(dep.timing).length > 0) {
const {id, doctorDepartmentId, createdAt, updatedAt, ...cleanTiming} =
dep.timing;
const { id, doctorDepartmentId, createdAt, updatedAt, ...cleanTiming } = dep.timing;
await prisma.doctorTiming.create({
data: {
@@ -554,58 +546,56 @@ export const updateDoctor = async (req, res) => {
}
}
res
.status(200)
.json({success: true, message: "Doctor updated successfully"});
res.status(200).json({ success: true, message: 'Doctor updated successfully' });
} catch (error) {
console.error("Update Error:", error);
res.status(500).json({success: false, message: "Failed to update doctor"});
console.error('Update Error:', error);
res.status(500).json({ success: false, message: 'Failed to update doctor' });
}
};
//delete doctor
export const deleteDoctor = async (req, res) => {
try {
const {doctorId} = req.params;
const { doctorId } = req.params;
const doctor = await prisma.doctor.findUnique({
where: {doctorId},
where: { doctorId },
});
if (!doctor) {
return res.status(404).json({
success: false,
message: "Doctor not found",
message: 'Doctor not found',
});
}
const doctorDepartments = await prisma.doctorDepartment.findMany({
where: {doctorId: doctor.id},
where: { doctorId: doctor.id },
});
for (const dd of doctorDepartments) {
await prisma.doctorTiming.deleteMany({
where: {doctorDepartmentId: dd.id},
where: { doctorDepartmentId: dd.id },
});
}
await prisma.doctorDepartment.deleteMany({
where: {doctorId: doctor.id},
where: { doctorId: doctor.id },
});
await prisma.doctor.delete({
where: {id: doctor.id},
where: { id: doctor.id },
});
res.status(200).json({
success: true,
message: "Doctor deleted successfully",
message: 'Doctor deleted successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to delete doctor",
message: 'Failed to delete doctor',
});
}
};
@@ -630,14 +620,14 @@ export const getDoctorTimings = async (req, res) => {
return {
Doctor_ID: doc.doctorId,
Doctor: doc.name,
Monday: timing.monday || "",
Tuesday: timing.tuesday || "",
Wednesday: timing.wednesday || "",
Thursday: timing.thursday || "",
Friday: timing.friday || "",
Saturday: timing.saturday || "",
Sunday: timing.sunday || "",
Additional: timing.additional || "",
Monday: timing.monday || '',
Tuesday: timing.tuesday || '',
Wednesday: timing.wednesday || '',
Thursday: timing.thursday || '',
Friday: timing.friday || '',
Saturday: timing.saturday || '',
Sunday: timing.sunday || '',
Additional: timing.additional || '',
};
});
@@ -649,7 +639,7 @@ export const getDoctorTimings = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctor timings",
message: 'Failed to fetch doctor timings',
});
}
};
@@ -657,10 +647,10 @@ export const getDoctorTimings = async (req, res) => {
export const getDoctorTimingById = async (req, res) => {
try {
const {doctorId} = req.params;
const { doctorId } = req.params;
const doctor = await prisma.doctor.findUnique({
where: {doctorId},
where: { doctorId },
include: {
departments: {
include: {
@@ -674,7 +664,7 @@ export const getDoctorTimingById = async (req, res) => {
if (!doctor) {
return res.status(404).json({
success: false,
message: "Doctor not found",
message: 'Doctor not found',
});
}
@@ -697,7 +687,7 @@ export const getDoctorTimingById = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch doctor timing",
message: 'Failed to fetch doctor timing',
});
}
};
backend/src/controllers/emailConfig.controller.js
+16 -16
View File
@@ -1,14 +1,14 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
// CREATE
export const createEmailConfig = async (req, res) => {
try {
const {name, email, type, isActive} = req.body;
const { name, email, type, isActive } = req.body;
if (!name || !email || !type) {
return res.status(400).json({
success: false,
message: "Name, Email and Type are required",
message: 'Name, Email and Type are required',
});
}
@@ -23,14 +23,14 @@ export const createEmailConfig = async (req, res) => {
res.status(201).json({
success: true,
message: "Email config created",
message: 'Email config created',
data: newEmail,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to create email config",
message: 'Failed to create email config',
});
}
};
@@ -40,7 +40,7 @@ export const getEmailConfigs = async (req, res) => {
try {
const emails = await prisma.emailConfig.findMany({
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
});
@@ -52,7 +52,7 @@ export const getEmailConfigs = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch email configs",
message: 'Failed to fetch email configs',
});
}
};
@@ -60,7 +60,7 @@ export const getEmailConfigs = async (req, res) => {
// GET SINGLE
export const getEmailConfig = async (req, res) => {
try {
const {id} = req.params;
const { id } = req.params;
const email = await prisma.emailConfig.findUnique({
where: {
@@ -71,7 +71,7 @@ export const getEmailConfig = async (req, res) => {
if (!email) {
return res.status(404).json({
success: false,
message: "Email config not found",
message: 'Email config not found',
});
}
@@ -83,7 +83,7 @@ export const getEmailConfig = async (req, res) => {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to fetch email config",
message: 'Failed to fetch email config',
});
}
};
@@ -91,7 +91,7 @@ export const getEmailConfig = async (req, res) => {
// UPDATE
export const updateEmailConfig = async (req, res) => {
try {
const {id} = req.params;
const { id } = req.params;
const updated = await prisma.emailConfig.update({
where: {
@@ -102,14 +102,14 @@ export const updateEmailConfig = async (req, res) => {
res.status(200).json({
success: true,
message: "Email config updated",
message: 'Email config updated',
data: updated,
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to update email config",
message: 'Failed to update email config',
});
}
};
@@ -117,7 +117,7 @@ export const updateEmailConfig = async (req, res) => {
// DELETE
export const deleteEmailConfig = async (req, res) => {
try {
const {id} = req.params;
const { id } = req.params;
await prisma.emailConfig.delete({
where: {
@@ -127,13 +127,13 @@ export const deleteEmailConfig = async (req, res) => {
res.status(200).json({
success: true,
message: "Email config deleted",
message: 'Email config deleted',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to delete email config",
message: 'Failed to delete email config',
});
}
};
backend/src/controllers/healthCheck.controller.js
+42 -81
View File
@@ -1,23 +1,21 @@
import prisma from "../prisma/client.js";
import { sendEmail } from "../utils/sendEmail.js";
import { getEmailsByType } from "../utils/getEmailByTypes.js";
import prisma from '../prisma/client.js';
import { sendEmail } from '../utils/sendEmail.js';
import { getEmailsByType } from '../utils/getEmailByTypes.js';
export const getAllCategories = async (req, res) => {
try {
const { admin } = req.query;
const categories = await prisma.healthCheckCategory.findMany({
where: admin === "true" ? {} : { isActive: true },
orderBy: { sortOrder: "asc" },
where: admin === 'true' ? {} : { isActive: true },
orderBy: { sortOrder: 'asc' },
include: {
_count: { select: { packages: true } },
},
});
return res.status(200).json({ success: true, data: categories });
} catch (error) {
return res
.status(500)
.json({ success: false, message: "Failed to fetch categories" });
return res.status(500).json({ success: false, message: 'Failed to fetch categories' });
}
};
@@ -35,14 +33,10 @@ export const createCategory = async (req, res) => {
},
});
return res
.status(201)
.json({ success: true, message: "Category created", data: category });
return res.status(201).json({ success: true, message: 'Category created', data: category });
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to create category" });
return res.status(500).json({ success: false, message: 'Failed to create category' });
}
};
@@ -58,7 +52,7 @@ export const updateCategory = async (req, res) => {
if (data.sortOrder !== undefined) data.sortOrder = Number(data.sortOrder);
if (data.slug === "") data.slug = null;
if (data.slug === '') data.slug = null;
const updatedCategory = await prisma.$transaction(async (tx) => {
const category = await tx.healthCheckCategory.update({
@@ -78,14 +72,12 @@ export const updateCategory = async (req, res) => {
return res.status(200).json({
success: true,
message: "Category updated",
message: 'Category updated',
data: updatedCategory,
});
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to update category" });
return res.status(500).json({ success: false, message: 'Failed to update category' });
}
};
@@ -97,15 +89,12 @@ export const deleteCategory = async (req, res) => {
where: { id: Number(id) },
});
return res
.status(200)
.json({ success: true, message: "Category deleted successfully" });
return res.status(200).json({ success: true, message: 'Category deleted successfully' });
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message:
"Failed to delete category. Ensure no packages are linked to it.",
message: 'Failed to delete category. Ensure no packages are linked to it.',
});
}
};
@@ -116,24 +105,19 @@ export const getAllPackages = async (req, res) => {
const packages = await prisma.healthPackage.findMany({
where: {
AND: [
admin === "true" ? {} : { isActive: true },
categorySlug ? { category: { slug: categorySlug } } : {},
],
AND: [admin === 'true' ? {} : { isActive: true }, categorySlug ? { category: { slug: categorySlug } } : {}],
},
include: {
category: true,
seo: true,
},
orderBy: [{ sortOrder: "asc" }, { createdAt: "desc" }],
orderBy: [{ sortOrder: 'asc' }, { createdAt: 'desc' }],
});
return res.status(200).json({ success: true, data: packages });
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to fetch packages" });
return res.status(500).json({ success: false, message: 'Failed to fetch packages' });
}
};
@@ -189,14 +173,10 @@ export const createPackage = async (req, res) => {
},
});
return res
.status(201)
.json({ success: true, message: "Package created", data: healthPackage });
return res.status(201).json({ success: true, message: 'Package created', data: healthPackage });
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to create package" });
return res.status(500).json({ success: false, message: 'Failed to create package' });
}
};
@@ -260,12 +240,10 @@ export const updatePackage = async (req, res) => {
},
});
return res
.status(200)
.json({ success: true, message: "Package updated", data: updated });
return res.status(200).json({ success: true, message: 'Package updated', data: updated });
} catch (error) {
console.error(error);
return res.status(500).json({ success: false, message: "Update failed" });
return res.status(500).json({ success: false, message: 'Update failed' });
}
};
@@ -279,29 +257,20 @@ export const deletePackage = async (req, res) => {
return res.status(200).json({
success: true,
message: "Package deleted",
message: 'Package deleted',
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Delete failed",
message: 'Delete failed',
});
}
};
export const createPackageInquiry = async (req, res) => {
try {
const {
fullName,
mobileNumber,
email,
age,
gender,
preferredDate,
packageId,
message,
} = req.body;
const { fullName, mobileNumber, email, age, gender, preferredDate, packageId, message } = req.body;
const inquiry = await prisma.healthPackageInquiry.create({
data: {
@@ -320,12 +289,12 @@ export const createPackageInquiry = async (req, res) => {
});
try {
const emailList = await getEmailsByType("HCINQUIRY");
const emailList = await getEmailsByType('HCINQUIRY');
if (emailList) {
await sendEmail({
to: emailList,
subject: "New Health Checkup Package Inquiry",
subject: 'New Health Checkup Package Inquiry',
html: `
<div style="font-family: Arial, sans-serif; background-color: #f4f6f8; padding: 20px;">
@@ -355,15 +324,15 @@ export const createPackageInquiry = async (req, res) => {
</tr>
<tr>
<td style="padding: 8px 0;"><b>Email:</b></td>
<td style="padding: 8px 0;">${email || "-"}</td>
<td style="padding: 8px 0;">${email || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Age:</b></td>
<td style="padding: 8px 0;">${age || "-"}</td>
<td style="padding: 8px 0;">${age || '-'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Gender:</b></td>
<td style="padding: 8px 0;">${gender || "-"}</td>
<td style="padding: 8px 0;">${gender || '-'}</td>
</tr>
</table>
@@ -372,19 +341,19 @@ export const createPackageInquiry = async (req, res) => {
<table style="width: 100%; border-collapse: collapse;">
<tr>
<td style="padding: 8px 0; width: 35%;"><b>Package Name:</b></td>
<td style="padding: 8px 0;">${inquiry.healthPackage?.name || "Unknown Package"}</td>
<td style="padding: 8px 0;">${inquiry.healthPackage?.name || 'Unknown Package'}</td>
</tr>
<tr>
<td style="padding: 8px 0;"><b>Preferred Date:</b></td>
<td style="padding: 8px 0;">
${
preferredDate
? new Date(preferredDate).toLocaleDateString("en-GB", {
day: "2-digit",
month: "long",
year: "numeric",
? new Date(preferredDate).toLocaleDateString('en-GB', {
day: '2-digit',
month: 'long',
year: 'numeric',
})
: "Not specified"
: 'Not specified'
}
</td>
</tr>
@@ -402,7 +371,7 @@ export const createPackageInquiry = async (req, res) => {
word-break: break-word;
overflow-wrap: anywhere;
">
${message ? message.replace(/\n/g, "<br/>") : "-"}
${message ? message.replace(/\n/g, '<br/>') : '-'}
</div>
</div>
@@ -420,19 +389,17 @@ export const createPackageInquiry = async (req, res) => {
});
}
} catch (err) {
console.error("Email failed:", err);
console.error('Email failed:', err);
}
return res.status(201).json({
success: true,
message: "Booking inquiry sent successfully",
message: 'Booking inquiry sent successfully',
data: inquiry,
});
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to submit inquiry" });
return res.status(500).json({ success: false, message: 'Failed to submit inquiry' });
}
};
@@ -449,9 +416,7 @@ export const getPackageBySlug = async (req, res) => {
});
if (!healthPackage) {
return res
.status(404)
.json({ success: false, message: "Package not found" });
return res.status(404).json({ success: false, message: 'Package not found' });
}
return res.status(200).json({
@@ -460,9 +425,7 @@ export const getPackageBySlug = async (req, res) => {
});
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to fetch package" });
return res.status(500).json({ success: false, message: 'Failed to fetch package' });
}
};
@@ -504,7 +467,7 @@ export const getAllInquiries = async (req, res) => {
},
},
},
orderBy: { createdAt: "desc" },
orderBy: { createdAt: 'desc' },
}),
]);
@@ -520,8 +483,6 @@ export const getAllInquiries = async (req, res) => {
});
} catch (error) {
console.error(error);
return res
.status(500)
.json({ success: false, message: "Failed to fetch inquiries" });
return res.status(500).json({ success: false, message: 'Failed to fetch inquiries' });
}
};
backend/src/controllers/importController.js
+23 -35
View File
@@ -1,22 +1,12 @@
import { PrismaClient } from "@prisma/client";
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();
export const bulkImportExcelData = async (req, res) => {
try {
const {
departments,
doctors,
timings,
careers,
inquiries,
academics,
appointments,
candidates,
news,
} = req.body;
const { departments, doctors, timings, careers, inquiries, academics, appointments, candidates, news } = req.body;
console.log("🚀 Starting Robust Data Import...");
console.log('🚀 Starting Robust Data Import...');
// 1. DEPARTMENTS
if (departments) {
@@ -54,14 +44,14 @@ export const bulkImportExcelData = async (req, res) => {
update: {
name: row.Name?.toString(),
designation: row.Designation?.toString() || null,
workingStatus: row["Working Status"]?.toString() || null,
workingStatus: row['Working Status']?.toString() || null,
qualification: row.Qualification?.toString() || null,
},
create: {
doctorId: row.GG_ID.toString(),
name: row.Name?.toString(),
designation: row.Designation?.toString() || null,
workingStatus: row["Working Status"]?.toString() || null,
workingStatus: row['Working Status']?.toString() || null,
qualification: row.Qualification?.toString() || null,
},
});
@@ -100,8 +90,8 @@ export const bulkImportExcelData = async (req, res) => {
if (doctor && doctor.departments.length > 0) {
const doctorDeptId = doctor.departments[0].id;
const rawAdd = row.Additional?.toString() || "";
const rawMon = row.Monday?.toString() || "";
const rawAdd = row.Additional?.toString() || '';
const rawMon = row.Monday?.toString() || '';
const isAppt = (val) => /appointment|basis|on call/i.test(val);
let finalAdd = rawAdd;
@@ -147,7 +137,7 @@ export const bulkImportExcelData = async (req, res) => {
experienceNeed: row.ExperienceNeed?.toString() || null,
email: row.HiringEmail?.toString() || null,
number: row.Number?.toString() || null,
status: row.Status?.toString() || "new",
status: row.Status?.toString() || 'new',
};
if (cId) {
await prisma.career.upsert({
@@ -168,7 +158,7 @@ export const bulkImportExcelData = async (req, res) => {
await prisma.inquiry.create({
data: {
fullName: row.FullName.toString(),
number: row.Number?.toString() || "",
number: row.Number?.toString() || '',
emailId: row.EmailId?.toString() || null,
subject: row.Subject?.toString() || null,
message: row.Message?.toString() || null,
@@ -185,10 +175,10 @@ export const bulkImportExcelData = async (req, res) => {
await prisma.academicsResearch.create({
data: {
fullName: row.FullName.toString(),
number: row.Number?.toString() || "",
number: row.Number?.toString() || '',
emailId: row.EmailId?.toString() || null,
subject: row.Subject?.toString() || null, // Force String
courseName: row["Course Name"]?.toString() || null,
courseName: row['Course Name']?.toString() || null,
message: row.Message?.toString() || null,
createdAt: row.Date ? new Date(row.Date) : new Date(),
},
@@ -201,7 +191,7 @@ export const bulkImportExcelData = async (req, res) => {
for (const row of appointments) {
if (!row.FullName) continue;
const doctorName = row.Doctor?.toString();
const departmentName = row["Department Id"]?.toString();
const departmentName = row['Department Id']?.toString();
const doctor = await prisma.doctor.findFirst({
where: { name: doctorName },
@@ -214,11 +204,11 @@ export const bulkImportExcelData = async (req, res) => {
if (!value) return new Date();
// Excel numeric date
if (typeof value === "number") {
if (typeof value === 'number') {
return new Date((value - 25569) * 86400 * 1000);
}
if (typeof value === "string") {
if (typeof value === 'string') {
const v = value.trim();
// Handle DD/MM/YYYY
@@ -238,15 +228,15 @@ export const bulkImportExcelData = async (req, res) => {
}
}
console.warn("⚠️ Invalid date, using current date:", value);
console.warn('⚠️ Invalid date, using current date:', value);
return new Date();
};
if (doctor && department) {
await prisma.appointment.create({
data: {
name: row.FullName.toString(),
mobileNumber: row.Number?.toString() || "",
email: row["Email Id"]?.toString() || null,
mobileNumber: row.Number?.toString() || '',
email: row['Email Id']?.toString() || null,
message: row.Message?.toString() || null,
date: parseDate(row.Date),
doctorId: doctor.doctorId,
@@ -265,10 +255,10 @@ export const bulkImportExcelData = async (req, res) => {
.create({
data: {
fullName: row.FullName.toString(),
mobile: row.Number?.toString() || "",
email: row.EmailId?.toString() || "",
subject: row.Subject?.toString() || "",
coverLetter: row["Cover Letter"]?.toString() || "",
mobile: row.Number?.toString() || '',
email: row.EmailId?.toString() || '',
subject: row.Subject?.toString() || '',
coverLetter: row['Cover Letter']?.toString() || '',
careerId: parseInt(row.CareerId),
createdAt: row.Date ? new Date(row.Date) : new Date(),
},
@@ -294,11 +284,9 @@ export const bulkImportExcelData = async (req, res) => {
}
}
res
.status(200)
.json({ success: true, message: "✅ Import completed successfully!" });
res.status(200).json({ success: true, message: '✅ Import completed successfully!' });
} catch (error) {
console.error("❌ Bulk Import Error:", error);
console.error('❌ Bulk Import Error:', error);
res.status(500).json({ success: false, error: error.message });
}
};
backend/src/controllers/inquiry.controller.js
+21 -21
View File
@@ -1,17 +1,17 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
import {sendEmail} from "../utils/sendEmail.js";
import {getEmailsByType} from "../utils/getEmailByTypes.js";
import { sendEmail } from '../utils/sendEmail.js';
import { getEmailsByType } from '../utils/getEmailByTypes.js';
/* CREATE INQUIRY */
export const createInquiry = async (req, res) => {
try {
const {fullName, number, emailId, subject, message} = req.body;
const { fullName, number, emailId, subject, message } = req.body;
if (!fullName || !number) {
return res.status(400).json({
success: false,
message: "Full name and number are required",
message: 'Full name and number are required',
});
}
@@ -25,12 +25,12 @@ export const createInquiry = async (req, res) => {
},
});
try {
const emailList = await getEmailsByType("INQUIRY");
const emailList = await getEmailsByType('INQUIRY');
if (emailList && emailList.length > 0) {
await sendEmail({
to: emailList,
subject: "New Inquiry Received",
subject: 'New Inquiry Received',
html: `
<div style="font-family: Arial, sans-serif; background-color: #f4f6f8; padding: 20px;">
@@ -78,7 +78,7 @@ export const createInquiry = async (req, res) => {
word-break: break-word;
overflow-wrap: anywhere;
">
${message ? message.replace(/\n/g, "<br/>") : "-"}
${message ? message.replace(/\n/g, '<br/>') : '-'}
</div>
</div>
@@ -96,20 +96,20 @@ export const createInquiry = async (req, res) => {
});
}
} catch (err) {
console.error("Inquiry email failed:", err);
console.error('Inquiry email failed:', err);
}
res.status(200).json({
success: true,
status: 200,
data: inquiry,
message: "Inquiry added successfully",
message: 'Inquiry added successfully',
});
} catch (error) {
console.error(error);
res.status(500).json({
success: false,
message: "Failed to add inquiry",
message: 'Failed to add inquiry',
});
}
};
@@ -119,7 +119,7 @@ export const getInquiries = async (req, res) => {
try {
const inquiries = await prisma.inquiry.findMany({
orderBy: {
createdAt: "desc",
createdAt: 'desc',
},
});
@@ -130,7 +130,7 @@ export const getInquiries = async (req, res) => {
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to fetch inquiries",
message: 'Failed to fetch inquiries',
});
}
};
@@ -138,16 +138,16 @@ export const getInquiries = async (req, res) => {
/* GET SINGLE */
export const getInquiry = async (req, res) => {
try {
const {id} = req.params;
const { id } = req.params;
const inquiry = await prisma.inquiry.findUnique({
where: {id: Number(id)},
where: { id: Number(id) },
});
if (!inquiry) {
return res.status(404).json({
success: false,
message: "Inquiry not found",
message: 'Inquiry not found',
});
}
@@ -158,7 +158,7 @@ export const getInquiry = async (req, res) => {
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to fetch inquiry",
message: 'Failed to fetch inquiry',
});
}
};
@@ -166,20 +166,20 @@ export const getInquiry = async (req, res) => {
/* DELETE */
export const deleteInquiry = async (req, res) => {
try {
const {id} = req.params;
const { id } = req.params;
await prisma.inquiry.delete({
where: {id: Number(id)},
where: { id: Number(id) },
});
res.json({
success: true,
message: "Inquiry deleted successfully",
message: 'Inquiry deleted successfully',
});
} catch (error) {
res.status(500).json({
success: false,
message: "Failed to delete inquiry",
message: 'Failed to delete inquiry',
});
}
};
backend/src/controllers/newsMedia.controller.js
+15 -23
View File
@@ -1,4 +1,4 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
// GET ALL NEWS
@@ -6,7 +6,7 @@ export const getAllNews = async (req, res) => {
try {
const page = req.query.page ? parseInt(req.query.page) : null;
const limit = req.query.limit ? parseInt(req.query.limit) : null;
const search = req.query.search?.trim() || "";
const search = req.query.search?.trim() || '';
const includeImages = {
images: true,
@@ -16,7 +16,7 @@ export const getAllNews = async (req, res) => {
? {
headline: {
contains: search,
mode: "insensitive",
mode: 'insensitive',
},
}
: {};
@@ -32,7 +32,7 @@ export const getAllNews = async (req, res) => {
prisma.newsMedia.findMany({
where: whereCondition,
include: includeImages,
orderBy: { createdAt: "desc" },
orderBy: { createdAt: 'desc' },
skip,
take,
}),
@@ -69,7 +69,7 @@ export const getAllNews = async (req, res) => {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to fetch news",
message: 'Failed to fetch news',
});
}
};
@@ -87,7 +87,7 @@ export const getNewsById = async (req, res) => {
if (!n) {
return res.status(404).json({
success: false,
message: "News not found",
message: 'News not found',
});
}
@@ -113,7 +113,7 @@ export const getNewsById = async (req, res) => {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to fetch news",
message: 'Failed to fetch news',
});
}
};
@@ -122,20 +122,12 @@ export const getNewsById = async (req, res) => {
export const createNews = async (req, res) => {
try {
const {
headline,
content,
firstPara,
secondPara,
date,
author,
imageUrls,
} = req.body;
const { headline, content, firstPara, secondPara, date, author, imageUrls } = req.body;
if (!headline) {
return res.status(400).json({
success: false,
message: "Headline is required",
message: 'Headline is required',
});
}
@@ -158,14 +150,14 @@ export const createNews = async (req, res) => {
return res.status(201).json({
success: true,
message: "News created successfully",
message: 'News created successfully',
data: news,
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to create news",
message: 'Failed to create news',
});
}
};
@@ -194,14 +186,14 @@ export const updateNews = async (req, res) => {
return res.status(200).json({
success: true,
message: "News updated successfully",
message: 'News updated successfully',
data: news,
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to update news",
message: 'Failed to update news',
});
}
};
@@ -218,13 +210,13 @@ export const deleteNews = async (req, res) => {
return res.status(200).json({
success: true,
message: "News deleted successfully",
message: 'News deleted successfully',
});
} catch (error) {
console.error(error);
return res.status(500).json({
success: false,
message: "Failed to delete news",
message: 'Failed to delete news',
});
}
};
backend/src/controllers/upload.controller.js
+4 -4
View File
@@ -1,9 +1,9 @@
import multer from "multer";
import path from "path";
import multer from 'multer';
import path from 'path';
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, "uploads/blog");
cb(null, 'uploads/blog');
},
filename: function (req, file, cb) {
@@ -12,4 +12,4 @@ const storage = multer.diskStorage({
},
});
export const upload = multer({storage});
export const upload = multer({ storage });
backend/src/middleware/auth.js
+5 -5
View File
@@ -1,19 +1,19 @@
import {verifyToken} from "../utils/jwt.js";
import { verifyToken } from '../utils/jwt.js';
export default function jwtAuthMiddleware(req, res, next) {
const authHeader = req.headers.authorization;
if (!authHeader || !authHeader.startsWith("Bearer ")) {
return res.status(401).json({error: "No token provided"});
if (!authHeader || !authHeader.startsWith('Bearer ')) {
return res.status(401).json({ error: 'No token provided' });
}
const token = authHeader.split(" ")[1];
const token = authHeader.split(' ')[1];
try {
const user = verifyToken(token);
req.user = user;
next();
} catch (err) {
return res.status(401).json({error: "Invalid or expired token"});
return res.status(401).json({ error: 'Invalid or expired token' });
}
}
backend/src/prisma/client.js
+1 -1
View File
@@ -1,4 +1,4 @@
import {PrismaClient} from "@prisma/client";
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();
backend/src/routes/academicsResearch.routes.js
+7 -7
View File
@@ -1,18 +1,18 @@
import express from "express";
import express from 'express';
import {
createAcademicsResearch,
getAcademicsResearch,
getSingleAcademicsResearch,
deleteAcademicsResearch,
} from "../controllers/academicsResearch.controller.js";
} from '../controllers/academicsResearch.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.post("/", createAcademicsResearch);
router.get("/getAll", jwtAuthMiddleware, getAcademicsResearch);
router.get("/:id", jwtAuthMiddleware, getSingleAcademicsResearch);
router.delete("/:id", jwtAuthMiddleware, deleteAcademicsResearch);
router.post('/', createAcademicsResearch);
router.get('/getAll', jwtAuthMiddleware, getAcademicsResearch);
router.get('/:id', jwtAuthMiddleware, getSingleAcademicsResearch);
router.delete('/:id', jwtAuthMiddleware, deleteAcademicsResearch);
export default router;
backend/src/routes/appointment.routes.js
+8 -8
View File
@@ -1,23 +1,23 @@
import express from "express";
import express from 'express';
import {
createAppointment,
getAppointments,
getAppointment,
updateAppointment,
deleteAppointment,
} from "../controllers/appointment.controller.js";
} from '../controllers/appointment.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
/* PUBLIC */
router.get("/getall", jwtAuthMiddleware, getAppointments);
router.post("/", createAppointment);
router.get('/getall', jwtAuthMiddleware, getAppointments);
router.post('/', createAppointment);
router.get("/:id", jwtAuthMiddleware, getAppointment);
router.patch("/:id", jwtAuthMiddleware, updateAppointment);
router.delete("/:id", jwtAuthMiddleware, deleteAppointment);
router.get('/:id', jwtAuthMiddleware, getAppointment);
router.patch('/:id', jwtAuthMiddleware, updateAppointment);
router.delete('/:id', jwtAuthMiddleware, deleteAppointment);
export default router;
backend/src/routes/auth.routes.js
+3 -3
View File
@@ -1,8 +1,8 @@
import express from "express";
import { login } from "../controllers/auth.controller.js";
import express from 'express';
import { login } from '../controllers/auth.controller.js';
const router = express.Router();
router.post("/login", login);
router.post('/login', login);
export default router;
backend/src/routes/blog.routes.js
+10 -10
View File
@@ -1,4 +1,4 @@
import express from "express";
import express from 'express';
import {
createBlog,
getBlogs,
@@ -7,25 +7,25 @@ import {
deleteBlog,
getAllBlogs,
getBlogForAdmin,
} from "../controllers/blog.controller.js";
} from '../controllers/blog.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
/* PUBLIC */
router.get("/", getBlogs);
router.get("/:slug", getBlog);
router.get('/', getBlogs);
router.get('/:slug', getBlog);
// Protected
router.get("/admin/all", jwtAuthMiddleware, getAllBlogs);
router.get('/admin/all', jwtAuthMiddleware, getAllBlogs);
router.get("/admin/:id", jwtAuthMiddleware, getBlogForAdmin);
router.get('/admin/:id', jwtAuthMiddleware, getBlogForAdmin);
router.post("/", jwtAuthMiddleware, createBlog);
router.put("/:id", jwtAuthMiddleware, updateBlog);
router.delete("/:id", jwtAuthMiddleware, deleteBlog);
router.post('/', jwtAuthMiddleware, createBlog);
router.put('/:id', jwtAuthMiddleware, updateBlog);
router.delete('/:id', jwtAuthMiddleware, deleteBlog);
export default router;
backend/src/routes/candidate.routes.js
+9 -9
View File
@@ -1,4 +1,4 @@
import express from "express";
import express from 'express';
import {
createCandidate,
getCandidates,
@@ -6,20 +6,20 @@ import {
getCandidatesByCareer,
updateCandidate,
deleteCandidate,
} from "../controllers/candidate.controller.js";
} from '../controllers/candidate.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
/* PUBLIC */
router.post("/", createCandidate);
router.post('/', createCandidate);
router.get("/getAll", jwtAuthMiddleware, getCandidates);
router.get("/:id", jwtAuthMiddleware, getCandidate);
router.get("/career/:careerId", jwtAuthMiddleware, getCandidatesByCareer);
router.get('/getAll', jwtAuthMiddleware, getCandidates);
router.get('/:id', jwtAuthMiddleware, getCandidate);
router.get('/career/:careerId', jwtAuthMiddleware, getCandidatesByCareer);
router.patch("/:id", jwtAuthMiddleware, updateCandidate);
router.delete("/:id", jwtAuthMiddleware, deleteCandidate);
router.patch('/:id', jwtAuthMiddleware, updateCandidate);
router.delete('/:id', jwtAuthMiddleware, deleteCandidate);
export default router;
backend/src/routes/career.routes.js
+7 -12
View File
@@ -1,19 +1,14 @@
import express from "express";
import {
getAllCareers,
createCareer,
updateCareer,
deleteCareer,
} from "../controllers/career.controller.js";
import express from 'express';
import { getAllCareers, createCareer, updateCareer, deleteCareer } from '../controllers/career.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.get("/getAll", getAllCareers);
router.get('/getAll', getAllCareers);
router.post("/", jwtAuthMiddleware, createCareer);
router.patch("/:id", jwtAuthMiddleware, updateCareer);
router.delete("/:id", jwtAuthMiddleware, deleteCareer);
router.post('/', jwtAuthMiddleware, createCareer);
router.patch('/:id', jwtAuthMiddleware, updateCareer);
router.delete('/:id', jwtAuthMiddleware, deleteCareer);
export default router;
backend/src/routes/department.routes.js
+8 -8
View File
@@ -1,22 +1,22 @@
import express from "express";
import express from 'express';
import {
getAllDepartments,
getDepartmentByName,
createDepartment,
updateDepartment,
deleteDepartment,
} from "../controllers/department.controller.js";
import jwtAuthMiddleware from "../middleware/auth.js";
} from '../controllers/department.controller.js';
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
// Public
router.get("/getAll", getAllDepartments);
router.get("/search", getDepartmentByName);
router.get('/getAll', getAllDepartments);
router.get('/search', getDepartmentByName);
// Protected
router.post("/", jwtAuthMiddleware, createDepartment);
router.put("/:departmentId", jwtAuthMiddleware, updateDepartment);
router.delete("/:departmentId", jwtAuthMiddleware, deleteDepartment);
router.post('/', jwtAuthMiddleware, createDepartment);
router.put('/:departmentId', jwtAuthMiddleware, updateDepartment);
router.delete('/:departmentId', jwtAuthMiddleware, deleteDepartment);
export default router;
backend/src/routes/doctor.routes.js
+11 -11
View File
@@ -1,4 +1,4 @@
import express from "express";
import express from 'express';
import {
getAllDoctors,
createDoctor,
@@ -8,20 +8,20 @@ import {
getDoctorTimingById,
getDoctorByDoctorId,
getDoctorsByDepartmentId,
} from "../controllers/doctor.controller.js";
} from '../controllers/doctor.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.get("/getAll", getAllDoctors);
router.get("/search", getDoctorsByDepartmentId);
router.get("/getTimings", getDoctorTimings);
router.get("/getTimings/:doctorId", getDoctorTimingById);
router.get("/:doctorId", getDoctorByDoctorId);
router.get('/getAll', getAllDoctors);
router.get('/search', getDoctorsByDepartmentId);
router.get('/getTimings', getDoctorTimings);
router.get('/getTimings/:doctorId', getDoctorTimingById);
router.get('/:doctorId', getDoctorByDoctorId);
router.post("/", jwtAuthMiddleware, createDoctor);
router.patch("/:doctorId/:action", jwtAuthMiddleware, updateDoctor);
router.delete("/:doctorId", jwtAuthMiddleware, deleteDoctor);
router.post('/', jwtAuthMiddleware, createDoctor);
router.patch('/:doctorId/:action', jwtAuthMiddleware, updateDoctor);
router.delete('/:doctorId', jwtAuthMiddleware, deleteDoctor);
export default router;
backend/src/routes/emailConfig.routes.js
+7 -7
View File
@@ -1,19 +1,19 @@
import express from "express";
import express from 'express';
import {
getEmailConfigs,
createEmailConfig,
updateEmailConfig,
deleteEmailConfig,
} from "../controllers/emailConfig.controller.js";
} from '../controllers/emailConfig.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.get("/getAll", getEmailConfigs);
router.get('/getAll', getEmailConfigs);
router.post("/", jwtAuthMiddleware, createEmailConfig);
router.patch("/:id", jwtAuthMiddleware, updateEmailConfig);
router.delete("/:id", jwtAuthMiddleware, deleteEmailConfig);
router.post('/', jwtAuthMiddleware, createEmailConfig);
router.patch('/:id', jwtAuthMiddleware, updateEmailConfig);
router.delete('/:id', jwtAuthMiddleware, deleteEmailConfig);
export default router;
backend/src/routes/healthCheck.route.js
+14 -14
View File
@@ -1,4 +1,4 @@
import express from "express";
import express from 'express';
import {
// Categories
getAllCategories,
@@ -16,24 +16,24 @@ import {
// Inquiries
createPackageInquiry,
getAllInquiries,
} from "../controllers/healthCheck.controller.js";
} from '../controllers/healthCheck.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.get("/packages", getAllPackages);
router.get("/packages/:slug", getPackageBySlug);
router.get("/categories", getAllCategories);
router.post("/inquiry", createPackageInquiry);
router.get('/packages', getAllPackages);
router.get('/packages/:slug', getPackageBySlug);
router.get('/categories', getAllCategories);
router.post('/inquiry', createPackageInquiry);
router.get("/inquiries", jwtAuthMiddleware, getAllInquiries);
router.post("/", jwtAuthMiddleware, createPackage);
router.patch("/:id", jwtAuthMiddleware, updatePackage);
router.delete("/:id", jwtAuthMiddleware, deletePackage);
router.get('/inquiries', jwtAuthMiddleware, getAllInquiries);
router.post('/', jwtAuthMiddleware, createPackage);
router.patch('/:id', jwtAuthMiddleware, updatePackage);
router.delete('/:id', jwtAuthMiddleware, deletePackage);
router.post("/categories", jwtAuthMiddleware, createCategory);
router.patch("/categories/:id", jwtAuthMiddleware, updateCategory);
router.delete("/categories/:id", jwtAuthMiddleware, deleteCategory);
router.post('/categories', jwtAuthMiddleware, createCategory);
router.patch('/categories/:id', jwtAuthMiddleware, updateCategory);
router.delete('/categories/:id', jwtAuthMiddleware, deleteCategory);
export default router;
backend/src/routes/importRoutes.js
+4 -4
View File
@@ -1,9 +1,9 @@
import express from "express";
import { bulkImportExcelData } from "../controllers/importController.js";
import jwtAuthMiddleware from "../middleware/auth.js";
import express from 'express';
import { bulkImportExcelData } from '../controllers/importController.js';
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.post("/bulk", jwtAuthMiddleware, bulkImportExcelData);
router.post('/bulk', jwtAuthMiddleware, bulkImportExcelData);
export default router;
backend/src/routes/inquiry.routes.js
+7 -12
View File
@@ -1,19 +1,14 @@
import express from "express";
import {
createInquiry,
getInquiries,
getInquiry,
deleteInquiry,
} from "../controllers/inquiry.controller.js";
import express from 'express';
import { createInquiry, getInquiries, getInquiry, deleteInquiry } from '../controllers/inquiry.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
router.post("/", createInquiry);
router.post('/', createInquiry);
router.get("/getAll", jwtAuthMiddleware, getInquiries);
router.get("/:id", jwtAuthMiddleware, getInquiry);
router.delete("/:id", jwtAuthMiddleware, deleteInquiry);
router.get('/getAll', jwtAuthMiddleware, getInquiries);
router.get('/:id', jwtAuthMiddleware, getInquiry);
router.delete('/:id', jwtAuthMiddleware, deleteInquiry);
export default router;
backend/src/routes/newsMedia.routes.js
+8 -14
View File
@@ -1,23 +1,17 @@
import express from "express";
import {
createNews,
getAllNews,
getNewsById,
updateNews,
deleteNews,
} from "../controllers/newsMedia.controller.js";
import express from 'express';
import { createNews, getAllNews, getNewsById, updateNews, deleteNews } from '../controllers/newsMedia.controller.js';
import jwtAuthMiddleware from "../middleware/auth.js";
import jwtAuthMiddleware from '../middleware/auth.js';
const router = express.Router();
// PUBLIC ROUTES
router.get("/getAll", getAllNews);
router.get("/:id", getNewsById);
router.get('/getAll', getAllNews);
router.get('/:id', getNewsById);
// PROTECTED ROUTES
router.post("/", jwtAuthMiddleware, createNews);
router.patch("/:id", jwtAuthMiddleware, updateNews);
router.delete("/:id", jwtAuthMiddleware, deleteNews);
router.post('/', jwtAuthMiddleware, createNews);
router.patch('/:id', jwtAuthMiddleware, updateNews);
router.delete('/:id', jwtAuthMiddleware, deleteNews);
export default router;
backend/src/routes/upload.routes.js
+9 -9
View File
@@ -1,6 +1,6 @@
import express from "express";
import * as Bytescale from "@bytescale/sdk";
import multer from "multer";
import express from 'express';
import * as Bytescale from '@bytescale/sdk';
import multer from 'multer';
const router = express.Router();
@@ -9,26 +9,26 @@ const uploadManager = new Bytescale.UploadManager({
});
const storage = multer.memoryStorage();
const upload = multer({storage});
const upload = multer({ storage });
router.post("/", upload.single("file"), async (req, res) => {
router.post('/', upload.single('file'), async (req, res) => {
try {
const file = req.file;
const {folderPath} = req.body;
const { folderPath } = req.body;
const result = await uploadManager.upload({
data: file.buffer,
name: file.originalname,
mime: file.mimetype,
path: {
folderPath: folderPath || "/general",
folderPath: folderPath || '/general',
},
});
res.json({fileUrl: result.fileUrl});
res.json({ fileUrl: result.fileUrl });
} catch (error) {
console.error(error);
res.status(500).json({error: "Upload failed"});
res.status(500).json({ error: 'Upload failed' });
}
});
backend/src/utils/createUser.js
+6 -8
View File
@@ -1,14 +1,12 @@
import prisma from "../prisma/client.js";
import { hashPassword } from "./password.js";
import prisma from '../prisma/client.js';
import { hashPassword } from './password.js';
async function main() {
const username = process.argv[2];
const password = process.argv[3];
const role = process.argv[4] || "admin";
const role = process.argv[4] || 'admin';
if (!username || !password) {
console.log(
"Usage: node scripts/createUser.js <username> <password> [role]",
);
console.log('Usage: node scripts/createUser.js <username> <password> [role]');
process.exit(1);
}
@@ -17,7 +15,7 @@ async function main() {
});
if (existingUser) {
console.log("User already exists");
console.log('User already exists');
process.exit(1);
}
@@ -31,7 +29,7 @@ async function main() {
},
});
console.log("User created:", {
console.log('User created:', {
id: user.id,
username: user.username,
role: user.role,
backend/src/utils/getEmailByTypes.js
+4 -4
View File
@@ -1,4 +1,4 @@
import prisma from "../prisma/client.js";
import prisma from '../prisma/client.js';
export const getEmailsByType = async (type) => {
try {
@@ -9,9 +9,9 @@ export const getEmailsByType = async (type) => {
},
});
return emails.map((e) => e.email).join(",");
return emails.map((e) => e.email).join(',');
} catch (error) {
console.error("Fetch email config error:", error);
return "";
console.error('Fetch email config error:', error);
return '';
}
};
backend/src/utils/jwt.js
+3 -3
View File
@@ -1,10 +1,10 @@
import jwt from "jsonwebtoken";
import "dotenv/config";
import jwt from 'jsonwebtoken';
import 'dotenv/config';
const SECRET = process.env.JWT_SECRET;
export function generateToken(payload) {
return jwt.sign(payload, SECRET, {expiresIn: "24h"});
return jwt.sign(payload, SECRET, { expiresIn: '24h' });
}
export function verifyToken(token) {
backend/src/utils/password.js
+1 -1
View File
@@ -1,4 +1,4 @@
import bcrypt from "bcryptjs";
import bcrypt from 'bcryptjs';
export async function hashPassword(password) {
return bcrypt.hash(password, 10);
backend/src/utils/sendEmail.js
+5 -5
View File
@@ -1,18 +1,18 @@
import postmark from "postmark";
import postmark from 'postmark';
const client = new postmark.ServerClient(process.env.POSTMARK_API_KEY);
export const sendEmail = async ({to, subject, html, text}) => {
export const sendEmail = async ({ to, subject, html, text }) => {
try {
await client.sendEmail({
From: process.env.EMAIL_FROM,
To: to,
Subject: subject,
HtmlBody: html,
TextBody: text || "",
MessageStream: "outbound",
TextBody: text || '',
MessageStream: 'outbound',
});
} catch (error) {
console.error("Email send error:", error);
console.error('Email send error:', error);
}
};
docker-compose.dev.yml
+39 -39
View File
@@ -1,45 +1,45 @@
version: "3.8"
version: '3.8'
services:
backend:
build:
context: .
dockerfile: docker/dev/Dockerfile.main
ports:
- "127.0.0.1:5008:5008"
env_file:
- ./backend/.env
depends_on:
db:
condition: service_healthy
restart: unless-stopped
backend:
build:
context: .
dockerfile: docker/dev/Dockerfile.main
ports:
- '127.0.0.1:5008:5008'
env_file:
- ./backend/.env
depends_on:
db:
condition: service_healthy
restart: unless-stopped
frontend:
build:
context: .
dockerfile: docker/dev/Dockerfile.frontend
ports:
- "127.0.0.1:3008:3000"
env_file:
- ./frontend/.env
restart: unless-stopped
frontend:
build:
context: .
dockerfile: docker/dev/Dockerfile.frontend
ports:
- '127.0.0.1:3008:3000'
env_file:
- ./frontend/.env
restart: unless-stopped
db:
image: postgres:16-alpine
environment:
- POSTGRES_USER=${POSTGRES_USER}
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
- POSTGRES_DB=${POSTGRES_DB}
volumes:
- postgres_data:/var/lib/postgresql/data
healthcheck:
test: ["CMD-SHELL", "pg_isready -U $$POSTGRES_USER -d $$POSTGRES_DB"]
interval: 5s
timeout: 5s
retries: 5
restart: unless-stopped
db:
image: postgres:16-alpine
environment:
- POSTGRES_USER=${POSTGRES_USER}
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
- POSTGRES_DB=${POSTGRES_DB}
volumes:
- postgres_data:/var/lib/postgresql/data
healthcheck:
test: ['CMD-SHELL', 'pg_isready -U $$POSTGRES_USER -d $$POSTGRES_DB']
interval: 5s
timeout: 5s
retries: 5
restart: unless-stopped
volumes:
postgres_data:
external: true
name: gg-backend_postgres_data
postgres_data:
external: true
name: gg-backend_postgres_data
docker-compose.prod.yml
+36 -36
View File
@@ -1,41 +1,41 @@
services:
backend:
build:
context: .
dockerfile: docker/dev/Dockerfile.main
ports:
- "127.0.0.1:5008:5008"
env_file:
- ./backend/.env
depends_on:
db:
condition: service_healthy
restart: always
backend:
build:
context: .
dockerfile: docker/dev/Dockerfile.main
ports:
- '127.0.0.1:5008:5008'
env_file:
- ./backend/.env
depends_on:
db:
condition: service_healthy
restart: always
frontend:
build:
context: .
dockerfile: docker/dev/Dockerfile.frontend
ports:
- "127.0.0.1:3008:3000"
env_file:
- ./frontend/.env
restart: always
frontend:
build:
context: .
dockerfile: docker/dev/Dockerfile.frontend
ports:
- '127.0.0.1:3008:3000'
env_file:
- ./frontend/.env
restart: always
db:
image: postgres:16-alpine
environment:
- POSTGRES_USER=${POSTGRES_USER}
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
- POSTGRES_DB=${POSTGRES_DB}
volumes:
- postgres_data:/var/lib/postgresql/data
healthcheck:
test: ["CMD-SHELL", "pg_isready -U $$POSTGRES_USER -d $$POSTGRES_DB"]
interval: 5s
timeout: 5s
retries: 5
restart: always
db:
image: postgres:16-alpine
environment:
- POSTGRES_USER=${POSTGRES_USER}
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD}
- POSTGRES_DB=${POSTGRES_DB}
volumes:
- postgres_data:/var/lib/postgresql/data
healthcheck:
test: ['CMD-SHELL', 'pg_isready -U $$POSTGRES_USER -d $$POSTGRES_DB']
interval: 5s
timeout: 5s
retries: 5
restart: always
volumes:
postgres_data:
postgres_data:
frontend/components.json
+23 -23
View File
@@ -1,25 +1,25 @@
{
"$schema": "https://ui.shadcn.com/schema.json",
"style": "radix-nova",
"rsc": false,
"tsx": true,
"tailwind": {
"config": "tailwind.config.js",
"css": "src/index.css",
"baseColor": "neutral",
"cssVariables": true,
"prefix": ""
},
"iconLibrary": "lucide",
"rtl": false,
"aliases": {
"components": "@/components",
"utils": "@/lib/utils",
"ui": "@/components/ui",
"lib": "@/lib",
"hooks": "@/hooks"
},
"menuColor": "default",
"menuAccent": "subtle",
"registries": {}
"$schema": "https://ui.shadcn.com/schema.json",
"style": "radix-nova",
"rsc": false,
"tsx": true,
"tailwind": {
"config": "tailwind.config.js",
"css": "src/index.css",
"baseColor": "neutral",
"cssVariables": true,
"prefix": ""
},
"iconLibrary": "lucide",
"rtl": false,
"aliases": {
"components": "@/components",
"utils": "@/lib/utils",
"ui": "@/components/ui",
"lib": "@/lib",
"hooks": "@/hooks"
},
"menuColor": "default",
"menuAccent": "subtle",
"registries": {}
}
frontend/eslint.config.js
+21 -21
View File
@@ -1,23 +1,23 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'
import { defineConfig, globalIgnores } from 'eslint/config'
import js from '@eslint/js';
import globals from 'globals';
import reactHooks from 'eslint-plugin-react-hooks';
import reactRefresh from 'eslint-plugin-react-refresh';
import tseslint from 'typescript-eslint';
import { defineConfig, globalIgnores } from 'eslint/config';
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
js.configs.recommended,
tseslint.configs.recommended,
reactHooks.configs.flat.recommended,
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
},
])
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
js.configs.recommended,
tseslint.configs.recommended,
reactHooks.configs.flat.recommended,
reactRefresh.configs.vite,
],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
},
]);
frontend/package-lock.json
Generated
+9697 -9697
View File
File diff suppressed because it is too large Load Diff
frontend/package.json
+57 -57
View File
@@ -1,59 +1,59 @@
{
"name": "frontend",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@editorjs/code": "^2.9.4",
"@editorjs/delimiter": "^1.4.2",
"@editorjs/editorjs": "^2.31.5",
"@editorjs/embed": "^2.8.0",
"@editorjs/header": "^2.8.8",
"@editorjs/image": "^2.10.3",
"@editorjs/list": "^2.0.9",
"@editorjs/quote": "^2.7.6",
"@editorjs/table": "^2.4.5",
"@fontsource-variable/geist": "^5.2.8",
"@tailwindcss/postcss": "^4.2.1",
"axios": "^1.13.6",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.1.1",
"file-saver": "^2.0.5",
"lucide-react": "^0.577.0",
"radix-ui": "^1.4.3",
"react": "^19.2.0",
"react-dom": "^19.2.0",
"react-hot-toast": "^2.6.0",
"react-router-dom": "^7.13.1",
"shadcn": "^4.0.5",
"tailwind-merge": "^3.5.0",
"tailwindcss": "^4.2.1",
"tailwindcss-animate": "^1.0.7",
"tw-animate-css": "^1.4.0",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@eslint/js": "^9.39.1",
"@types/estree": "^1.0.8",
"@types/json-schema": "^7.0.15",
"@types/node": "^24.12.0",
"@types/react": "^19.2.7",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^5.1.4",
"eslint": "^9.39.1",
"eslint-plugin-react-hooks": "^7.0.1",
"eslint-plugin-react-refresh": "^0.4.24",
"globals": "^16.5.0",
"postcss": "^8.5.8",
"typescript": "~5.9.3",
"typescript-eslint": "^8.48.0",
"vite": "^7.3.1"
}
"name": "frontend",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@editorjs/code": "^2.9.4",
"@editorjs/delimiter": "^1.4.2",
"@editorjs/editorjs": "^2.31.5",
"@editorjs/embed": "^2.8.0",
"@editorjs/header": "^2.8.8",
"@editorjs/image": "^2.10.3",
"@editorjs/list": "^2.0.9",
"@editorjs/quote": "^2.7.6",
"@editorjs/table": "^2.4.5",
"@fontsource-variable/geist": "^5.2.8",
"@tailwindcss/postcss": "^4.2.1",
"axios": "^1.13.6",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.1.1",
"file-saver": "^2.0.5",
"lucide-react": "^0.577.0",
"radix-ui": "^1.4.3",
"react": "^19.2.0",
"react-dom": "^19.2.0",
"react-hot-toast": "^2.6.0",
"react-router-dom": "^7.13.1",
"shadcn": "^4.0.5",
"tailwind-merge": "^3.5.0",
"tailwindcss": "^4.2.1",
"tailwindcss-animate": "^1.0.7",
"tw-animate-css": "^1.4.0",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@eslint/js": "^9.39.1",
"@types/estree": "^1.0.8",
"@types/json-schema": "^7.0.15",
"@types/node": "^24.12.0",
"@types/react": "^19.2.7",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^5.1.4",
"eslint": "^9.39.1",
"eslint-plugin-react-hooks": "^7.0.1",
"eslint-plugin-react-refresh": "^0.4.24",
"globals": "^16.5.0",
"postcss": "^8.5.8",
"typescript": "~5.9.3",
"typescript-eslint": "^8.48.0",
"vite": "^7.3.1"
}
}
frontend/postcss.config.js
+1 -1
View File
@@ -1,5 +1,5 @@
export default {
plugins: {
"@tailwindcss/postcss": {},
'@tailwindcss/postcss': {},
},
};
frontend/src/App.tsx
+21 -21
View File
@@ -1,29 +1,29 @@
import {BrowserRouter, Routes, Route, Navigate} from "react-router-dom";
import {Toaster} from "react-hot-toast";
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
import { Toaster } from 'react-hot-toast';
import Login from "@/pages/Login";
import Login from '@/pages/Login';
import DashboardLayout from "./layouts/DashboardLayout";
import DashboardLayout from './layouts/DashboardLayout';
// import ProtectedRoute from "./components/ProtectedRoutes/ProtectedRoutes";
import ProtectedRoute from "./auth/ProtectedRoute";
import PublicRoute from "./auth/PublicRoute";
import {AuthProvider} from "./context/AuthContext";
import Department from "./pages/Department";
import Doctor from "./pages/Doctor";
import Blog from "./pages/Blog";
import BlogEditorPage from "./pages/BlogEditor";
import Appointment from "./pages/Appointment";
import EmailPage from "./pages/email";
import CareerPage from "./pages/Career";
import CandidatePage from "./pages/candidates";
import InquiryPage from "./pages/inquiry";
import AcademicsPage from "./pages/Academics";
import NewsPage from "./pages/newsMedia";
import BlogDetail from "./pages/BlogDetails";
import ImportData from "./pages/ImportData";
import HealthPackagePage from "./pages/HealthPackagePage";
import ProtectedRoute from './auth/ProtectedRoute';
import PublicRoute from './auth/PublicRoute';
import { AuthProvider } from './context/AuthContext';
import Department from './pages/Department';
import Doctor from './pages/Doctor';
import Blog from './pages/Blog';
import BlogEditorPage from './pages/BlogEditor';
import Appointment from './pages/Appointment';
import EmailPage from './pages/email';
import CareerPage from './pages/Career';
import CandidatePage from './pages/candidates';
import InquiryPage from './pages/inquiry';
import AcademicsPage from './pages/Academics';
import NewsPage from './pages/newsMedia';
import BlogDetail from './pages/BlogDetails';
import ImportData from './pages/ImportData';
import HealthPackagePage from './pages/HealthPackagePage';
export default function App() {
return (
frontend/src/api/academics.ts
+2 -2
View File
@@ -1,7 +1,7 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export const getAcademicsApi = async () => {
const res = await apiClient.get("/academics/getAll");
const res = await apiClient.get('/academics/getAll');
return res.data;
};
frontend/src/api/appointment.ts
+5 -5
View File
@@ -1,12 +1,12 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export const getAppointmentsApi = async (
page = 1,
limit = 10,
date = "",
startDate = "",
endDate = "",
search = "",
date = '',
startDate = '',
endDate = '',
search = ''
) => {
const params = new URLSearchParams({
page: String(page),
frontend/src/api/auth.ts
+3 -6
View File
@@ -1,10 +1,7 @@
import apiClient from "./client";
import apiClient from './client';
export const loginApi = async (
username: string,
password: string,
): Promise<any> => {
const response = await apiClient.post("/auth/login/", {
export const loginApi = async (username: string, password: string): Promise<any> => {
const response = await apiClient.post('/auth/login/', {
username,
password,
});
frontend/src/api/blog.ts
+6 -6
View File
@@ -1,4 +1,4 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export interface Blog {
id?: number;
@@ -9,7 +9,7 @@ export interface Blog {
}
export const getAllBlogsApi = async () => {
const res = await apiClient.get("/blogs");
const res = await apiClient.get('/blogs');
return res.data;
};
@@ -19,7 +19,7 @@ export const getBlogByIdApi = async (id: number) => {
};
export const createBlogApi = async (data: Blog) => {
const res = await apiClient.post("/blogs", data);
const res = await apiClient.post('/blogs', data);
return res.data;
};
@@ -36,11 +36,11 @@ export const deleteBlogApi = async (id: number) => {
/* IMAGE UPLOAD */
export const uploadImageApi = async (file: File) => {
const formData = new FormData();
formData.append("image", file);
formData.append('image', file);
const res = await apiClient.post("/upload/image", formData, {
const res = await apiClient.post('/upload/image', formData, {
headers: {
"Content-Type": "multipart/form-data",
'Content-Type': 'multipart/form-data',
},
});
frontend/src/api/candidates.ts
+2 -2
View File
@@ -1,7 +1,7 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export const getCandidatesApi = async () => {
const res = await apiClient.get("/candidates/getAll");
const res = await apiClient.get('/candidates/getAll');
return res.data;
};
frontend/src/api/career.ts
+10 -10
View File
@@ -1,20 +1,20 @@
import apiClient from "@/api/client";
import toast from "react-hot-toast";
import apiClient from '@/api/client';
import toast from 'react-hot-toast';
export const getCareersApi = async () => {
const res = await apiClient.get("/careers/getAll?admin=true");
const res = await apiClient.get('/careers/getAll?admin=true');
return res.data;
};
export const createCareerApi = async (data: any) => {
try {
const res = await apiClient.post("/careers", data);
const res = await apiClient.post('/careers', data);
toast.success("Career created successfully");
toast.success('Career created successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to create career");
toast.error(error?.response?.data?.message || 'Failed to create career');
throw error;
}
@@ -24,11 +24,11 @@ export const updateCareerApi = async (id: number, data: any) => {
try {
const res = await apiClient.patch(`/careers/${id}`, data);
toast.success("Career updated successfully");
toast.success('Career updated successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to update career");
toast.error(error?.response?.data?.message || 'Failed to update career');
throw error;
}
@@ -38,11 +38,11 @@ export const deleteCareerApi = async (id: number) => {
try {
const res = await apiClient.delete(`/careers/${id}`);
toast.success("Career deleted successfully");
toast.success('Career deleted successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to delete career");
toast.error(error?.response?.data?.message || 'Failed to delete career');
throw error;
}
frontend/src/api/client.ts
+12 -12
View File
@@ -1,48 +1,48 @@
import axios from "axios";
import type {InternalAxiosRequestConfig} from "axios";
import axios from 'axios';
import type { InternalAxiosRequestConfig } from 'axios';
const baseURL: string = import.meta.env.VITE_API_URL;
const apiClient = axios.create({
baseURL: baseURL,
headers: {
"Content-Type": "application/json",
'Content-Type': 'application/json',
},
});
export const setAxiosAuthToken = (token: string | null): void => {
if (token) {
apiClient.defaults.headers.common["Authorization"] = `Bearer ${token}`;
apiClient.defaults.headers.common['Authorization'] = `Bearer ${token}`;
} else {
delete apiClient.defaults.headers.common["Authorization"];
delete apiClient.defaults.headers.common['Authorization'];
}
};
apiClient.interceptors.request.use(
(config: InternalAxiosRequestConfig) => {
const token = localStorage.getItem("token");
const token = localStorage.getItem('token');
if (token && config.headers) {
config.headers["Authorization"] = `Bearer ${token}`;
config.headers['Authorization'] = `Bearer ${token}`;
}
return config;
},
(error: any) => Promise.reject(error),
(error: any) => Promise.reject(error)
);
apiClient.interceptors.response.use(
(response) => response,
async (error) => {
if (error.response?.status === 401) {
console.error("Unauthorized - token missing or invalid");
console.error('Unauthorized - token missing or invalid');
localStorage.removeItem("token");
window.location.href = "/login";
localStorage.removeItem('token');
window.location.href = '/login';
}
return Promise.reject(error);
},
}
);
export default apiClient;
frontend/src/api/department.ts
+11 -17
View File
@@ -1,5 +1,5 @@
import apiClient from "@/api/client";
import toast from "react-hot-toast";
import apiClient from '@/api/client';
import toast from 'react-hot-toast';
export interface Department {
departmentId: string;
@@ -15,7 +15,7 @@ export interface Department {
}
export const getDepartmentsApi = async () => {
const res = await apiClient.get("/departments/getAll?admin=true");
const res = await apiClient.get('/departments/getAll?admin=true');
return res.data;
};
@@ -29,15 +29,13 @@ export const createDepartmentApi = async (data: {
services?: string;
}) => {
try {
const res = await apiClient.post("/departments", data);
const res = await apiClient.post('/departments', data);
toast.success("Department created successfully");
toast.success('Department created successfully');
return res.data;
} catch (error: any) {
toast.error(
error?.response?.data?.message || "Failed to create department",
);
toast.error(error?.response?.data?.message || 'Failed to create department');
throw error;
}
@@ -52,18 +50,16 @@ export const updateDepartmentApi = async (
para3?: string;
facilities?: string;
services?: string;
},
}
) => {
try {
const res = await apiClient.put(`/departments/${departmentId}`, data);
toast.success("Department updated successfully");
toast.success('Department updated successfully');
return res.data;
} catch (error: any) {
toast.error(
error?.response?.data?.message || "Failed to update department",
);
toast.error(error?.response?.data?.message || 'Failed to update department');
throw error;
}
@@ -73,13 +69,11 @@ export const deleteDepartmentApi = async (departmentId: string) => {
try {
const res = await apiClient.delete(`/departments/${departmentId}`);
toast.success("Department deleted successfully");
toast.success('Department deleted successfully');
return res.data;
} catch (error: any) {
toast.error(
error?.response?.data?.message || "Failed to delete department",
);
toast.error(error?.response?.data?.message || 'Failed to delete department');
throw error;
}
frontend/src/api/doctor.ts
+11 -11
View File
@@ -1,5 +1,5 @@
import apiClient from "@/api/client";
import toast from "react-hot-toast";
import apiClient from '@/api/client';
import toast from 'react-hot-toast';
export interface Doctor {
doctorId: string;
@@ -27,7 +27,7 @@ export interface Doctor {
}
export const getDoctorsApi = async () => {
const res = await apiClient.get("/doctors/getAll?admin=true");
const res = await apiClient.get('/doctors/getAll?admin=true');
return res.data;
};
@@ -38,13 +38,13 @@ export const getDoctorByIdApi = async (doctorId: string) => {
export const createDoctorApi = async (data: Doctor) => {
try {
const res = await apiClient.post("/doctors", data);
const res = await apiClient.post('/doctors', data);
toast.success("Doctor created successfully");
toast.success('Doctor created successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to create doctor");
toast.error(error?.response?.data?.message || 'Failed to create doctor');
throw error;
}
@@ -53,16 +53,16 @@ export const createDoctorApi = async (data: Doctor) => {
export const updateDoctorApi = async (
doctorId: string,
data: Partial<Doctor>,
action: "toggleStatus" | "updateDetails" = "updateDetails",
action: 'toggleStatus' | 'updateDetails' = 'updateDetails'
) => {
try {
const res = await apiClient.patch(`/doctors/${doctorId}/${action}`, data);
toast.success("Doctor updated successfully");
toast.success('Doctor updated successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to update doctor");
toast.error(error?.response?.data?.message || 'Failed to update doctor');
throw error;
}
@@ -72,11 +72,11 @@ export const deleteDoctorApi = async (doctorId: string) => {
try {
const res = await apiClient.delete(`/doctors/${doctorId}`);
toast.success("Doctor deleted successfully");
toast.success('Doctor deleted successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to delete doctor");
toast.error(error?.response?.data?.message || 'Failed to delete doctor');
throw error;
}
frontend/src/api/email.ts
+4 -7
View File
@@ -1,4 +1,4 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export interface EmailConfig {
id?: number;
@@ -10,21 +10,18 @@ export interface EmailConfig {
// GET ALL
export const getEmailConfigsApi = async () => {
const res = await apiClient.get("/email/getAll");
const res = await apiClient.get('/email/getAll');
return res.data;
};
// CREATE
export const createEmailConfigApi = async (data: EmailConfig) => {
const res = await apiClient.post("/email", data);
const res = await apiClient.post('/email', data);
return res.data;
};
// UPDATE
export const updateEmailConfigApi = async (
id: number,
data: Partial<EmailConfig>,
) => {
export const updateEmailConfigApi = async (id: number, data: Partial<EmailConfig>) => {
const res = await apiClient.patch(`/email/${id}`, data);
return res.data;
};
frontend/src/api/healthCheck.ts
+25 -40
View File
@@ -1,5 +1,5 @@
import apiClient from "@/api/client";
import toast from "react-hot-toast";
import apiClient from '@/api/client';
import toast from 'react-hot-toast';
export interface SeoData {
seoTitle?: string;
@@ -56,36 +56,33 @@ export interface HealthInquiry {
}
export const getHealthCategoriesApi = async () => {
const res = await apiClient.get("/health-check/categories?admin=true");
const res = await apiClient.get('/health-check/categories?admin=true');
return res.data;
};
export const getHealthPackagesApi = async () => {
const res = await apiClient.get("/health-check/packages?admin=true");
const res = await apiClient.get('/health-check/packages?admin=true');
return res.data;
};
export const createHealthPackageApi = async (data: Partial<HealthPackage>) => {
try {
const res = await apiClient.post("/health-check", data);
toast.success("Package created successfully");
const res = await apiClient.post('/health-check', data);
toast.success('Package created successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to create package");
toast.error(error?.response?.data?.message || 'Failed to create package');
throw error;
}
};
export const updateHealthPackageApi = async (
id: number,
data: Partial<HealthPackage>,
) => {
export const updateHealthPackageApi = async (id: number, data: Partial<HealthPackage>) => {
try {
const res = await apiClient.patch(`/health-check/${id}`, data);
toast.success("Package updated successfully");
toast.success('Package updated successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to update package");
toast.error(error?.response?.data?.message || 'Failed to update package');
throw error;
}
};
@@ -93,27 +90,23 @@ export const updateHealthPackageApi = async (
export const deleteHealthPackageApi = async (id: number) => {
try {
const res = await apiClient.delete(`/health-check/${id}`);
toast.success("Package deleted successfully");
toast.success('Package deleted successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to delete package");
toast.error(error?.response?.data?.message || 'Failed to delete package');
throw error;
}
};
export const createCategoryApi = async (data: {
name: string;
slug: string;
sortOrder: number;
}) => {
export const createCategoryApi = async (data: { name: string; slug: string; sortOrder: number }) => {
try {
const res = await apiClient.post("/health-check/categories", data);
const res = await apiClient.post('/health-check/categories', data);
toast.success("Category created successfully");
toast.success('Category created successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to create category");
toast.error(error?.response?.data?.message || 'Failed to create category');
throw error;
}
@@ -123,11 +116,11 @@ export const updateCategoryApi = async (id: number, data: any) => {
try {
const res = await apiClient.patch(`/health-check/categories/${id}`, data);
toast.success("Category updated successfully");
toast.success('Category updated successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to update category");
toast.error(error?.response?.data?.message || 'Failed to update category');
throw error;
}
@@ -137,34 +130,26 @@ export const deleteCategoryApi = async (id: number) => {
try {
const res = await apiClient.delete(`/health-check/categories/${id}`);
toast.success("Category deleted successfully");
toast.success('Category deleted successfully');
return res.data;
} catch (error: any) {
toast.error(error?.response?.data?.message || "Failed to delete category");
toast.error(error?.response?.data?.message || 'Failed to delete category');
throw error;
}
};
export const getAllInquiriesApi = async (
page = 1,
limit = 10,
filterDate = "",
startDate = "",
endDate = "",
) => {
export const getAllInquiriesApi = async (page = 1, limit = 10, filterDate = '', startDate = '', endDate = '') => {
const params = new URLSearchParams({
page: page.toString(),
limit: limit.toString(),
});
if (filterDate) params.append("filterDate", filterDate);
if (startDate) params.append("startDate", startDate);
if (endDate) params.append("endDate", endDate);
if (filterDate) params.append('filterDate', filterDate);
if (startDate) params.append('startDate', startDate);
if (endDate) params.append('endDate', endDate);
const res = await apiClient.get(
`/health-check/inquiries?${params.toString()}`,
);
const res = await apiClient.get(`/health-check/inquiries?${params.toString()}`);
return res.data;
};
frontend/src/api/inquiry.ts
+2 -2
View File
@@ -1,7 +1,7 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export const getInquiriesApi = async () => {
const res = await apiClient.get("/inquiry/getAll");
const res = await apiClient.get('/inquiry/getAll');
return res.data;
};
frontend/src/api/newsMedia.ts
+4 -6
View File
@@ -1,14 +1,12 @@
import apiClient from "@/api/client";
import apiClient from '@/api/client';
export const getNewsApi = async (page = 1, limit = 10, search = "") => {
const res = await apiClient.get(
`/newsMedia/getAll?page=${page}&limit=${limit}&search=${search}`,
);
export const getNewsApi = async (page = 1, limit = 10, search = '') => {
const res = await apiClient.get(`/newsMedia/getAll?page=${page}&limit=${limit}&search=${search}`);
return res.data;
};
export const createNewsApi = async (data: any) => {
const res = await apiClient.post("/newsMedia", data);
const res = await apiClient.post('/newsMedia', data);
return res.data;
};
frontend/src/auth/ProtectedRoute.tsx
+3 -3
View File
@@ -1,7 +1,7 @@
import {Navigate, Outlet} from "react-router-dom";
import {useAuth} from "@/context/AuthContext";
import { Navigate, Outlet } from 'react-router-dom';
import { useAuth } from '@/context/AuthContext';
export default function ProtectedRoute() {
const {token} = useAuth();
const { token } = useAuth();
return token ? <Outlet /> : <Navigate to="/" replace />;
}
frontend/src/auth/PublicRoute.tsx
+3 -3
View File
@@ -1,7 +1,7 @@
import {Navigate, Outlet} from "react-router-dom";
import {useAuth} from "@/context/AuthContext";
import { Navigate, Outlet } from 'react-router-dom';
import { useAuth } from '@/context/AuthContext';
export default function PublicRoute() {
const {token} = useAuth();
const { token } = useAuth();
return token ? <Navigate to="/dashboard" replace /> : <Outlet />;
}
frontend/src/components/BytescaleUploader/BytescaleUploader.tsx
+17 -30
View File
@@ -1,26 +1,15 @@
import { useState, useRef } from "react";
import { Button } from "@/components/ui/button";
import { User, X, Loader2 } from "lucide-react";
import axios from "axios";
import { useState, useRef } from 'react';
import { Button } from '@/components/ui/button';
import { User, X, Loader2 } from 'lucide-react';
import axios from 'axios';
interface BytescaleUploaderProps {
value: string;
onChange: (url: string) => void;
folderPath:
| "/health-packages"
| "/seo"
| "/doctors"
| "/departments"
| "/news"
| "/blog"
| "/doctor-og";
folderPath: '/health-packages' | '/seo' | '/doctors' | '/departments' | '/news' | '/blog' | '/doctor-og';
}
export function BytescaleUploader({
value,
onChange,
folderPath,
}: BytescaleUploaderProps) {
export function BytescaleUploader({ value, onChange, folderPath }: BytescaleUploaderProps) {
const baseURL = import.meta.env.VITE_API_URL;
const [isUploading, setIsUploading] = useState(false);
const fileInputRef = useRef<HTMLInputElement>(null);
@@ -30,33 +19,32 @@ export function BytescaleUploader({
if (!file) return;
if (file.size > 5 * 1024 * 1024) {
alert("File is too large (Max 5MB)");
alert('File is too large (Max 5MB)');
return;
}
setIsUploading(true);
const formData = new FormData();
formData.append("file", file);
formData.append("folderPath", folderPath);
formData.append('file', file);
formData.append('folderPath', folderPath);
try {
const response = await axios.post(`${baseURL}/upload`, formData, {
headers: {
"Content-Type": "multipart/form-data",
'Content-Type': 'multipart/form-data',
},
});
const { fileUrl } = response.data;
onChange(fileUrl);
} catch (e: any) {
console.error("Upload Error:", e);
const errorMessage =
e.response?.data?.error || e.message || "Upload failed";
console.error('Upload Error:', e);
const errorMessage = e.response?.data?.error || e.message || 'Upload failed';
alert(`Upload Error: ${errorMessage}`);
} finally {
setIsUploading(false);
if (fileInputRef.current) fileInputRef.current.value = "";
if (fileInputRef.current) fileInputRef.current.value = '';
}
};
@@ -73,7 +61,7 @@ export function BytescaleUploader({
/>
<button
type="button"
onClick={() => onChange("")}
onClick={() => onChange('')}
className="absolute -top-1 -right-1 bg-destructive text-white rounded-full p-0.5 shadow-sm hover:scale-110 transition-transform"
>
<X className="w-3 h-3" />
@@ -111,17 +99,16 @@ export function BytescaleUploader({
Uploading...
</>
) : value ? (
"Change Photo"
'Change Photo'
) : (
"Upload Photo"
'Upload Photo'
)}
</Button>
</div>
{value && (
<p className="text-xs text-amber-600 pl-[72px]">
⚠️ Make sure to save the changes by clicking the "Save Changes"
button.
⚠️ Make sure to save the changes by clicking the "Save Changes" button.
</p>
)}
</div>
frontend/src/components/HealthPackageModal/HealthPackageModal.tsx
+39 -96
View File
@@ -1,38 +1,21 @@
import { BytescaleUploader } from "@/components/BytescaleUploader/BytescaleUploader";
import SeoFields from "@/components/SeoFields/SeoFields";
import { useEffect } from "react";
import { BytescaleUploader } from '@/components/BytescaleUploader/BytescaleUploader';
import SeoFields from '@/components/SeoFields/SeoFields';
import { useEffect } from 'react';
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { Input } from "@/components/ui/input";
import { Textarea } from "@/components/ui/textarea";
import { Button } from "@/components/ui/button";
import { Label } from "@/components/ui/label";
import { Badge } from "@/components/ui/badge";
import { Switch } from "@/components/ui/switch";
import { Input } from '@/components/ui/input';
import { Textarea } from '@/components/ui/textarea';
import { Button } from '@/components/ui/button';
import { Label } from '@/components/ui/label';
import { Badge } from '@/components/ui/badge';
import { Switch } from '@/components/ui/switch';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import {
Accordion,
AccordionContent,
AccordionItem,
AccordionTrigger,
} from "@/components/ui/accordion";
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
import { Plus, Trash2 } from "lucide-react";
import { Plus, Trash2 } from 'lucide-react';
interface Props {
open: boolean;
@@ -65,8 +48,8 @@ export default function HealthPackageModal({
? prev.slug
: pkgForm.name
.toLowerCase()
.replace(/[^a-z0-9]+/g, "-")
.replace(/(^-|-$)/g, ""),
.replace(/[^a-z0-9]+/g, '-')
.replace(/(^-|-$)/g, ''),
}));
}
}, [pkgForm.name]);
@@ -76,8 +59,8 @@ export default function HealthPackageModal({
...inclusionsList,
{
id: Date.now(),
category: "",
items: "",
category: '',
items: '',
},
]);
};
@@ -86,11 +69,7 @@ export default function HealthPackageModal({
setInclusionsList(inclusionsList.filter((item) => item.id !== id));
};
const handleUpdateInclusionField = (
id: number,
field: string,
value: string,
) => {
const handleUpdateInclusionField = (id: number, field: string, value: string) => {
setInclusionsList(
inclusionsList.map((item) =>
item.id === id
@@ -98,8 +77,8 @@ export default function HealthPackageModal({
...item,
[field]: value,
}
: item,
),
: item
)
);
};
@@ -108,7 +87,7 @@ export default function HealthPackageModal({
<DialogContent className="w-full !max-w-7xl h-[92vh] flex flex-col p-0 overflow-hidden">
<DialogHeader className="px-6 py-5 border-b bg-background sticky top-0 z-20">
<DialogTitle className="text-2xl font-bold">
{editingPackage ? "Edit Health Package" : "Create Health Package"}
{editingPackage ? 'Edit Health Package' : 'Create Health Package'}
</DialogTitle>
</DialogHeader>
@@ -120,21 +99,17 @@ export default function HealthPackageModal({
<div className="sticky top-0 bg-background z-10 pb-2">
<h3 className="text-lg font-bold">Profile & Pricing</h3>
<p className="text-sm text-muted-foreground">
Main package information
</p>
<p className="text-sm text-muted-foreground">Main package information</p>
</div>
<div className="space-y-5">
<div className="space-y-2">
<Label className="font-semibold">Package Image</Label>
<p className="text-xs text-muted-foreground">
Recommended size: 650 × 250
</p>
<p className="text-xs text-muted-foreground">Recommended size: 650 × 250</p>
<BytescaleUploader
value={pkgForm.image || ""}
value={pkgForm.image || ''}
folderPath="/health-packages"
onChange={(url) =>
setPkgForm({
@@ -149,9 +124,7 @@ export default function HealthPackageModal({
<div>
<p className="font-semibold">Active Visibility</p>
<p className="text-sm text-muted-foreground">
Show this package publicly
</p>
<p className="text-sm text-muted-foreground">Show this package publicly</p>
</div>
<Switch
@@ -227,11 +200,9 @@ export default function HealthPackageModal({
<Input
type="number"
value={pkgForm.price || ""}
value={pkgForm.price || ''}
onChange={(e) => {
const value = e.target.value
? Number(e.target.value)
: undefined;
const value = e.target.value ? Number(e.target.value) : undefined;
setPkgForm({
...pkgForm,
@@ -242,20 +213,16 @@ export default function HealthPackageModal({
</div>
<div className="space-y-2">
<Label className="font-semibold">
Discounted Price (₹)
</Label>
<Label className="font-semibold">Discounted Price (₹)</Label>
<Input
type="number"
disabled={!pkgForm.price}
value={pkgForm.discountedPrice || ""}
value={pkgForm.discountedPrice || ''}
onChange={(e) =>
setPkgForm({
...pkgForm,
discountedPrice: e.target.value
? Number(e.target.value)
: undefined,
discountedPrice: e.target.value ? Number(e.target.value) : undefined,
})
}
/>
@@ -300,21 +267,15 @@ export default function HealthPackageModal({
<div>
<h3 className="text-lg font-bold">Tests & Inclusions</h3>
<p className="text-sm text-muted-foreground">
Group tests into categories
</p>
<p className="text-sm text-muted-foreground">Group tests into categories</p>
</div>
<Badge variant="outline">
{inclusionsList.length} Groups
</Badge>
<Badge variant="outline">{inclusionsList.length} Groups</Badge>
</div>
<Accordion type="multiple" className="space-y-4">
{inclusionsList.map((inc, index) => {
const testCount = inc.items
?.split(",")
.filter(Boolean).length;
const testCount = inc.items?.split(',').filter(Boolean).length;
return (
<AccordionItem
@@ -325,13 +286,9 @@ export default function HealthPackageModal({
<AccordionTrigger className="hover:no-underline w-full">
<div className="flex w-full items-center justify-between">
<div className="flex flex-col items-start text-left">
<p className="font-semibold">
{inc.category || `Group ${index + 1}`}
</p>
<p className="font-semibold">{inc.category || `Group ${index + 1}`}</p>
<p className="text-xs text-muted-foreground">
{testCount || 0} tests included
</p>
<p className="text-xs text-muted-foreground">{testCount || 0} tests included</p>
</div>
<Button
@@ -354,13 +311,7 @@ export default function HealthPackageModal({
<Input
placeholder="Routine Blood Tests"
value={inc.category}
onChange={(e) =>
handleUpdateInclusionField(
inc.id,
"category",
e.target.value,
)
}
onChange={(e) => handleUpdateInclusionField(inc.id, 'category', e.target.value)}
/>
</div>
@@ -373,18 +324,10 @@ export default function HealthPackageModal({
rows={4}
placeholder="CBC, LFT, RFT, TSH"
value={inc.items}
onChange={(e) =>
handleUpdateInclusionField(
inc.id,
"items",
e.target.value,
)
}
onChange={(e) => handleUpdateInclusionField(inc.id, 'items', e.target.value)}
/>
<p className="text-xs text-muted-foreground">
Separate each test using commas
</p>
<p className="text-xs text-muted-foreground">Separate each test using commas</p>
</div>
</div>
</AccordionContent>
@@ -427,7 +370,7 @@ export default function HealthPackageModal({
</Button>
<Button className="px-10" onClick={onSave}>
{editingPackage ? "Save Changes" : "Create Package"}
{editingPackage ? 'Save Changes' : 'Create Package'}
</Button>
</DialogFooter>
</DialogContent>
frontend/src/components/PackageInquiriesTab/PackageInquiriesTab.tsx
+43 -97
View File
@@ -1,33 +1,21 @@
import { useState, useEffect, useCallback } from "react";
import { getAllInquiriesApi, HealthInquiry } from "@/api/healthCheck";
import { useState, useEffect, useCallback } from 'react';
import { getAllInquiriesApi, HealthInquiry } from '@/api/healthCheck';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Badge } from "@/components/ui/badge";
import { Loader2, RefreshCw, ChevronLeft, ChevronRight } from "lucide-react";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Badge } from '@/components/ui/badge';
import { Loader2, RefreshCw, ChevronLeft, ChevronRight } from 'lucide-react';
export default function PackageInquiriesTab() {
const [inquiries, setInquiries] = useState<HealthInquiry[]>([]);
const [loading, setLoading] = useState(true);
const [filterDate, setFilterDate] = useState("");
const [startDate, setStartDate] = useState("");
const [endDate, setEndDate] = useState("");
const [filterDate, setFilterDate] = useState('');
const [startDate, setStartDate] = useState('');
const [endDate, setEndDate] = useState('');
const [currentPage, setCurrentPage] = useState(1);
const [itemsPerPage, setItemsPerPage] = useState(10);
@@ -37,18 +25,12 @@ export default function PackageInquiriesTab() {
const fetchInquiries = useCallback(async () => {
setLoading(true);
try {
const res = await getAllInquiriesApi(
currentPage,
itemsPerPage,
filterDate,
startDate,
endDate,
);
const res = await getAllInquiriesApi(currentPage, itemsPerPage, filterDate, startDate, endDate);
setInquiries(res.data || []);
setTotalItems(res.pagination?.total || 0);
setTotalPages(res.pagination?.totalPages || 1);
} catch (err) {
console.error("Failed to fetch inquiries", err);
console.error('Failed to fetch inquiries', err);
} finally {
setLoading(false);
}
@@ -58,10 +40,7 @@ export default function PackageInquiriesTab() {
fetchInquiries();
}, [fetchInquiries]);
const handleFilterChange = (
setter: React.Dispatch<React.SetStateAction<string>>,
value: string,
) => {
const handleFilterChange = (setter: React.Dispatch<React.SetStateAction<string>>, value: string) => {
setter(value);
setCurrentPage(1);
};
@@ -76,24 +55,18 @@ export default function PackageInquiriesTab() {
<div className="flex flex-wrap items-end gap-3">
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
Specific Date
</label>
<label className="text-xs font-medium text-muted-foreground">Specific Date</label>
<Input
type="date"
value={filterDate}
onChange={(e) =>
handleFilterChange(setFilterDate, e.target.value)
}
onChange={(e) => handleFilterChange(setFilterDate, e.target.value)}
className="w-[140px] text-sm"
disabled={!!startDate || !!endDate}
/>
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
From
</label>
<label className="text-xs font-medium text-muted-foreground">From</label>
<Input
type="date"
value={startDate}
@@ -104,9 +77,7 @@ export default function PackageInquiriesTab() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
To
</label>
<label className="text-xs font-medium text-muted-foreground">To</label>
<Input
type="date"
value={endDate}
@@ -117,16 +88,15 @@ export default function PackageInquiriesTab() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
Rows
</label>
<label className="text-xs font-medium text-muted-foreground">Rows</label>
<select
value={itemsPerPage}
onChange={(e) => {
setItemsPerPage(Number(e.target.value));
setCurrentPage(1);
}}
className="flex h-10 rounded-md border border-input bg-background px-3 py-2 text-sm focus:ring-2 focus:ring-primary">
className="flex h-10 rounded-md border border-input bg-background px-3 py-2 text-sm focus:ring-2 focus:ring-primary"
>
<option value={5}>5 / page</option>
<option value={10}>10 / page</option>
<option value={20}>20 / page</option>
@@ -135,9 +105,7 @@ export default function PackageInquiriesTab() {
</div>
<Button variant="outline" onClick={fetchInquiries} disabled={loading}>
<RefreshCw
className={`mr-2 h-4 w-4 ${loading ? "animate-spin" : ""}`}
/>
<RefreshCw className={`mr-2 h-4 w-4 ${loading ? 'animate-spin' : ''}`} />
Refresh
</Button>
</div>
@@ -147,21 +115,11 @@ export default function PackageInquiriesTab() {
<Table className="w-full min-w-[1000px] table-fixed border-separate border-spacing-0">
<TableHeader className="sticky top-0 z-20 bg-background shadow-sm">
<TableRow>
<TableHead className="w-[150px] font-bold bg-background">
Requested Date
</TableHead>
<TableHead className="w-[220px] font-bold bg-background">
Patient Details
</TableHead>
<TableHead className="w-[250px] font-bold bg-background">
Requested Package
</TableHead>
<TableHead className="w-[120px] font-bold bg-background">
Age/Gender
</TableHead>
<TableHead className="w-[250px] font-bold bg-background">
Message
</TableHead>
<TableHead className="w-[150px] font-bold bg-background">Requested Date</TableHead>
<TableHead className="w-[220px] font-bold bg-background">Patient Details</TableHead>
<TableHead className="w-[250px] font-bold bg-background">Requested Package</TableHead>
<TableHead className="w-[120px] font-bold bg-background">Age/Gender</TableHead>
<TableHead className="w-[250px] font-bold bg-background">Message</TableHead>
</TableRow>
</TableHeader>
<TableBody>
@@ -173,9 +131,7 @@ export default function PackageInquiriesTab() {
</TableRow>
) : inquiries.length === 0 ? (
<TableRow>
<TableCell
colSpan={5}
className="text-center text-muted-foreground py-10">
<TableCell colSpan={5} className="text-center text-muted-foreground py-10">
No inquiries found for the selected criteria
</TableCell>
</TableRow>
@@ -187,23 +143,16 @@ export default function PackageInquiriesTab() {
{new Date(inq.preferredDate).toLocaleDateString()}
</div>
<div className="text-[11px] text-muted-foreground mt-1">
Submitted:{" "}
{new Date(inq.createdAt).toLocaleDateString()}
Submitted: {new Date(inq.createdAt).toLocaleDateString()}
</div>
</TableCell>
<TableCell>
<div className="font-semibold text-base">
{inq.fullName}
</div>
<div className="font-semibold text-base">{inq.fullName}</div>
<div className="text-sm">{inq.mobileNumber}</div>
<div className="text-xs text-muted-foreground">
{inq.email || "-"}
</div>
<div className="text-xs text-muted-foreground">{inq.email || '-'}</div>
</TableCell>
<TableCell>
<div className="font-semibold text-sm truncate">
{inq.healthPackage?.name || "N/A"}
</div>
<div className="font-semibold text-sm truncate">{inq.healthPackage?.name || 'N/A'}</div>
</TableCell>
<TableCell>
<div className="font-medium">
@@ -214,12 +163,12 @@ export default function PackageInquiriesTab() {
<Tooltip>
<TooltipTrigger asChild>
<div className="text-sm italic line-clamp-3 text-muted-foreground whitespace-pre-wrap cursor-pointer">
{inq.message || "No message provided."}
{inq.message || 'No message provided.'}
</div>
</TooltipTrigger>
<TooltipContent className="max-w-md whitespace-pre-wrap">
{inq.message || "No message provided."}
{inq.message || 'No message provided.'}
</TooltipContent>
</Tooltip>
</TooltipProvider>
@@ -233,9 +182,8 @@ export default function PackageInquiriesTab() {
{!loading && totalItems > 0 && (
<div className="flex flex-col sm:flex-row items-center justify-between px-2 py-4 border-t gap-4 mt-2">
<div className="text-sm text-muted-foreground">
Showing{" "}
<span className="font-semibold">{indexOfFirstItem + 1}</span> to{" "}
<span className="font-semibold">{indexOfLastItem}</span> of{" "}
Showing <span className="font-semibold">{indexOfFirstItem + 1}</span> to{' '}
<span className="font-semibold">{indexOfLastItem}</span> of{' '}
<span className="font-semibold">{totalItems}</span> inquiries
</div>
<div className="flex items-center gap-6">
@@ -247,20 +195,18 @@ export default function PackageInquiriesTab() {
variant="outline"
size="icon"
className="h-9 w-9"
onClick={() =>
setCurrentPage((prev) => Math.max(prev - 1, 1))
}
disabled={currentPage === 1}>
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
disabled={currentPage === 1}
>
<ChevronLeft className="h-4 w-4" />
</Button>
<Button
variant="outline"
size="icon"
className="h-9 w-9"
onClick={() =>
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
}
disabled={currentPage === totalPages || totalPages === 0}>
onClick={() => setCurrentPage((prev) => Math.min(prev + 1, totalPages))}
disabled={currentPage === totalPages || totalPages === 0}
>
<ChevronRight className="h-4 w-4" />
</Button>
</div>
frontend/src/components/ProtectedRoutes/ProtectedRoutes.tsx
+4 -4
View File
@@ -1,8 +1,8 @@
import {Navigate} from "react-router-dom";
import {useAuth} from "@/context/AuthContext";
import { Navigate } from 'react-router-dom';
import { useAuth } from '@/context/AuthContext';
export default function ProtectedRoute({children}: any) {
const {token} = useAuth();
export default function ProtectedRoute({ children }: any) {
const { token } = useAuth();
if (!token) {
return <Navigate to="/" />;
frontend/src/components/SeoFields/SeoFields.tsx
+34 -59
View File
@@ -1,11 +1,11 @@
import { BytescaleUploader } from "@/components/BytescaleUploader/BytescaleUploader";
import { BytescaleUploader } from '@/components/BytescaleUploader/BytescaleUploader';
import { Badge } from "@/components/ui/badge";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";
import { Badge } from '@/components/ui/badge';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { Textarea } from '@/components/ui/textarea';
import { X } from "lucide-react";
import { X } from 'lucide-react';
interface SeoData {
seoTitle?: string;
@@ -21,15 +21,10 @@ interface SeoFieldsProps {
value?: SeoData;
onChange: (seo: SeoData) => void;
slug?: string;
folderPath?: "/seo";
folderPath?: '/seo';
}
export default function SeoFields({
value,
onChange,
slug,
folderPath = "/seo",
}: SeoFieldsProps) {
export default function SeoFields({ value, onChange, slug, folderPath = '/seo' }: SeoFieldsProps) {
const seo = value || {};
const updateSeo = (field: keyof SeoData, fieldValue: any) => {
@@ -41,8 +36,8 @@ export default function SeoFields({
const removeTag = (index: number) => {
updateSeo(
"tags",
(seo.tags || []).filter((_, i) => i !== index),
'tags',
(seo.tags || []).filter((_, i) => i !== index)
);
};
@@ -52,9 +47,7 @@ export default function SeoFields({
<div>
<h3 className="text-lg font-bold">SEO Settings</h3>
<p className="text-sm text-muted-foreground">
Optimize for Google & social sharing
</p>
<p className="text-sm text-muted-foreground">Optimize for Google & social sharing</p>
</div>
<Badge variant="secondary">Optional</Badge>
@@ -64,41 +57,33 @@ export default function SeoFields({
<div className="flex items-center justify-between">
<Label className="text-sm font-semibold">SEO Title</Label>
<span className="text-xs text-muted-foreground">
{seo.seoTitle?.length || 0}/60
</span>
<span className="text-xs text-muted-foreground">{seo.seoTitle?.length || 0}/60</span>
</div>
<Input
placeholder="Best Health Checkup Package in Kochi"
value={seo.seoTitle || ""}
onChange={(e) => updateSeo("seoTitle", e.target.value)}
value={seo.seoTitle || ''}
onChange={(e) => updateSeo('seoTitle', e.target.value)}
/>
<p className="text-xs text-muted-foreground">
Recommended: 50–60 characters
</p>
<p className="text-xs text-muted-foreground">Recommended: 50–60 characters</p>
</div>
<div className="space-y-2">
<div className="flex items-center justify-between">
<Label className="text-sm font-semibold">Meta Description</Label>
<span className="text-xs text-muted-foreground">
{seo.metaDescription?.length || 0}/160
</span>
<span className="text-xs text-muted-foreground">{seo.metaDescription?.length || 0}/160</span>
</div>
<Textarea
rows={4}
placeholder="Short description shown in Google search results"
value={seo.metaDescription || ""}
onChange={(e) => updateSeo("metaDescription", e.target.value)}
value={seo.metaDescription || ''}
onChange={(e) => updateSeo('metaDescription', e.target.value)}
/>
<p className="text-xs text-muted-foreground">
Recommended: 150–160 characters
</p>
<p className="text-xs text-muted-foreground">Recommended: 150–160 characters</p>
</div>
<div className="space-y-2">
@@ -106,8 +91,8 @@ export default function SeoFields({
<Input
placeholder="health checkup package kochi"
value={seo.focusKeyphrase || ""}
onChange={(e) => updateSeo("focusKeyphrase", e.target.value)}
value={seo.focusKeyphrase || ''}
onChange={(e) => updateSeo('focusKeyphrase', e.target.value)}
/>
</div>
@@ -122,11 +107,7 @@ export default function SeoFields({
>
<span>{tag}</span>
<button
type="button"
onClick={() => removeTag(index)}
className="hover:text-red-500 transition-colors"
>
<button type="button" onClick={() => removeTag(index)} className="hover:text-red-500 transition-colors">
<X className="h-3 w-3" />
</button>
</div>
@@ -136,16 +117,16 @@ export default function SeoFields({
placeholder="Type keyword and press Enter"
className="border-0 shadow-none focus-visible:ring-0 min-w-[220px] flex-1"
onKeyDown={(e) => {
if (e.key === "Enter" && e.currentTarget.value.trim()) {
if (e.key === 'Enter' && e.currentTarget.value.trim()) {
e.preventDefault();
const newTag = e.currentTarget.value.trim();
if (!(seo.tags || []).includes(newTag)) {
updateSeo("tags", [...(seo.tags || []), newTag]);
updateSeo('tags', [...(seo.tags || []), newTag]);
}
e.currentTarget.value = "";
e.currentTarget.value = '';
}
}}
/>
@@ -159,9 +140,7 @@ export default function SeoFields({
<div>
<h4 className="font-bold">Open Graph (Social Preview)</h4>
<p className="text-sm text-muted-foreground">
Facebook, WhatsApp & Twitter sharing
</p>
<p className="text-sm text-muted-foreground">Facebook, WhatsApp & Twitter sharing</p>
</div>
<Badge variant="secondary">Optional</Badge>
@@ -172,13 +151,11 @@ export default function SeoFields({
<Input
placeholder="Title for social sharing"
value={seo.ogTitle || ""}
onChange={(e) => updateSeo("ogTitle", e.target.value)}
value={seo.ogTitle || ''}
onChange={(e) => updateSeo('ogTitle', e.target.value)}
/>
<p className="text-xs text-muted-foreground">
If empty, SEO title will be used
</p>
<p className="text-xs text-muted-foreground">If empty, SEO title will be used</p>
</div>
<div className="space-y-2">
@@ -187,22 +164,20 @@ export default function SeoFields({
<Textarea
rows={4}
placeholder="Description for social sharing"
value={seo.ogDescription || ""}
onChange={(e) => updateSeo("ogDescription", e.target.value)}
value={seo.ogDescription || ''}
onChange={(e) => updateSeo('ogDescription', e.target.value)}
/>
<p className="text-xs text-muted-foreground">
If empty, meta description will be used
</p>
<p className="text-xs text-muted-foreground">If empty, meta description will be used</p>
</div>
<div className="space-y-2">
<Label className="text-sm font-semibold">OG Image</Label>
<BytescaleUploader
value={seo.ogImage || ""}
value={seo.ogImage || ''}
folderPath={folderPath}
onChange={(url) => updateSeo("ogImage", url)}
onChange={(url) => updateSeo('ogImage', url)}
/>
</div>
</div>
frontend/src/components/SeoPreview/SeoPreview.tsx
+18 -63
View File
@@ -1,11 +1,5 @@
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogFooter,
} from "@/components/ui/dialog";
import { Button } from "@/components/ui/button";
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
interface SeoPreviewData {
seo?: {
@@ -28,14 +22,8 @@ interface SeoPreviewProps {
title?: string;
}
export default function SeoPreview({
open,
onOpenChange,
previewData,
url,
title = "SEO Preview",
}: SeoPreviewProps) {
const previewUrl = url || "https://www.gg-hospital.com";
export default function SeoPreview({ open, onOpenChange, previewData, url, title = 'SEO Preview' }: SeoPreviewProps) {
const previewUrl = url || 'https://www.gg-hospital.com';
const hasSeoData =
!!previewData?.seo &&
@@ -47,27 +35,17 @@ export default function SeoPreview({
previewData.seo.metaDescription
);
const imageUrl =
previewData?.seo?.ogImage ||
"https://placehold.co/1200x630?text=GG+Hospital";
const imageUrl = previewData?.seo?.ogImage || 'https://placehold.co/1200x630?text=GG+Hospital';
const ogTitle =
previewData?.seo?.ogTitle || previewData?.seo?.seoTitle || "GG Hospital";
const ogTitle = previewData?.seo?.ogTitle || previewData?.seo?.seoTitle || 'GG Hospital';
const ogDescription =
previewData?.seo?.ogDescription ||
previewData?.seo?.metaDescription ||
"No description available";
previewData?.seo?.ogDescription || previewData?.seo?.metaDescription || 'No description available';
const searchTitle =
previewData?.seo?.seoTitle ||
previewData?.seo?.ogTitle ||
"SEO title preview";
const searchTitle = previewData?.seo?.seoTitle || previewData?.seo?.ogTitle || 'SEO title preview';
const searchDescription =
previewData?.seo?.metaDescription ||
previewData?.seo?.ogDescription ||
"No meta description available";
previewData?.seo?.metaDescription || previewData?.seo?.ogDescription || 'No meta description available';
return (
<Dialog open={open} onOpenChange={onOpenChange}>
@@ -91,53 +69,30 @@ export default function SeoPreview({
className="block max-w-[560px] overflow-hidden rounded-xl border bg-white shadow-sm transition hover:shadow-md"
>
<div className="aspect-[1.91/1] overflow-hidden bg-muted">
<img
src={imageUrl}
alt="OG Preview"
className="h-full w-full object-cover"
/>
<img src={imageUrl} alt="OG Preview" className="h-full w-full object-cover" />
</div>
<div className="border-t bg-[#f0f2f5] px-4 py-3">
<h3 className="mt-1 line-clamp-2 text-[18px] font-semibold leading-snug text-[#1c1e21]">
{ogTitle}
</h3>
<h3 className="mt-1 line-clamp-2 text-[18px] font-semibold leading-snug text-[#1c1e21]">{ogTitle}</h3>
<p className="mt-1 line-clamp-2 text-[14px] text-[#65676b]">
{ogDescription}
</p>
<p className="mt-1 truncate text-[11px] tracking-wide text-[#65676b]">
{previewUrl}
</p>
<p className="mt-1 line-clamp-2 text-[14px] text-[#65676b]">{ogDescription}</p>
<p className="mt-1 truncate text-[11px] tracking-wide text-[#65676b]">{previewUrl}</p>
</div>
</a>
</div>
{/* Google Preview */}
<div>
<p className="mb-4 text-sm font-semibold text-muted-foreground">
Google Search Preview
</p>
<p className="mb-4 text-sm font-semibold text-muted-foreground">Google Search Preview</p>
<div className="rounded-xl border bg-white p-6">
<a
href={previewUrl}
target="_blank"
rel="noopener noreferrer"
className="block"
>
<p className="truncate text-[14px] text-[#202124] hover:underline">
{previewUrl}
</p>
<a href={previewUrl} target="_blank" rel="noopener noreferrer" className="block">
<p className="truncate text-[14px] text-[#202124] hover:underline">{previewUrl}</p>
<h3 className="mt-1 text-[22px] leading-tight text-[#1a0dab] hover:underline">
{searchTitle}
</h3>
<h3 className="mt-1 text-[22px] leading-tight text-[#1a0dab] hover:underline">{searchTitle}</h3>
</a>
<p className="mt-2 line-clamp-3 text-[14px] leading-6 text-[#4d5156]">
{searchDescription}
</p>
<p className="mt-2 line-clamp-3 text-[14px] leading-6 text-[#4d5156]">{searchDescription}</p>
</div>
</div>
</div>
frontend/src/components/layout/Header.tsx
+8 -8
View File
@@ -1,16 +1,16 @@
import {useState, useEffect} from "react";
import {useAuth} from "@/context/AuthContext";
import {Button} from "@/components/ui/button";
import {Switch} from "@/components/ui/switch";
import {log} from "console";
import { useState, useEffect } from 'react';
import { useAuth } from '@/context/AuthContext';
import { Button } from '@/components/ui/button';
import { Switch } from '@/components/ui/switch';
import { log } from 'console';
export default function Header() {
const {user, logout} = useAuth();
const { user, logout } = useAuth();
const [darkMode, setDarkMode] = useState<boolean>(false);
useEffect(() => {
if (darkMode) document.documentElement.classList.add("dark");
else document.documentElement.classList.remove("dark");
if (darkMode) document.documentElement.classList.add('dark');
else document.documentElement.classList.remove('dark');
}, [darkMode]);
return (
frontend/src/components/layout/Sidebar.tsx
+26 -29
View File
@@ -1,55 +1,55 @@
import { Link, useLocation } from "react-router-dom";
import { Link, useLocation } from 'react-router-dom';
import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { Button } from '@/components/ui/button';
import { Separator } from '@/components/ui/separator';
export default function Sidebar() {
const location = useLocation();
const navItems = [
{
name: "Department",
path: "/department",
name: 'Department',
path: '/department',
},
{
name: "Doctor",
path: "/doctor",
name: 'Doctor',
path: '/doctor',
},
{
name: "Health Check",
path: "/health-check",
name: 'Health Check',
path: '/health-check',
},
{
name: "Appointments",
path: "/appointment",
name: 'Appointments',
path: '/appointment',
},
{
name: "Career",
path: "/career",
name: 'Career',
path: '/career',
},
{
name: "Candidates",
path: "/candidate",
name: 'Candidates',
path: '/candidate',
},
{
name: "Inquiry",
path: "/inquiry",
name: 'Inquiry',
path: '/inquiry',
},
{
name: "Academics & Research",
path: "/academics",
name: 'Academics & Research',
path: '/academics',
},
{
name: "News & Media",
path: "/news",
name: 'News & Media',
path: '/news',
},
{
name: "Email",
path: "/email",
name: 'Email',
path: '/email',
},
{
name: "Blog",
path: "/blog",
name: 'Blog',
path: '/blog',
},
];
@@ -67,10 +67,7 @@ export default function Sidebar() {
return (
<Link key={item.path} to={item.path}>
<Button
variant={active ? "secondary" : "ghost"}
className="w-full justify-start"
>
<Button variant={active ? 'secondary' : 'ghost'} className="w-full justify-start">
{item.name}
</Button>
</Link>
frontend/src/components/ui/accordion.tsx
+51 -69
View File
@@ -1,79 +1,61 @@
import * as React from "react"
import { Accordion as AccordionPrimitive } from "radix-ui"
import * as React from 'react';
import { Accordion as AccordionPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { ChevronDownIcon, ChevronUpIcon } from "lucide-react"
import { cn } from '@/lib/utils';
import { ChevronDownIcon, ChevronUpIcon } from 'lucide-react';
function Accordion({
className,
...props
}: React.ComponentProps<typeof AccordionPrimitive.Root>) {
return (
<AccordionPrimitive.Root
data-slot="accordion"
className={cn("flex w-full flex-col", className)}
{...props}
/>
)
function Accordion({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Root>) {
return <AccordionPrimitive.Root data-slot="accordion" className={cn('flex w-full flex-col', className)} {...props} />;
}
function AccordionItem({
className,
...props
}: React.ComponentProps<typeof AccordionPrimitive.Item>) {
return (
<AccordionPrimitive.Item
data-slot="accordion-item"
className={cn("not-last:border-b", className)}
{...props}
/>
)
function AccordionItem({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Item>) {
return (
<AccordionPrimitive.Item data-slot="accordion-item" className={cn('not-last:border-b', className)} {...props} />
);
}
function AccordionTrigger({
className,
children,
...props
}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {
return (
<AccordionPrimitive.Header className="flex">
<AccordionPrimitive.Trigger
data-slot="accordion-trigger"
className={cn(
"group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring disabled:pointer-events-none disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground",
className
)}
{...props}
>
{children}
<ChevronDownIcon data-slot="accordion-trigger-icon" className="pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden" />
<ChevronUpIcon data-slot="accordion-trigger-icon" className="pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline" />
</AccordionPrimitive.Trigger>
</AccordionPrimitive.Header>
)
function AccordionTrigger({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {
return (
<AccordionPrimitive.Header className="flex">
<AccordionPrimitive.Trigger
data-slot="accordion-trigger"
className={cn(
'group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring disabled:pointer-events-none disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground',
className
)}
{...props}
>
{children}
<ChevronDownIcon
data-slot="accordion-trigger-icon"
className="pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
/>
<ChevronUpIcon
data-slot="accordion-trigger-icon"
className="pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
/>
</AccordionPrimitive.Trigger>
</AccordionPrimitive.Header>
);
}
function AccordionContent({
className,
children,
...props
}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
return (
<AccordionPrimitive.Content
data-slot="accordion-content"
className="overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up"
{...props}
>
<div
className={cn(
"h-(--radix-accordion-content-height) pt-0 pb-2.5 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4",
className
)}
>
{children}
</div>
</AccordionPrimitive.Content>
)
function AccordionContent({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Content>) {
return (
<AccordionPrimitive.Content
data-slot="accordion-content"
className="overflow-hidden text-sm data-open:animate-accordion-down data-closed:animate-accordion-up"
{...props}
>
<div
className={cn(
'h-(--radix-accordion-content-height) pt-0 pb-2.5 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4',
className
)}
>
{children}
</div>
</AccordionPrimitive.Content>
);
}
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
frontend/src/components/ui/badge.tsx
+32 -41
View File
@@ -1,49 +1,40 @@
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { Slot } from "radix-ui"
import * as React from 'react';
import { cva, type VariantProps } from 'class-variance-authority';
import { Slot } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const badgeVariants = cva(
"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!",
{
variants: {
variant: {
default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
secondary:
"bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80",
destructive:
"bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20",
outline:
"border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground",
ghost:
"hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50",
link: "text-primary underline-offset-4 hover:underline",
},
},
defaultVariants: {
variant: "default",
},
}
)
'group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!',
{
variants: {
variant: {
default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
secondary: 'bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80',
destructive:
'bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20',
outline: 'border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground',
ghost: 'hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50',
link: 'text-primary underline-offset-4 hover:underline',
},
},
defaultVariants: {
variant: 'default',
},
}
);
function Badge({
className,
variant = "default",
asChild = false,
...props
}: React.ComponentProps<"span"> &
VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
const Comp = asChild ? Slot.Root : "span"
className,
variant = 'default',
asChild = false,
...props
}: React.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
const Comp = asChild ? Slot.Root : 'span';
return (
<Comp
data-slot="badge"
data-variant={variant}
className={cn(badgeVariants({ variant }), className)}
{...props}
/>
)
return (
<Comp data-slot="badge" data-variant={variant} className={cn(badgeVariants({ variant }), className)} {...props} />
);
}
export { Badge, badgeVariants }
export { Badge, badgeVariants };
frontend/src/components/ui/button.tsx
+57 -59
View File
@@ -1,67 +1,65 @@
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { Slot } from "radix-ui"
import * as React from 'react';
import { cva, type VariantProps } from 'class-variance-authority';
import { Slot } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
const buttonVariants = cva(
"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
{
variants: {
variant: {
default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
outline:
"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
secondary:
"bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
ghost:
"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
destructive:
"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
link: "text-primary underline-offset-4 hover:underline",
},
size: {
default:
"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
icon: "size-8",
"icon-xs":
"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
"icon-sm":
"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
"icon-lg": "size-9",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
}
)
"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
{
variants: {
variant: {
default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
outline:
'border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50',
secondary:
'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
ghost:
'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50',
destructive:
'bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40',
link: 'text-primary underline-offset-4 hover:underline',
},
size: {
default: 'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2',
icon: 'size-8',
'icon-xs':
"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
'icon-sm': 'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
'icon-lg': 'size-9',
},
},
defaultVariants: {
variant: 'default',
size: 'default',
},
}
);
function Button({
className,
variant = "default",
size = "default",
asChild = false,
...props
}: React.ComponentProps<"button"> &
VariantProps<typeof buttonVariants> & {
asChild?: boolean
}) {
const Comp = asChild ? Slot.Root : "button"
className,
variant = 'default',
size = 'default',
asChild = false,
...props
}: React.ComponentProps<'button'> &
VariantProps<typeof buttonVariants> & {
asChild?: boolean;
}) {
const Comp = asChild ? Slot.Root : 'button';
return (
<Comp
data-slot="button"
data-variant={variant}
data-size={size}
className={cn(buttonVariants({ variant, size, className }))}
{...props}
/>
)
return (
<Comp
data-slot="button"
data-variant={variant}
data-size={size}
className={cn(buttonVariants({ variant, size, className }))}
{...props}
/>
);
}
export { Button, buttonVariants }
export { Button, buttonVariants };
frontend/src/components/ui/card.tsx
+54 -87
View File
@@ -1,103 +1,70 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Card({
className,
size = "default",
...props
}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
return (
<div
data-slot="card"
data-size={size}
className={cn(
"group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
className
)}
{...props}
/>
)
function Card({ className, size = 'default', ...props }: React.ComponentProps<'div'> & { size?: 'default' | 'sm' }) {
return (
<div
data-slot="card"
data-size={size}
className={cn(
'group/card flex flex-col gap-4 overflow-hidden rounded-xl bg-card py-4 text-sm text-card-foreground ring-1 ring-foreground/10 has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl',
className
)}
{...props}
/>
);
}
function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-header"
className={cn(
"group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3",
className
)}
{...props}
/>
)
function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="card-header"
className={cn(
'group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4 group-data-[size=sm]/card:px-3 has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3',
className
)}
{...props}
/>
);
}
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-title"
className={cn(
"text-base leading-snug font-medium group-data-[size=sm]/card:text-sm",
className
)}
{...props}
/>
)
function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="card-title"
className={cn('text-base leading-snug font-medium group-data-[size=sm]/card:text-sm', className)}
{...props}
/>
);
}
function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-description"
className={cn("text-sm text-muted-foreground", className)}
{...props}
/>
)
function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
return <div data-slot="card-description" className={cn('text-sm text-muted-foreground', className)} {...props} />;
}
function CardAction({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-action"
className={cn(
"col-start-2 row-span-2 row-start-1 self-start justify-self-end",
className
)}
{...props}
/>
)
function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="card-action"
className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}
{...props}
/>
);
}
function CardContent({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-content"
className={cn("px-4 group-data-[size=sm]/card:px-3", className)}
{...props}
/>
)
function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
return <div data-slot="card-content" className={cn('px-4 group-data-[size=sm]/card:px-3', className)} {...props} />;
}
function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="card-footer"
className={cn(
"flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3",
className
)}
{...props}
/>
)
function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="card-footer"
className={cn('flex items-center rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/card:p-3', className)}
{...props}
/>
);
}
export {
Card,
CardHeader,
CardFooter,
CardTitle,
CardAction,
CardDescription,
CardContent,
}
export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent };
frontend/src/components/ui/command.tsx
+126 -169
View File
@@ -1,193 +1,150 @@
import * as React from "react"
import { Command as CommandPrimitive } from "cmdk"
import * as React from 'react';
import { Command as CommandPrimitive } from 'cmdk';
import { cn } from "@/lib/utils"
import {
Dialog,
DialogContent,
DialogDescription,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog"
import {
InputGroup,
InputGroupAddon,
} from "@/components/ui/input-group"
import { SearchIcon, CheckIcon } from "lucide-react"
import { cn } from '@/lib/utils';
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { InputGroup, InputGroupAddon } from '@/components/ui/input-group';
import { SearchIcon, CheckIcon } from 'lucide-react';
function Command({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive>) {
return (
<CommandPrimitive
data-slot="command"
className={cn(
"flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground",
className
)}
{...props}
/>
)
function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>) {
return (
<CommandPrimitive
data-slot="command"
className={cn(
'flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground',
className
)}
{...props}
/>
);
}
function CommandDialog({
title = "Command Palette",
description = "Search for a command to run...",
children,
className,
showCloseButton = false,
...props
title = 'Command Palette',
description = 'Search for a command to run...',
children,
className,
showCloseButton = false,
...props
}: React.ComponentProps<typeof Dialog> & {
title?: string
description?: string
className?: string
showCloseButton?: boolean
title?: string;
description?: string;
className?: string;
showCloseButton?: boolean;
}) {
return (
<Dialog {...props}>
<DialogHeader className="sr-only">
<DialogTitle>{title}</DialogTitle>
<DialogDescription>{description}</DialogDescription>
</DialogHeader>
<DialogContent
className={cn(
"top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0",
className
)}
showCloseButton={showCloseButton}
>
{children}
</DialogContent>
</Dialog>
)
return (
<Dialog {...props}>
<DialogHeader className="sr-only">
<DialogTitle>{title}</DialogTitle>
<DialogDescription>{description}</DialogDescription>
</DialogHeader>
<DialogContent
className={cn('top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0', className)}
showCloseButton={showCloseButton}
>
{children}
</DialogContent>
</Dialog>
);
}
function CommandInput({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive.Input>) {
return (
<div data-slot="command-input-wrapper" className="p-1 pb-0">
<InputGroup className="h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!">
<CommandPrimitive.Input
data-slot="command-input"
className={cn(
"w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50",
className
)}
{...props}
/>
<InputGroupAddon>
<SearchIcon className="size-4 shrink-0 opacity-50" />
</InputGroupAddon>
</InputGroup>
</div>
)
function CommandInput({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>) {
return (
<div data-slot="command-input-wrapper" className="p-1 pb-0">
<InputGroup className="h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!">
<CommandPrimitive.Input
data-slot="command-input"
className={cn('w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50', className)}
{...props}
/>
<InputGroupAddon>
<SearchIcon className="size-4 shrink-0 opacity-50" />
</InputGroupAddon>
</InputGroup>
</div>
);
}
function CommandList({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive.List>) {
return (
<CommandPrimitive.List
data-slot="command-list"
className={cn(
"no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none",
className
)}
{...props}
/>
)
function CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>) {
return (
<CommandPrimitive.List
data-slot="command-list"
className={cn('no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none', className)}
{...props}
/>
);
}
function CommandEmpty({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive.Empty>) {
return (
<CommandPrimitive.Empty
data-slot="command-empty"
className={cn("py-6 text-center text-sm", className)}
{...props}
/>
)
function CommandEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>) {
return (
<CommandPrimitive.Empty
data-slot="command-empty"
className={cn('py-6 text-center text-sm', className)}
{...props}
/>
);
}
function CommandGroup({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive.Group>) {
return (
<CommandPrimitive.Group
data-slot="command-group"
className={cn(
"overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground",
className
)}
{...props}
/>
)
function CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>) {
return (
<CommandPrimitive.Group
data-slot="command-group"
className={cn(
'overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground',
className
)}
{...props}
/>
);
}
function CommandSeparator({
className,
...props
}: React.ComponentProps<typeof CommandPrimitive.Separator>) {
return (
<CommandPrimitive.Separator
data-slot="command-separator"
className={cn("-mx-1 h-px bg-border", className)}
{...props}
/>
)
function CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>) {
return (
<CommandPrimitive.Separator
data-slot="command-separator"
className={cn('-mx-1 h-px bg-border', className)}
{...props}
/>
);
}
function CommandItem({
className,
children,
...props
}: React.ComponentProps<typeof CommandPrimitive.Item>) {
return (
<CommandPrimitive.Item
data-slot="command-item"
className={cn(
"group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-selected:bg-muted data-selected:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-selected:*:[svg]:text-foreground",
className
)}
{...props}
>
{children}
<CheckIcon className="ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" />
</CommandPrimitive.Item>
)
function CommandItem({ className, children, ...props }: React.ComponentProps<typeof CommandPrimitive.Item>) {
return (
<CommandPrimitive.Item
data-slot="command-item"
className={cn(
"group/command-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 data-selected:bg-muted data-selected:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-selected:*:[svg]:text-foreground",
className
)}
{...props}
>
{children}
<CheckIcon className="ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" />
</CommandPrimitive.Item>
);
}
function CommandShortcut({
className,
...props
}: React.ComponentProps<"span">) {
return (
<span
data-slot="command-shortcut"
className={cn(
"ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground",
className
)}
{...props}
/>
)
function CommandShortcut({ className, ...props }: React.ComponentProps<'span'>) {
return (
<span
data-slot="command-shortcut"
className={cn(
'ml-auto text-xs tracking-widest text-muted-foreground group-data-selected/command-item:text-foreground',
className
)}
{...props}
/>
);
}
export {
Command,
CommandDialog,
CommandInput,
CommandList,
CommandEmpty,
CommandGroup,
CommandItem,
CommandShortcut,
CommandSeparator,
}
Command,
CommandDialog,
CommandInput,
CommandList,
CommandEmpty,
CommandGroup,
CommandItem,
CommandShortcut,
CommandSeparator,
};
frontend/src/components/ui/dialog.tsx
+107 -138
View File
@@ -1,166 +1,135 @@
import * as React from "react"
import { Dialog as DialogPrimitive } from "radix-ui"
import * as React from 'react';
import { Dialog as DialogPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { Button } from "@/components/ui/button"
import { XIcon } from "lucide-react"
import { cn } from '@/lib/utils';
import { Button } from '@/components/ui/button';
import { XIcon } from 'lucide-react';
function Dialog({
...props
}: React.ComponentProps<typeof DialogPrimitive.Root>) {
return <DialogPrimitive.Root data-slot="dialog" {...props} />
function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {
return <DialogPrimitive.Root data-slot="dialog" {...props} />;
}
function DialogTrigger({
...props
}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />
function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {
return <DialogPrimitive.Trigger data-slot="dialog-trigger" {...props} />;
}
function DialogPortal({
...props
}: React.ComponentProps<typeof DialogPrimitive.Portal>) {
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />
function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {
return <DialogPrimitive.Portal data-slot="dialog-portal" {...props} />;
}
function DialogClose({
...props
}: React.ComponentProps<typeof DialogPrimitive.Close>) {
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />
function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {
return <DialogPrimitive.Close data-slot="dialog-close" {...props} />;
}
function DialogOverlay({
className,
...props
}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
return (
<DialogPrimitive.Overlay
data-slot="dialog-overlay"
className={cn(
"fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
className
)}
{...props}
/>
)
function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {
return (
<DialogPrimitive.Overlay
data-slot="dialog-overlay"
className={cn(
'fixed inset-0 isolate z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0',
className
)}
{...props}
/>
);
}
function DialogContent({
className,
children,
showCloseButton = true,
...props
className,
children,
showCloseButton = true,
...props
}: React.ComponentProps<typeof DialogPrimitive.Content> & {
showCloseButton?: boolean
showCloseButton?: boolean;
}) {
return (
<DialogPortal>
<DialogOverlay />
<DialogPrimitive.Content
data-slot="dialog-content"
className={cn(
"fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
className
)}
{...props}
>
{children}
{showCloseButton && (
<DialogPrimitive.Close data-slot="dialog-close" asChild>
<Button
variant="ghost"
className="absolute top-2 right-2"
size="icon-sm"
>
<XIcon
/>
<span className="sr-only">Close</span>
</Button>
</DialogPrimitive.Close>
)}
</DialogPrimitive.Content>
</DialogPortal>
)
return (
<DialogPortal>
<DialogOverlay />
<DialogPrimitive.Content
data-slot="dialog-content"
className={cn(
'fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-sm text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
className
)}
{...props}
>
{children}
{showCloseButton && (
<DialogPrimitive.Close data-slot="dialog-close" asChild>
<Button variant="ghost" className="absolute top-2 right-2" size="icon-sm">
<XIcon />
<span className="sr-only">Close</span>
</Button>
</DialogPrimitive.Close>
)}
</DialogPrimitive.Content>
</DialogPortal>
);
}
function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="dialog-header"
className={cn("flex flex-col gap-2", className)}
{...props}
/>
)
function DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {
return <div data-slot="dialog-header" className={cn('flex flex-col gap-2', className)} {...props} />;
}
function DialogFooter({
className,
showCloseButton = false,
children,
...props
}: React.ComponentProps<"div"> & {
showCloseButton?: boolean
className,
showCloseButton = false,
children,
...props
}: React.ComponentProps<'div'> & {
showCloseButton?: boolean;
}) {
return (
<div
data-slot="dialog-footer"
className={cn(
"-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end",
className
)}
{...props}
>
{children}
{showCloseButton && (
<DialogPrimitive.Close asChild>
<Button variant="outline">Close</Button>
</DialogPrimitive.Close>
)}
</div>
)
return (
<div
data-slot="dialog-footer"
className={cn(
'-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end',
className
)}
{...props}
>
{children}
{showCloseButton && (
<DialogPrimitive.Close asChild>
<Button variant="outline">Close</Button>
</DialogPrimitive.Close>
)}
</div>
);
}
function DialogTitle({
className,
...props
}: React.ComponentProps<typeof DialogPrimitive.Title>) {
return (
<DialogPrimitive.Title
data-slot="dialog-title"
className={cn(
"text-base leading-none font-medium",
className
)}
{...props}
/>
)
function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {
return (
<DialogPrimitive.Title
data-slot="dialog-title"
className={cn('text-base leading-none font-medium', className)}
{...props}
/>
);
}
function DialogDescription({
className,
...props
}: React.ComponentProps<typeof DialogPrimitive.Description>) {
return (
<DialogPrimitive.Description
data-slot="dialog-description"
className={cn(
"text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
className
)}
{...props}
/>
)
function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {
return (
<DialogPrimitive.Description
data-slot="dialog-description"
className={cn(
'text-sm text-muted-foreground *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',
className
)}
{...props}
/>
);
}
export {
Dialog,
DialogClose,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogOverlay,
DialogPortal,
DialogTitle,
DialogTrigger,
}
Dialog,
DialogClose,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogOverlay,
DialogPortal,
DialogTitle,
DialogTrigger,
};
frontend/src/components/ui/input-group.tsx
+115 -136
View File
@@ -1,156 +1,135 @@
"use client"
'use client';
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import * as React from 'react';
import { cva, type VariantProps } from 'class-variance-authority';
import { cn } from "@/lib/utils"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { Textarea } from "@/components/ui/textarea"
import { cn } from '@/lib/utils';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Textarea } from '@/components/ui/textarea';
function InputGroup({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="input-group"
role="group"
className={cn(
"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5",
className
)}
{...props}
/>
)
function InputGroup({ className, ...props }: React.ComponentProps<'div'>) {
return (
<div
data-slot="input-group"
role="group"
className={cn(
'group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5',
className
)}
{...props}
/>
);
}
const inputGroupAddonVariants = cva(
"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
{
variants: {
align: {
"inline-start":
"order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
"inline-end":
"order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",
"block-start":
"order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2",
"block-end":
"order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2",
},
},
defaultVariants: {
align: "inline-start",
},
}
)
"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
{
variants: {
align: {
'inline-start': 'order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]',
'inline-end': 'order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]',
'block-start':
'order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2',
'block-end': 'order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2',
},
},
defaultVariants: {
align: 'inline-start',
},
}
);
function InputGroupAddon({
className,
align = "inline-start",
...props
}: React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>) {
return (
<div
role="group"
data-slot="input-group-addon"
data-align={align}
className={cn(inputGroupAddonVariants({ align }), className)}
onClick={(e) => {
if ((e.target as HTMLElement).closest("button")) {
return
}
e.currentTarget.parentElement?.querySelector("input")?.focus()
}}
{...props}
/>
)
className,
align = 'inline-start',
...props
}: React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>) {
return (
<div
role="group"
data-slot="input-group-addon"
data-align={align}
className={cn(inputGroupAddonVariants({ align }), className)}
onClick={(e) => {
if ((e.target as HTMLElement).closest('button')) {
return;
}
e.currentTarget.parentElement?.querySelector('input')?.focus();
}}
{...props}
/>
);
}
const inputGroupButtonVariants = cva(
"flex items-center gap-2 text-sm shadow-none",
{
variants: {
size: {
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
sm: "",
"icon-xs":
"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
"icon-sm": "size-8 p-0 has-[>svg]:p-0",
},
},
defaultVariants: {
size: "xs",
},
}
)
const inputGroupButtonVariants = cva('flex items-center gap-2 text-sm shadow-none', {
variants: {
size: {
xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
sm: '',
'icon-xs': 'size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0',
'icon-sm': 'size-8 p-0 has-[>svg]:p-0',
},
},
defaultVariants: {
size: 'xs',
},
});
function InputGroupButton({
className,
type = "button",
variant = "ghost",
size = "xs",
...props
}: Omit<React.ComponentProps<typeof Button>, "size"> &
VariantProps<typeof inputGroupButtonVariants>) {
return (
<Button
type={type}
data-size={size}
variant={variant}
className={cn(inputGroupButtonVariants({ size }), className)}
{...props}
/>
)
className,
type = 'button',
variant = 'ghost',
size = 'xs',
...props
}: Omit<React.ComponentProps<typeof Button>, 'size'> & VariantProps<typeof inputGroupButtonVariants>) {
return (
<Button
type={type}
data-size={size}
variant={variant}
className={cn(inputGroupButtonVariants({ size }), className)}
{...props}
/>
);
}
function InputGroupText({ className, ...props }: React.ComponentProps<"span">) {
return (
<span
className={cn(
"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
/>
)
function InputGroupText({ className, ...props }: React.ComponentProps<'span'>) {
return (
<span
className={cn(
"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
/>
);
}
function InputGroupInput({
className,
...props
}: React.ComponentProps<"input">) {
return (
<Input
data-slot="input-group-control"
className={cn(
"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent",
className
)}
{...props}
/>
)
function InputGroupInput({ className, ...props }: React.ComponentProps<'input'>) {
return (
<Input
data-slot="input-group-control"
className={cn(
'flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent',
className
)}
{...props}
/>
);
}
function InputGroupTextarea({
className,
...props
}: React.ComponentProps<"textarea">) {
return (
<Textarea
data-slot="input-group-control"
className={cn(
"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent",
className
)}
{...props}
/>
)
function InputGroupTextarea({ className, ...props }: React.ComponentProps<'textarea'>) {
return (
<Textarea
data-slot="input-group-control"
className={cn(
'flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent',
className
)}
{...props}
/>
);
}
export {
InputGroup,
InputGroupAddon,
InputGroupButton,
InputGroupText,
InputGroupInput,
InputGroupTextarea,
}
export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea };
frontend/src/components/ui/input.tsx
+15 -15
View File
@@ -1,19 +1,19 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Input({ className, type, ...props }: React.ComponentProps<"input">) {
return (
<input
type={type}
data-slot="input"
className={cn(
"h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
className
)}
{...props}
/>
)
function Input({ className, type, ...props }: React.ComponentProps<'input'>) {
return (
<input
type={type}
data-slot="input"
className={cn(
'h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',
className
)}
{...props}
/>
);
}
export { Input }
export { Input };
frontend/src/components/ui/label.tsx
+15 -18
View File
@@ -1,22 +1,19 @@
import * as React from "react"
import { Label as LabelPrimitive } from "radix-ui"
import * as React from 'react';
import { Label as LabelPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Label({
className,
...props
}: React.ComponentProps<typeof LabelPrimitive.Root>) {
return (
<LabelPrimitive.Root
data-slot="label"
className={cn(
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
className
)}
{...props}
/>
)
function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>) {
return (
<LabelPrimitive.Root
data-slot="label"
className={cn(
'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
className
)}
{...props}
/>
);
}
export { Label }
export { Label };
frontend/src/components/ui/popover.tsx
+34 -69
View File
@@ -1,87 +1,52 @@
import * as React from "react"
import { Popover as PopoverPrimitive } from "radix-ui"
import * as React from 'react';
import { Popover as PopoverPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Popover({
...props
}: React.ComponentProps<typeof PopoverPrimitive.Root>) {
return <PopoverPrimitive.Root data-slot="popover" {...props} />
function Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>) {
return <PopoverPrimitive.Root data-slot="popover" {...props} />;
}
function PopoverTrigger({
...props
}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {
return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />
function PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {
return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />;
}
function PopoverContent({
className,
align = "center",
sideOffset = 4,
...props
className,
align = 'center',
sideOffset = 4,
...props
}: React.ComponentProps<typeof PopoverPrimitive.Content>) {
return (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
data-slot="popover-content"
align={align}
sideOffset={sideOffset}
className={cn(
"z-50 flex w-72 origin-(--radix-popover-content-transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
className
)}
{...props}
/>
</PopoverPrimitive.Portal>
)
return (
<PopoverPrimitive.Portal>
<PopoverPrimitive.Content
data-slot="popover-content"
align={align}
sideOffset={sideOffset}
className={cn(
'z-50 flex w-72 origin-(--radix-popover-content-transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
className
)}
{...props}
/>
</PopoverPrimitive.Portal>
);
}
function PopoverAnchor({
...props
}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {
return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props} />
function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {
return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props} />;
}
function PopoverHeader({ className, ...props }: React.ComponentProps<"div">) {
return (
<div
data-slot="popover-header"
className={cn("flex flex-col gap-0.5 text-sm", className)}
{...props}
/>
)
function PopoverHeader({ className, ...props }: React.ComponentProps<'div'>) {
return <div data-slot="popover-header" className={cn('flex flex-col gap-0.5 text-sm', className)} {...props} />;
}
function PopoverTitle({ className, ...props }: React.ComponentProps<"h2">) {
return (
<div
data-slot="popover-title"
className={cn("font-medium", className)}
{...props}
/>
)
function PopoverTitle({ className, ...props }: React.ComponentProps<'h2'>) {
return <div data-slot="popover-title" className={cn('font-medium', className)} {...props} />;
}
function PopoverDescription({
className,
...props
}: React.ComponentProps<"p">) {
return (
<p
data-slot="popover-description"
className={cn("text-muted-foreground", className)}
{...props}
/>
)
function PopoverDescription({ className, ...props }: React.ComponentProps<'p'>) {
return <p data-slot="popover-description" className={cn('text-muted-foreground', className)} {...props} />;
}
export {
Popover,
PopoverAnchor,
PopoverContent,
PopoverDescription,
PopoverHeader,
PopoverTitle,
PopoverTrigger,
}
export { Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger };
frontend/src/components/ui/scroll-area.tsx
+37 -45
View File
@@ -1,53 +1,45 @@
import * as React from "react"
import { ScrollArea as ScrollAreaPrimitive } from "radix-ui"
import * as React from 'react';
import { ScrollArea as ScrollAreaPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function ScrollArea({
className,
children,
...props
}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
return (
<ScrollAreaPrimitive.Root
data-slot="scroll-area"
className={cn("relative", className)}
{...props}
>
<ScrollAreaPrimitive.Viewport
data-slot="scroll-area-viewport"
className="size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1"
>
{children}
</ScrollAreaPrimitive.Viewport>
<ScrollBar />
<ScrollAreaPrimitive.Corner />
</ScrollAreaPrimitive.Root>
)
function ScrollArea({ className, children, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
return (
<ScrollAreaPrimitive.Root data-slot="scroll-area" className={cn('relative', className)} {...props}>
<ScrollAreaPrimitive.Viewport
data-slot="scroll-area-viewport"
className="size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1"
>
{children}
</ScrollAreaPrimitive.Viewport>
<ScrollBar />
<ScrollAreaPrimitive.Corner />
</ScrollAreaPrimitive.Root>
);
}
function ScrollBar({
className,
orientation = "vertical",
...props
className,
orientation = 'vertical',
...props
}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {
return (
<ScrollAreaPrimitive.ScrollAreaScrollbar
data-slot="scroll-area-scrollbar"
data-orientation={orientation}
orientation={orientation}
className={cn(
"flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent",
className
)}
{...props}
>
<ScrollAreaPrimitive.ScrollAreaThumb
data-slot="scroll-area-thumb"
className="relative flex-1 rounded-full bg-border"
/>
</ScrollAreaPrimitive.ScrollAreaScrollbar>
)
return (
<ScrollAreaPrimitive.ScrollAreaScrollbar
data-slot="scroll-area-scrollbar"
data-orientation={orientation}
orientation={orientation}
className={cn(
'flex touch-none p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-transparent data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-transparent',
className
)}
{...props}
>
<ScrollAreaPrimitive.ScrollAreaThumb
data-slot="scroll-area-thumb"
className="relative flex-1 rounded-full bg-border"
/>
</ScrollAreaPrimitive.ScrollAreaScrollbar>
);
}
export { ScrollArea, ScrollBar }
export { ScrollArea, ScrollBar };
frontend/src/components/ui/select.tsx
+137 -160
View File
@@ -1,190 +1,167 @@
import * as React from "react"
import { Select as SelectPrimitive } from "radix-ui"
import * as React from 'react';
import { Select as SelectPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
import { cn } from '@/lib/utils';
import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from 'lucide-react';
function Select({
...props
}: React.ComponentProps<typeof SelectPrimitive.Root>) {
return <SelectPrimitive.Root data-slot="select" {...props} />
function Select({ ...props }: React.ComponentProps<typeof SelectPrimitive.Root>) {
return <SelectPrimitive.Root data-slot="select" {...props} />;
}
function SelectGroup({
className,
...props
}: React.ComponentProps<typeof SelectPrimitive.Group>) {
return (
<SelectPrimitive.Group
data-slot="select-group"
className={cn("scroll-my-1 p-1", className)}
{...props}
/>
)
function SelectGroup({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Group>) {
return <SelectPrimitive.Group data-slot="select-group" className={cn('scroll-my-1 p-1', className)} {...props} />;
}
function SelectValue({
...props
}: React.ComponentProps<typeof SelectPrimitive.Value>) {
return <SelectPrimitive.Value data-slot="select-value" {...props} />
function SelectValue({ ...props }: React.ComponentProps<typeof SelectPrimitive.Value>) {
return <SelectPrimitive.Value data-slot="select-value" {...props} />;
}
function SelectTrigger({
className,
size = "default",
children,
...props
className,
size = 'default',
children,
...props
}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
size?: "sm" | "default"
size?: 'sm' | 'default';
}) {
return (
<SelectPrimitive.Trigger
data-slot="select-trigger"
data-size={size}
className={cn(
"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
{children}
<SelectPrimitive.Icon asChild>
<ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
</SelectPrimitive.Icon>
</SelectPrimitive.Trigger>
)
return (
<SelectPrimitive.Trigger
data-slot="select-trigger"
data-size={size}
className={cn(
"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
{children}
<SelectPrimitive.Icon asChild>
<ChevronDownIcon className="pointer-events-none size-4 text-muted-foreground" />
</SelectPrimitive.Icon>
</SelectPrimitive.Trigger>
);
}
function SelectContent({
className,
children,
position = "item-aligned",
align = "center",
...props
className,
children,
position = 'item-aligned',
align = 'center',
...props
}: React.ComponentProps<typeof SelectPrimitive.Content>) {
return (
<SelectPrimitive.Portal>
<SelectPrimitive.Content
data-slot="select-content"
data-align-trigger={position === "item-aligned"}
className={cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-36 origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", position ==="popper"&&"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className )}
position={position}
align={align}
{...props}
>
<SelectScrollUpButton />
<SelectPrimitive.Viewport
data-position={position}
className={cn(
"data-[position=popper]:h-(--radix-select-trigger-height) data-[position=popper]:w-full data-[position=popper]:min-w-(--radix-select-trigger-width)",
position === "popper" && ""
)}
>
{children}
</SelectPrimitive.Viewport>
<SelectScrollDownButton />
</SelectPrimitive.Content>
</SelectPrimitive.Portal>
)
return (
<SelectPrimitive.Portal>
<SelectPrimitive.Content
data-slot="select-content"
data-align-trigger={position === 'item-aligned'}
className={cn(
'relative z-50 max-h-(--radix-select-content-available-height) min-w-36 origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
position === 'popper' &&
'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
className
)}
position={position}
align={align}
{...props}
>
<SelectScrollUpButton />
<SelectPrimitive.Viewport
data-position={position}
className={cn(
'data-[position=popper]:h-(--radix-select-trigger-height) data-[position=popper]:w-full data-[position=popper]:min-w-(--radix-select-trigger-width)',
position === 'popper' && ''
)}
>
{children}
</SelectPrimitive.Viewport>
<SelectScrollDownButton />
</SelectPrimitive.Content>
</SelectPrimitive.Portal>
);
}
function SelectLabel({
className,
...props
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
return (
<SelectPrimitive.Label
data-slot="select-label"
className={cn("px-1.5 py-1 text-xs text-muted-foreground", className)}
{...props}
/>
)
function SelectLabel({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Label>) {
return (
<SelectPrimitive.Label
data-slot="select-label"
className={cn('px-1.5 py-1 text-xs text-muted-foreground', className)}
{...props}
/>
);
}
function SelectItem({
className,
children,
...props
}: React.ComponentProps<typeof SelectPrimitive.Item>) {
return (
<SelectPrimitive.Item
data-slot="select-item"
className={cn(
"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
className
)}
{...props}
>
<span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
<SelectPrimitive.ItemIndicator>
<CheckIcon className="pointer-events-none" />
</SelectPrimitive.ItemIndicator>
</span>
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
</SelectPrimitive.Item>
)
function SelectItem({ className, children, ...props }: React.ComponentProps<typeof SelectPrimitive.Item>) {
return (
<SelectPrimitive.Item
data-slot="select-item"
className={cn(
"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
className
)}
{...props}
>
<span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
<SelectPrimitive.ItemIndicator>
<CheckIcon className="pointer-events-none" />
</SelectPrimitive.ItemIndicator>
</span>
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
</SelectPrimitive.Item>
);
}
function SelectSeparator({
className,
...props
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
return (
<SelectPrimitive.Separator
data-slot="select-separator"
className={cn("pointer-events-none -mx-1 my-1 h-px bg-border", className)}
{...props}
/>
)
function SelectSeparator({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.Separator>) {
return (
<SelectPrimitive.Separator
data-slot="select-separator"
className={cn('pointer-events-none -mx-1 my-1 h-px bg-border', className)}
{...props}
/>
);
}
function SelectScrollUpButton({
className,
...props
}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
return (
<SelectPrimitive.ScrollUpButton
data-slot="select-scroll-up-button"
className={cn(
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
<ChevronUpIcon
/>
</SelectPrimitive.ScrollUpButton>
)
function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
return (
<SelectPrimitive.ScrollUpButton
data-slot="select-scroll-up-button"
className={cn(
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
<ChevronUpIcon />
</SelectPrimitive.ScrollUpButton>
);
}
function SelectScrollDownButton({
className,
...props
className,
...props
}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
return (
<SelectPrimitive.ScrollDownButton
data-slot="select-scroll-down-button"
className={cn(
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
<ChevronDownIcon
/>
</SelectPrimitive.ScrollDownButton>
)
return (
<SelectPrimitive.ScrollDownButton
data-slot="select-scroll-down-button"
className={cn(
"z-10 flex cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4",
className
)}
{...props}
>
<ChevronDownIcon />
</SelectPrimitive.ScrollDownButton>
);
}
export {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectScrollDownButton,
SelectScrollUpButton,
SelectSeparator,
SelectTrigger,
SelectValue,
}
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectScrollDownButton,
SelectScrollUpButton,
SelectSeparator,
SelectTrigger,
SelectValue,
};
frontend/src/components/ui/separator.tsx
+20 -20
View File
@@ -1,26 +1,26 @@
import * as React from "react"
import { Separator as SeparatorPrimitive } from "radix-ui"
import * as React from 'react';
import { Separator as SeparatorPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Separator({
className,
orientation = "horizontal",
decorative = true,
...props
className,
orientation = 'horizontal',
decorative = true,
...props
}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
return (
<SeparatorPrimitive.Root
data-slot="separator"
decorative={decorative}
orientation={orientation}
className={cn(
"shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
className
)}
{...props}
/>
)
return (
<SeparatorPrimitive.Root
data-slot="separator"
decorative={decorative}
orientation={orientation}
className={cn(
'shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch',
className
)}
{...props}
/>
);
}
export { Separator }
export { Separator };
frontend/src/components/ui/switch.tsx
+8 -8
View File
@@ -1,22 +1,22 @@
import * as React from "react";
import {Switch as SwitchPrimitive} from "radix-ui";
import * as React from 'react';
import { Switch as SwitchPrimitive } from 'radix-ui';
import {cn} from "@/lib/utils";
import { cn } from '@/lib/utils';
function Switch({
className,
size = "default",
size = 'default',
...props
}: React.ComponentProps<typeof SwitchPrimitive.Root> & {
size?: "sm" | "default";
size?: 'sm' | 'default';
}) {
return (
<SwitchPrimitive.Root
data-slot="switch"
data-size={size}
className={cn(
"peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50",
className,
'peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50',
className
)}
{...props}
>
@@ -28,4 +28,4 @@ function Switch({
);
}
export {Switch};
export { Switch };
frontend/src/components/ui/table.tsx
+52 -96
View File
@@ -1,114 +1,70 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Table({ className, ...props }: React.ComponentProps<"table">) {
return (
<div
data-slot="table-container"
className="relative w-full overflow-x-auto"
>
<table
data-slot="table"
className={cn("w-full caption-bottom text-sm", className)}
{...props}
/>
</div>
)
function Table({ className, ...props }: React.ComponentProps<'table'>) {
return (
<div data-slot="table-container" className="relative w-full overflow-x-auto">
<table data-slot="table" className={cn('w-full caption-bottom text-sm', className)} {...props} />
</div>
);
}
function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
return (
<thead
data-slot="table-header"
className={cn("[&_tr]:border-b", className)}
{...props}
/>
)
function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {
return <thead data-slot="table-header" className={cn('[&_tr]:border-b', className)} {...props} />;
}
function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
return (
<tbody
data-slot="table-body"
className={cn("[&_tr:last-child]:border-0", className)}
{...props}
/>
)
function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {
return <tbody data-slot="table-body" className={cn('[&_tr:last-child]:border-0', className)} {...props} />;
}
function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">) {
return (
<tfoot
data-slot="table-footer"
className={cn(
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
className
)}
{...props}
/>
)
function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>) {
return (
<tfoot
data-slot="table-footer"
className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}
{...props}
/>
);
}
function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
return (
<tr
data-slot="table-row"
className={cn(
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
className
)}
{...props}
/>
)
function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {
return (
<tr
data-slot="table-row"
className={cn('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', className)}
{...props}
/>
);
}
function TableHead({ className, ...props }: React.ComponentProps<"th">) {
return (
<th
data-slot="table-head"
className={cn(
"h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
className
)}
{...props}
/>
)
function TableHead({ className, ...props }: React.ComponentProps<'th'>) {
return (
<th
data-slot="table-head"
className={cn(
'h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0',
className
)}
{...props}
/>
);
}
function TableCell({ className, ...props }: React.ComponentProps<"td">) {
return (
<td
data-slot="table-cell"
className={cn(
"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
className
)}
{...props}
/>
)
function TableCell({ className, ...props }: React.ComponentProps<'td'>) {
return (
<td
data-slot="table-cell"
className={cn('p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0', className)}
{...props}
/>
);
}
function TableCaption({
className,
...props
}: React.ComponentProps<"caption">) {
return (
<caption
data-slot="table-caption"
className={cn("mt-4 text-sm text-muted-foreground", className)}
{...props}
/>
)
function TableCaption({ className, ...props }: React.ComponentProps<'caption'>) {
return (
<caption data-slot="table-caption" className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />
);
}
export {
Table,
TableHeader,
TableBody,
TableFooter,
TableHead,
TableRow,
TableCell,
TableCaption,
}
export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };
frontend/src/components/ui/tabs.tsx
+61 -75
View File
@@ -1,88 +1,74 @@
import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { Tabs as TabsPrimitive } from "radix-ui"
import * as React from 'react';
import { cva, type VariantProps } from 'class-variance-authority';
import { Tabs as TabsPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Tabs({
className,
orientation = "horizontal",
...props
}: React.ComponentProps<typeof TabsPrimitive.Root>) {
return (
<TabsPrimitive.Root
data-slot="tabs"
data-orientation={orientation}
className={cn(
"group/tabs flex gap-2 data-horizontal:flex-col",
className
)}
{...props}
/>
)
function Tabs({ className, orientation = 'horizontal', ...props }: React.ComponentProps<typeof TabsPrimitive.Root>) {
return (
<TabsPrimitive.Root
data-slot="tabs"
data-orientation={orientation}
className={cn('group/tabs flex gap-2 data-horizontal:flex-col', className)}
{...props}
/>
);
}
const tabsListVariants = cva(
"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none",
{
variants: {
variant: {
default: "bg-muted",
line: "gap-1 bg-transparent",
},
},
defaultVariants: {
variant: "default",
},
}
)
'group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none',
{
variants: {
variant: {
default: 'bg-muted',
line: 'gap-1 bg-transparent',
},
},
defaultVariants: {
variant: 'default',
},
}
);
function TabsList({
className,
variant = "default",
...props
}: React.ComponentProps<typeof TabsPrimitive.List> &
VariantProps<typeof tabsListVariants>) {
return (
<TabsPrimitive.List
data-slot="tabs-list"
data-variant={variant}
className={cn(tabsListVariants({ variant }), className)}
{...props}
/>
)
className,
variant = 'default',
...props
}: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>) {
return (
<TabsPrimitive.List
data-slot="tabs-list"
data-variant={variant}
className={cn(tabsListVariants({ variant }), className)}
{...props}
/>
);
}
function TabsTrigger({
className,
...props
}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
return (
<TabsPrimitive.Trigger
data-slot="tabs-trigger"
className={cn(
"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
"data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground",
"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
className
)}
{...props}
/>
)
function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
return (
<TabsPrimitive.Trigger
data-slot="tabs-trigger"
className={cn(
"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
'group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent',
'data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground',
'after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100',
className
)}
{...props}
/>
);
}
function TabsContent({
className,
...props
}: React.ComponentProps<typeof TabsPrimitive.Content>) {
return (
<TabsPrimitive.Content
data-slot="tabs-content"
className={cn("flex-1 text-sm outline-none", className)}
{...props}
/>
)
function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>) {
return (
<TabsPrimitive.Content
data-slot="tabs-content"
className={cn('flex-1 text-sm outline-none', className)}
{...props}
/>
);
}
export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants }
export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants };
frontend/src/components/ui/textarea.tsx
+14 -14
View File
@@ -1,18 +1,18 @@
import * as React from "react"
import * as React from 'react';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
return (
<textarea
data-slot="textarea"
className={cn(
"flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
className
)}
{...props}
/>
)
function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
return (
<textarea
data-slot="textarea"
className={cn(
'flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',
className
)}
{...props}
/>
);
}
export { Textarea }
export { Textarea };
frontend/src/components/ui/tooltip.tsx
+30 -43
View File
@@ -1,55 +1,42 @@
import * as React from "react"
import { Tooltip as TooltipPrimitive } from "radix-ui"
import * as React from 'react';
import { Tooltip as TooltipPrimitive } from 'radix-ui';
import { cn } from "@/lib/utils"
import { cn } from '@/lib/utils';
function TooltipProvider({
delayDuration = 0,
...props
}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
return (
<TooltipPrimitive.Provider
data-slot="tooltip-provider"
delayDuration={delayDuration}
{...props}
/>
)
function TooltipProvider({ delayDuration = 0, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
return <TooltipPrimitive.Provider data-slot="tooltip-provider" delayDuration={delayDuration} {...props} />;
}
function Tooltip({
...props
}: React.ComponentProps<typeof TooltipPrimitive.Root>) {
return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {
return <TooltipPrimitive.Root data-slot="tooltip" {...props} />;
}
function TooltipTrigger({
...props
}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />;
}
function TooltipContent({
className,
sideOffset = 0,
children,
...props
className,
sideOffset = 0,
children,
...props
}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
return (
<TooltipPrimitive.Portal>
<TooltipPrimitive.Content
data-slot="tooltip-content"
sideOffset={sideOffset}
className={cn(
"z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
className
)}
{...props}
>
{children}
<TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" />
</TooltipPrimitive.Content>
</TooltipPrimitive.Portal>
)
return (
<TooltipPrimitive.Portal>
<TooltipPrimitive.Content
data-slot="tooltip-content"
sideOffset={sideOffset}
className={cn(
'z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
className
)}
{...props}
>
{children}
<TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" />
</TooltipPrimitive.Content>
</TooltipPrimitive.Portal>
);
}
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
frontend/src/context/AuthContext.tsx
+8 -10
View File
@@ -1,5 +1,5 @@
import {createContext, useContext, useState} from "react";
import api from "@/services/api";
import { createContext, useContext, useState } from 'react';
import api from '@/services/api';
type AuthContextType = {
user: any;
@@ -10,28 +10,26 @@ type AuthContextType = {
const AuthContext = createContext<AuthContextType | null>(null);
export function AuthProvider({children}: {children: React.ReactNode}) {
const [token, setToken] = useState<string | null>(
localStorage.getItem("token"),
);
export function AuthProvider({ children }: { children: React.ReactNode }) {
const [token, setToken] = useState<string | null>(localStorage.getItem('token'));
const [user, setUser] = useState(null);
async function login(username: string, password: string) {
const response = await api.post("/auth/login", {
const response = await api.post('/auth/login', {
username,
password,
});
const token = response.data.token;
localStorage.setItem("token", token);
localStorage.setItem('token', token);
setToken(token);
}
function logout() {
localStorage.removeItem("token");
localStorage.removeItem('token');
setToken(null);
setUser(null);
@@ -55,7 +53,7 @@ export function useAuth() {
const context = useContext(AuthContext);
if (!context) {
throw new Error("useAuth must be used inside AuthProvider");
throw new Error('useAuth must be used inside AuthProvider');
}
return context;
frontend/src/index.css
+3 -3
View File
@@ -1,6 +1,6 @@
@import "tailwindcss";
@import "tw-animate-css";
@import "shadcn/tailwind.css";
@import 'tailwindcss';
@import 'tw-animate-css';
@import 'shadcn/tailwind.css';
@custom-variant dark (&:is(.dark *));
frontend/src/layouts/DashboardLayout.tsx
+3 -3
View File
@@ -1,7 +1,7 @@
import {Outlet} from "react-router-dom";
import { Outlet } from 'react-router-dom';
import Sidebar from "@/components/layout/Sidebar";
import Header from "@/components/layout/Header";
import Sidebar from '@/components/layout/Sidebar';
import Header from '@/components/layout/Header';
export default function DashboardLayout() {
return (
frontend/src/lib/utils.ts
+3 -3
View File
@@ -1,6 +1,6 @@
import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"
import { clsx, type ClassValue } from 'clsx';
import { twMerge } from 'tailwind-merge';
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
return twMerge(clsx(inputs));
}
frontend/src/main.tsx
+7 -7
View File
@@ -1,14 +1,14 @@
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import "./index.css";
import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import './index.css';
import {AuthProvider} from "./context/AuthContext";
import { AuthProvider } from './context/AuthContext';
ReactDOM.createRoot(document.getElementById("root")!).render(
ReactDOM.createRoot(document.getElementById('root')!).render(
<React.StrictMode>
<AuthProvider>
<App />
</AuthProvider>
</React.StrictMode>,
</React.StrictMode>
);
frontend/src/pages/Academics.tsx
+46 -139
View File
@@ -1,44 +1,22 @@
import { useState, useEffect, useCallback } from "react";
import { useState, useEffect, useCallback } from 'react';
import { getAcademicsApi, deleteAcademicsApi } from "@/api/academics";
import { exportToExcel } from "@/utils/exportToExcel";
import { getAcademicsApi, deleteAcademicsApi } from '@/api/academics';
import { exportToExcel } from '@/utils/exportToExcel';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogFooter,
} from "@/components/ui/dialog";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog';
import {
Loader2,
Trash,
RefreshCw,
Download,
ChevronLeft,
ChevronRight,
Eye,
BookOpen,
} from "lucide-react";
import { Loader2, Trash, RefreshCw, Download, ChevronLeft, ChevronRight, Eye, BookOpen } from 'lucide-react';
export default function AcademicsPage() {
const [records, setRecords] = useState<any[]>([]);
const [loading, setLoading] = useState(true);
const [searchText, setSearchText] = useState("");
const [searchText, setSearchText] = useState('');
const [viewOpen, setViewOpen] = useState(false);
const [viewData, setViewData] = useState<any>(null);
@@ -87,7 +65,7 @@ export default function AcademicsPage() {
}
async function handleDelete(id: number) {
if (!confirm("Delete record?")) return;
if (!confirm('Delete record?')) return;
await deleteAcademicsApi(id);
fetchAll();
}
@@ -104,7 +82,7 @@ export default function AcademicsPage() {
Date: new Date(item.createdAt).toLocaleDateString(),
}));
exportToExcel(exportData, "academics");
exportToExcel(exportData, 'academics');
};
return (
@@ -120,12 +98,7 @@ export default function AcademicsPage() {
className="w-[280px] text-base"
/>
<Button
variant="outline"
onClick={fetchAll}
disabled={loading}
className="text-base"
>
<Button variant="outline" onClick={fetchAll} disabled={loading} className="text-base">
<RefreshCw className="mr-2 h-5 w-5" />
Refresh
</Button>
@@ -147,27 +120,13 @@ export default function AcademicsPage() {
<Table className="w-full min-w-[1100px] table-fixed border-separate border-spacing-0">
<TableHeader className="sticky top-0 z-20 bg-background shadow-sm">
<TableRow>
<TableHead className="w-[60px] bg-background font-bold text-sm">
ID
</TableHead>
<TableHead className="w-[220px] bg-background font-bold text-sm">
Full Name
</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">
Course
</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">
Subject
</TableHead>
<TableHead className="w-[140px] bg-background font-bold text-sm">
Applied Date
</TableHead>
<TableHead className="w-[220px] bg-background font-bold text-sm">
Message
</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-right text-sm">
Actions
</TableHead>
<TableHead className="w-[60px] bg-background font-bold text-sm">ID</TableHead>
<TableHead className="w-[220px] bg-background font-bold text-sm">Full Name</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">Course</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">Subject</TableHead>
<TableHead className="w-[140px] bg-background font-bold text-sm">Applied Date</TableHead>
<TableHead className="w-[220px] bg-background font-bold text-sm">Message</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-right text-sm">Actions</TableHead>
</TableRow>
</TableHeader>
@@ -180,56 +139,32 @@ export default function AcademicsPage() {
</TableRow>
) : currentItems.length === 0 ? (
<TableRow>
<TableCell
colSpan={7}
className="text-center text-muted-foreground py-10 text-base"
>
<TableCell colSpan={7} className="text-center text-muted-foreground py-10 text-base">
No records found
</TableCell>
</TableRow>
) : (
currentItems.map((item) => (
<TableRow key={item.id} className="hover:bg-muted/50">
<TableCell className="font-mono text-xs">
{item.id}
<TableCell className="font-mono text-xs">{item.id}</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">{item.fullName}</div>
<div className="text-xs text-muted-foreground truncate">{item.emailId}</div>
<div className="text-[11px] font-medium">{item.number}</div>
</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">
{item.fullName}
</div>
<div className="text-xs text-muted-foreground truncate">
{item.emailId}
</div>
<div className="text-[11px] font-medium">
{item.number}
</div>
<div className="text-sm font-medium line-clamp-2">{item.courseName || '-'}</div>
</TableCell>
<TableCell>
<div className="text-sm font-medium line-clamp-2">
{item.courseName || "-"}
</div>
<div className="text-sm line-clamp-2">{item.subject || '-'}</div>
</TableCell>
<TableCell className="text-sm">{new Date(item.createdAt).toLocaleDateString()}</TableCell>
<TableCell>
<div className="text-sm line-clamp-2">
{item.subject || "-"}
</div>
</TableCell>
<TableCell className="text-sm">
{new Date(item.createdAt).toLocaleDateString()}
</TableCell>
<TableCell>
<div className="text-sm line-clamp-2 text-muted-foreground italic">
{item.message || "-"}
</div>
<div className="text-sm line-clamp-2 text-muted-foreground italic">{item.message || '-'}</div>
</TableCell>
<TableCell className="text-right">
<div className="flex justify-end gap-2">
<Button
size="icon"
variant="ghost"
className="h-9 w-9"
onClick={() => openView(item)}
>
<Button size="icon" variant="ghost" className="h-9 w-9" onClick={() => openView(item)}>
<Eye className="h-4 w-4" />
</Button>
<Button
@@ -252,14 +187,9 @@ export default function AcademicsPage() {
{!loading && filteredRecords.length > 0 && (
<div className="flex items-center justify-between px-2 py-6 border-t">
<div className="text-base text-muted-foreground">
Showing{" "}
<span className="font-semibold">{indexOfFirstItem + 1}</span> to{" "}
<span className="font-semibold">
{Math.min(indexOfLastItem, filteredRecords.length)}
</span>{" "}
of{" "}
<span className="font-semibold">{filteredRecords.length}</span>{" "}
records
Showing <span className="font-semibold">{indexOfFirstItem + 1}</span> to{' '}
<span className="font-semibold">{Math.min(indexOfLastItem, filteredRecords.length)}</span> of{' '}
<span className="font-semibold">{filteredRecords.length}</span> records
</div>
<div className="flex items-center gap-6">
<div className="text-base font-semibold">
@@ -270,9 +200,7 @@ export default function AcademicsPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.max(prev - 1, 1))
}
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
disabled={currentPage === 1}
>
<ChevronLeft className="h-5 w-5" />
@@ -281,9 +209,7 @@ export default function AcademicsPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
}
onClick={() => setCurrentPage((prev) => Math.min(prev + 1, totalPages))}
disabled={currentPage === totalPages || totalPages === 0}
>
<ChevronRight className="h-5 w-5" />
@@ -307,42 +233,26 @@ export default function AcademicsPage() {
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div className="space-y-4">
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Applicant Information
</p>
<p className="text-lg font-bold text-primary">
{viewData.fullName}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Applicant Information</p>
<p className="text-lg font-bold text-primary">{viewData.fullName}</p>
<p className="text-sm font-medium">{viewData.emailId}</p>
<p className="text-sm">{viewData.number}</p>
</div>
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Course & Subject
</p>
<p className="text-base font-semibold">
{viewData.courseName || "N/A"}
</p>
<p className="text-sm text-muted-foreground">
{viewData.subject}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Course & Subject</p>
<p className="text-base font-semibold">{viewData.courseName || 'N/A'}</p>
<p className="text-sm text-muted-foreground">{viewData.subject}</p>
</div>
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Submission Date
</p>
<p className="text-sm">
{new Date(viewData.createdAt).toLocaleString()}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Submission Date</p>
<p className="text-sm">{new Date(viewData.createdAt).toLocaleString()}</p>
</div>
</div>
<div className="space-y-4">
<div className="p-4 bg-muted/30 rounded-lg border">
<p className="text-xs uppercase font-bold text-muted-foreground mb-2">
Message / Research Inquiry
</p>
<p className="text-xs uppercase font-bold text-muted-foreground mb-2">Message / Research Inquiry</p>
<p className="text-sm leading-relaxed whitespace-pre-wrap italic">
{viewData.message || "No message content provided."}
{viewData.message || 'No message content provided.'}
</p>
</div>
</div>
@@ -350,10 +260,7 @@ export default function AcademicsPage() {
</div>
)}
<DialogFooter>
<Button
onClick={() => setViewOpen(false)}
className="w-full md:w-auto"
>
<Button onClick={() => setViewOpen(false)} className="w-full md:w-auto">
Close
</Button>
</DialogFooter>
frontend/src/pages/Appointment.tsx
+57 -166
View File
@@ -1,47 +1,26 @@
import { useState, useEffect, useCallback } from "react";
import { useState, useEffect, useCallback } from 'react';
import { getAppointmentsApi, deleteAppointmentApi } from "@/api/appointment";
import { exportToExcel } from "@/utils/exportToExcel";
import { getAppointmentsApi, deleteAppointmentApi } from '@/api/appointment';
import { exportToExcel } from '@/utils/exportToExcel';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogFooter,
} from "@/components/ui/dialog";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog';
import {
Loader2,
Trash,
RefreshCw,
Download,
ChevronLeft,
ChevronRight,
Eye,
} from "lucide-react";
import { Loader2, Trash, RefreshCw, Download, ChevronLeft, ChevronRight, Eye } from 'lucide-react';
export default function AppointmentPage() {
const [appointments, setAppointments] = useState<any[]>([]);
const [loading, setLoading] = useState(true);
const [searchText, setSearchText] = useState("");
const [filterDoctor, setFilterDoctor] = useState("");
const [filterDate, setFilterDate] = useState("");
const [startDate, setStartDate] = useState("");
const [endDate, setEndDate] = useState("");
const [searchText, setSearchText] = useState('');
const [filterDoctor, setFilterDoctor] = useState('');
const [filterDate, setFilterDate] = useState('');
const [startDate, setStartDate] = useState('');
const [endDate, setEndDate] = useState('');
const [viewOpen, setViewOpen] = useState(false);
const [viewData, setViewData] = useState<any>(null);
@@ -53,14 +32,7 @@ export default function AppointmentPage() {
const fetchAll = useCallback(async () => {
setLoading(true);
try {
const res = await getAppointmentsApi(
currentPage,
itemsPerPage,
filterDate,
startDate,
endDate,
searchText,
);
const res = await getAppointmentsApi(currentPage, itemsPerPage, filterDate, startDate, endDate, searchText);
setAppointments(res?.data || []);
setTotalPages(res?.pagination?.totalPages || 1);
setTotalItems(res?.pagination?.total || 0);
@@ -76,9 +48,7 @@ export default function AppointmentPage() {
}, [fetchAll]);
const filteredAppointments = appointments.filter((item) => {
const matchesDoctor = filterDoctor
? item.doctor?.name?.toLowerCase().includes(filterDoctor.toLowerCase())
: true;
const matchesDoctor = filterDoctor ? item.doctor?.name?.toLowerCase().includes(filterDoctor.toLowerCase()) : true;
return matchesDoctor;
});
@@ -95,7 +65,7 @@ export default function AppointmentPage() {
}
async function handleDelete(id: number) {
if (!confirm("Delete appointment?")) return;
if (!confirm('Delete appointment?')) return;
await deleteAppointmentApi(id);
fetchAll();
}
@@ -111,7 +81,7 @@ export default function AppointmentPage() {
Date: new Date(item.date).toLocaleDateString(),
Message: item.message,
}));
exportToExcel(exportData, "appointments");
exportToExcel(exportData, 'appointments');
};
return (
@@ -121,9 +91,7 @@ export default function AppointmentPage() {
<div className="flex flex-wrap gap-4 items-end">
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
Search
</label>
<label className="text-xs font-medium text-muted-foreground">Search</label>
<Input
placeholder="Search name / phone..."
value={searchText}
@@ -136,9 +104,7 @@ export default function AppointmentPage() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
Date
</label>
<label className="text-xs font-medium text-muted-foreground">Date</label>
<Input
type="date"
value={filterDate}
@@ -152,9 +118,7 @@ export default function AppointmentPage() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
From
</label>
<label className="text-xs font-medium text-muted-foreground">From</label>
<Input
type="date"
value={startDate}
@@ -168,9 +132,7 @@ export default function AppointmentPage() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
To
</label>
<label className="text-xs font-medium text-muted-foreground">To</label>
<Input
type="date"
value={endDate}
@@ -184,9 +146,7 @@ export default function AppointmentPage() {
</div>
<div className="flex flex-col gap-1">
<label className="text-xs font-medium text-muted-foreground">
Rows
</label>
<label className="text-xs font-medium text-muted-foreground">Rows</label>
<select
value={itemsPerPage}
onChange={(e) => {
@@ -201,12 +161,7 @@ export default function AppointmentPage() {
</select>
</div>
<Button
variant="outline"
onClick={fetchAll}
disabled={loading}
className="text-base"
>
<Button variant="outline" onClick={fetchAll} disabled={loading} className="text-base">
<RefreshCw className="mr-2 h-5 w-5" />
Refresh
</Button>
@@ -228,24 +183,12 @@ export default function AppointmentPage() {
<Table className="w-full min-w-[1000px] table-fixed border-separate border-spacing-0">
<TableHeader className="sticky top-0 z-20 bg-background shadow-sm">
<TableRow>
<TableHead className="w-[60px] bg-background font-bold text-sm">
ID
</TableHead>
<TableHead className="w-[200px] bg-background font-bold text-sm">
Patient
</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">
Doctor
</TableHead>
<TableHead className="w-[150px] bg-background font-bold text-sm">
Date
</TableHead>
<TableHead className="w-[250px] bg-background font-bold text-sm">
Message
</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-right text-sm">
Actions
</TableHead>
<TableHead className="w-[60px] bg-background font-bold text-sm">ID</TableHead>
<TableHead className="w-[200px] bg-background font-bold text-sm">Patient</TableHead>
<TableHead className="w-[180px] bg-background font-bold text-sm">Doctor</TableHead>
<TableHead className="w-[150px] bg-background font-bold text-sm">Date</TableHead>
<TableHead className="w-[250px] bg-background font-bold text-sm">Message</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-right text-sm">Actions</TableHead>
</TableRow>
</TableHeader>
@@ -258,53 +201,31 @@ export default function AppointmentPage() {
</TableRow>
) : filteredAppointments.length === 0 ? (
<TableRow>
<TableCell
colSpan={6}
className="text-center text-muted-foreground py-10 text-base"
>
<TableCell colSpan={6} className="text-center text-muted-foreground py-10 text-base">
No appointments found
</TableCell>
</TableRow>
) : (
filteredAppointments.map((item) => (
<TableRow key={item.id} className="hover:bg-muted/50">
<TableCell className="font-mono text-xs">
{item.id}
<TableCell className="font-mono text-xs">{item.id}</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">{item.name}</div>
<div className="text-xs text-muted-foreground">{item.mobileNumber}</div>
</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">
{item.name}
</div>
<div className="text-xs text-muted-foreground">
{item.mobileNumber}
</div>
<div className="text-sm font-medium">{item.doctor?.name || '-'}</div>
<div className="text-[10px] text-muted-foreground truncate">{item.department?.name}</div>
</TableCell>
<TableCell>
<div className="text-sm font-medium">
{item.doctor?.name || "-"}
</div>
<div className="text-[10px] text-muted-foreground truncate">
{item.department?.name}
</div>
<div className="text-sm">{new Date(item.date).toLocaleDateString()}</div>
</TableCell>
<TableCell>
<div className="text-sm">
{new Date(item.date).toLocaleDateString()}
</div>
</TableCell>
<TableCell>
<div className="text-sm line-clamp-2 text-muted-foreground italic">
{item.message || "-"}
</div>
<div className="text-sm line-clamp-2 text-muted-foreground italic">{item.message || '-'}</div>
</TableCell>
<TableCell className="text-right">
<div className="flex justify-end gap-2">
<Button
size="icon"
variant="ghost"
className="h-9 w-9"
onClick={() => openView(item)}
>
<Button size="icon" variant="ghost" className="h-9 w-9" onClick={() => openView(item)}>
<Eye className="h-4 w-4" />
</Button>
<Button
@@ -327,12 +248,9 @@ export default function AppointmentPage() {
{!loading && totalItems > 0 && (
<div className="flex items-center justify-between px-2 py-6 border-t">
<div className="text-base text-muted-foreground">
Showing{" "}
<span className="font-semibold">{indexOfFirstItem + 1}</span> to{" "}
<span className="font-semibold">
{Math.min(currentPage * itemsPerPage, totalItems)}
</span>{" "}
of <span className="font-semibold">{totalItems}</span>
Showing <span className="font-semibold">{indexOfFirstItem + 1}</span> to{' '}
<span className="font-semibold">{Math.min(currentPage * itemsPerPage, totalItems)}</span> of{' '}
<span className="font-semibold">{totalItems}</span>
</div>
<div className="flex items-center gap-6">
<div className="text-base font-semibold">
@@ -343,9 +261,7 @@ export default function AppointmentPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.max(prev - 1, 1))
}
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
disabled={currentPage === 1}
>
<ChevronLeft className="h-5 w-5" />
@@ -354,9 +270,7 @@ export default function AppointmentPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
}
onClick={() => setCurrentPage((prev) => Math.min(prev + 1, totalPages))}
disabled={currentPage === totalPages || totalPages === 0}
>
<ChevronRight className="h-5 w-5" />
@@ -371,33 +285,21 @@ export default function AppointmentPage() {
<Dialog open={viewOpen} onOpenChange={setViewOpen}>
<DialogContent className="w-full !max-w-3xl max-h-[85vh] overflow-y-auto">
<DialogHeader>
<DialogTitle className="text-2xl border-b pb-2">
Appointment Details
</DialogTitle>
<DialogTitle className="text-2xl border-b pb-2">Appointment Details</DialogTitle>
</DialogHeader>
{viewData && (
<div className="space-y-6 py-4">
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div className="space-y-4">
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Patient Information
</p>
<p className="text-lg font-bold text-primary">
{viewData.name}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Patient Information</p>
<p className="text-lg font-bold text-primary">{viewData.name}</p>
<p className="text-sm">{viewData.mobileNumber}</p>
<p className="text-sm">
{viewData.email || "No email provided"}
</p>
<p className="text-sm">{viewData.email || 'No email provided'}</p>
</div>
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Appointment Date
</p>
<p className="text-base font-semibold">
{new Date(viewData.date).toLocaleDateString()}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Appointment Date</p>
<p className="text-base font-semibold">{new Date(viewData.date).toLocaleDateString()}</p>
<p className="text-[10px] text-muted-foreground">
Booked on: {new Date(viewData.createdAt).toLocaleString()}
</p>
@@ -405,22 +307,14 @@ export default function AppointmentPage() {
</div>
<div className="space-y-4">
<div>
<p className="text-xs uppercase font-bold text-muted-foreground">
Doctor / Department
</p>
<p className="text-base font-bold">
{viewData.doctor?.name || "Not Assigned"}
</p>
<p className="text-sm text-muted-foreground">
{viewData.department?.name || "General"}
</p>
<p className="text-xs uppercase font-bold text-muted-foreground">Doctor / Department</p>
<p className="text-base font-bold">{viewData.doctor?.name || 'Not Assigned'}</p>
<p className="text-sm text-muted-foreground">{viewData.department?.name || 'General'}</p>
</div>
<div className="p-4 bg-muted/30 rounded-lg">
<p className="text-xs uppercase font-bold text-muted-foreground mb-2">
Message from Patient
</p>
<p className="text-xs uppercase font-bold text-muted-foreground mb-2">Message from Patient</p>
<p className="text-sm italic leading-relaxed whitespace-pre-wrap">
{viewData.message || "No message provided."}
{viewData.message || 'No message provided.'}
</p>
</div>
</div>
@@ -428,10 +322,7 @@ export default function AppointmentPage() {
</div>
)}
<DialogFooter>
<Button
onClick={() => setViewOpen(false)}
className="w-full md:w-auto"
>
<Button onClick={() => setViewOpen(false)} className="w-full md:w-auto">
Close
</Button>
</DialogFooter>
frontend/src/pages/Blog.tsx
+21 -47
View File
@@ -1,23 +1,16 @@
import {useState, useEffect, useCallback} from "react";
import {AxiosError} from "axios";
import {useNavigate} from "react-router-dom";
import { useState, useEffect, useCallback } from 'react';
import { AxiosError } from 'axios';
import { useNavigate } from 'react-router-dom';
import {getAllBlogsApi, deleteBlogApi} from "@/api/blog";
import { getAllBlogsApi, deleteBlogApi } from '@/api/blog';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import {Card, CardContent, CardHeader, CardTitle} from "@/components/ui/card";
import {Button} from "@/components/ui/button";
import {Input} from "@/components/ui/input";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import {Loader2, RefreshCw, Plus, Pencil, Trash, Eye} from "lucide-react";
import { Loader2, RefreshCw, Plus, Pencil, Trash, Eye } from 'lucide-react';
interface Blog {
id: number;
@@ -29,14 +22,14 @@ interface Blog {
export default function BlogPage() {
const [blogs, setBlogs] = useState<Blog[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState("");
const [searchText, setSearchText] = useState("");
const [error, setError] = useState('');
const [searchText, setSearchText] = useState('');
const navigate = useNavigate();
const fetchBlogs = useCallback(async () => {
setLoading(true);
setError("");
setError('');
try {
const res = await getAllBlogsApi();
@@ -48,9 +41,9 @@ export default function BlogPage() {
}
} catch (err) {
if (err instanceof AxiosError) {
setError(err.response?.data?.message || "Failed to load blogs");
setError(err.response?.data?.message || 'Failed to load blogs');
} else {
setError("Something went wrong");
setError('Something went wrong');
}
} finally {
setLoading(false);
@@ -64,14 +57,11 @@ export default function BlogPage() {
const filteredBlogs = blogs.filter((b) => {
const text = searchText.toLowerCase();
return (
b.title?.toLowerCase().includes(text) ||
b.writer?.toLowerCase().includes(text)
);
return b.title?.toLowerCase().includes(text) || b.writer?.toLowerCase().includes(text);
});
async function handleDelete(id: number) {
const confirmDelete = confirm("Delete this blog?");
const confirmDelete = confirm('Delete this blog?');
if (!confirmDelete) return;
try {
@@ -100,18 +90,14 @@ export default function BlogPage() {
Refresh
</Button>
<Button onClick={() => navigate("/blog/create")}>
<Button onClick={() => navigate('/blog/create')}>
<Plus className="mr-2 h-4 w-4" />
Add Blog
</Button>
</div>
</div>
{error && (
<div className="p-4 text-red-600 bg-red-50 border rounded-md">
{error}
</div>
)}
{error && <div className="p-4 text-red-600 bg-red-50 border rounded-md">{error}</div>}
<Card>
<CardHeader>
@@ -153,26 +139,14 @@ export default function BlogPage() {
<TableCell>{blog.writer}</TableCell>
<TableCell className="flex gap-2">
<Button
size="sm"
variant="outline"
onClick={() => navigate(`/blog/edit/${blog.id}`)}
>
<Button size="sm" variant="outline" onClick={() => navigate(`/blog/edit/${blog.id}`)}>
<Pencil className="h-4 w-4" />
</Button>
<Button
size="sm"
variant="secondary"
onClick={() => navigate(`/blog/${blog.id}`)}
>
<Button size="sm" variant="secondary" onClick={() => navigate(`/blog/${blog.id}`)}>
<Eye className="h-4 w-4" />
</Button>
<Button
size="sm"
variant="destructive"
onClick={() => handleDelete(blog.id)}
>
<Button size="sm" variant="destructive" onClick={() => handleDelete(blog.id)}>
<Trash className="h-4 w-4" />
</Button>
</TableCell>
frontend/src/pages/BlogDetails.tsx
+30 -64
View File
@@ -1,26 +1,22 @@
import React, {useEffect, useState} from "react";
import {useParams, useNavigate} from "react-router-dom";
import React, { useEffect, useState } from 'react';
import { useParams, useNavigate } from 'react-router-dom';
import {Button} from "@/components/ui/button";
import {getBlogByIdApi} from "@/api/blog";
import { Button } from '@/components/ui/button';
import { getBlogByIdApi } from '@/api/blog';
/* ---------------- LIST RENDERER ---------------- */
const renderList = (items, style) => {
// ✅ Checklist
if (style === "checklist") {
if (style === 'checklist') {
return (
<div className="mb-4 space-y-2">
{items.map((item, i) => (
<div key={i} className="flex items-center gap-2">
<input
type="checkbox"
checked={item.meta?.checked || false}
readOnly
/>
<input type="checkbox" checked={item.meta?.checked || false} readOnly />
<span
className={item.meta?.checked ? "line-through opacity-60" : ""}
className={item.meta?.checked ? 'line-through opacity-60' : ''}
dangerouslySetInnerHTML={{
__html: item.content || "",
__html: item.content || '',
}}
/>
</div>
@@ -30,14 +26,10 @@ const renderList = (items, style) => {
}
// ✅ Ordered / Unordered
const ListTag = style === "ordered" ? "ol" : "ul";
const ListTag = style === 'ordered' ? 'ol' : 'ul';
return (
<ListTag
className={`pl-6 mb-4 ${
style === "ordered" ? "list-decimal" : "list-disc"
}`}
>
<ListTag className={`pl-6 mb-4 ${style === 'ordered' ? 'list-decimal' : 'list-disc'}`}>
{items
.filter((item) => item.content)
.map((item, i) => (
@@ -57,60 +49,44 @@ const renderList = (items, style) => {
/* ---------------- BLOCK RENDERER ---------------- */
const renderBlock = (block, index) => {
switch (block.type) {
case "paragraph":
case 'paragraph':
return (
<p
key={index}
className="mb-4 leading-7 text-gray-800"
dangerouslySetInnerHTML={{__html: block.data.text}}
/>
<p key={index} className="mb-4 leading-7 text-gray-800" dangerouslySetInnerHTML={{ __html: block.data.text }} />
);
case "header":
case 'header':
return (
<h2
key={index}
className="text-2xl font-semibold mb-4"
dangerouslySetInnerHTML={{__html: block.data.text}}
/>
<h2 key={index} className="text-2xl font-semibold mb-4" dangerouslySetInnerHTML={{ __html: block.data.text }} />
);
case "image":
case 'image':
return (
<img
key={index}
src={block.data.file?.url}
alt={block.data.caption || "blog-image"}
alt={block.data.caption || 'blog-image'}
className="w-full rounded-lg mb-4"
/>
);
case "list":
return (
<div key={index}>{renderList(block.data.items, block.data.style)}</div>
);
case 'list':
return <div key={index}>{renderList(block.data.items, block.data.style)}</div>;
case "quote":
case 'quote':
return (
<blockquote
key={index}
className="border-l-4 border-gray-300 pl-4 italic my-4 text-gray-600"
>
<blockquote key={index} className="border-l-4 border-gray-300 pl-4 italic my-4 text-gray-600">
{block.data.text}
</blockquote>
);
case "code":
case 'code':
return (
<pre
key={index}
className="bg-gray-100 p-4 rounded-md overflow-x-auto text-sm mb-4"
>
<pre key={index} className="bg-gray-100 p-4 rounded-md overflow-x-auto text-sm mb-4">
<code>{block.data.code}</code>
</pre>
);
case "table":
case 'table':
return (
<div key={index} className="overflow-x-auto mb-6">
<table className="w-full border border-gray-200">
@@ -133,7 +109,7 @@ const renderBlock = (block, index) => {
</div>
);
case "delimiter":
case 'delimiter':
return <hr key={index} className="my-6 border-gray-300" />;
default:
@@ -143,17 +119,17 @@ const renderBlock = (block, index) => {
/* ---------------- MAIN COMPONENT ---------------- */
const BlogDetail = () => {
const {id} = useParams();
const { id } = useParams();
const navigate = useNavigate();
const [blog, setBlog] = useState(null);
const fetchBlog = async () => {
try {
const res = await getBlogByIdApi(Number(id));
console.log({res});
console.log({ res });
setBlog(res);
} catch (err) {
console.error("Error fetching blog", err);
console.error('Error fetching blog', err);
}
};
@@ -168,11 +144,7 @@ const BlogDetail = () => {
return (
<div className="mx-auto flex flex-col ">
{/* Back Button */}
<Button
variant="ghost"
className="mb-4 w-fit text-black px-0"
onClick={() => navigate(-1)}
>
<Button variant="ghost" className="mb-4 w-fit text-black px-0" onClick={() => navigate(-1)}>
← Back
</Button>
@@ -186,17 +158,11 @@ const BlogDetail = () => {
{/* Image (only if exists) */}
{blog.image?.trim() && (
<img
src={blog.image}
alt="blog"
className="w-full h-[220px] md:h-[400px] object-cover rounded-lg mb-6"
/>
<img src={blog.image} alt="blog" className="w-full h-[220px] md:h-[400px] object-cover rounded-lg mb-6" />
)}
{/* Content */}
<div>
{blog.content?.blocks?.map((block, index) => renderBlock(block, index))}
</div>
<div>{blog.content?.blocks?.map((block, index) => renderBlock(block, index))}</div>
</div>
);
};
frontend/src/pages/BlogEditor.tsx
+46 -75
View File
@@ -1,40 +1,35 @@
import {useEffect, useRef, useState} from "react";
import {useNavigate, useParams} from "react-router-dom";
import {BytescaleUploader} from "@/components/BytescaleUploader/BytescaleUploader";
import EditorJS, {OutputData} from "@editorjs/editorjs";
import Header from "@editorjs/header";
import List from "@editorjs/list";
import ImageTool from "@editorjs/image";
import Quote from "@editorjs/quote";
import Table from "@editorjs/table";
import CodeTool from "@editorjs/code";
import Embed from "@editorjs/embed";
import Delimiter from "@editorjs/delimiter";
import axios from "axios";
import { useEffect, useRef, useState } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import { BytescaleUploader } from '@/components/BytescaleUploader/BytescaleUploader';
import EditorJS, { OutputData } from '@editorjs/editorjs';
import Header from '@editorjs/header';
import List from '@editorjs/list';
import ImageTool from '@editorjs/image';
import Quote from '@editorjs/quote';
import Table from '@editorjs/table';
import CodeTool from '@editorjs/code';
import Embed from '@editorjs/embed';
import Delimiter from '@editorjs/delimiter';
import axios from 'axios';
import {
createBlogApi,
updateBlogApi,
getBlogByIdApi,
uploadImageApi,
} from "@/api/blog";
import { createBlogApi, updateBlogApi, getBlogByIdApi, uploadImageApi } from '@/api/blog';
import {Card, CardContent, CardHeader, CardTitle} from "@/components/ui/card";
import {Input} from "@/components/ui/input";
import {Button} from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
export default function BlogEditorPage() {
const baseURL = import.meta.env.VITE_API_URL;
const {id} = useParams();
const { id } = useParams();
const navigate = useNavigate();
const editorRef = useRef<EditorJS | null>(null);
const hasInitialized = useRef(false);
const hasRenderedContent = useRef(false);
const [title, setTitle] = useState("");
const [writer, setWriter] = useState("");
const [coverImage, setCoverImage] = useState("");
const [title, setTitle] = useState('');
const [writer, setWriter] = useState('');
const [coverImage, setCoverImage] = useState('');
const [loading, setLoading] = useState(false);
const isEdit = Boolean(id);
@@ -47,16 +42,16 @@ export default function BlogEditorPage() {
const initEditor = async () => {
editor = new EditorJS({
holder: "editorjs",
holder: 'editorjs',
placeholder: "Write blog content...",
placeholder: 'Write blog content...',
tools: {
header: {
class: Header,
inlineToolbar: true,
config: {
placeholder: "Enter heading",
placeholder: 'Enter heading',
levels: [1, 2, 3, 4],
defaultLevel: 2,
},
@@ -66,7 +61,7 @@ export default function BlogEditorPage() {
class: List,
inlineToolbar: true,
config: {
defaultStyle: "unordered",
defaultStyle: 'unordered',
},
},
@@ -82,38 +77,33 @@ export default function BlogEditorPage() {
uploader: {
uploadByFile: async (file: File) => {
if (file.size > 5 * 1024 * 1024) {
alert("File is too large (Max 5MB)");
return {success: 0, file: {url: ""}};
alert('File is too large (Max 5MB)');
return { success: 0, file: { url: '' } };
}
const formData = new FormData();
formData.append("file", file);
formData.append("folderPath", "/blog");
formData.append('file', file);
formData.append('folderPath', '/blog');
try {
const response = await axios.post(
`${baseURL}/upload`,
formData,
{
headers: {
"Content-Type": "multipart/form-data",
},
const response = await axios.post(`${baseURL}/upload`, formData, {
headers: {
'Content-Type': 'multipart/form-data',
},
);
});
return {
success: 1,
file: {url: response.data.fileUrl},
file: { url: response.data.fileUrl },
};
} catch (e: any) {
console.error("EditorJS Image Upload Error:", e);
const errorMessage =
e.response?.data?.error || e.message || "Upload failed";
console.error('EditorJS Image Upload Error:', e);
const errorMessage = e.response?.data?.error || e.message || 'Upload failed';
alert(`Upload Error: ${errorMessage}`);
return {
success: 0,
file: {url: ""},
file: { url: '' },
};
}
},
@@ -132,7 +122,7 @@ export default function BlogEditorPage() {
setTitle(res.title);
setWriter(res.writer);
setCoverImage(res.image || "");
setCoverImage(res.image || '');
if (res.content) {
await editor.blocks.clear();
@@ -170,7 +160,7 @@ export default function BlogEditorPage() {
await createBlogApi(payload);
}
navigate("/blog");
navigate('/blog');
} catch (err) {
console.error(err);
} finally {
@@ -182,47 +172,28 @@ export default function BlogEditorPage() {
<div className="p-6 max-w-5xl mx-auto space-y-6">
<Card>
<CardHeader>
<CardTitle>{isEdit ? "Edit Blog" : "Create Blog"}</CardTitle>
<CardTitle>{isEdit ? 'Edit Blog' : 'Create Blog'}</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<Input
placeholder="Blog Title"
value={title}
onChange={(e) => setTitle(e.target.value)}
/>
<Input placeholder="Blog Title" value={title} onChange={(e) => setTitle(e.target.value)} />
<Input
placeholder="Writer Name"
value={writer}
onChange={(e) => setWriter(e.target.value)}
/>
<Input placeholder="Writer Name" value={writer} onChange={(e) => setWriter(e.target.value)} />
<div className="space-y-2">
<label className="text-sm font-medium">Cover Image</label>
<BytescaleUploader
value={coverImage}
folderPath="/blog"
onChange={(url) => setCoverImage(url)}
/>
<BytescaleUploader value={coverImage} folderPath="/blog" onChange={(url) => setCoverImage(url)} />
{coverImage && (
<img
src={coverImage}
alt="cover"
className="w-full max-h-[250px] object-cover rounded-md"
/>
<img src={coverImage} alt="cover" className="w-full max-h-[250px] object-cover rounded-md" />
)}
</div>
<div
id="editorjs"
className="border rounded-md p-4 bg-white min-h-[300px]"
/>
<div id="editorjs" className="border rounded-md p-4 bg-white min-h-[300px]" />
<Button onClick={handleSave} disabled={loading}>
{loading ? "Saving..." : "Save Blog"}
{loading ? 'Saving...' : 'Save Blog'}
</Button>
</CardContent>
</Card>
frontend/src/pages/Career.tsx
+61 -137
View File
@@ -1,39 +1,19 @@
import { useState, useEffect, useCallback } from "react";
import { useState, useEffect, useCallback } from 'react';
import { getCareersApi, updateCareerApi, createCareerApi } from "@/api/career";
import { getCareersApi, updateCareerApi, createCareerApi } from '@/api/career';
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogFooter,
} from "@/components/ui/dialog";
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog';
import { Input } from "@/components/ui/input";
import { Badge } from "@/components/ui/badge";
import { Switch } from "@/components/ui/switch";
import { Label } from "@/components/ui/label";
import { Input } from '@/components/ui/input';
import { Badge } from '@/components/ui/badge';
import { Switch } from '@/components/ui/switch';
import { Label } from '@/components/ui/label';
import {
Loader2,
Plus,
Pencil,
RefreshCw,
ChevronLeft,
ChevronRight,
} from "lucide-react";
import { Loader2, Plus, Pencil, RefreshCw, ChevronLeft, ChevronRight } from 'lucide-react';
export default function CareerPage() {
const [careers, setCareers] = useState<any[]>([]);
@@ -42,19 +22,19 @@ export default function CareerPage() {
const [openModal, setOpenModal] = useState(false);
const [editing, setEditing] = useState<any>(null);
const [searchText, setSearchText] = useState("");
const [searchText, setSearchText] = useState('');
const [currentPage, setCurrentPage] = useState(1);
const itemsPerPage = 10;
const [form, setForm] = useState({
post: "",
designation: "",
qualification: "",
experienceNeed: "",
email: "",
number: "",
status: "new",
post: '',
designation: '',
qualification: '',
experienceNeed: '',
email: '',
number: '',
status: 'new',
isActive: true,
sortOrder: 0,
});
@@ -78,7 +58,7 @@ export default function CareerPage() {
const filteredCareers = careers.filter(
(item) =>
item.post?.toLowerCase().includes(searchText.toLowerCase()) ||
item.designation?.toLowerCase().includes(searchText.toLowerCase()),
item.designation?.toLowerCase().includes(searchText.toLowerCase())
);
useEffect(() => {
@@ -102,20 +82,20 @@ export default function CareerPage() {
} as any);
fetchAll();
} catch (error) {
console.error("Failed to toggle status", error);
console.error('Failed to toggle status', error);
}
};
function openAdd() {
setEditing(null);
setForm({
post: "",
designation: "",
qualification: "",
experienceNeed: "",
email: "",
number: "",
status: "new",
post: '',
designation: '',
qualification: '',
experienceNeed: '',
email: '',
number: '',
status: 'new',
isActive: true,
sortOrder: 0,
});
@@ -125,13 +105,13 @@ export default function CareerPage() {
function openEdit(item: any) {
setEditing(item);
setForm({
post: item.post || "",
designation: item.designation || "",
qualification: item.qualification || "",
experienceNeed: item.experienceNeed || "",
email: item.email || "",
number: item.number || "",
status: item.status || "new",
post: item.post || '',
designation: item.designation || '',
qualification: item.qualification || '',
experienceNeed: item.experienceNeed || '',
email: item.email || '',
number: item.number || '',
status: item.status || 'new',
isActive: item.isActive ?? true,
sortOrder: item.sortOrder ?? 0,
});
@@ -166,12 +146,7 @@ export default function CareerPage() {
className="w-[250px] text-base"
/>
<Button
variant="outline"
onClick={fetchAll}
disabled={loading}
className="text-base"
>
<Button variant="outline" onClick={fetchAll} disabled={loading} className="text-base">
<RefreshCw className="mr-2 h-5 w-5" />
Refresh
</Button>
@@ -193,24 +168,12 @@ export default function CareerPage() {
<Table className="w-full min-w-[800px] table-fixed border-separate border-spacing-0">
<TableHeader className="sticky top-0 z-20 bg-background shadow-sm">
<TableRow>
<TableHead className="w-[80px] bg-background font-bold text-sm">
Priority
</TableHead>
<TableHead className="w-[250px] bg-background font-bold text-sm">
Post & Designation
</TableHead>
<TableHead className="w-[200px] bg-background font-bold text-sm">
Qualification
</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-sm">
Experience
</TableHead>
<TableHead className="w-[80px] bg-background font-bold text-sm">
Status (Active)
</TableHead>
<TableHead className="w-[80px] bg-background font-bold text-right text-sm">
Actions
</TableHead>
<TableHead className="w-[80px] bg-background font-bold text-sm">Priority</TableHead>
<TableHead className="w-[250px] bg-background font-bold text-sm">Post & Designation</TableHead>
<TableHead className="w-[200px] bg-background font-bold text-sm">Qualification</TableHead>
<TableHead className="w-[120px] bg-background font-bold text-sm">Experience</TableHead>
<TableHead className="w-[80px] bg-background font-bold text-sm">Status (Active)</TableHead>
<TableHead className="w-[80px] bg-background font-bold text-right text-sm">Actions</TableHead>
</TableRow>
</TableHeader>
@@ -223,58 +186,34 @@ export default function CareerPage() {
</TableRow>
) : currentItems.length === 0 ? (
<TableRow>
<TableCell
colSpan={6}
className="text-center text-muted-foreground py-10 text-base"
>
<TableCell colSpan={6} className="text-center text-muted-foreground py-10 text-base">
No careers found
</TableCell>
</TableRow>
) : (
currentItems.map((item) => (
<TableRow key={item.id} className="hover:bg-muted/50">
<TableCell className="font-mono text-xs">
{item.sortOrder}
<TableCell className="font-mono text-xs">{item.sortOrder}</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">{item.post}</div>
<div className="text-xs text-muted-foreground truncate">{item.designation}</div>
</TableCell>
<TableCell>
<div className="font-semibold text-base truncate">
{item.post}
</div>
<div className="text-xs text-muted-foreground truncate">
{item.designation}
</div>
</TableCell>
<TableCell>
<div className="text-sm line-clamp-2">
{item.qualification}
</div>
</TableCell>
<TableCell className="text-sm">
{item.experienceNeed}
<div className="text-sm line-clamp-2">{item.qualification}</div>
</TableCell>
<TableCell className="text-sm">{item.experienceNeed}</TableCell>
<TableCell>
<div className="flex items-center gap-2">
<Switch
checked={item.isActive}
onCheckedChange={() => handleToggleStatus(item)}
/>
<Badge
variant={item.isActive ? "default" : "secondary"}
className="capitalize"
>
{item.isActive ? "Active" : "Hidden"}
<Switch checked={item.isActive} onCheckedChange={() => handleToggleStatus(item)} />
<Badge variant={item.isActive ? 'default' : 'secondary'} className="capitalize">
{item.isActive ? 'Active' : 'Hidden'}
</Badge>
</div>
</TableCell>
<TableCell className="text-right">
<div className="flex justify-end gap-2">
<Button
size="icon"
variant="ghost"
className="h-9 w-9"
onClick={() => openEdit(item)}
>
<Button size="icon" variant="ghost" className="h-9 w-9" onClick={() => openEdit(item)}>
<Pencil className="h-4 w-4" />
</Button>
</div>
@@ -289,14 +228,9 @@ export default function CareerPage() {
{!loading && filteredCareers.length > 0 && (
<div className="flex items-center justify-between px-2 py-6 border-t">
<div className="text-base text-muted-foreground">
Showing{" "}
<span className="font-semibold">{indexOfFirstItem + 1}</span> to{" "}
<span className="font-semibold">
{Math.min(indexOfLastItem, filteredCareers.length)}
</span>{" "}
of{" "}
<span className="font-semibold">{filteredCareers.length}</span>{" "}
careers
Showing <span className="font-semibold">{indexOfFirstItem + 1}</span> to{' '}
<span className="font-semibold">{Math.min(indexOfLastItem, filteredCareers.length)}</span> of{' '}
<span className="font-semibold">{filteredCareers.length}</span> careers
</div>
<div className="flex items-center gap-6">
<div className="text-base font-semibold">
@@ -307,9 +241,7 @@ export default function CareerPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.max(prev - 1, 1))
}
onClick={() => setCurrentPage((prev) => Math.max(prev - 1, 1))}
disabled={currentPage === 1}
>
<ChevronLeft className="h-5 w-5" />
@@ -318,9 +250,7 @@ export default function CareerPage() {
variant="outline"
size="icon"
className="h-10 w-10"
onClick={() =>
setCurrentPage((prev) => Math.min(prev + 1, totalPages))
}
onClick={() => setCurrentPage((prev) => Math.min(prev + 1, totalPages))}
disabled={currentPage === totalPages || totalPages === 0}
>
<ChevronRight className="h-5 w-5" />
@@ -335,9 +265,7 @@ export default function CareerPage() {
<Dialog open={openModal} onOpenChange={setOpenModal}>
<DialogContent className="w-full max-w-lg">
<DialogHeader>
<DialogTitle className="text-2xl">
{editing ? "Edit Career" : "Add New Career"}
</DialogTitle>
<DialogTitle className="text-2xl">{editing ? 'Edit Career' : 'Add New Career'}</DialogTitle>
</DialogHeader>
<div className="space-y-4 py-4">
@@ -420,15 +348,11 @@ export default function CareerPage() {
</div>
<DialogFooter className="pt-4 border-t">
<Button
variant="ghost"
onClick={() => setOpenModal(false)}
className="text-base"
>
<Button variant="ghost" onClick={() => setOpenModal(false)} className="text-base">
Cancel
</Button>
<Button onClick={handleSubmit} className="px-8 text-base">
{editing ? "Save Changes" : "Create Career"}
{editing ? 'Save Changes' : 'Create Career'}
</Button>
</DialogFooter>
</DialogContent>

Some files were not shown because too many files have changed in this diff Show More