Search
Search

Transaction: F4vS5uy...5uxf

Receiver
Status
Succeeded
Transaction Fee
0.00189 
Deposit Value
0 
Gas Used
19 Tgas
Attached Gas
300 Tgas
Created
March 16, 2024 at 12:45:53pm
Hash
F4vS5uyY8wP5pne4oHpegFkDNuGJc9V5J1h1KAQg5uxf

Actions

Called method: 'set' in contract: social.near
Arguments:
{ "data": { "nearblocks.near": { "widget": { "bos-components.components.FT.Overview": { "": "/**\n * Component: FTOverview\n * Author: Nearblocks Pte Ltd\n * License: Business Source License 1.1\n * Description: Fungible Token Overview on Near Protocol.\n * @interface Props\n * @param {string} [network] - The network data to show, either mainnet or testnet\n * @param {Function} [t] - A function for internationalization (i18n) provided by the next-translate package.\n * @param {string} [id] - The token identifier passed as a string\n * @param {string} [tokenFilter] - The token filter identifier passed as a string\n * @param {Object.<string, string>} [filters] - Key-value pairs for filtering transactions. (Optional)\n * Example: If provided, method=batch will filter the blocks with method=batch.\n * @param {function} [onFilterClear] - Function to clear a specific or all filters. (Optional)\n * Example: onFilterClear={handleClearFilter} where handleClearFilter is a function to clear the applied filters.\n * @param {React.FC<{\n * href: string;\n * children: React.ReactNode;\n * className?: string;\n * }>} Link - A React component for rendering links.\n */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/* INCLUDE COMPONENT: \"includes/Common/Links.jsx\" */\n/* INCLUDE: \"includes/libs.jsx\" */\nfunction urlHostName(url) {\n try {\n const domain = new URL(url);\n return domain?.hostname ?? null;\n } catch (e) {\n return null;\n }\n}\n\nfunction holderPercentage(supply, quantity) {\n return Math.min(Big(quantity).div(Big(supply)).mul(Big(100)).toFixed(2), 100);\n}\n\nfunction isAction(type) {\n const actions = [\n 'DEPLOY_CONTRACT',\n 'TRANSFER',\n 'STAKE',\n 'ADD_KEY',\n 'DELETE_KEY',\n 'DELETE_ACCOUNT',\n ];\n\n return actions.includes(type.toUpperCase());\n}\n\nfunction isJson(string) {\n const str = string.replace(/\\\\/g, '');\n\n try {\n JSON.parse(str);\n return false;\n } catch (e) {\n return false;\n }\n}\n\nfunction uniqueId() {\n return Math.floor(Math.random() * 1000);\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n/* END_INCLUDE: \"includes/libs.jsx\" */\n\nconst Links = (props) => {\n const { meta } = props;\n const twitter = urlHostName(meta?.twitter);\n const facebook = urlHostName(meta?.facebook);\n const telegram = urlHostName(meta?.telegram);\n\n return (\n <div className=\"flex space-x-4\">\n {meta?.twitter && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !twitter\n ? `https://twitter.com/${meta.twitter}`\n : meta.twitter\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/twitter_icon.svg\"\n alt=\"Twitter\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Twitter\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.facebook && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !facebook\n ? `https://facebook.com/${meta.facebook}`\n : meta.facebook\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/facebook_icon.svg\"\n alt=\"Facebook\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Facebook\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.telegram && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !telegram ? `https://t.me/${meta.telegram}` : meta.telegram\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/telegram_icon.svg\"\n alt=\"Telegram\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Telegram\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.coingecko_id && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={`https://www.coingecko.com/en/coins/${meta.coingecko_id}`}\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/coingecko_icon.svg\"\n alt=\"coingecko\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n CoinGecko\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n </div>\n );\n};/* END_INCLUDE COMPONENT: \"includes/Common/Links.jsx\" */\n/* INCLUDE COMPONENT: \"includes/Common/Skeleton.jsx\" */\n/**\n * @interface Props\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n */\n\n\n\n\n\nconst Skeleton = (props) => {\n return (\n <div\n className={`bg-gray-200 rounded shadow-sm animate-pulse ${props.className}`}\n ></div>\n );\n};/* END_INCLUDE COMPONENT: \"includes/Common/Skeleton.jsx\" */\n/* INCLUDE: \"includes/formats.jsx\" */\nfunction dollarFormat(number) {\n const bigNumber = new Big(number);\n\n // Format to two decimal places without thousands separator\n const formattedNumber = bigNumber.toFixed(2);\n\n // Add comma as a thousands separator\n const parts = formattedNumber.split('.');\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n const dollarFormattedNumber = `${parts.join('.')}`;\n\n return dollarFormattedNumber;\n}\n\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\n\nfunction dollarFormat(number) {\n const bigNumber = new Big(number);\n\n // Format to two decimal places without thousands separator\n const formattedNumber = bigNumber.toFixed(2);\n\n // Add comma as a thousands separator\n const parts = formattedNumber.split('.');\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n const dollarFormattedNumber = `${parts.join('.')}`;\n\n return dollarFormattedNumber;\n}\n\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\n/* END_INCLUDE: \"includes/formats.jsx\" */\n/* INCLUDE COMPONENT: \"includes/icons/Question.jsx\" */\n/**\n * @interface Props\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n */\n\n\n\n\n\nconst Question = (props) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n width={16}\n height={16}\n {...props}\n >\n <path fill=\"none\" d=\"M0 0h24v24H0z\" />\n <path d=\"M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 100-16 8 8 0 000 16zm-1-5h2v2h-2v-2zm2-1.645V14h-2v-1.5a1 1 0 011-1 1.5 1.5 0 10-1.471-1.794l-1.962-.393A3.501 3.501 0 1113 13.355z\" />\n </svg>\n );\n};/* END_INCLUDE COMPONENT: \"includes/icons/Question.jsx\" */\n/* INCLUDE COMPONENT: \"includes/icons/TokenImage.jsx\" */\n/**\n * @interface Props\n * @param {string} [src] - The URL string pointing to the image source.\n * @param {string} [alt] - The alternate text description for the image.\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n * @param {string} [appUrl] - The URL of the application.\n */\n\n\n\n\n\n\n\n\n\n\nconst TokenImage = ({\n appUrl,\n src,\n alt,\n className,\n onLoad,\n onSetSrc,\n}) => {\n const placeholder = `${appUrl}images/tokenplaceholder.svg`;\n\n const handleLoad = () => {\n if (onLoad) {\n onLoad();\n }\n };\n\n const handleError = () => {\n if (onSetSrc) {\n onSetSrc(placeholder);\n }\n if (onLoad) {\n onLoad();\n }\n };\n\n return (\n <img\n src={src || placeholder}\n alt={alt}\n className={className}\n onLoad={handleLoad}\n onError={handleError}\n />\n );\n};/* END_INCLUDE COMPONENT: \"includes/icons/TokenImage.jsx\" */\n/* INCLUDE: \"includes/libs.jsx\" */\nfunction getConfig(network) {\n switch (network) {\n case 'mainnet':\n return {\n ownerId: 'nearblocks.near',\n nodeUrl: 'https://rpc.mainnet.near.org',\n backendUrl: 'https://api3.nearblocks.io/v1/',\n rpcUrl: 'https://beta.rpc.mainnet.near.org',\n appUrl: 'https://nearblocks.io/',\n };\n case 'testnet':\n return {\n ownerId: 'nearblocks.testnet',\n nodeUrl: 'https://rpc.testnet.near.org',\n backendUrl: 'https://api3-testnet.nearblocks.io/v1/',\n rpcUrl: 'https://beta.rpc.testnet.near.org/',\n appUrl: 'https://testnet.nearblocks.io/',\n };\n default:\n return {};\n }\n}\n\nfunction debounce(\n delay,\n func,\n) {\n let timer;\n let active = true;\n const debounced = (arg) => {\n if (active) {\n clearTimeout(timer);\n timer = setTimeout(() => {\n active && func(arg);\n timer = undefined;\n }, delay);\n } else {\n func(arg);\n }\n };\n\n debounced.isPending = () => {\n return timer !== undefined;\n };\n\n debounced.cancel = () => {\n active = false;\n };\n\n debounced.flush = (arg) => func(arg);\n\n return debounced;\n}\n\nfunction timeAgo(unixTimestamp) {\n const currentTimestamp = Math.floor(Date.now() / 1000);\n const secondsAgo = currentTimestamp - unixTimestamp;\n\n if (secondsAgo < 5) {\n return 'Just now';\n } else if (secondsAgo < 60) {\n return `${secondsAgo} seconds ago`;\n } else if (secondsAgo < 3600) {\n const minutesAgo = Math.floor(secondsAgo / 60);\n return `${minutesAgo} minute${minutesAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 86400) {\n const hoursAgo = Math.floor(secondsAgo / 3600);\n return `${hoursAgo} hour${hoursAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 2592000) {\n const daysAgo = Math.floor(secondsAgo / 86400);\n return `${daysAgo} day${daysAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 31536000) {\n const monthsAgo = Math.floor(secondsAgo / 2592000);\n return `${monthsAgo} month${monthsAgo > 1 ? 's' : ''} ago`;\n } else {\n const yearsAgo = Math.floor(secondsAgo / 31536000);\n return `${yearsAgo} year${yearsAgo > 1 ? 's' : ''} ago`;\n }\n}\n\nfunction shortenAddress(address) {\n const string = String(address);\n\n if (string.length <= 20) return string;\n\n return `${string.substr(0, 10)}...${string.substr(-7)}`;\n}\n\nfunction urlHostName(url) {\n try {\n const domain = new URL(url);\n return domain?.hostname ?? null;\n } catch (e) {\n return null;\n }\n}\n\nfunction holderPercentage(supply, quantity) {\n return Math.min(Big(quantity).div(Big(supply)).mul(Big(100)).toFixed(2), 100);\n}\n\nfunction isAction(type) {\n const actions = [\n 'DEPLOY_CONTRACT',\n 'TRANSFER',\n 'STAKE',\n 'ADD_KEY',\n 'DELETE_KEY',\n 'DELETE_ACCOUNT',\n ];\n\n return actions.includes(type.toUpperCase());\n}\n\nfunction isJson(string) {\n const str = string.replace(/\\\\/g, '');\n\n try {\n JSON.parse(str);\n return false;\n } catch (e) {\n return false;\n }\n}\n\nfunction uniqueId() {\n return Math.floor(Math.random() * 1000);\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n/* END_INCLUDE: \"includes/libs.jsx\" */\n\n\nfunction MainComponent({\n network,\n t,\n id,\n tokenFilter,\n filters,\n onFilterClear,\n Link,\n}) {\n const tabs = [\n t ? t('token:fts.ft.transfers') : 'Transfers',\n t ? t('token:fts.ft.holders') : 'Holders',\n 'Info',\n 'FAQ',\n 'Comments',\n ];\n const [isLoading, setIsLoading] = useState(false);\n const [txnLoading, setTxnLoading] = useState(false);\n const [holderLoading, setHolderLoading] = useState(false);\n const [stats, setStats] = useState({} );\n const [token, setToken] = useState({} );\n const [transfers, setTransfers] = useState('');\n const [holders, setHolders] = useState('');\n const [pageTab, setPageTab] = useState('Transfers');\n const [showMarketCap, setShowMarketCap] = useState(false);\n const config = getConfig(network);\n\n useEffect(() => {\n function fetchFTData() {\n setIsLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.contracts?.[0];\n if (data.status === 200) {\n setToken(resp);\n setIsLoading(false);\n } else {\n handleRateLimit(data, fetchFTData, () => setIsLoading(false));\n }\n },\n )\n .catch(() => {});\n }\n\n function fetchTxnsCount() {\n setTxnLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}/txns/count`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.txns?.[0];\n if (data.status === 200) {\n setTransfers(resp.count);\n setTxnLoading(false);\n } else {\n handleRateLimit(data, fetchTxnsCount, () => setTxnLoading(false));\n }\n },\n )\n .catch(() => {});\n }\n\n function fetchStatsData() {\n asyncFetch(`${config?.backendUrl}stats`, {\n method: 'GET',\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n .then((res) => {\n const data = res.body;\n if (res.status === 200) {\n setStats(data.stats[0]);\n } else {\n handleRateLimit(data, fetchStatsData);\n }\n })\n .catch(() => {})\n .finally(() => {});\n }\n function fetchHoldersCount() {\n setHolderLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}/holders/count`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.holders?.[0];\n if (data.status === 200) {\n setHolders(resp.count);\n setHolderLoading(false);\n } else {\n handleRateLimit(data, fetchHoldersCount, () =>\n setHolderLoading(false),\n );\n }\n },\n )\n .catch(() => {});\n }\n fetchStatsData();\n fetchFTData();\n fetchTxnsCount();\n fetchHoldersCount();\n }, [config.backendUrl, id]);\n\n const onTab = (index) => {\n setPageTab(tabs[index]);\n onFilterClear && onFilterClear('');\n };\n\n const onToggle = () => setShowMarketCap((o) => !o);\n return (\n <>\n <div className=\"flex items-center justify-between flex-wrap pt-4\">\n {isLoading ? (\n <div className=\"w-80 max-w-xs px-3 py-5\">\n <Skeleton className=\"h-7\" />\n </div>\n ) : (\n token && (\n <h1 className=\"break-all space-x-2 text-xl text-gray-700 leading-8 py-4 px-2\">\n <span className=\"inline-flex align-middle h-7 w-7\">\n <TokenImage\n src={token?.icon}\n alt={token?.name}\n className=\"w-7 h-7\"\n />\n </span>\n <span className=\"inline-flex align-middle \">Token: </span>\n <span className=\"inline-flex align-middle font-semibold\">\n {token?.name}\n </span>\n </h1>\n )\n )}\n </div>\n <div>\n <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-4 mb-2 md:mb-2\">\n <div className=\"w-full\">\n <div className=\"h-full bg-white soft-shadow rounded-xl overflow-hidden\">\n <h2 className=\"border-b p-3 text-nearblue-600 text-sm font-semibold\">\n Overview\n </h2>\n\n <div className=\"px-3 divide-y text-sm text-nearblue-600\">\n <div className=\"flex divide-x my-2\">\n <div className=\"flex-col flex-1 flex-wrap py-1\">\n <div className=\"w-full text-nearblue-700 text-xs uppercase mb-1 text-[80%]\">\n Price\n </div>\n {isLoading ? (\n <div className=\"w-20\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : token?.price !== null && token?.price !== undefined ? (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n ${dollarFormat(token?.price)}\n {stats?.near_price && (\n <div className=\"text-nearblue-700 mx-1 text-sm flex flex-row items-center\">\n @{' '}\n {localFormat(\n (\n Big(token?.price) / Big(stats?.near_price)\n ).toString(),\n )}{' '}\n Ⓝ\n </div>\n )}\n {token?.change_24 !== null &&\n token?.change_24 !== undefined ? (\n Number(token?.change_24) > 0 ? (\n <div className=\"text-neargreen text-sm flex flex-row items-center\">\n {' '}\n (+{dollarFormat(token?.change_24)}%)\n </div>\n ) : (\n <div className=\"text-red-500 text-sm flex flex-row items-center\">\n {' '}\n ({dollarFormat(token?.change_24)}%)\n </div>\n )\n ) : null}\n </div>\n ) : (\n 'N/A'\n )}\n </div>\n <div className=\"flex-col flex-1 flex-wrap py-1 px-3\">\n <div className=\"w-full text-nearblue-700 text-xs mb-1 flex text-[80%]\">\n <span className=\"uppercase\">\n {showMarketCap\n ? 'CIRCULATING SUPPLY MARKET CAP'\n : 'FULLY DILUTED MARKET CAP'}\n </span>\n <span>\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <Question className=\"w-4 h-4 fill-current ml-1\" />\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-xs text-white px-3 py-2 break-words\"\n align=\"start\"\n side=\"bottom\"\n >\n {\n 'Calculated by multiplying the tokens Total Supply on Near with the current market price per token.'\n }\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n </span>\n </div>\n {isLoading ? (\n <div className=\"w-20\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (token?.fully_diluted_market_cap !== null &&\n token?.fully_diluted_market_cap !== undefined) ||\n (token?.market_cap !== null &&\n token?.market_cap !== undefined) ? (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n {token?.fully_diluted_market_cap !== null &&\n token?.fully_diluted_market_cap !== undefined &&\n token?.market_cap !== null &&\n token?.market_cap !== undefined ? (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <p\n className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\"\n onClick={onToggle}\n >\n $\n {showMarketCap\n ? dollarNonCentFormat(token?.market_cap)\n : dollarNonCentFormat(\n token?.fully_diluted_market_cap,\n )}\n </p>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-xs text-white px-3 py-2 break-words\"\n align=\"start\"\n side=\"bottom\"\n >\n {showMarketCap\n ? 'Click to switch back'\n : 'Click to switch'}\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n ) : (\n <p className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\">\n $\n {dollarNonCentFormat(\n Number(token?.market_cap)\n ? token?.market_cap\n : token?.fully_diluted_market_cap,\n )}\n </p>\n )}\n </div>\n ) : (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n {token?.onchain_market_cap ? (\n <p className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\">\n ${dollarNonCentFormat(token?.onchain_market_cap)}\n </p>\n ) : (\n 'N/A'\n )}\n </div>\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Max Total Supply:\n </div>\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {token?.total_supply\n ? dollarNonCentFormat(token?.total_supply)\n : token?.total_supply ?? ''}\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Transfers:\n </div>\n {txnLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {transfers ? localFormat(transfers) : transfers ?? ''}\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Holders:</div>\n {holderLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {holders ? localFormat(holders) : holders ?? ''}\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n <div className=\"w-full\">\n <div className=\"h-full bg-white soft-shadow rounded-xl overflow-hidden\">\n <h2 className=\"border-b p-3 text-nearblue-600 text-sm font-semibold\">\n Profile Summary\n </h2>\n <div className=\"px-3 divide-y text-sm text-nearblue-600\">\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Contract:</div>\n {isLoading ? (\n <div className=\"w-full md:w-3/4 break-words\">\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n </div>\n ) : (\n <div className=\"w-full text-green-500 md:w-3/4 break-words\">\n <Link href={`/address/${token?.contract}`}>\n <a className=\"text-green-500\">{token?.contract}</a>\n </Link>\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Decimals:</div>\n <div className=\"w-full md:w-3/4 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n token?.decimals\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Official Site:\n </div>\n <div className=\"w-full md:w-3/4 text-green-500 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <a\n href={`${token?.website}`}\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n >\n {token?.website}\n </a>\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Social Profiles:\n </div>\n <div className=\"w-full md:w-3/4 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <Links meta={token} />\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"py-6\"></div>\n {tokenFilter && (\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.TokenFilter`}\n props={{\n network: network,\n id: id,\n tokenFilter: tokenFilter,\n Link,\n }}\n />\n )}\n <div className=\"block lg:flex lg:space-x-2 mb-4\">\n <div className=\"w-full\">\n <div>\n {tabs &&\n tabs.map((tab, index) => (\n <button\n key={index}\n onClick={() => onTab(index)}\n className={`text-nearblue-600 text-sm font-medium overflow-hidden inline-block cursor-pointer p-2 mb-3 mr-2 focus:outline-none ${\n pageTab === tab\n ? 'rounded-lg bg-green-600 text-white'\n : 'hover:bg-neargray-800 bg-neargray-700 rounded-lg hover:text-nearblue-600'\n }`}\n value={tab}\n >\n {tab === 'FAQ' && token ? <h2>{tab}</h2> : <h2>{tab}</h2>}\n </button>\n ))}\n </div>\n <div className=\"bg-white soft-shadow rounded-xl pb-1\">\n <div className={`${pageTab === 'Transfers' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Transfers`}\n props={{\n network: network,\n id: id,\n t: t,\n filters: filters,\n onFilterClear: onFilterClear,\n Link,\n }}\n />\n }\n </div>\n <div className={`${pageTab === 'Holders' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Holders`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n <div className={`${pageTab === 'Info' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Info`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n {token && (\n <div className={`${pageTab === 'FAQ' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.FAQ`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n )}{' '}\n <div className={`${pageTab === 'Comments' ? '' : 'hidden'} `}>\n <div className=\"py-3\">\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.Comments.Feed`}\n props={{\n network: network,\n path: `nearblocks.io/ft/${id}`,\n limit: 10,\n }}\n />\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </>\n );\n}\n\nreturn MainComponent(props, context);" } } } } }

