ibelick

export const truncateEthAddress = (address: string) => {
  const truncateRegex = /^(0x[a-zA-Z0-9]{4})[a-zA-Z0-9]+([a-zA-Z0-9]{4})$/;
  const match = address.match(truncateRegex);
  if (!match) return address;
  return `${match[1]}…${match[2]}`;
};

ibelick

const ButtonConnectWallet: React.FC = () => {
  const [address, setAddress] = useState<string | null>(null);

  const connectWallet = async () => {
    if (!window?.ethereum) {
      alert("No wallet found. Please install MetaMask.");
      return;
    }

    try {

ibelick

import { GetStaticProps, NextPage } from "next";

interface Data {
  title: string;
}

interface HomePageProps {
  data: Data;
}

ibelick

import type { GetStaticPaths, GetStaticProps, NextPage } from "next";
import { ParsedUrlQuery } from "querystring";

interface Data {
  title: string;
}

interface HomePageProps {
  data: Data;
}

ibelick

import { useState, Fragment } from "react";
import { Transition } from "@headlessui/react";
import * as DialogPrimitive from "@radix-ui/react-dialog";
import * as Portal from "@radix-ui/react-portal";

interface DialogProps {
  trigger: React.ReactNode;
}

const Dialog: React.FC<DialogProps> = ({ trigger }) => {

ibelick

ibelick

interface ProgressProps {
  label?: string;
  value: number;
}

const Progress: React.FC<ProgressProps> = ({ label, value }) => {
  return (
    <>
      {label ? (
        <div className="mb-1 flex justify-between">

ibelick

const IconButton = () => {
  return (
    <button className="inline-flex h-10 w-10 items-center justify-center rounded-full bg-gray-50 text-black drop-shadow-sm transition-colors duration-150 hover:bg-gray-200">
      <svg className="h-4 w-4 fill-current" viewBox="0 0 20 20">
        <path
          d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z"
          clip-rule="evenodd"
          fill-rule="evenodd"
        ></path>
      </svg>

ibelick

import useSWR from "swr";
import { fetcher } from "lib/fetch";

const usePrice = (fromCurrencies: string, vsCurrencies: string) => {
  const { data, error } = useSWR(
    `https://api.coingecko.com/api/v3/simple/price?ids=${fromCurrencies}&vs_currencies=${vsCurrencies}`,
    fetcher
  );

  return {

ibelick

const SelectDisplayImage = () => {
  const [image, setImage] = useState<null | string>(null);

  const onImageChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    const input = event.target;

    if (!input.files?.length) {
      return;
    }