feat: add blacklisted user blocking screen

Add BlacklistedScreen component, blocking store type, API error interceptor,
and i18n translations (ru, en, zh, fa) for blacklisted users.
This commit is contained in:
Fringg
2026-02-06 15:48:24 +03:00
parent 2df86cd903
commit 5a8c1e7e33
9 changed files with 123 additions and 2 deletions

View File

@@ -0,0 +1,48 @@
import { useTranslation } from 'react-i18next';
import { useBlockingStore } from '../../store/blocking';
export default function BlacklistedScreen() {
const { t } = useTranslation();
const { blacklistedInfo } = useBlockingStore();
return (
<div className="fixed inset-0 z-[100] flex flex-col items-center justify-center bg-dark-950 p-6">
<div className="w-full max-w-md text-center">
{/* Icon */}
<div className="mb-8">
<div className="mx-auto flex h-24 w-24 items-center justify-center rounded-full bg-dark-800">
<svg
className="h-12 w-12 text-red-500"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636"
/>
</svg>
</div>
</div>
{/* Title */}
<h1 className="mb-4 text-2xl font-bold text-white">{t('blocking.blacklisted.title')}</h1>
{/* Message */}
<p className="mb-6 text-lg text-gray-400">{t('blocking.blacklisted.defaultMessage')}</p>
{/* Reason */}
{blacklistedInfo?.message && (
<div className="mb-6 rounded-xl bg-dark-800/50 p-4">
<p className="mb-1 text-sm text-gray-500">{t('blocking.blacklisted.reason')}:</p>
<p className="text-gray-300">{blacklistedInfo.message}</p>
</div>
)}
<p className="mt-8 text-sm text-gray-500">{t('blocking.blacklisted.contactSupport')}</p>
</div>
</div>
);
}

View File

@@ -1,2 +1,3 @@
export { default as MaintenanceScreen } from './MaintenanceScreen';
export { default as ChannelSubscriptionScreen } from './ChannelSubscriptionScreen';
export { default as BlacklistedScreen } from './BlacklistedScreen';