Fix: AI-Nachrichtenverarbeitung - Nur bei geänderten Nachrichten anzeigen, Checkbox für Einverständnis hinzufügen

This commit is contained in:
Hördle Bot
2025-12-05 10:55:18 +01:00
parent dbcdaf9278
commit d8f69631b5
4 changed files with 55 additions and 17 deletions

View File

@@ -67,6 +67,7 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
const [commentError, setCommentError] = useState<string | null>(null);
const [commentCollapsed, setCommentCollapsed] = useState(true);
const [rewrittenMessage, setRewrittenMessage] = useState<string | null>(null);
const [commentAIConsent, setCommentAIConsent] = useState(false);
useEffect(() => {
const updateCountdown = () => {
@@ -317,7 +318,7 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
};
const handleCommentSubmit = async () => {
if (!commentText.trim() || commentSending || commentSent || !dailyPuzzle) {
if (!commentText.trim() || commentSending || commentSent || !dailyPuzzle || !commentAIConsent) {
return;
}
@@ -343,8 +344,10 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
const rewriteData = await rewriteResponse.json();
if (rewriteData.rewrittenMessage) {
finalMessage = rewriteData.rewrittenMessage;
// If message was changed significantly (simple check), show it
if (finalMessage !== commentText.trim()) {
// Only show rewritten message if it was actually changed
// The API adds "(autocorrected by Polite-Bot)" suffix only if message was changed
const wasChanged = finalMessage.includes('(autocorrected by Polite-Bot)');
if (wasChanged) {
setRewrittenMessage(finalMessage);
}
}
@@ -687,14 +690,26 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
</span>
)}
</div>
<div style={{ marginBottom: '0.75rem' }}>
<label style={{ display: 'flex', alignItems: 'flex-start', gap: '0.5rem', fontSize: '0.85rem', color: 'var(--foreground)', cursor: 'pointer' }}>
<input
type="checkbox"
checked={commentAIConsent}
onChange={(e) => setCommentAIConsent(e.target.checked)}
disabled={commentSending || commentSent}
style={{ marginTop: '0.2rem', cursor: (commentSending || commentSent) ? 'not-allowed' : 'pointer' }}
/>
<span>{t('commentAIConsent')}</span>
</label>
</div>
<button
onClick={handleCommentSubmit}
disabled={!commentText.trim() || commentSending || commentSent}
disabled={!commentText.trim() || commentSending || commentSent || !commentAIConsent}
className="btn-primary"
style={{
width: '100%',
opacity: (!commentText.trim() || commentSending || commentSent) ? 0.5 : 1,
cursor: (!commentText.trim() || commentSending || commentSent) ? 'not-allowed' : 'pointer'
opacity: (!commentText.trim() || commentSending || commentSent || !commentAIConsent) ? 0.5 : 1,
cursor: (!commentText.trim() || commentSending || commentSent || !commentAIConsent) ? 'not-allowed' : 'pointer'
}}
>
{commentSending ? t('sending') : t('sendComment')}
@@ -706,14 +721,20 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
{commentSent && (
<div style={{ marginTop: '1.5rem', padding: '1rem', background: 'rgba(16, 185, 129, 0.1)', borderRadius: '0.5rem', border: '1px solid rgba(16, 185, 129, 0.3)' }}>
<p style={{ fontSize: '0.9rem', color: 'var(--success)', textAlign: 'center', marginBottom: rewrittenMessage ? '0.5rem' : 0 }}>
{t('commentSent')}
</p>
{rewrittenMessage && (
<div style={{ fontSize: '0.85rem', color: 'var(--muted-foreground)', textAlign: 'center' }}>
<p style={{ marginBottom: '0.25rem' }}>{t('commentRewritten')}</p>
<p style={{ fontStyle: 'italic' }}>"{rewrittenMessage}"</p>
</div>
{rewrittenMessage ? (
<>
<p style={{ fontSize: '0.9rem', color: 'var(--success)', textAlign: 'center', marginBottom: '0.5rem' }}>
{t('commentSent')}
</p>
<div style={{ fontSize: '0.85rem', color: 'var(--muted-foreground)', textAlign: 'center' }}>
<p style={{ marginBottom: '0.25rem' }}>{t('commentRewritten')}</p>
<p style={{ fontStyle: 'italic' }}>"{rewrittenMessage}"</p>
</div>
</>
) : (
<p style={{ fontSize: '0.9rem', color: 'var(--success)', textAlign: 'center', marginBottom: 0 }}>
{t('commentThankYou')}
</p>
)}
</div>
)}