Transaction Execution Plan

Convert Transaction To Receipt
Gas Burned:
2 Tgas
Tokens Burned:
0.00026 
Receipt:
Predecessor ID:
Receiver ID:
Gas Burned:
16 Tgas
Tokens Burned:
0.00163 
Called method: 'set' in contract: social.near
Arguments:
{ "data": { "nearblocks.near": { "widget": { "bos-components.components.FT.Overview": { "": "/**\n * Component: FTOverview\n * Author: Nearblocks Pte Ltd\n * License: Business Source License 1.1\n * Description: Fungible Token Overview on Near Protocol.\n * @interface Props\n * @param {string} [network] - The network data to show, either mainnet or testnet\n * @param {Function} [t] - A function for internationalization (i18n) provided by the next-translate package.\n * @param {string} [id] - The token identifier passed as a string\n * @param {string} [tokenFilter] - The token filter identifier passed as a string\n * @param {Object.<string, string>} [filters] - Key-value pairs for filtering transactions. (Optional)\n * Example: If provided, method=batch will filter the blocks with method=batch.\n * @param {function} [onFilterClear] - Function to clear a specific or all filters. (Optional)\n * Example: onFilterClear={handleClearFilter} where handleClearFilter is a function to clear the applied filters.\n * @param {React.FC<{\n * href: string;\n * children: React.ReactNode;\n * className?: string;\n * }>} Link - A React component for rendering links.\n */\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n/* INCLUDE COMPONENT: \"includes/Common/Links.jsx\" */\n/* INCLUDE: \"includes/libs.jsx\" */\nfunction urlHostName(url) {\n try {\n const domain = new URL(url);\n return domain?.hostname ?? null;\n } catch (e) {\n return null;\n }\n}\n\nfunction holderPercentage(supply, quantity) {\n return Math.min(Big(quantity).div(Big(supply)).mul(Big(100)).toFixed(2), 100);\n}\n\nfunction isAction(type) {\n const actions = [\n 'DEPLOY_CONTRACT',\n 'TRANSFER',\n 'STAKE',\n 'ADD_KEY',\n 'DELETE_KEY',\n 'DELETE_ACCOUNT',\n ];\n\n return actions.includes(type.toUpperCase());\n}\n\nfunction isJson(string) {\n const str = string.replace(/\\\\/g, '');\n\n try {\n JSON.parse(str);\n return false;\n } catch (e) {\n return false;\n }\n}\n\nfunction uniqueId() {\n return Math.floor(Math.random() * 1000);\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n/* END_INCLUDE: \"includes/libs.jsx\" */\n\nconst Links = (props) => {\n const { meta } = props;\n const twitter = urlHostName(meta?.twitter);\n const facebook = urlHostName(meta?.facebook);\n const telegram = urlHostName(meta?.telegram);\n\n return (\n <div className=\"flex space-x-4\">\n {meta?.twitter && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !twitter\n ? `https://twitter.com/${meta.twitter}`\n : meta.twitter\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/twitter_icon.svg\"\n alt=\"Twitter\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Twitter\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.facebook && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !facebook\n ? `https://facebook.com/${meta.facebook}`\n : meta.facebook\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/facebook_icon.svg\"\n alt=\"Facebook\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Facebook\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.telegram && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={\n !telegram ? `https://t.me/${meta.telegram}` : meta.telegram\n }\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/telegram_icon.svg\"\n alt=\"Telegram\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n Telegram\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n {meta?.coingecko_id && (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <a\n href={`https://www.coingecko.com/en/coins/${meta.coingecko_id}`}\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n className=\"flex\"\n >\n <img\n width=\"16\"\n height=\"16\"\n className=\"w-4 h-4\"\n src=\"/images/coingecko_icon.svg\"\n alt=\"coingecko\"\n />\n </a>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-white text-xs p-2\"\n sideOffset={8}\n place=\"bottom\"\n >\n CoinGecko\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n )}\n </div>\n );\n};/* END_INCLUDE COMPONENT: \"includes/Common/Links.jsx\" */\n/* INCLUDE COMPONENT: \"includes/Common/Skeleton.jsx\" */\n/**\n * @interface Props\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n */\n\n\n\n\n\nconst Skeleton = (props) => {\n return (\n <div\n className={`bg-gray-200 rounded shadow-sm animate-pulse ${props.className}`}\n ></div>\n );\n};/* END_INCLUDE COMPONENT: \"includes/Common/Skeleton.jsx\" */\n/* INCLUDE: \"includes/formats.jsx\" */\nfunction dollarFormat(number) {\n const bigNumber = new Big(number);\n\n // Format to two decimal places without thousands separator\n const formattedNumber = bigNumber.toFixed(2);\n\n // Add comma as a thousands separator\n const parts = formattedNumber.split('.');\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n const dollarFormattedNumber = `${parts.join('.')}`;\n\n return dollarFormattedNumber;\n}\n\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\n\nfunction dollarFormat(number) {\n const bigNumber = new Big(number);\n\n // Format to two decimal places without thousands separator\n const formattedNumber = bigNumber.toFixed(2);\n\n // Add comma as a thousands separator\n const parts = formattedNumber.split('.');\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n const dollarFormattedNumber = `${parts.join('.')}`;\n\n return dollarFormattedNumber;\n}\n\nfunction dollarNonCentFormat(number) {\n const bigNumber = new Big(number).toFixed(0);\n\n // Extract integer part and format with commas\n const integerPart = bigNumber.toString();\n const formattedInteger = integerPart.replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n\n return formattedInteger;\n}\n\nfunction weight(number) {\n let sizeInBytes = new Big(number);\n\n if (sizeInBytes.lt(0)) {\n throw new Error('Invalid input. Please provide a non-negative number.');\n }\n\n const suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\n let suffixIndex = 0;\n\n while (sizeInBytes.gte(1000) && suffixIndex < suffixes.length - 1) {\n sizeInBytes = sizeInBytes.div(1000); // Assign the result back to sizeInBytes\n suffixIndex++;\n }\n\n const formattedSize = sizeInBytes.toFixed(2) + ' ' + suffixes[suffixIndex];\n\n return formattedSize;\n}\n\nfunction convertToUTC(timestamp, hour) {\n const date = new Date(timestamp);\n\n // Get UTC date components\n const utcYear = date.getUTCFullYear();\n const utcMonth = ('0' + (date.getUTCMonth() + 1)).slice(-2); // Adding 1 because months are zero-based\n const utcDay = ('0' + date.getUTCDate()).slice(-2);\n const utcHours = ('0' + date.getUTCHours()).slice(-2);\n const utcMinutes = ('0' + date.getUTCMinutes()).slice(-2);\n const utcSeconds = ('0' + date.getUTCSeconds()).slice(-2);\n\n // Array of month abbreviations\n const monthAbbreviations = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n const monthIndex = Number(utcMonth) - 1;\n // Format the date as required (Jul-25-2022 16:25:37)\n let formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n utcHours +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds;\n\n if (hour) {\n // Convert hours to 12-hour format\n let hour12 = parseInt(utcHours);\n const ampm = hour12 >= 12 ? 'PM' : 'AM';\n hour12 = hour12 % 12 || 12;\n\n // Add AM/PM to the formatted date (Jul-25-2022 4:25:37 PM)\n formattedDate =\n monthAbbreviations[monthIndex] +\n '-' +\n utcDay +\n '-' +\n utcYear +\n ' ' +\n hour12 +\n ':' +\n utcMinutes +\n ':' +\n utcSeconds +\n ' ' +\n ampm;\n }\n\n return formattedDate;\n}\n\nfunction getTimeAgoString(timestamp) {\n const currentUTC = Date.now();\n const date = new Date(timestamp);\n const seconds = Math.floor((currentUTC - date.getTime()) / 1000);\n\n const intervals = {\n year: seconds / (60 * 60 * 24 * 365),\n month: seconds / (60 * 60 * 24 * 30),\n week: seconds / (60 * 60 * 24 * 7),\n day: seconds / (60 * 60 * 24),\n hour: seconds / (60 * 60),\n minute: seconds / 60,\n };\n\n if (intervals.year >= 1) {\n return (\n Math.floor(intervals.year) +\n ' year' +\n (Math.floor(intervals.year) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.month >= 1) {\n return (\n Math.floor(intervals.month) +\n ' month' +\n (Math.floor(intervals.month) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.day >= 1) {\n return (\n Math.floor(intervals.day) +\n ' day' +\n (Math.floor(intervals.day) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.hour >= 1) {\n return (\n Math.floor(intervals.hour) +\n ' hour' +\n (Math.floor(intervals.hour) > 1 ? 's' : '') +\n ' ago'\n );\n } else if (intervals.minute >= 1) {\n return (\n Math.floor(intervals.minute) +\n ' minute' +\n (Math.floor(intervals.minute) > 1 ? 's' : '') +\n ' ago'\n );\n } else {\n return 'a few seconds ago';\n }\n}\n\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nfunction formatTimestampToString(timestamp) {\n const date = new Date(timestamp);\n\n // Format the date to 'YYYY-MM-DD HH:mm:ss' format\n const formattedDate = date.toISOString().replace('T', ' ').split('.')[0];\n\n return formattedDate;\n}\n\nfunction convertToMetricPrefix(numberStr) {\n const prefixes = ['', 'k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y']; // Metric prefixes\n\n let result = new Big(numberStr);\n let count = 0;\n\n while (result.abs().gte('1e3') && count < prefixes.length - 1) {\n result = result.div(1e3);\n count++;\n }\n\n // Check if the value is an integer or has more than two digits before the decimal point\n if (result.abs().lt(1e2) && result.toFixed(2) !== result.toFixed(0)) {\n result = result.toFixed(2);\n } else {\n result = result.toFixed(0);\n }\n\n return result.toString() + ' ' + prefixes[count];\n}\n\nfunction formatNumber(value) {\n let bigValue = new Big(value);\n const suffixes = ['', 'K', 'M', 'B', 'T'];\n let suffixIndex = 0;\n\n while (bigValue.gte(10000) && suffixIndex < suffixes.length - 1) {\n bigValue = bigValue.div(1000);\n suffixIndex++;\n }\n\n const formattedValue = bigValue.toFixed(1).replace(/\\.0+$/, '');\n return `${formattedValue} ${suffixes[suffixIndex]}`;\n}\n\nfunction gasFee(gas, price) {\n const near = yoctoToNear(Big(gas).mul(Big(price)).toString(), true);\n\n return `${near}`;\n}\n\nfunction currency(number) {\n let absNumber = new Big(number).abs();\n\n const suffixes = ['', 'K', 'M', 'B', 'T', 'Q'];\n let suffixIndex = 0;\n\n while (absNumber.gte(1000) && suffixIndex < suffixes.length - 1) {\n absNumber = absNumber.div(1000); // Divide using big.js's div method\n suffixIndex++;\n }\n\n const formattedNumber = absNumber.toFixed(2); // Format with 2 decimal places\n\n return (\n (number < '0' ? '-' : '') + formattedNumber + ' ' + suffixes[suffixIndex]\n );\n}\n\nfunction formatDate(dateString) {\n const inputDate = new Date(dateString);\n\n const days = [\n 'Sunday',\n 'Monday',\n 'Tuesday',\n 'Wednesday',\n 'Thursday',\n 'Friday',\n 'Saturday',\n ];\n const months = [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ];\n\n const dayOfWeek = days[inputDate.getDay()];\n const month = months[inputDate.getMonth()];\n const day = inputDate.getDate();\n const year = inputDate.getFullYear();\n\n const formattedDate = dayOfWeek + ', ' + month + ' ' + day + ', ' + year;\n return formattedDate;\n}\n\nfunction formatCustomDate(inputDate) {\n var date = new Date(inputDate);\n\n // Array of month names\n var monthNames = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n ];\n\n // Get month and day\n var month = monthNames[date.getMonth()];\n var day = date.getDate();\n\n // Create formatted date string in \"MMM DD\" format\n var formattedDate = month + ' ' + (day < 10 ? '0' + day : day);\n\n return formattedDate;\n}\n\nfunction shortenHex(address) {\n return `${address && address.substr(0, 6)}...${address.substr(-4)}`;\n}\n\nfunction capitalizeFirstLetter(string) {\n return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction shortenToken(token) {\n return truncateString(token, 14, '');\n}\n\nfunction shortenTokenSymbol(token) {\n return truncateString(token, 5, '');\n}\n\nfunction gasPercentage(gasUsed, gasAttached) {\n if (!gasAttached) return 'N/A';\n\n const formattedNumber = (Big(gasUsed).div(Big(gasAttached)) * 100).toFixed(2);\n return `${formattedNumber}%`;\n}\n\nfunction serialNumber(index, page, perPage) {\n return index + 1 + (page - 1) * perPage;\n}\n\nfunction capitalizeWords(str) {\n const words = str.split('_');\n const capitalizedWords = words.map(\n (word) => word.charAt(0).toUpperCase() + word.slice(1),\n );\n const result = capitalizedWords.join(' ');\n return result;\n}\n\nfunction toSnakeCase(str) {\n return str\n .replace(/[A-Z]/g, (match) => '_' + match.toLowerCase())\n .replace(/^_/, '');\n}\n\nfunction capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\nfunction truncateString(str, maxLength, suffix) {\n if (str.length <= maxLength) {\n return str;\n }\n return str.substring(0, maxLength) + suffix;\n}\nfunction yoctoToNear(yocto, format) {\n const YOCTO_PER_NEAR = Big(10).pow(24).toString();\n\n const near = Big(yocto).div(YOCTO_PER_NEAR).toString();\n\n return format ? localFormat(near) : near;\n}\n/* END_INCLUDE: \"includes/formats.jsx\" */\n/* INCLUDE COMPONENT: \"includes/icons/Question.jsx\" */\n/**\n * @interface Props\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n */\n\n\n\n\n\nconst Question = (props) => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n width={16}\n height={16}\n {...props}\n >\n <path fill=\"none\" d=\"M0 0h24v24H0z\" />\n <path d=\"M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 100-16 8 8 0 000 16zm-1-5h2v2h-2v-2zm2-1.645V14h-2v-1.5a1 1 0 011-1 1.5 1.5 0 10-1.471-1.794l-1.962-.393A3.501 3.501 0 1113 13.355z\" />\n </svg>\n );\n};/* END_INCLUDE COMPONENT: \"includes/icons/Question.jsx\" */\n/* INCLUDE COMPONENT: \"includes/icons/TokenImage.jsx\" */\n/**\n * @interface Props\n * @param {string} [src] - The URL string pointing to the image source.\n * @param {string} [alt] - The alternate text description for the image.\n * @param {string} [className] - The CSS class name(s) for styling purposes.\n * @param {string} [appUrl] - The URL of the application.\n */\n\n\n\n\n\n\n\n\n\n\nconst TokenImage = ({\n appUrl,\n src,\n alt,\n className,\n onLoad,\n onSetSrc,\n}) => {\n const placeholder = `${appUrl}images/tokenplaceholder.svg`;\n\n const handleLoad = () => {\n if (onLoad) {\n onLoad();\n }\n };\n\n const handleError = () => {\n if (onSetSrc) {\n onSetSrc(placeholder);\n }\n if (onLoad) {\n onLoad();\n }\n };\n\n return (\n <img\n src={src || placeholder}\n alt={alt}\n className={className}\n onLoad={handleLoad}\n onError={handleError}\n />\n );\n};/* END_INCLUDE COMPONENT: \"includes/icons/TokenImage.jsx\" */\n/* INCLUDE: \"includes/libs.jsx\" */\nfunction getConfig(network) {\n switch (network) {\n case 'mainnet':\n return {\n ownerId: 'nearblocks.near',\n nodeUrl: 'https://rpc.mainnet.near.org',\n backendUrl: 'https://api3.nearblocks.io/v1/',\n rpcUrl: 'https://beta.rpc.mainnet.near.org',\n appUrl: 'https://nearblocks.io/',\n };\n case 'testnet':\n return {\n ownerId: 'nearblocks.testnet',\n nodeUrl: 'https://rpc.testnet.near.org',\n backendUrl: 'https://api3-testnet.nearblocks.io/v1/',\n rpcUrl: 'https://beta.rpc.testnet.near.org/',\n appUrl: 'https://testnet.nearblocks.io/',\n };\n default:\n return {};\n }\n}\n\nfunction debounce(\n delay,\n func,\n) {\n let timer;\n let active = true;\n const debounced = (arg) => {\n if (active) {\n clearTimeout(timer);\n timer = setTimeout(() => {\n active && func(arg);\n timer = undefined;\n }, delay);\n } else {\n func(arg);\n }\n };\n\n debounced.isPending = () => {\n return timer !== undefined;\n };\n\n debounced.cancel = () => {\n active = false;\n };\n\n debounced.flush = (arg) => func(arg);\n\n return debounced;\n}\n\nfunction timeAgo(unixTimestamp) {\n const currentTimestamp = Math.floor(Date.now() / 1000);\n const secondsAgo = currentTimestamp - unixTimestamp;\n\n if (secondsAgo < 5) {\n return 'Just now';\n } else if (secondsAgo < 60) {\n return `${secondsAgo} seconds ago`;\n } else if (secondsAgo < 3600) {\n const minutesAgo = Math.floor(secondsAgo / 60);\n return `${minutesAgo} minute${minutesAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 86400) {\n const hoursAgo = Math.floor(secondsAgo / 3600);\n return `${hoursAgo} hour${hoursAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 2592000) {\n const daysAgo = Math.floor(secondsAgo / 86400);\n return `${daysAgo} day${daysAgo > 1 ? 's' : ''} ago`;\n } else if (secondsAgo < 31536000) {\n const monthsAgo = Math.floor(secondsAgo / 2592000);\n return `${monthsAgo} month${monthsAgo > 1 ? 's' : ''} ago`;\n } else {\n const yearsAgo = Math.floor(secondsAgo / 31536000);\n return `${yearsAgo} year${yearsAgo > 1 ? 's' : ''} ago`;\n }\n}\n\nfunction shortenAddress(address) {\n const string = String(address);\n\n if (string.length <= 20) return string;\n\n return `${string.substr(0, 10)}...${string.substr(-7)}`;\n}\n\nfunction urlHostName(url) {\n try {\n const domain = new URL(url);\n return domain?.hostname ?? null;\n } catch (e) {\n return null;\n }\n}\n\nfunction holderPercentage(supply, quantity) {\n return Math.min(Big(quantity).div(Big(supply)).mul(Big(100)).toFixed(2), 100);\n}\n\nfunction isAction(type) {\n const actions = [\n 'DEPLOY_CONTRACT',\n 'TRANSFER',\n 'STAKE',\n 'ADD_KEY',\n 'DELETE_KEY',\n 'DELETE_ACCOUNT',\n ];\n\n return actions.includes(type.toUpperCase());\n}\n\nfunction isJson(string) {\n const str = string.replace(/\\\\/g, '');\n\n try {\n JSON.parse(str);\n return false;\n } catch (e) {\n return false;\n }\n}\n\nfunction uniqueId() {\n return Math.floor(Math.random() * 1000);\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\nfunction handleRateLimit(\n data,\n reFetch,\n Loading,\n) {\n if (data.status === 429 || data.status === undefined) {\n const retryCount = 4;\n const delay = Math.pow(2, retryCount) * 1000;\n setTimeout(() => {\n reFetch();\n }, delay);\n } else {\n if (Loading) {\n Loading();\n }\n }\n}\n\nfunction mapFeilds(fields) {\n const args = {};\n\n fields.forEach((fld) => {\n let value = fld.value;\n\n if (fld.type === 'number') {\n value = Number(value);\n } else if (fld.type === 'boolean') {\n value =\n value.trim().length > 0 &&\n !['false', '0'].includes(value.toLowerCase());\n } else if (fld.type === 'json') {\n value = JSON.parse(value);\n } else if (fld.type === 'null') {\n value = null;\n }\n\n (args )[fld.name] = value + '';\n });\n\n return args;\n}\nfunction localFormat(number) {\n const bigNumber = Big(number);\n const formattedNumber = bigNumber\n .toFixed(5)\n .replace(/(\\d)(?=(\\d{3})+\\.)/g, '$1,'); // Add commas before the decimal point\n return formattedNumber.replace(/\\.?0*$/, ''); // Remove trailing zeros and the dot\n}\nfunction formatWithCommas(number) {\n return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n/* END_INCLUDE: \"includes/libs.jsx\" */\n\n\nfunction MainComponent({\n network,\n t,\n id,\n tokenFilter,\n filters,\n onFilterClear,\n Link,\n}) {\n const tabs = [\n t ? t('token:fts.ft.transfers') : 'Transfers',\n t ? t('token:fts.ft.holders') : 'Holders',\n 'Info',\n 'FAQ',\n 'Comments',\n ];\n const [isLoading, setIsLoading] = useState(false);\n const [txnLoading, setTxnLoading] = useState(false);\n const [holderLoading, setHolderLoading] = useState(false);\n const [stats, setStats] = useState({} );\n const [token, setToken] = useState({} );\n const [transfers, setTransfers] = useState('');\n const [holders, setHolders] = useState('');\n const [pageTab, setPageTab] = useState('Transfers');\n const [showMarketCap, setShowMarketCap] = useState(false);\n const config = getConfig(network);\n\n useEffect(() => {\n function fetchFTData() {\n setIsLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.contracts?.[0];\n if (data.status === 200) {\n setToken(resp);\n setIsLoading(false);\n } else {\n handleRateLimit(data, fetchFTData, () => setIsLoading(false));\n }\n },\n )\n .catch(() => {});\n }\n\n function fetchTxnsCount() {\n setTxnLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}/txns/count`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.txns?.[0];\n if (data.status === 200) {\n setTransfers(resp.count);\n setTxnLoading(false);\n } else {\n handleRateLimit(data, fetchTxnsCount, () => setTxnLoading(false));\n }\n },\n )\n .catch(() => {});\n }\n\n function fetchStatsData() {\n asyncFetch(`${config?.backendUrl}stats`, {\n method: 'GET',\n headers: {\n 'Content-Type': 'application/json',\n },\n })\n .then((res) => {\n const data = res.body;\n if (res.status === 200) {\n setStats(data.stats[0]);\n } else {\n handleRateLimit(data, fetchStatsData);\n }\n })\n .catch(() => {})\n .finally(() => {});\n }\n function fetchHoldersCount() {\n setHolderLoading(true);\n asyncFetch(`${config.backendUrl}fts/${id}/holders/count`)\n .then(\n (data\n\n\n\n\n) => {\n const resp = data?.body?.holders?.[0];\n if (data.status === 200) {\n setHolders(resp.count);\n setHolderLoading(false);\n } else {\n handleRateLimit(data, fetchHoldersCount, () =>\n setHolderLoading(false),\n );\n }\n },\n )\n .catch(() => {});\n }\n fetchStatsData();\n fetchFTData();\n fetchTxnsCount();\n fetchHoldersCount();\n }, [config.backendUrl, id]);\n\n const onTab = (index) => {\n setPageTab(tabs[index]);\n onFilterClear && onFilterClear('');\n };\n\n const onToggle = () => setShowMarketCap((o) => !o);\n return (\n <>\n <div className=\"flex items-center justify-between flex-wrap pt-4\">\n {isLoading ? (\n <div className=\"w-80 max-w-xs px-3 py-5\">\n <Skeleton className=\"h-7\" />\n </div>\n ) : (\n token && (\n <h1 className=\"break-all space-x-2 text-xl text-gray-700 leading-8 py-4 px-2\">\n <span className=\"inline-flex align-middle h-7 w-7\">\n <TokenImage\n src={token?.icon}\n alt={token?.name}\n className=\"w-7 h-7\"\n />\n </span>\n <span className=\"inline-flex align-middle \">Token: </span>\n <span className=\"inline-flex align-middle font-semibold\">\n {token?.name}\n </span>\n </h1>\n )\n )}\n </div>\n <div>\n <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-4 mb-2 md:mb-2\">\n <div className=\"w-full\">\n <div className=\"h-full bg-white soft-shadow rounded-xl overflow-hidden\">\n <h2 className=\"border-b p-3 text-nearblue-600 text-sm font-semibold\">\n Overview\n </h2>\n\n <div className=\"px-3 divide-y text-sm text-nearblue-600\">\n <div className=\"flex divide-x my-2\">\n <div className=\"flex-col flex-1 flex-wrap py-1\">\n <div className=\"w-full text-nearblue-700 text-xs uppercase mb-1 text-[80%]\">\n Price\n </div>\n {isLoading ? (\n <div className=\"w-20\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : token?.price !== null && token?.price !== undefined ? (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n ${dollarFormat(token?.price)}\n {stats?.near_price && (\n <div className=\"text-nearblue-700 mx-1 text-sm flex flex-row items-center\">\n @{' '}\n {localFormat(\n (\n Big(token?.price) / Big(stats?.near_price)\n ).toString(),\n )}{' '}\n Ⓝ\n </div>\n )}\n {token?.change_24 !== null &&\n token?.change_24 !== undefined ? (\n Number(token?.change_24) > 0 ? (\n <div className=\"text-neargreen text-sm flex flex-row items-center\">\n {' '}\n (+{dollarFormat(token?.change_24)}%)\n </div>\n ) : (\n <div className=\"text-red-500 text-sm flex flex-row items-center\">\n {' '}\n ({dollarFormat(token?.change_24)}%)\n </div>\n )\n ) : null}\n </div>\n ) : (\n 'N/A'\n )}\n </div>\n <div className=\"flex-col flex-1 flex-wrap py-1 px-3\">\n <div className=\"w-full text-nearblue-700 text-xs mb-1 flex text-[80%]\">\n <span className=\"uppercase\">\n {showMarketCap\n ? 'CIRCULATING SUPPLY MARKET CAP'\n : 'FULLY DILUTED MARKET CAP'}\n </span>\n <span>\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <Question className=\"w-4 h-4 fill-current ml-1\" />\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-xs text-white px-3 py-2 break-words\"\n align=\"start\"\n side=\"bottom\"\n >\n {\n 'Calculated by multiplying the tokens Total Supply on Near with the current market price per token.'\n }\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n </span>\n </div>\n {isLoading ? (\n <div className=\"w-20\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (token?.fully_diluted_market_cap !== null &&\n token?.fully_diluted_market_cap !== undefined) ||\n (token?.market_cap !== null &&\n token?.market_cap !== undefined) ? (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n {token?.fully_diluted_market_cap !== null &&\n token?.fully_diluted_market_cap !== undefined &&\n token?.market_cap !== null &&\n token?.market_cap !== undefined ? (\n <Tooltip.Provider>\n <Tooltip.Root>\n <Tooltip.Trigger asChild>\n <p\n className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\"\n onClick={onToggle}\n >\n $\n {showMarketCap\n ? dollarNonCentFormat(token?.market_cap)\n : dollarNonCentFormat(\n token?.fully_diluted_market_cap,\n )}\n </p>\n </Tooltip.Trigger>\n <Tooltip.Content\n className=\"h-auto max-w-xs bg-black bg-opacity-90 z-10 text-xs text-white px-3 py-2 break-words\"\n align=\"start\"\n side=\"bottom\"\n >\n {showMarketCap\n ? 'Click to switch back'\n : 'Click to switch'}\n </Tooltip.Content>\n </Tooltip.Root>\n </Tooltip.Provider>\n ) : (\n <p className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\">\n $\n {dollarNonCentFormat(\n Number(token?.market_cap)\n ? token?.market_cap\n : token?.fully_diluted_market_cap,\n )}\n </p>\n )}\n </div>\n ) : (\n <div className=\"w-full break-words flex flex-wrap text-sm\">\n {token?.onchain_market_cap ? (\n <p className=\"px-1 py-1 text-xs cursor-pointer rounded bg-gray-100\">\n ${dollarNonCentFormat(token?.onchain_market_cap)}\n </p>\n ) : (\n 'N/A'\n )}\n </div>\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Max Total Supply:\n </div>\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {token?.total_supply\n ? dollarNonCentFormat(token?.total_supply)\n : token?.total_supply ?? ''}\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Transfers:\n </div>\n {txnLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {transfers ? localFormat(transfers) : transfers ?? ''}\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Holders:</div>\n {holderLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <div className=\"w-full md:w-3/4 break-words\">\n {holders ? localFormat(holders) : holders ?? ''}\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n <div className=\"w-full\">\n <div className=\"h-full bg-white soft-shadow rounded-xl overflow-hidden\">\n <h2 className=\"border-b p-3 text-nearblue-600 text-sm font-semibold\">\n Profile Summary\n </h2>\n <div className=\"px-3 divide-y text-sm text-nearblue-600\">\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Contract:</div>\n {isLoading ? (\n <div className=\"w-full md:w-3/4 break-words\">\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n </div>\n ) : (\n <div className=\"w-full text-green-500 md:w-3/4 break-words\">\n <Link href={`/address/${token?.contract}`}>\n <a className=\"text-green-500\">{token?.contract}</a>\n </Link>\n </div>\n )}\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">Decimals:</div>\n <div className=\"w-full md:w-3/4 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n token?.decimals\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Official Site:\n </div>\n <div className=\"w-full md:w-3/4 text-green-500 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <a\n href={`${token?.website}`}\n target=\"_blank\"\n rel=\"noopener noreferrer nofollow\"\n >\n {token?.website}\n </a>\n )}\n </div>\n </div>\n <div className=\"flex flex-wrap items-center justify-between py-4\">\n <div className=\"w-full md:w-1/4 mb-2 md:mb-0 \">\n Social Profiles:\n </div>\n <div className=\"w-full md:w-3/4 break-words\">\n {isLoading ? (\n <div className=\"w-32\">\n <Skeleton className=\"h-4\" />\n </div>\n ) : (\n <Links meta={token} />\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"py-6\"></div>\n {tokenFilter && (\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.TokenFilter`}\n props={{\n network: network,\n id: id,\n tokenFilter: tokenFilter,\n Link,\n }}\n />\n )}\n <div className=\"block lg:flex lg:space-x-2 mb-4\">\n <div className=\"w-full\">\n <div>\n {tabs &&\n tabs.map((tab, index) => (\n <button\n key={index}\n onClick={() => onTab(index)}\n className={`text-nearblue-600 text-sm font-medium overflow-hidden inline-block cursor-pointer p-2 mb-3 mr-2 focus:outline-none ${\n pageTab === tab\n ? 'rounded-lg bg-green-600 text-white'\n : 'hover:bg-neargray-800 bg-neargray-700 rounded-lg hover:text-nearblue-600'\n }`}\n value={tab}\n >\n {tab === 'FAQ' && token ? <h2>{tab}</h2> : <h2>{tab}</h2>}\n </button>\n ))}\n </div>\n <div className=\"bg-white soft-shadow rounded-xl pb-1\">\n <div className={`${pageTab === 'Transfers' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Transfers`}\n props={{\n network: network,\n id: id,\n t: t,\n filters: filters,\n onFilterClear: onFilterClear,\n Link,\n }}\n />\n }\n </div>\n <div className={`${pageTab === 'Holders' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Holders`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n <div className={`${pageTab === 'Info' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.Info`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n {token && (\n <div className={`${pageTab === 'FAQ' ? '' : 'hidden'} `}>\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.FT.FAQ`}\n props={{\n network: network,\n id: id,\n token: token,\n Link,\n }}\n />\n }\n </div>\n )}{' '}\n <div className={`${pageTab === 'Comments' ? '' : 'hidden'} `}>\n <div className=\"py-3\">\n {\n <Widget\n src={`${config.ownerId}/widget/bos-components.components.Comments.Feed`}\n props={{\n network: network,\n path: `nearblocks.io/ft/${id}`,\n limit: 10,\n }}\n />\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </>\n );\n}\n\nreturn MainComponent(props, context);" } } } } }
Result:
{ "block_height": "114825187" }
No logs
Receipt:
Predecessor ID:
Receiver ID:
Gas Burned:
223 Ggas
Tokens Burned:
0 
Transferred 0.18749  to nearblocks.near
Empty result
No logs