Yandrik/swa-dojo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: sentry bug reports and integration (glitchtip)

Browse Source
This commit is contained in:
Yandrik
2025-07-09 15:45:35 +02:00
parent cb069a45be
commit 99cd4098da
4 changed files with 152 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
App.tsx
View File

@ -1,6 +1,7 @@
import React, { useState, useEffect, useCallback, useMemo, useRef } from 'react';
import { Dialog } from "@headlessui/react";
import { Cog6ToothIcon } from "@heroicons/react/24/outline";
import { Cog6ToothIcon, ChatBubbleLeftRightIcon } from "@heroicons/react/24/outline";
import * as Sentry from "@sentry/react";
import { Exercise, CheckResult, ExercisePartType } from './types';
import { swaExercises1 } from './data/swa_exercises.1';
import { swaExercises2 } from './data/swa_exercises.2';
@ -539,6 +540,16 @@ const allSwaExercises: Exercise[] = [
export default function App() {
const [exercises, setExercises] = useState<Exercise[]>([]);
const [currentIndex, setCurrentIndex] = useState(0);
const [showFeedback, setShowFeedback] = useState(false);
const [feedbackMessage, setFeedbackMessage] = useState('');
const handleFeedbackSubmit = () => {
Sentry.captureFeedback({
message: feedbackMessage,
});
setFeedbackMessage('');
setShowFeedback(false);
};
// --- API KEY STATE ---
const [apiKey, setApiKey] = useState<string>('');
@ -592,6 +603,14 @@ export default function App() {
return (
<div className="min-h-screen flex flex-col p-4 md:p-8">
{/* Feedback Button */}
<button
className="fixed top-4 right-16 z-50 bg-white rounded-full p-2 shadow hover:bg-slate-100 transition"
aria-label="Feedback"
onClick={() => setShowFeedback(true)}
>
<ChatBubbleLeftRightIcon className="w-7 h-7 text-slate-600" />
</button>
{/* Settings Button */}
<button
className="fixed top-4 right-4 z-50 bg-white rounded-full p-2 shadow hover:bg-slate-100 transition"
@ -642,6 +661,45 @@ export default function App() {
</Dialog.Panel>
</div>
</Dialog>
{/* Feedback Modal */}
<Dialog open={showFeedback} onClose={() => setShowFeedback(false)} className="relative z-50">
<div className="fixed inset-0 bg-black/30" aria-hidden="true" />
<div className="fixed inset-0 flex items-center justify-center p-4">
<Dialog.Panel className="bg-white rounded-lg shadow-xl p-8 max-w-md w-full">
<Dialog.Title className="font-bold text-lg mb-4 flex items-center gap-2">
<ChatBubbleLeftRightIcon className="w-6 h-6 text-blue-600" />
Feedback?
</Dialog.Title>
<div className="mb-4">
<p>
Hi :)<br/>Hast du Feedback, Aufgabenideen, oder gab es einen Bug? Sag mir gern bescheid, und ich schau, was ich tun kann - yandrik
</p>
<textarea
className="w-full border rounded px-3 py-2 text-slate-800"
value={feedbackMessage}
onChange={e => setFeedbackMessage(e.target.value)}
placeholder="Ich finde, dass..."
rows={5}
/>
</div>
<div className="flex justify-end gap-2">
<button
className="px-4 py-2 rounded bg-slate-200 text-slate-700 hover:bg-slate-300"
onClick={() => setShowFeedback(false)}
>
Abbrechen
</button>
<button
className="px-4 py-2 rounded bg-blue-600 text-white font-bold hover:bg-blue-700"
onClick={handleFeedbackSubmit}
disabled={!feedbackMessage.trim()}
>
Senden
</button>
</div>
</Dialog.Panel>
</div>
</Dialog>
<header className="mb-6 flex-shrink-0">
<h1 className="text-3xl font-serif font-bold text-slate-800">SWA Trainer</h1>
<p className="text-slate-500">Interaktive Übungen zur Vorbereitung auf die SWA-Klausur</p>
@ -673,4 +731,4 @@ export default function App() {
</div>
</div>
);
}
}