import { useState } from 'react';
import axios from '../services/api';

function Md5Tool() {
  const [input, setInput] = useState('');
  const [result, setResult] = useState('');

  const hashPassword = async () => {
    try {
      const res = await axios.post('/hash/md5', { password: input });

      setResult(res.data.md5);
    } catch (err) {
      alert('Fehler beim Hashen');
    }
  };

  return (
    <div className="main-content">
      <h2>MD5 Hasher</h2>
      <input
        type="text"
        value={input}
        onChange={(e) => setInput(e.target.value)}
        placeholder="Gib ein Passwort ein"
      />
      <button onClick={hashPassword}>Hash berechnen</button>
      {result && <p><strong>MD5:</strong> {result}</p>}
    </div>
  );
}

export default Md5Tool;
