'use client'

import React, { useState } from 'react'

export function UserRoleLookup({ onLoad }: { onLoad: (userId: string) => void }) {
  const [userId, setUserId] = useState('00000000-0000-0000-0000-000000000001')
  return (
    <div className="flex gap-2">
      <input
        type="text"
        value={userId}
        onChange={e => setUserId(e.target.value)}
        placeholder="User-ID eingeben..."
        className="border border-gray-300 rounded-lg px-3 py-2 text-sm flex-1 font-mono"
      />
      <button
        onClick={() => onLoad(userId)}
        className="px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg text-sm"
      >
        Laden
      </button>
    </div>
  )
}
