Add 8 new tools: Hash Verifier, URL Tool, String Utils, Cron Explainer, IP Calc, Lorem Ipsum, CSV Viewer, Notes

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-06 09:10:25 +02:00
parent ef03e76950
commit 75062dbf5e
20 changed files with 1727 additions and 2 deletions
@@ -0,0 +1,96 @@
+import { useState } from 'react';
+import axios from '../services/api';
+
+function HashVerifierTool() {
+  const [text, setText] = useState('');
+  const [hash, setHash] = useState('');
+  const [algo, setAlgo] = useState('sha256');
+  const [result, setResult] = useState(null);
+  const [error, setError] = useState('');
+  const [loading, setLoading] = useState(false);
+
+  const verify = async () => {
+    setError('');
+    setResult(null);
+    if (!text || !hash) {
+      setError('Bitte Text und Hash eingeben.');
+      return;
+    }
+    setLoading(true);
+    try {
+      const res = await axios.post('/api/hash/verify', { text, hash, algorithm: algo });
+      setResult(res.data.match);
+    } catch (err) {
+      setError(err.response?.data?.message || 'Fehler bei der Verifikation');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="main-content">
+      <h2>Hash Verifier</h2>
+      <p style={{ color: 'var(--muted)', marginBottom: '16px', fontSize: '0.95rem' }}>
+        Prüft, ob ein Text mit einem gegebenen Hash übereinstimmt.
+      </p>
+
+      <input
+        type="text"
+        value={text}
+        onChange={(e) => { setText(e.target.value); setResult(null); setError(''); }}
+        placeholder="Originaltext"
+      />
+
+      <input
+        type="text"
+        value={hash}
+        onChange={(e) => { setHash(e.target.value); setResult(null); setError(''); }}
+        placeholder="Hash-Wert"
+        style={{ marginTop: '8px', fontFamily: 'monospace' }}
+      />
+
+      <select
+        value={algo}
+        onChange={(e) => { setAlgo(e.target.value); setResult(null); }}
+        style={{ marginTop: '8px' }}
+      >
+        <option value="md5">MD5</option>
+        <option value="sha256">SHA256</option>
+        <option value="bcrypt">bcrypt</option>
+      </select>
+
+      <button onClick={verify} disabled={loading} style={{ marginTop: '8px' }}>
+        {loading ? 'Prüfen...' : 'Prüfen'}
+      </button>
+
+      {error && <p className="error" style={{ marginTop: '12px' }}>{error}</p>}
+
+      {result !== null && (
+        <div style={{
+          marginTop: '24px',
+          padding: '32px',
+          background: 'var(--surface-2)',
+          border: `2px solid ${result ? '#22c55e' : '#ef4444'}`,
+          borderRadius: '16px',
+          textAlign: 'center',
+        }}>
+          <div style={{ fontSize: '3rem', marginBottom: '8px' }}>
+            {result ? '✓' : '✗'}
+          </div>
+          <div style={{
+            fontSize: '1.4rem',
+            fontWeight: 700,
+            color: result ? '#22c55e' : '#ef4444',
+          }}>
+            {result ? 'Übereinstimmung' : 'Kein Match'}
+          </div>
+          <div style={{ color: 'var(--muted)', marginTop: '6px', fontSize: '0.9rem' }}>
+            Algorithmus: {algo.toUpperCase()}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+export default HashVerifierTool;