🐛 fix(config): Runtime env

This commit is contained in:
web@ppanel 2024-12-08 12:59:14 +07:00
parent 55727103b8
commit a1e4999a2f
5 changed files with 52 additions and 60 deletions

View File

@ -1,8 +1,6 @@
import { Avatar, AvatarFallback, AvatarImage } from '@shadcn/ui/avatar'; import { Avatar, AvatarFallback, AvatarImage } from '@shadcn/ui/avatar';
import { Card, CardDescription, CardHeader, CardTitle } from '@shadcn/ui/card'; import { Card, CardDescription, CardHeader, CardTitle } from '@shadcn/ui/card';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@shadcn/ui/tooltip';
import { getTranslations } from 'next-intl/server'; import { getTranslations } from 'next-intl/server';
import Image from 'next/legacy/image';
import Link from 'next/link'; import Link from 'next/link';
const BASE_URL = 'https://cdn.jsdelivr.net/gh/perfect-panel/ppanel-assets/billing/index.json'; const BASE_URL = 'https://cdn.jsdelivr.net/gh/perfect-panel/ppanel-assets/billing/index.json';
@ -15,7 +13,6 @@ interface ItemType {
logo: string; logo: string;
title: string; title: string;
description: string; description: string;
poster: string;
expiryDate: string; expiryDate: string;
href: string; href: string;
} }
@ -37,37 +34,29 @@ export default async function Billing({ type }: BillingProps) {
} }
if (list && list.length === 0) return null; if (list && list.length === 0) return null;
return ( return (
<TooltipProvider> <>
<h1 className='text mt-2 font-bold'> <h1 className='text mt-2 font-bold'>
<span>{t('title')}</span> <span>{t('title')}</span>
<span className='text-muted-foreground ml-2 text-xs'>{t('description')}</span> <span className='text-muted-foreground ml-2 text-xs'>{t('description')}</span>
</h1> </h1>
<div className='grid gap-3 md:grid-cols-3 lg:grid-cols-6'> <div className='grid gap-3 md:grid-cols-3 lg:grid-cols-6'>
{list.map((item, index) => ( {list.map((item, index) => (
<Tooltip key={index}> <Link href={item.href} target='_blank' key={index}>
<TooltipTrigger asChild> <Card className='h-full cursor-pointer'>
<Link href={item.href} target='_blank'> <CardHeader className='flex flex-row gap-2 p-3'>
<Card className='cursor-pointer'> <Avatar>
<CardHeader className='flex flex-row items-center gap-2 p-3'> <AvatarImage src={item.logo} />
<Avatar> <AvatarFallback>{item.title}</AvatarFallback>
<AvatarImage src={item.logo} /> </Avatar>
<AvatarFallback>{item.title}</AvatarFallback> <div>
</Avatar> <CardTitle>{item.title}</CardTitle>
<div> <CardDescription className='mt-2'>{item.description}</CardDescription>
<CardTitle>{item.title}</CardTitle> </div>
<CardDescription className='line-clamp-3'>{item.description}</CardDescription> </CardHeader>
</div> </Card>
</CardHeader> </Link>
</Card>
</Link>
</TooltipTrigger>
<TooltipContent className='bg-muted text-muted-foreground'>
<p className='mb-1'>{item.description}</p>
<Image src={item.poster} width={400} height={300} unoptimized objectFit='cover' />
</TooltipContent>
</Tooltip>
))} ))}
</div> </div>
</TooltipProvider> </>
); );
} }

View File

