1. Ogólny opis projektu
Wymagana jest разработка веб-интерфейса с интеграцией смарт-контракта для выполнения кросс-чейн переводов токенов через функцию send (LayerZero OFT). Интерфейс должен обеспечивать подключение кошелька (MetaMask/WalletConnect), проверку разрешений (approve), и вызов функции отправки токенов в другую сеть.
Stos technologiczny: JavaScript (vanilla JS lub React/Vue do uzgodnienia), Web3.js lub Ethers.js, HTML/CSS для UI.
2. Wymagania funkcjonalne
2.1. Podłączenie portfela
Zaimplementować przycisk "Connect Wallet" для podłączenia MetaMask/WalletConnect
Wyświetlać podłączony adres portfela w interfejsie
Wsparcie dla przełączania sieci (BSC, Ethereum, Arbitrum itp.)
2.2. Interfejs użytkownika (UI)
Interfejs powinien zawierać następujące elementy:
Pola wejściowe:
Adres kontraktu tokena (input, przykład: 0xFB93EE8152dd0a0e6F4b49C66c06d800Cf1Db72d)
Adres odbiorcy (input dla recipient address)
Ilość tokenów (input z weryfikacją wartości liczbowej)
Docelowa sieć (dropdown/select z wyborem sieci docelowej)
Przyciski akcji:
"Check Allowance" — weryfikacja pozwolenia (approve)
"Approve Tokens" — wydanie pozwolenia kontraktowi
"Send Tokens" — wykonanie kros-sieciowego transferu
Bloki informacyjne:
Status operacji (pending, success, error)
Hash transakcji (z klikalnym linkiem do eksploratora)
Saldo tokenów użytkownika
3. Logika działania (sekwencja działań)
Krok 1: Weryfikacja obecności funkcji send w kontrakcie
Krok 2: Weryfikacja Allowance (pozwolenia)
Funkcja: allowance(address owner, address spender)
Parametry:
Logika:
Wywołać funkcję allowance() na kontrakcie tokena
Porównać zwróconą wartość z ilością tokenów wprowadzoną przez użytkownika (przekonwertować na uint256 z uwzględnieniem decimals tokena)
Jeśli allowance < amount:
Krok 3: Approve (wydanie pozwolenia)
Funkcja: approve(address spender, uint256 amount)
Parametry:
Działania:
Wywołać funkcję approve() z podanymi parametrami
Poczekać na potwierdzenie transakcji
Pokazać komunikat "Approval successful"
Odblokować przycisk "Send Tokens"
Krok 4: Wywołanie funkcji send (kros-sieciowy transfer)
Funkcja: send(LzSendParam calldata _sendParam, MessagingFee calldata _fee, address _refundAddress) payable
Parametry do przekazania:
javascript
{
payableAmount: "0.002", // nativna waluta (BNB/ETH), domyślnie 0.002
_sendParam: {
dstEid: [wartość z słownika sieci], // ID docelowej sieci (LayerZero endpoint ID)
to: [adres odbiorcy z input], // adres odbiorcy
amountLD: [ilość tokenów w uint256], // z uwzględnieniem decimals
minAmountLD: "0", // minimalna ilość (domyślnie 0)
extraOptions: "0x0003",
composeMsg: "0x",
oftCmd: "0x"
},
_fee: {
nativeFee: "1265332848942799", // opłata w nativnej walucie
lzTokenFee: "0" // opłata w LZ tokenach (zwykle 0)
},
_refundAddress: [podłączony portfel użytkownika]
}
Działania:
Zebrać wszystkie parametry z UI
Przekonwertować amountLD na uint256 z uwzględnieniem decimals tokena
Podstawić dstEid z słownika sieci (patrz sekcja 4)
Wywołać funkcję send() z payableAmount jako value transakcji
Poczekać na potwierdzenie transakcji
Wyświetlić hash transakcji z klikalnym linkiem do eksploratora bloków
4. Słownik sieci (Network Dictionary)
Wymagana jest stworzenie obiektu/słownika do mapowania nazw sieci i ich LayerZero Endpoint ID (dstEid):
javascript
const networkIds = {
"Ethereum": 30101,
"BSC": 30102,
"Arbitrum": 30110,
"Optimism": 30111,
"Polygon": 30109,
"Avalanche": 30106,
"Base": 30184,
// dodać inne w miarę potrzeby
};
Uwaga: Dokładne ID należy potwierdzić w dokumentacji LayerZero V2 dla każdej sieci.
5. Obsługa błędów
Wymagana jest obsługa następujących błędów:
Portfel nie jest podłączony
Za mało tokenów na saldzie
Za mało nativnej waluty na opłacenie gas
Użytkownik odrzucił transakcję
Kontrakt nie zawiera potrzebnej funkcji
Błąd sieci/RPC
Nieprawidłowy format adresu
Wszystkie błędy powinny być wyświetlane w zrozumiałej formie w UI.
6. Wymagania dotyczące kodu
Czysty, czytelny kod z komentarzami w języku angielskim lub rosyjskim
Modularna struktura (podział logiki Web3, UI, narzędzi)
Użycie async/await dla operacji asynchronicznych
Walidacja wszystkich wejść użytkownika
Responsive design (dostosowanie do urządzeń mobilnych)
7. Przykład kontraktu do testowania
Sieć: BSC (Binance Smart Chain)
Adres kontraktu: 0xFB93EE8152dd0a0e6F4b49C66c06d800Cf1Db72d
Link: https://bscscan.com/address/0xfb93ee8152dd0a0e6f4b49c66c06d800cf1db72d
Funkcje do pracy:
send() — Write Contract (wysyłanie tokenów)
allowance() — Read Contract (sprawdzanie pozwolenia)
approve() — Write Contract (wydawanie pozwolenia)
8. Wynik pracy
Wykonawca powinien dostarczyć:
Kod źródłowy (HTML, CSS, JavaScript)
Instrukcję instalacji i uruchomienia (jeśli wymagana jest kompilacja)
Krótka dokumentacja dotycząca korzystania z interfejsu
Demo-wersja (opcjonalnie, można na GitHub Pages lub Vercel)
9. Dodatkowe wymagania
Kod z interfejsem dostarczono w zip, być może trzeba dodać dodatkowy input
