ui-nyla/src/components/Connections/ConnectionsErrorDisplay.tsx

41 lines
No EOL
1.1 KiB
TypeScript

import React from 'react';
import styles from './ConnectionsErrorDisplay.module.css';
import { ConnectionsErrorDisplayProps } from './connectionsInterfaces';
import { useLanguage } from '../../contexts/LanguageContext';
export function ConnectionsErrorDisplay({
error,
connectError,
disconnectError
}: ConnectionsErrorDisplayProps) {
const { t } = useLanguage();
// Don't render anything if no errors
if (!error && !connectError && !disconnectError) {
return null;
}
return (
<div className={styles.errorContainer}>
{error && (
<div className={styles.errorMessage}>
<strong>{t('connections.error', 'Error')}:</strong> {error}
</div>
)}
{connectError && (
<div className={styles.errorMessage}>
<strong>{t('connections.connection_error', 'Connection Error')}:</strong> {connectError}
</div>
)}
{disconnectError && (
<div className={styles.errorMessage}>
<strong>{t('connections.disconnect_error', 'Disconnect Error')}:</strong> {disconnectError}
</div>
)}
</div>
);
}
export default ConnectionsErrorDisplay;