@ -2,14 +2,7 @@
import { Icon } from '@iconify/react'; import { Icon } from '@iconify/react';
import { formatBytes, unitConversion } from '@repo/ui/utils'; import { formatBytes, unitConversion } from '@repo/ui/utils';
import { import { Card, CardContent, CardFooter, CardHeader, CardTitle } from '@shadcn/ui/card';
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from '@shadcn/ui/card';
import { import {
ChartConfig, ChartConfig,
ChartContainer, ChartContainer,
@ -119,12 +112,12 @@ export default function Statistics() {
return ( return (
<> <>
<h1 className='text-lg font-semibold'></h1> <h1 className='text-lg font-semibold'></h1>
<div className='grid grid-cols-2 gap-3 md:grid-cols-4 lg:grid-cols-8'> <div className='grid grid-cols-2 gap-3 md:grid-cols-4 xl:grid-cols-8'>
{[ {[
{ {
title: '在线IP数', title: '在线IP数',
value: '666', value: '666',
icon: 'uil:network-wired', icon: 'uil:users-alt',
onClick: () => console.log('在线IP数 clicked'), onClick: () => console.log('在线IP数 clicked'),
}, },
{ {
@ -171,13 +164,11 @@ export default function Statistics() {
}, },
].map((item, index) => ( ].map((item, index) => (
<Card key={index} onClick={item.onClick} className='cursor-pointer'> <Card key={index} onClick={item.onClick} className='cursor-pointer'>
<CardHeader className='flex flex-row items-center justify-between'> <CardHeader className='p-4'>
<CardTitle>{item.title}</CardTitle> <CardTitle>{item.title}</CardTitle>
<CardDescription>
<Icon icon={item.icon} className='text-2xl' />
</CardDescription>
</CardHeader> </CardHeader>
<CardContent> <CardContent className='flex justify-between p-4 text-xl'>
<Icon icon={item.icon} className='text-muted-foreground' />
<div className='text-xl font-bold tabular-nums leading-none'>{item.value}</div> <div className='text-xl font-bold tabular-nums leading-none'>{item.value}</div>
</CardContent> </CardContent>
</Card> </Card>

View File

@ -2,10 +2,13 @@ import { env } from 'next-runtime-env';
export const locales = ['en-US', 'zh-CN']; export const locales = ['en-US', 'zh-CN'];
export const NEXT_PUBLIC_DEFAULT_LANGUAGE = env('NEXT_PUBLIC_DEFAULT_LANGUAGE') || locales[0]; export const NEXT_PUBLIC_DEFAULT_LANGUAGE =
env('NEXT_PUBLIC_DEFAULT_LANGUAGE') || process.env.NEXT_PUBLIC_DEFAULT_LANGUAGE || locales[0];
export const NEXT_PUBLIC_SITE_URL = env('NEXT_PUBLIC_SITE_URL'); export const NEXT_PUBLIC_SITE_URL = env('NEXT_PUBLIC_SITE_URL') || process.env.NEXT_PUBLIC_SITE_URL;
export const NEXT_PUBLIC_API_URL = env('NEXT_PUBLIC_API_URL'); export const NEXT_PUBLIC_API_URL = env('NEXT_PUBLIC_API_URL') || process.env.NEXT_PUBLIC_API_URL;
export const NEXT_PUBLIC_DEFAULT_USER_EMAIL = env('NEXT_PUBLIC_DEFAULT_USER_EMAIL'); export const NEXT_PUBLIC_DEFAULT_USER_EMAIL =
export const NEXT_PUBLIC_DEFAULT_USER_PASSWORD = env('NEXT_PUBLIC_DEFAULT_USER_PASSWORD'); env('NEXT_PUBLIC_DEFAULT_USER_EMAIL') || process.env.NEXT_PUBLIC_DEFAULT_USER_EMAIL;
export const NEXT_PUBLIC_DEFAULT_USER_PASSWORD =
env('NEXT_PUBLIC_DEFAULT_USER_PASSWORD') || process.env.NEXT_PUBLIC_DEFAULT_USER_PASSWORD;

View File

@ -12,7 +12,7 @@ export function Empty() {
useEffect(() => { useEffect(() => {
const random = Math.floor(Math.random() * 10); const random = Math.floor(Math.random() * 10);
setDescription(t(`empty.${random}`)); setDescription(t(`empty.${random}`));
}, []); }, [t]);
return <_Empty description={description} />; return <_Empty description={description} />;
} }

View File

@ -2,19 +2,28 @@ import { env } from 'next-runtime-env';
export const locales = ['en-US', 'zh-CN']; export const locales = ['en-US', 'zh-CN'];
export const NEXT_PUBLIC_DEFAULT_LANGUAGE = env('NEXT_PUBLIC_DEFAULT_LANGUAGE') || locales[0]; export const NEXT_PUBLIC_DEFAULT_LANGUAGE =
env('NEXT_PUBLIC_DEFAULT_LANGUAGE') || process.env.NEXT_PUBLIC_DEFAULT_LANGUAGE || locales[0];
export const NEXT_PUBLIC_SITE_URL = env('NEXT_PUBLIC_SITE_URL'); export const NEXT_PUBLIC_SITE_URL = env('NEXT_PUBLIC_SITE_URL') || process.env.NEXT_PUBLIC_SITE_URL;
export const NEXT_PUBLIC_API_URL = env('NEXT_PUBLIC_API_URL'); export const NEXT_PUBLIC_API_URL = env('NEXT_PUBLIC_API_URL') || process.env.NEXT_PUBLIC_API_URL;
export const NEXT_PUBLIC_DEFAULT_USER_EMAIL = env('NEXT_PUBLIC_DEFAULT_USER_EMAIL'); export const NEXT_PUBLIC_DEFAULT_USER_EMAIL =
export const NEXT_PUBLIC_DEFAULT_USER_PASSWORD = env('NEXT_PUBLIC_DEFAULT_USER_PASSWORD'); env('NEXT_PUBLIC_DEFAULT_USER_EMAIL') || process.env.NEXT_PUBLIC_DEFAULT_USER_EMAIL;
export const NEXT_PUBLIC_DEFAULT_USER_PASSWORD =
env('NEXT_PUBLIC_DEFAULT_USER_PASSWORD') || process.env.NEXT_PUBLIC_DEFAULT_USER_PASSWORD;
export const NEXT_PUBLIC_EMAIL = env('NEXT_PUBLIC_EMAIL'); export const NEXT_PUBLIC_EMAIL = env('NEXT_PUBLIC_EMAIL') || process.env.NEXT_PUBLIC_EMAIL;
export const NEXT_PUBLIC_TELEGRAM_LINK = env('NEXT_PUBLIC_TELEGRAM_LINK'); export const NEXT_PUBLIC_TELEGRAM_LINK =
export const NEXT_PUBLIC_DISCORD_LINK = env('NEXT_PUBLIC_DISCORD_LINK'); env('NEXT_PUBLIC_TELEGRAM_LINK') || process.env.NEXT_PUBLIC_TELEGRAM_LINK;
export const NEXT_PUBLIC_GITHUB_LINK = env('NEXT_PUBLIC_GITHUB_LINK'); export const NEXT_PUBLIC_DISCORD_LINK =
export const NEXT_PUBLIC_LINKEDIN_LINK = env('NEXT_PUBLIC_LINKEDIN_LINK'); env('NEXT_PUBLIC_DISCORD_LINK') || process.env.NEXT_PUBLIC_DISCORD_LINK;
export const NEXT_PUBLIC_TWITTER_LINK = env('NEXT_PUBLIC_TWITTER_LINK'); export const NEXT_PUBLIC_GITHUB_LINK =
export const NEXT_PUBLIC_INSTAGRAM_LINK = env('NEXT_PUBLIC_INSTAGRAM_LINK'); env('NEXT_PUBLIC_GITHUB_LINK') || process.env.NEXT_PUBLIC_GITHUB_LINK;
export const NEXT_PUBLIC_LINKEDIN_LINK =
env('NEXT_PUBLIC_LINKEDIN_LINK') || process.env.NEXT_PUBLIC_LINKEDIN_LINK;
export const NEXT_PUBLIC_TWITTER_LINK =
env('NEXT_PUBLIC_TWITTER_LINK') || process.env.NEXT_PUBLIC_TWITTER_LINK;
export const NEXT_PUBLIC_INSTAGRAM_LINK =
env('NEXT_PUBLIC_INSTAGRAM_LINK') || process.env.NEXT_PUBLIC_INSTAGRAM_LINK;