Commit 2ddcb28d by Arjun Jhukal

updated the private checkout and other and changed the solution from session to cookie

parent 0ace8a5b
// app/buy-coins/[slug]/success/page.tsx
"use client"
import GlassWrapper from '@/components/molecules/GlassWrapper'
import { restoreAuthFromCookies } from '@/utils/authSession'
import Image from 'next/image'
import Link from 'next/link'
import { useParams } from 'next/navigation'
import { useEffect, useState } from 'react'
export default function PaymentSuccess() {
const params = useParams();
const slug = params?.slug as string;
const [isReady, setIsReady] = useState(false);
useEffect(() => {
const wasRestored = restoreAuthFromCookies();
if (wasRestored) {
window.location.reload();
return;
}
setIsReady(true);
}, []);
if (!isReady) {
return (
<div className="flex items-center justify-center min-h-[200px]">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-white"></div>
</div>
);
}
return (
<GlassWrapper className="max-w-[520px] mx-auto flex flex-col gap-3 items-center text-center p-6">
<Image
......
......@@ -6,6 +6,7 @@ import BitCoinIcon from '@/icons/BitCoinIcon';
import GoldCoinIcon from '@/icons/GoldCoinIcon';
import { useDepositMutation } from '@/services/transaction';
import { showToast, ToastVariant } from '@/slice/toastSlice';
import { backupAuthToCookies, restoreAuthFromCookies } from '@/utils/authSession';
import { Box, Button } from '@mui/material';
import { Card, TickCircle } from '@wandersonalwes/iconsax-react';
import Image from 'next/image';
......@@ -14,37 +15,7 @@ import PaymentForm from './FortPay';
export type PaymentModeProps = "crypto" | "fortpay"
const AUTH_KEYS = ['token', 'access_token', 'authToken', 'user', 'refresh_token'];
const BACKUP_PREFIX = '__payment_backup__';
function backupAuthToSession() {
AUTH_KEYS.forEach((key) => {
const value = localStorage.getItem(key);
if (value !== null) {
sessionStorage.setItem(`${BACKUP_PREFIX}${key}`, value);
}
});
sessionStorage.setItem(`${BACKUP_PREFIX}redirected`, 'true');
}
function restoreAuthFromSession() {
const wasRedirected = sessionStorage.getItem(`${BACKUP_PREFIX}redirected`);
if (!wasRedirected) return;
AUTH_KEYS.forEach((key) => {
const backup = sessionStorage.getItem(`${BACKUP_PREFIX}${key}`);
if (backup !== null) {
if (localStorage.getItem(key) === null) {
localStorage.setItem(key, backup);
}
}
});
AUTH_KEYS.forEach((key) => {
sessionStorage.removeItem(`${BACKUP_PREFIX}${key}`);
});
sessionStorage.removeItem(`${BACKUP_PREFIX}redirected`);
}
export default function CheckoutPage({ amount, slug, bonus }: {
amount: number;
......@@ -56,7 +27,7 @@ export default function CheckoutPage({ amount, slug, bonus }: {
const [currentPaymentMode, setCurrentPaymentMode] = React.useState("crypto");
useEffect(() => {
restoreAuthFromSession();
restoreAuthFromCookies();
}, []);
return (
......@@ -161,10 +132,8 @@ export default function CheckoutPage({ amount, slug, bonus }: {
type: currentPaymentMode as PaymentModeProps
}).unwrap();
backupAuthToSession();
backupAuthToCookies();
window.open(response?.data?.payment_url, "_blank");
// window.location.href = response?.data?.payment_url;
} catch (e: any) {
dispatch(
......
// components/Private.tsx
"use client";
import { useAppDispatch, useAppSelector } from "@/hooks/hook";
import { clearTokens, setTokens } from "@/slice/authSlice";
import { restoreAuthFromCookies } from "@/utils/authSession";
import Cookies from "js-cookie";
import { useRouter } from "next/navigation";
import React, { useEffect } from "react";
import React, { useEffect, useState } from "react";
function isTokenExpired(token: string): boolean {
try {
......@@ -22,33 +25,50 @@ function isTokenExpired(token: string): boolean {
export default function Private({ children }: { children: React.ReactNode }) {
const router = useRouter();
const dispatch = useAppDispatch();
const [isHydrating, setIsHydrating] = useState(true);
const user = useAppSelector((state) => state.auth.user);
const token = useAppSelector((state) => state.auth.access_token);
useEffect(() => {
// First, try to restore auth from cookies (for payment redirects)
const wasRestored = restoreAuthFromCookies();
if (wasRestored) {
window.location.reload();
return;
}
const accessToken = token || Cookies.get("access_token");
if (!accessToken || isTokenExpired(accessToken)) {
dispatch(clearTokens());
// router.replace("/");
setIsHydrating(false);
return;
}
// ✅ optional: if Redux was empty, rehydrate it from cookie
if (!token && accessToken) {
dispatch(setTokens({ access_token: accessToken, user: user || null }));
}
// if (!user) {
// router.replace("/");
// }
setIsHydrating(false);
}, [token, user, dispatch, router]);
if (!user) return null;
if (isHydrating) {
return (
<div className="flex items-center justify-center min-h-[200px]">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-white"></div>
</div>
);
}
if (!user) {
return (
<div className="flex items-center justify-center min-h-[200px] text-white">
<p>User Not Found. Please log in again.</p>
</div>
);
}
return <>{children}</>;
}
\ No newline at end of file
// utils/authSession.ts
import Cookies from 'js-cookie';
const AUTH_KEYS = ['token', 'access_token', 'authToken', 'user', 'refresh_token'];
const BACKUP_PREFIX = '__payment_backup__';
const COOKIE_EXPIRY = 1 / 24; // 1 hour (in days)
export function backupAuthToCookies() {
if (typeof window === 'undefined') return;
AUTH_KEYS.forEach((key) => {
const value = localStorage.getItem(key);
if (value !== null) {
// Store in cookie with 1 hour expiry
Cookies.set(`${BACKUP_PREFIX}${key}`, value, {
expires: COOKIE_EXPIRY,
secure: true,
sameSite: 'lax'
});
}
});
Cookies.set(`${BACKUP_PREFIX}redirected`, 'true', {
expires: COOKIE_EXPIRY,
secure: true,
sameSite: 'lax'
});
}
export function restoreAuthFromCookies(): boolean {
if (typeof window === 'undefined') return false;
const wasRedirected = Cookies.get(`${BACKUP_PREFIX}redirected`);
if (!wasRedirected) return false;
let restored = false;
AUTH_KEYS.forEach((key) => {
const backup = Cookies.get(`${BACKUP_PREFIX}${key}`);
if (backup !== undefined && backup !== null) {
if (localStorage.getItem(key) === null) {
localStorage.setItem(key, backup);
restored = true;
}
}
});
// Clean up cookies
AUTH_KEYS.forEach((key) => {
Cookies.remove(`${BACKUP_PREFIX}${key}`);
});
Cookies.remove(`${BACKUP_PREFIX}redirected`);
return restored;
}
export function clearAuthBackup() {
if (typeof window === 'undefined') return;
AUTH_KEYS.forEach((key) => {
Cookies.remove(`${BACKUP_PREFIX}${key}`);
});
Cookies.remove(`${BACKUP_PREFIX}redirected`);
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment