fix(default): resolve v1 frontend issue regressions

Fix v1 frontend regressions across channel forms, dashboard charts, wallet history, payment callbacks, invite links, API key groups, rate-limit errors, and usage-log scrolling.

Fixes #4715
Fixes #4618
Fixes #4699
Fixes #4651
Fixes #4637
Fixes #4682
Fixes #4691
Fixes #4565
Fixes #4334

web/default/src/features/errors/general-error.tsx

@@ -25,27 +25,45 @@ const FEEDBACK_URL = 'https://github.com/QuantumNous/new-api/issues'
 
 type GeneralErrorProps = React.HTMLAttributes<HTMLDivElement> & {
   minimal?: boolean
+  error?: unknown
+}
+
+function getHttpStatus(error: unknown): number | undefined {
+  if (typeof error !== 'object' || error === null) return undefined
+  const response = (error as Record<string, unknown>).response
+  if (typeof response !== 'object' || response === null) return undefined
+  const status = (response as Record<string, unknown>).status
+  return typeof status === 'number' ? status : undefined
 }
 
 export function GeneralError({
   className,
   minimal = false,
+  error,
 }: GeneralErrorProps) {
   const { t } = useTranslation()
   const navigate = useNavigate()
   const { history } = useRouter()
+  const status = getHttpStatus(error)
+  const isRateLimited = status === 429
+  const title = isRateLimited
+    ? t('Too many requests')
+    : `${t('Oops! Something went wrong')} ${`:')`}`
+  const description = isRateLimited
+    ? t('Please wait a moment before trying again.')
+    : t('Please try again later.')
+
   return (
     <div className={cn('h-svh w-full', className)}>
       <div className='m-auto flex h-full w-full flex-col items-center justify-center gap-2'>
         {!minimal && (
-          <h1 className='text-[7rem] leading-tight font-bold'>500</h1>
+          <h1 className='text-[7rem] leading-tight font-bold'>
+            {status ?? 500}
+          </h1>
         )}
-        <span className='font-medium'>
-          {t('Oops! Something went wrong')} {`:')`}
-        </span>
+        <span className='font-medium'>{title}</span>
         <p className='text-muted-foreground text-center'>
-          {t('We apologize for the inconvenience.')} <br />{' '}
-          {t('Please try again later.')}
+          {t('We apologize for the inconvenience.')} <br /> {description}
         </p>
         {!minimal && (
           <p className='text-muted-foreground text-center text-sm'>