salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

stlyes fixes

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2025-12-29 19:52:51 +00:00
parent c91175fdcb
commit 4f7ab9c606
155 changed files with 1576 additions and 2489 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/components/auth/ProtectedRoute.tsx
View File

@@ -93,8 +93,8 @@ export default function ProtectedRoute({ children }: ProtectedRouteProps) {
</p>
{showError && (
<div className="mt-4 p-4 bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 rounded-lg">
<p className="text-sm text-yellow-800 dark:text-yellow-200 mb-3">
<div className="mt-4 p-4 bg-warning-50 dark:bg-warning-900/20 border border-warning-200 dark:border-warning-800 rounded-lg">
<p className="text-sm text-warning-800 dark:text-warning-200 mb-3">
{errorMessage}
</p>
<button
@@ -103,7 +103,7 @@ export default function ProtectedRoute({ children }: ProtectedRouteProps) {
setShowError(false);
window.location.reload();
}}
className="px-4 py-2 text-sm bg-yellow-600 text-white rounded hover:bg-yellow-700"
className="px-4 py-2 text-sm bg-warning-600 text-white rounded hover:bg-warning-700"
>
Retry or Reload Page
</button>

38
frontend/src/components/auth/SignInForm.tsx
View File

@@ -169,22 +169,22 @@ export default function SignInForm() {
<div className="space-y-6">
{/* Logout Reason Display */}
{logoutReason && (
<div className="p-4 bg-yellow-50 border border-yellow-200 rounded-lg dark:bg-yellow-900/20 dark:border-yellow-800">
<div className="p-4 bg-warning-50 border border-warning-200 rounded-lg dark:bg-warning-900/20 dark:border-warning-800">
<div className="flex items-start justify-between">
<div className="flex-1">
<div className="flex items-center gap-2 mb-2">
<svg className="w-5 h-5 text-yellow-600 dark:text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
<svg className="w-5 h-5 text-warning-600 dark:text-warning-400" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clipRule="evenodd" />
</svg>
<h4 className="font-semibold text-yellow-800 dark:text-yellow-300">
<h4 className="font-semibold text-warning-800 dark:text-warning-300">
Session Ended
</h4>
</div>
<p className="text-sm text-yellow-700 dark:text-yellow-400 mb-2">
<p className="text-sm text-warning-700 dark:text-warning-400 mb-2">
{logoutReason.message}
</p>
{logoutReason.path && logoutReason.path !== '/signin' && (
<p className="text-xs text-yellow-600 dark:text-yellow-500">
<p className="text-xs text-warning-600 dark:text-warning-500">
Original page: <span className="font-mono">{logoutReason.path}</span>
</p>
)}
@@ -192,7 +192,7 @@ export default function SignInForm() {
<button
type="button"
onClick={() => setShowLogoutDetails(!showLogoutDetails)}
className="ml-2 p-1 text-yellow-600 hover:text-yellow-800 dark:text-yellow-400 dark:hover:text-yellow-300"
className="ml-2 p-1 text-warning-600 hover:text-warning-800 dark:text-warning-400 dark:hover:text-warning-300"
title="Toggle technical details"
>
<svg className="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
@@ -203,18 +203,18 @@ export default function SignInForm() {
{/* Expandable Technical Details */}
{showLogoutDetails && (
<div className="mt-3 pt-3 border-t border-yellow-300 dark:border-yellow-700">
<p className="text-xs font-semibold text-yellow-800 dark:text-yellow-300 mb-2">
<div className="mt-3 pt-3 border-t border-warning-300 dark:border-warning-700">
<p className="text-xs font-semibold text-warning-800 dark:text-warning-300 mb-2">
Technical Details:
</p>
<div className="space-y-1 text-xs font-mono text-yellow-700 dark:text-yellow-400">
<div className="space-y-1 text-xs font-mono text-warning-700 dark:text-warning-400">
<div><span className="font-bold">Code:</span> {logoutReason.code}</div>
<div><span className="font-bold">Source:</span> {logoutReason.source}</div>
<div><span className="font-bold">Time:</span> {new Date(logoutReason.timestamp).toLocaleString()}</div>
{logoutReason.context && Object.keys(logoutReason.context).length > 0 && (
<div className="mt-2">
<span className="font-bold">Context:</span>
<pre className="mt-1 p-2 bg-yellow-100 dark:bg-yellow-900/30 rounded text-xs overflow-x-auto">
<pre className="mt-1 p-2 bg-warning-100 dark:bg-warning-900/30 rounded text-xs overflow-x-auto">
{JSON.stringify(logoutReason.context, null, 2)}
</pre>
</div>
@@ -227,22 +227,22 @@ export default function SignInForm() {
{/* Session Conflict Alert */}
{sessionConflict && (
<div className="p-4 bg-orange-50 border border-orange-200 rounded-lg dark:bg-orange-900/20 dark:border-orange-800">
<div className="p-4 bg-warning-50 border border-warning-200 rounded-lg dark:bg-warning-900/20 dark:border-warning-800">
<div className="flex items-center gap-2 mb-3">
<svg className="w-5 h-5 text-orange-600 dark:text-orange-400" fill="currentColor" viewBox="0 0 20 20">
<svg className="w-5 h-5 text-warning-600 dark:text-warning-400" fill="currentColor" viewBox="0 0 20 20">
<path fillRule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z" clipRule="evenodd" />
</svg>
<h4 className="font-semibold text-orange-800 dark:text-orange-300">
<h4 className="font-semibold text-warning-800 dark:text-warning-300">
Active Session Detected
</h4>
</div>
<p className="text-sm text-orange-700 dark:text-orange-400 mb-2">
<p className="text-sm text-warning-700 dark:text-warning-400 mb-2">
You have an active session for:
</p>
<p className="text-sm font-semibold text-orange-800 dark:text-orange-300 mb-3">
<p className="text-sm font-semibold text-warning-800 dark:text-warning-300 mb-3">
{sessionConflict.existingUser.email}
</p>
<p className="text-sm text-orange-700 dark:text-orange-400 mb-4">
<p className="text-sm text-warning-700 dark:text-warning-400 mb-4">
You're trying to login as: <strong>{sessionConflict.requestedUser.email}</strong>
</p>
<div className="flex gap-3">
@@ -250,14 +250,14 @@ export default function SignInForm() {
type="button"
onClick={handleForceLogout}
disabled={loading}
className="flex-1 px-4 py-2 text-sm font-medium text-white bg-orange-600 rounded-lg hover:bg-orange-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
className="flex-1 px-4 py-2 text-sm font-medium text-white bg-warning-600 rounded-lg hover:bg-warning-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
>
{loading ? 'Logging out...' : 'Logout Previous & Continue'}
</button>
<button
type="button"
onClick={() => setSessionConflict(null)}
className="flex-1 px-4 py-2 text-sm font-medium text-orange-700 bg-orange-100 rounded-lg hover:bg-orange-200 dark:bg-orange-900/40 dark:text-orange-300 dark:hover:bg-orange-900/60 transition-colors"
className="flex-1 px-4 py-2 text-sm font-medium text-warning-700 bg-warning-100 rounded-lg hover:bg-warning-200 dark:bg-warning-900/40 dark:text-warning-300 dark:hover:bg-warning-900/60 transition-colors"
>
Cancel
</button>
@@ -266,7 +266,7 @@ export default function SignInForm() {
)}
{error && (
<div className="p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg dark:bg-red-900/20 dark:text-red-400 dark:border-red-800">
<div className="p-3 text-sm text-error-600 bg-error-50 border border-error-200 rounded-lg dark:bg-error-900/20 dark:text-error-400 dark:border-error-800">
{error}
</div>
)}

2
frontend/src/components/auth/SignUpForm.tsx
View File

@@ -188,7 +188,7 @@ export default function SignUpForm({ planDetails: planDetailsProp, planLoading:
<form onSubmit={handleSubmit}>
<div className="space-y-5">
{error && (
<div className="p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg dark:bg-red-900/20 dark:text-red-400 dark:border-red-800">
<div className="p-3 text-sm text-error-600 bg-error-50 border border-error-200 rounded-lg dark:bg-error-900/20 dark:text-error-400 dark:border-error-800">
{error}
</div>
)}

6
frontend/src/components/auth/SignUpFormEnhanced.tsx
View File

@@ -231,7 +231,7 @@ export default function SignUpFormEnhanced({ planDetails: planDetailsProp, planL
${step === currentStep
? 'bg-brand-500 text-white'
: step < currentStep
? 'bg-green-500 text-white'
? 'bg-success-500 text-white'
: 'bg-gray-200 text-gray-600 dark:bg-gray-700 dark:text-gray-400'
}
`}
@@ -245,7 +245,7 @@ export default function SignUpFormEnhanced({ planDetails: planDetailsProp, planL
</div>
</div>
{step < 3 && (
<div className={`flex-1 h-0.5 mx-4 ${step < currentStep ? 'bg-green-500' : 'bg-gray-200 dark:bg-gray-700'}`} />
<div className={`flex-1 h-0.5 mx-4 ${step < currentStep ? 'bg-success-500' : 'bg-gray-200 dark:bg-gray-700'}`} />
)}
</div>
))}
@@ -282,7 +282,7 @@ export default function SignUpFormEnhanced({ planDetails: planDetailsProp, planL
{renderStepIndicator()}
{error && (
<div className="mb-4 p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg dark:bg-red-900/20 dark:text-red-400 dark:border-red-800">
<div className="mb-4 p-3 text-sm text-error-600 bg-error-50 border border-error-200 rounded-lg dark:bg-error-900/20 dark:text-error-400 dark:border-error-800">
{error}
</div>
)}

4
frontend/src/components/auth/SignUpFormSimplified.tsx
View File

@@ -231,7 +231,7 @@ export default function SignUpFormSimplified({ planDetails: planDetailsProp, pla
</div>
{error && (
<div className="mb-4 p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg dark:bg-red-900/20 dark:text-red-400 dark:border-red-800">
<div className="mb-4 p-3 text-sm text-error-600 bg-error-50 border border-error-200 rounded-lg dark:bg-error-900/20 dark:text-error-400 dark:border-error-800">
{error}
</div>
)}
@@ -357,7 +357,7 @@ export default function SignUpFormSimplified({ planDetails: planDetailsProp, pla
<span className="text-sm text-gray-600 dark:text-gray-400">Loading payment options...</span>
</div>
) : paymentMethods.length === 0 ? (
<div className="p-4 bg-amber-50 border border-amber-200 rounded-lg text-amber-800 dark:bg-amber-900/20 dark:border-amber-800 dark:text-amber-200">
<div className="p-4 bg-warning-50 border border-warning-200 rounded-lg text-warning-800 dark:bg-warning-900/20 dark:border-warning-800 dark:text-warning-200">
<p className="text-sm">No payment methods available. Please contact support.</p>
</div>
) : (

12
frontend/src/components/auth/SignUpFormUnified.tsx
View File

@@ -305,7 +305,7 @@ export default function SignUpFormUnified({
</button>
</div>
<div className="h-6 flex items-center justify-center">
<span className={`inline-flex items-center gap-1.5 text-xs text-green-600 dark:text-green-400 font-semibold bg-green-50 dark:bg-green-900/20 px-2 py-1 rounded-full transition-opacity duration-200 ${
<span className={`inline-flex items-center gap-1.5 text-xs text-success-600 dark:text-success-400 font-semibold bg-success-50 dark:bg-success-900/20 px-2 py-1 rounded-full transition-opacity duration-200 ${
billingPeriod === 'annually' ? 'opacity-100' : 'opacity-0'
}`}>
<svg className="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -374,7 +374,7 @@ export default function SignUpFormUnified({
</div>
{error && (
<div className="mb-4 p-3 text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg dark:bg-red-900/20 dark:text-red-400 dark:border-red-800">
<div className="mb-4 p-3 text-sm text-error-600 bg-error-50 border border-error-200 rounded-lg dark:bg-error-900/20 dark:text-error-400 dark:border-error-800">
{error}
</div>
)}
@@ -453,7 +453,7 @@ export default function SignUpFormUnified({
<Loader2 className="w-4 h-4 animate-spin text-brand-500" />
</div>
) : paymentMethods.length === 0 ? (
<div className="p-3 bg-amber-50 border border-amber-200 rounded-lg text-amber-800 dark:bg-amber-900/20 dark:border-amber-800 dark:text-amber-200">
<div className="p-3 bg-warning-50 border border-warning-200 rounded-lg text-warning-800 dark:bg-warning-900/20 dark:border-warning-800 dark:text-warning-200">
<p className="text-xs">No payment methods available</p>
</div>
) : (
@@ -565,7 +565,7 @@ export default function SignUpFormUnified({
</button>
</div>
<div className="h-7 flex items-center justify-center">
<p className={`inline-flex items-center gap-1.5 text-green-600 dark:text-green-400 text-sm font-semibold bg-green-50 dark:bg-green-900/20 px-3 py-1.5 rounded-full transition-opacity duration-200 ${
<p className={`inline-flex items-center gap-1.5 text-success-600 dark:text-success-400 text-sm font-semibold bg-success-50 dark:bg-success-900/20 px-3 py-1.5 rounded-full transition-opacity duration-200 ${
billingPeriod === 'annually' ? 'opacity-100' : 'opacity-0'
}`}>
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -599,7 +599,7 @@ export default function SignUpFormUnified({
>
{isPopular && !isSelected && (
<div className="absolute -top-3 left-1/2 -translate-x-1/2">
<span className="bg-gradient-to-r from-green-500 to-emerald-500 text-white text-xs font-bold px-3 py-1 rounded-full shadow-lg">
<span className="bg-gradient-to-r from-success-500 to-success-500 text-white text-xs font-bold px-3 py-1 rounded-full shadow-lg">
⭐ POPULAR
</span>
</div>
@@ -638,7 +638,7 @@ export default function SignUpFormUnified({
<div className="flex-1 grid grid-cols-2 gap-x-6 gap-y-2.5">
{features.map((feature, idx) => (
<div key={idx} className="flex items-center gap-2">
<CheckCircle className="w-4 h-4 text-green-500 dark:text-green-400 flex-shrink-0" />
<CheckCircle className="w-4 h-4 text-success-500 dark:text-success-400 flex-shrink-0" />
<span className="text-sm text-gray-700 dark:text-gray-300 leading-tight">{feature}</span>
</div>
))}