51 lines
1.7 KiB
TypeScript
51 lines
1.7 KiB
TypeScript
|
|
import React from 'react';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
const SocialConnectError: React.FC = () => {
|
|
const { t } = useTranslation();
|
|
|
|
const searchParams = new URLSearchParams(window.location.search);
|
|
const platform = searchParams.get('platform') || 'unknown';
|
|
const errorMessage = searchParams.get('error') || t('social.connectError.defaultError');
|
|
|
|
const platformName = platform === 'youtube' ? 'YouTube' :
|
|
platform === 'instagram' ? 'Instagram' :
|
|
platform === 'facebook' ? 'Facebook' : platform;
|
|
|
|
const navigateToHome = () => {
|
|
window.location.href = '/';
|
|
};
|
|
|
|
return (
|
|
<div className="social-connect-page">
|
|
<div className="social-connect-card error">
|
|
<div className="social-connect-icon error">
|
|
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
|
|
<circle cx="12" cy="12" r="10" />
|
|
<line x1="15" y1="9" x2="9" y2="15" />
|
|
<line x1="9" y1="9" x2="15" y2="15" />
|
|
</svg>
|
|
</div>
|
|
<h1 className="social-connect-title">{t('social.connectError.title', { platform: platformName })}</h1>
|
|
<p className="social-connect-message">
|
|
{errorMessage}
|
|
</p>
|
|
<p className="social-connect-detail">
|
|
{t('social.connectError.detail')}
|
|
</p>
|
|
<div className="social-connect-actions">
|
|
<button
|
|
onClick={navigateToHome}
|
|
className="social-connect-button"
|
|
>
|
|
{t('social.connectError.retry')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SocialConnectError;
|