import { forgeDomain } from 'zudux-state';
import { useCommand, useDomainSlice } from 'zudux-state/react';

const wallet = forgeDomain({
  name: 'wallet',
  seed: { balance: 0 },
  commands: {
    add(context, amount: number) {
      context.edit((draft) => { draft.balance += amount; });
    },
  },
});

export function WalletButton() {
  const balance = useDomainSlice(wallet, (state) => state.balance);
  const add = useCommand(wallet, 'add');
  return <button onClick={() => void add(10)}>Balance: {balance}</button>;
}