fixed the pto , sick , adjustment quill onfocus issue
This commit is contained in:
parent
bebb4fb980
commit
3efcf99151
|
|
@ -13,8 +13,8 @@ const httpsAgent = new https.Agent({
|
||||||
|
|
||||||
const api: AxiosInstance = axios.create({
|
const api: AxiosInstance = axios.create({
|
||||||
// https://dreadingly-unfighting-pandora.ngrok-free.dev/
|
// https://dreadingly-unfighting-pandora.ngrok-free.dev/
|
||||||
// https://quality-friendly-goldfish.ngrok-free.app/
|
// https://daniela-nonprofessed-boastfully.ngrok-free.app/
|
||||||
baseURL: 'https://quality-friendly-goldfish.ngrok-free.app/api/v1/va', // 🔁 your backend
|
baseURL: 'https://daniela-nonprofessed-boastfully.ngrok-free.app/api/v1/va', // 🔁 your backend
|
||||||
httpsAgent
|
httpsAgent
|
||||||
// timeout: 10000,
|
// timeout: 10000,
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -68,7 +68,7 @@ export const handleLogin = async (credentials: { email: string, password: string
|
||||||
try {
|
try {
|
||||||
console.log("➡️ Calling API...");
|
console.log("➡️ Calling API...");
|
||||||
const response = await axios.post(
|
const response = await axios.post(
|
||||||
'https://quality-friendly-goldfish.ngrok-free.app/api/v1/va/login',
|
'https://daniela-nonprofessed-boastfully.ngrok-free.app/api/v1/va/login',
|
||||||
{ userDetails: { ...credentials } },
|
{ userDetails: { ...credentials } },
|
||||||
{ headers: { "ngrok-skip-browser-warning": 69420 }, httpsAgent }
|
{ headers: { "ngrok-skip-browser-warning": 69420 }, httpsAgent }
|
||||||
);
|
);
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,99 @@
|
||||||
|
// contexts/ToastContext.tsx
|
||||||
|
import React, { createContext, useContext, useState, ReactNode } from 'react';
|
||||||
|
|
||||||
|
interface Toast {
|
||||||
|
id: number;
|
||||||
|
message: string;
|
||||||
|
type: 'success' | 'error' | 'info' | 'warning';
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ToastContextType {
|
||||||
|
showToast: (message: string, type?: Toast['type']) => void;
|
||||||
|
hideToast: (id: number) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ToastContext = createContext<ToastContextType | undefined>(undefined);
|
||||||
|
|
||||||
|
export const ToastProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
|
||||||
|
const [toasts, setToasts] = useState<Toast[]>([]);
|
||||||
|
|
||||||
|
const showToast = (message: string, type: Toast['type'] = 'success') => {
|
||||||
|
const id = Date.now();
|
||||||
|
setToasts(prev => [...prev, { id, message, type }]);
|
||||||
|
|
||||||
|
// Auto remove after 5 seconds
|
||||||
|
setTimeout(() => {
|
||||||
|
hideToast(id);
|
||||||
|
}, 3000);
|
||||||
|
};
|
||||||
|
|
||||||
|
const hideToast = (id: number) => {
|
||||||
|
setToasts(prev => prev.filter(toast => toast.id !== id));
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ToastContext.Provider value={{ showToast, hideToast }}>
|
||||||
|
{children}
|
||||||
|
<ToastContainer toasts={toasts} hideToast={hideToast} />
|
||||||
|
</ToastContext.Provider>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const useToast = () => {
|
||||||
|
const context = useContext(ToastContext);
|
||||||
|
if (!context) {
|
||||||
|
throw new Error('useToast must be used within a ToastProvider');
|
||||||
|
}
|
||||||
|
return context;
|
||||||
|
};
|
||||||
|
|
||||||
|
const ToastContainer: React.FC<{
|
||||||
|
toasts: Toast[];
|
||||||
|
hideToast: (id: number) => void;
|
||||||
|
}> = ({ toasts, hideToast }) => {
|
||||||
|
const getTypeStyles = (type: Toast['type']) => {
|
||||||
|
switch (type) {
|
||||||
|
case 'success':
|
||||||
|
return 'bg-success text-success-content';
|
||||||
|
case 'error':
|
||||||
|
return 'bg-error text-error-content';
|
||||||
|
case 'warning':
|
||||||
|
return 'bg-warning text-warning-content';
|
||||||
|
case 'info':
|
||||||
|
return 'bg-info text-info-content';
|
||||||
|
default:
|
||||||
|
return 'bg-neutral text-neutral-content';
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="toast toast-center toast-top z-2000">
|
||||||
|
{toasts.map((toast) => (
|
||||||
|
<div
|
||||||
|
key={toast.id}
|
||||||
|
className="w-full max-w-md px-2 mb-2"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`alert ${getTypeStyles(toast.type)} shadow-lg flex items-start`}
|
||||||
|
onClick={() => hideToast(toast.id)}
|
||||||
|
>
|
||||||
|
<div className="flex-grow min-w-0">
|
||||||
|
<p className="text-sm break-words whitespace-pre-wrap">
|
||||||
|
{toast.message}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<button
|
||||||
|
className="btn btn-ghost btn-xs flex-shrink-0 ml-2"
|
||||||
|
onClick={(e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
hideToast(toast.id);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
✕
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
@ -588,7 +588,7 @@ const DashboardLayout = () => {
|
||||||
if (!selectedProject?.projectId) return
|
if (!selectedProject?.projectId) return
|
||||||
|
|
||||||
console.log(selectedProject?.projectId, "SelectedProject ID")
|
console.log(selectedProject?.projectId, "SelectedProject ID")
|
||||||
socketRef.current = io("https://quality-friendly-goldfish.ngrok-free.app", {
|
socketRef.current = io("https://daniela-nonprofessed-boastfully.ngrok-free.app", {
|
||||||
transports: ["websocket"],
|
transports: ["websocket"],
|
||||||
secure: true,
|
secure: true,
|
||||||
rejectUnauthorized: false,
|
rejectUnauthorized: false,
|
||||||
|
|
|
||||||
|
|
@ -4,9 +4,12 @@ import App from './App'
|
||||||
import './index.css'
|
import './index.css'
|
||||||
import { Provider } from "react-redux";
|
import { Provider } from "react-redux";
|
||||||
import { store } from "./store";
|
import { store } from "./store";
|
||||||
|
import { ToastProvider } from './helper/ToastContext';
|
||||||
|
|
||||||
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
|
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<App />
|
<ToastProvider>
|
||||||
|
<App />
|
||||||
|
</ToastProvider>
|
||||||
</Provider>
|
</Provider>
|
||||||
)
|
)
|
||||||
|
|
|
||||||
|
|
@ -133,7 +133,7 @@ const Dashboard: React.FC = () => {
|
||||||
try {
|
try {
|
||||||
console.log("📡 Fetching projects...Dashboard");
|
console.log("📡 Fetching projects...Dashboard");
|
||||||
const res = await window.electron.getProjectList();
|
const res = await window.electron.getProjectList();
|
||||||
console.log(" Project list response in dashboard:", res);
|
console.log(" Project list response in dashboard: ", res.data?.[0]);
|
||||||
|
|
||||||
if (res?.success && Array.isArray(res.data)) {
|
if (res?.success && Array.isArray(res.data)) {
|
||||||
// Store data redux store
|
// Store data redux store
|
||||||
|
|
@ -152,9 +152,11 @@ const Dashboard: React.FC = () => {
|
||||||
);
|
);
|
||||||
|
|
||||||
// Auto-select first project
|
// Auto-select first project
|
||||||
if (res.data.length > 0 && !selectedProject) {
|
if (res.data.length > 0) {
|
||||||
const firstProject = res.data[0];
|
const firstProject = res.data[0];
|
||||||
|
|
||||||
|
|
||||||
|
console.log("Line 158" , firstProject)
|
||||||
// Select the project
|
// Select the project
|
||||||
dispatch(setSelectedProjectSlice(firstProject));
|
dispatch(setSelectedProjectSlice(firstProject));
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ import { quillModules } from '../../../utils/quillConfig';
|
||||||
import Quill from 'quill';
|
import Quill from 'quill';
|
||||||
import 'quill/dist/quill.snow.css';
|
import 'quill/dist/quill.snow.css';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import { useToast } from '../../../helper/ToastContext';
|
||||||
|
|
||||||
interface Project {
|
interface Project {
|
||||||
projectId: string;
|
projectId: string;
|
||||||
|
|
@ -50,6 +51,7 @@ const AdjustmentTab: React.FC<AdjustmentTabProps> = ({ projects }) => {
|
||||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||||
const quillRef = useRef<any>(null);
|
const quillRef = useRef<any>(null);
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
|
const { showToast } = useToast();
|
||||||
|
|
||||||
// Field validation functions
|
// Field validation functions
|
||||||
const validateProjectId = (projectId: string): string | undefined => {
|
const validateProjectId = (projectId: string): string | undefined => {
|
||||||
|
|
@ -460,9 +462,14 @@ const AdjustmentTab: React.FC<AdjustmentTabProps> = ({ projects }) => {
|
||||||
|
|
||||||
if (res?.success) {
|
if (res?.success) {
|
||||||
console.log("Timesheet Created Successfully");
|
console.log("Timesheet Created Successfully");
|
||||||
alert(res.message);
|
|
||||||
resetForm();
|
resetForm();
|
||||||
navigate('/dashboard/leave-adjustments')
|
// Show success toast instead of alert
|
||||||
|
showToast("PTO Request submitted successfully!", "success");
|
||||||
|
|
||||||
|
// Navigate after a small delay
|
||||||
|
setTimeout(() => {
|
||||||
|
navigate('/dashboard/leave-adjustments');
|
||||||
|
}, 300);
|
||||||
} else {
|
} else {
|
||||||
setFormErrors(prev => ({
|
setFormErrors(prev => ({
|
||||||
...prev,
|
...prev,
|
||||||
|
|
@ -475,6 +482,7 @@ const AdjustmentTab: React.FC<AdjustmentTabProps> = ({ projects }) => {
|
||||||
...prev,
|
...prev,
|
||||||
general: err.message || "Something went wrong while saving timesheet"
|
general: err.message || "Something went wrong while saving timesheet"
|
||||||
}));
|
}));
|
||||||
|
showToast(err.message || "Something went wrong while saving timesheet", "error");
|
||||||
} finally {
|
} finally {
|
||||||
setIsSubmitting(false);
|
setIsSubmitting(false);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ import ReactQuill from "react-quill-new";
|
||||||
import Quill from "quill";
|
import Quill from "quill";
|
||||||
import "quill/dist/quill.snow.css";
|
import "quill/dist/quill.snow.css";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
|
import { useToast } from "../../../helper/ToastContext";
|
||||||
|
|
||||||
interface LeaveFormData {
|
interface LeaveFormData {
|
||||||
fromDate: string;
|
fromDate: string;
|
||||||
|
|
@ -26,6 +27,9 @@ const PtoLeaveTab: React.FC<{
|
||||||
const quillRef = useRef<any>(null);
|
const quillRef = useRef<any>(null);
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
|
|
||||||
|
const { showToast } = useToast();
|
||||||
|
|
||||||
|
console.log("ptoLeave", ptoLeave)
|
||||||
const [errors, setErrors] = useState<Partial<LeaveFormData>>({});
|
const [errors, setErrors] = useState<Partial<LeaveFormData>>({});
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -200,11 +204,18 @@ const PtoLeaveTab: React.FC<{
|
||||||
|
|
||||||
if (result.success) {
|
if (result.success) {
|
||||||
resetForm();
|
resetForm();
|
||||||
alert("PTO Request submitted!");
|
// Show success toast instead of alert
|
||||||
navigate('/dashboard/leave-adjustments')
|
showToast("PTO Request submitted successfully!", "success");
|
||||||
|
|
||||||
|
// Navigate after a small delay
|
||||||
|
setTimeout(() => {
|
||||||
|
navigate('/dashboard/leave-adjustments');
|
||||||
|
}, 300);
|
||||||
} else {
|
} else {
|
||||||
setServerError(result.message || "Something went wrong");
|
setServerError(result.message || "Something went wrong");
|
||||||
|
showToast(result.message || "Failed to submit PTO request", "error");
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
@ -213,7 +224,6 @@ const PtoLeaveTab: React.FC<{
|
||||||
<div className="max-w-4xl space-y-3 ">
|
<div className="max-w-4xl space-y-3 ">
|
||||||
<div className="grid grid-cols-2 gap-4">
|
<div className="grid grid-cols-2 gap-4">
|
||||||
|
|
||||||
|
|
||||||
{/* From Date */}
|
{/* From Date */}
|
||||||
<div className="form-control">
|
<div className="form-control">
|
||||||
<label className="label">
|
<label className="label">
|
||||||
|
|
@ -262,12 +272,12 @@ const PtoLeaveTab: React.FC<{
|
||||||
className="h-60"
|
className="h-60"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
{errors.comment && <p className="text-error text-xs">{errors.comment}</p>}
|
{errors.comment && <p className="text-error text-xs">{errors.comment}</p>}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{serverError && (
|
{serverError && (
|
||||||
<p className="text-red-500 font-medium text-center text-xs">{serverError}</p>
|
<p className="text-red-500 font-medium text-center text-xs">{serverError}</p>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<button
|
<button
|
||||||
onClick={handleSubmit}
|
onClick={handleSubmit}
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,7 @@ import ReactQuill from "react-quill-new";
|
||||||
import Quill from "quill";
|
import Quill from "quill";
|
||||||
import "quill/dist/quill.snow.css"; // correct CSS
|
import "quill/dist/quill.snow.css"; // correct CSS
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
import { useToast } from '../../../helper/ToastContext';
|
||||||
|
|
||||||
interface LeaveFormData {
|
interface LeaveFormData {
|
||||||
fromDate: string;
|
fromDate: string;
|
||||||
|
|
@ -24,6 +25,7 @@ const SickLeaveTab: React.FC<{
|
||||||
const quillRef = useRef<any>(null);
|
const quillRef = useRef<any>(null);
|
||||||
const [sickErrors, setSickErrors] = useState<Partial<LeaveFormData>>({});
|
const [sickErrors, setSickErrors] = useState<Partial<LeaveFormData>>({});
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
|
const { showToast } = useToast();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const editor = quillRef.current?.getEditor();
|
const editor = quillRef.current?.getEditor();
|
||||||
|
|
@ -216,10 +218,16 @@ const SickLeaveTab: React.FC<{
|
||||||
|
|
||||||
if (result.success) {
|
if (result.success) {
|
||||||
resetForm();
|
resetForm();
|
||||||
alert("SICK leave applied!");
|
// Show success toast instead of alert
|
||||||
navigate('/dashboard/leave-adjustments')
|
showToast("SICK Request submitted successfully!", "success");
|
||||||
|
|
||||||
|
// Navigate after a small delay
|
||||||
|
setTimeout(() => {
|
||||||
|
navigate('/dashboard/leave-adjustments');
|
||||||
|
}, 300);
|
||||||
} else {
|
} else {
|
||||||
setServerError(result.message || "Something went wrong");
|
setServerError(result.message || "Something went wrong");
|
||||||
|
showToast(result.message || "Failed to submit SICK request", "error");
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -126,6 +126,17 @@ const Settings: React.FC = () => {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{profile?.wiseEmail&& (
|
||||||
|
<div className="p-2 rounded bg-base-200/40">
|
||||||
|
<p className="text-xs text-base-content/60 flex items-center gap-1 mb-0.5">
|
||||||
|
🏦 Wise Email
|
||||||
|
</p>
|
||||||
|
<p className="text-xs font-medium truncate" title={profile?.veemAccount || "N/A"}>
|
||||||
|
{profile?.wiseEmail || "N/A"}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* Location - Full Width */}
|
{/* Location - Full Width */}
|
||||||
<div className="p-2 rounded bg-base-200/40 col-span-2 sm:col-span-3">
|
<div className="p-2 rounded bg-base-200/40 col-span-2 sm:col-span-3">
|
||||||
<p className="text-xs text-base-content/60 flex items-center gap-1 mb-0.5">
|
<p className="text-xs text-base-content/60 flex items-center gap-1 mb-0.5">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue