sarlink/sarlink-portal
7
0
Fork 0
mirror of https://github.com/i701/sarlink-portal.git synced 2025-07-28 17:20:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

add admin checks for admin pages and run biome formating 🔨
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 11m8s
Details

Browse Source
This commit is contained in:
i701
2025-07-25 13:31:12 +05:00
parent aedf7cdf7d
commit 9b2f2c1528
127 changed files with 6577 additions and 6334 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
components/billing/expiry-time-countdown.tsx
View File

@ -1,57 +1,67 @@
'use client'
import { usePathname, useRouter } from 'next/navigation'
import { useEffect, useState } from 'react'
import { Progress } from '@/components/ui/progress'
"use client";
import { usePathname, useRouter } from "next/navigation";
import { useEffect, useState } from "react";
import { Progress } from "@/components/ui/progress";
const calculateTimeLeft = (expiresAt: string) => {
const now = Date.now()
const expirationTime = new Date(expiresAt).getTime()
return Math.max(0, Math.floor((expirationTime - now) / 1000))
}
const now = Date.now();
const expirationTime = new Date(expiresAt).getTime();
return Math.max(0, Math.floor((expirationTime - now) / 1000));
};
const HumanizeTimeLeft = (seconds: number) => {
const minutes = Math.floor(seconds / 60)
const remainingSeconds = seconds % 60
return `${minutes}m ${remainingSeconds}s`
}
export default function ExpiryCountDown({ expiresAt, expiryLabel }: { expiresAt: string, expiryLabel: string }) {
const [timeLeft, setTimeLeft] = useState(calculateTimeLeft(expiresAt))
const [mounted, setMounted] = useState(false)
const router = useRouter()
const pathname = usePathname()
useEffect(() => {
setMounted(true)
}, [])
useEffect(() => {
const timer = setInterval(() => {
setTimeLeft(calculateTimeLeft(expiresAt))
}, 1000)
return () => clearInterval(timer)
}, [expiresAt])
useEffect(() => {
if (timeLeft <= 0) {
router.replace(pathname)
}
}, [timeLeft, router, pathname])
if (!mounted) {
return null
}
return (
<div className='overflow-clip relative mx-2 p-4 rounded-md border border-dashed flex items-center justify-between text-muted-foreground'>
<div className='absolute inset-0 title-bg mask-b-from-0' />
{timeLeft ? (
<span>Time left: {HumanizeTimeLeft(timeLeft)}</span>
) : (
<span>{expiryLabel} has expired.</span>
)}
{timeLeft > 0 && (
<Progress className='absolute bottom-0 left-0 right-0' color='#f49b5b' value={timeLeft / 600 * 100} />
)}
</div>
)
const minutes = Math.floor(seconds / 60);
const remainingSeconds = seconds % 60;
return `${minutes}m ${remainingSeconds}s`;
};
export default function ExpiryCountDown({
expiresAt,
expiryLabel,
}: {
expiresAt: string;
expiryLabel: string;
}) {
const [timeLeft, setTimeLeft] = useState(calculateTimeLeft(expiresAt));
const [mounted, setMounted] = useState(false);
const router = useRouter();
const pathname = usePathname();
useEffect(() => {
setMounted(true);
}, []);
useEffect(() => {
const timer = setInterval(() => {
setTimeLeft(calculateTimeLeft(expiresAt));
}, 1000);
return () => clearInterval(timer);
}, [expiresAt]);
useEffect(() => {
if (timeLeft <= 0) {
router.replace(pathname);
}
}, [timeLeft, router, pathname]);
if (!mounted) {
return null;
}
return (
<div className="overflow-clip relative mx-2 p-4 rounded-md border border-dashed flex items-center justify-between text-muted-foreground">
<div className="absolute inset-0 title-bg mask-b-from-0" />
{timeLeft ? (
<span>Time left: {HumanizeTimeLeft(timeLeft)}</span>
) : (
<span>{expiryLabel} has expired.</span>
)}
{timeLeft > 0 && (
<Progress
className="absolute bottom-0 left-0 right-0"
color="#f49b5b"
value={(timeLeft / 600) * 100}
/>
)}
</div>
);
}