CubLearn-Solidity/components/CertificateMinter.js

66 lines
2.2 KiB
JavaScript

"use client"
import { useState } from 'react';
import { ethers } from 'ethers';
import { abi, NFT_CONTRACT_ADDRESS } from "../constants/index";
const CertificateMinter = () => {
const [recipient, setRecipient] = useState('');
const [userName, setUserName] = useState('');
const [surName, setSurName] = useState('');
const [email, setEmail] = useState('');
const [companyName, setCompanyName] = useState('');
const mintCertificate = async () => {
try {
if (window.ethereum) {
await window.ethereum.request({ method: 'eth_requestAccounts' });
const provider = new ethers.providers.Web3Provider(window.ethereum);
const signer = provider.getSigner();
const certificateContract = new ethers.Contract(NFT_CONTRACT_ADDRESS, abi, signer);
await certificateContract.mintCertificate(recipient, userName, surName, email, companyName);
alert('Certificate minted successfully!');
} else {
alert('Please connect your wallet');
}
} catch (error) {
console.error('Error minting certificate:', error);
alert('Error minting certificate. Please check the console for details.');
}
};
return (
<div>
<h2>Certificate Minter</h2>
<label>
Recipient Address:
<input type="text" value={recipient} onChange={(e) => setRecipient(e.target.value)} style={{ color: 'black' }} />
</label>
<br />
<label>
Name:
<input type="text" value={userName} onChange={(e) => setUserName(e.target.value)} style={{ color: 'black' }}/>
</label>
<br />
<label>
Surname:
<input type="text" value={surName} onChange={(e) => setSurName(e.target.value)} style={{ color: 'black' }}/>
</label>
<br />
<label>
Email:
<input type="text" value={email} onChange={(e) => setEmail(e.target.value)} style={{ color: 'black' }}/>
</label>
<br />
<label>
Company Name:
<input type="text" value={companyName} onChange={(e) => setCompanyName(e.target.value)} style={{ color: 'black' }}/>
</label>
<br />
<button onClick={mintCertificate}>Mint Certificate</button>
</div>
);
};
export default CertificateMinter;