explorer: Update bootstrap and dashkit (#21458)
* Update dashkit style assets * Update bootstrap to v5 * Fixes for new dashkit and bootstrap * Fix deprecation warnings in dashkit * Bump bootstrap to v5.1
This commit is contained in:
Justin Starry
GitHub
parent
160fb69d7d
commit
ffb5518cbe
|
|
@ -36,7 +36,7 @@
|
|||
"@types/socket.io-client": "^3.0.0",
|
||||
"bignumber.js": "^9.0.1",
|
||||
"bn.js": "^5.2.0",
|
||||
"bootstrap": "^4.6.0",
|
||||
"bootstrap": "~5.1.3",
|
||||
"bs58": "^4.0.1",
|
||||
"chai": "^4.3.4",
|
||||
"chart.js": "^2.9.4",
|
||||
|
|
@ -4858,6 +4858,16 @@
|
|||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/@popperjs/core": {
|
||||
"version": "2.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.0.tgz",
|
||||
"integrity": "sha512-zrsUxjLOKAzdewIDRWy9nsV1GQsKBCWaGwsZQlCgr6/q+vjyZhFgqedLfFBuI9anTPEUT4APq9Mu0SZBTzIcGQ==",
|
||||
"peer": true,
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
},
|
||||
"node_modules/@project-serum/anchor": {
|
||||
"version": "0.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@project-serum/anchor/-/anchor-0.11.1.tgz",
|
||||
|
|
@ -8229,16 +8239,15 @@
|
|||
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
|
||||
},
|
||||
"node_modules/bootstrap": {
|
||||
"version": "4.6.0",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz",
|
||||
"integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==",
|
||||
"version": "5.1.3",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz",
|
||||
"integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==",
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/bootstrap"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"jquery": "1.9.1 - 3",
|
||||
"popper.js": "^1.16.1"
|
||||
"@popperjs/core": "^2.10.2"
|
||||
}
|
||||
},
|
||||
"node_modules/borsh": {
|
||||
|
|
@ -17948,12 +17957,6 @@
|
|||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/jquery": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
|
||||
"integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==",
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/js-sha256": {
|
||||
"version": "0.9.0",
|
||||
"resolved": "https://registry.npmjs.org/js-sha256/-/js-sha256-0.9.0.tgz",
|
||||
|
|
@ -20067,17 +20070,6 @@
|
|||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/popper.js": {
|
||||
"version": "1.16.1",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
|
||||
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
|
||||
"deprecated": "You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1",
|
||||
"peer": true,
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/popperjs"
|
||||
}
|
||||
},
|
||||
"node_modules/portfinder": {
|
||||
"version": "1.0.28",
|
||||
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
|
||||
|
|
@ -31093,6 +31085,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"@popperjs/core": {
|
||||
"version": "2.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.0.tgz",
|
||||
"integrity": "sha512-zrsUxjLOKAzdewIDRWy9nsV1GQsKBCWaGwsZQlCgr6/q+vjyZhFgqedLfFBuI9anTPEUT4APq9Mu0SZBTzIcGQ==",
|
||||
"peer": true
|
||||
},
|
||||
"@project-serum/anchor": {
|
||||
"version": "0.11.1",
|
||||
"resolved": "https://registry.npmjs.org/@project-serum/anchor/-/anchor-0.11.1.tgz",
|
||||
|
|
@ -33721,9 +33719,9 @@
|
|||
"integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
|
||||
},
|
||||
"bootstrap": {
|
||||
"version": "4.6.0",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz",
|
||||
"integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw==",
|
||||
"version": "5.1.3",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz",
|
||||
"integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q==",
|
||||
"requires": {}
|
||||
},
|
||||
"borsh": {
|
||||
|
|
@ -41199,12 +41197,6 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
|
||||
"integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==",
|
||||
"peer": true
|
||||
},
|
||||
"js-sha256": {
|
||||
"version": "0.9.0",
|
||||
"resolved": "https://registry.npmjs.org/js-sha256/-/js-sha256-0.9.0.tgz",
|
||||
|
|
@ -42910,12 +42902,6 @@
|
|||
"ts-pnp": "^1.1.6"
|
||||
}
|
||||
},
|
||||
"popper.js": {
|
||||
"version": "1.16.1",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
|
||||
"integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
|
||||
"peer": true
|
||||
},
|
||||
"portfinder": {
|
||||
"version": "1.0.28",
|
||||
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@
|
|||
"@types/socket.io-client": "^3.0.0",
|
||||
"bignumber.js": "^9.0.1",
|
||||
"bn.js": "^5.2.0",
|
||||
"bootstrap": "^4.6.0",
|
||||
"bootstrap": "~5.1.3",
|
||||
"bs58": "^4.0.1",
|
||||
"chai": "^4.3.4",
|
||||
"chart.js": "^2.9.4",
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import { Location } from "history";
|
|||
import {
|
||||
useCluster,
|
||||
ClusterStatus,
|
||||
clusterUrl,
|
||||
clusterName,
|
||||
clusterSlug,
|
||||
CLUSTERS,
|
||||
|
|
@ -34,52 +33,50 @@ export function ClusterModal() {
|
|||
return (
|
||||
<>
|
||||
<div
|
||||
className={`modal fade fixed-right${show ? " show" : ""}`}
|
||||
className={`offcanvas offcanvas-end${show ? " show" : ""}`}
|
||||
onClick={onClose}
|
||||
>
|
||||
<div className="modal-dialog modal-dialog-vertical">
|
||||
<div className="modal-content">
|
||||
<div className="modal-body" onClick={(e) => e.stopPropagation()}>
|
||||
<span className="c-pointer" onClick={onClose}>
|
||||
×
|
||||
</span>
|
||||
<div className="modal-body" onClick={(e) => e.stopPropagation()}>
|
||||
<span className="c-pointer" onClick={onClose}>
|
||||
×
|
||||
</span>
|
||||
|
||||
<h2 className="text-center mb-4 mt-4">Choose a Cluster</h2>
|
||||
<ClusterToggle />
|
||||
<h2 className="text-center mb-4 mt-4">Choose a Cluster</h2>
|
||||
<ClusterToggle />
|
||||
|
||||
{showDeveloperSettings && (
|
||||
<>
|
||||
<hr />
|
||||
{showDeveloperSettings && (
|
||||
<>
|
||||
<hr />
|
||||
|
||||
<h2 className="text-center mb-4 mt-4">Developer Settings</h2>
|
||||
<div className="d-flex justify-content-between">
|
||||
<span className="mr-3">Enable custom url param</span>
|
||||
<div className="custom-control custom-switch d-inline">
|
||||
<input
|
||||
type="checkbox"
|
||||
defaultChecked={enableCustomUrl}
|
||||
className="custom-control-input"
|
||||
id="cardToggle"
|
||||
onChange={onToggleCustomUrlFeature}
|
||||
/>
|
||||
<label
|
||||
className="custom-control-label"
|
||||
htmlFor="cardToggle"
|
||||
></label>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-muted font-size-sm mt-3">
|
||||
Enable this setting to easily connect to a custom cluster
|
||||
via the "customUrl" url param.
|
||||
</p>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<h2 className="text-center mb-4 mt-4">Developer Settings</h2>
|
||||
<div className="d-flex justify-content-between">
|
||||
<span className="me-3">Enable custom url param</span>
|
||||
<div className="form-check form-switch">
|
||||
<input
|
||||
type="checkbox"
|
||||
defaultChecked={enableCustomUrl}
|
||||
className="form-check-input"
|
||||
id="cardToggle"
|
||||
onChange={onToggleCustomUrlFeature}
|
||||
/>
|
||||
<label
|
||||
className="form-check-label"
|
||||
htmlFor="cardToggle"
|
||||
></label>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-muted font-size-sm mt-3">
|
||||
Enable this setting to easily connect to a custom cluster via
|
||||
the "customUrl" url param.
|
||||
</p>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Overlay show={show} />
|
||||
<div onClick={onClose}>
|
||||
<Overlay show={show} />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -93,8 +90,9 @@ function CustomClusterInput({ activeSuffix, active }: InputProps) {
|
|||
const history = useHistory();
|
||||
const location = useLocation();
|
||||
|
||||
const customClass = (prefix: string) =>
|
||||
active ? `${prefix}-${activeSuffix}` : "";
|
||||
const btnClass = active
|
||||
? `border-${activeSuffix} text-${activeSuffix}`
|
||||
: "btn-white";
|
||||
|
||||
const clusterLocation = (location: Location) => {
|
||||
if (customUrl.length > 0) {
|
||||
|
|
@ -118,31 +116,26 @@ function CustomClusterInput({ activeSuffix, active }: InputProps) {
|
|||
|
||||
const inputTextClass = editing ? "" : "text-muted";
|
||||
return (
|
||||
<Link
|
||||
to={(location) => clusterLocation(location)}
|
||||
className="btn input-group input-group-merge p-0"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
defaultValue={customUrl}
|
||||
className={`form-control form-control-prepended ${inputTextClass} ${customClass(
|
||||
"border"
|
||||
)}`}
|
||||
onFocus={() => setEditing(true)}
|
||||
onBlur={() => setEditing(false)}
|
||||
onInput={(e) => onUrlInput(e.currentTarget.value)}
|
||||
/>
|
||||
<div className="input-group-prepend">
|
||||
<div className={`input-group-text pr-0 ${customClass("border")}`}>
|
||||
<span className={customClass("text") || ""}>Custom:</span>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<>
|
||||
<Link className={`btn col-12 mb-3 ${btnClass}`} to={clusterLocation}>
|
||||
Custom RPC URL
|
||||
</Link>
|
||||
{active && (
|
||||
<input
|
||||
type="text"
|
||||
defaultValue={customUrl}
|
||||
className={`form-control ${inputTextClass}`}
|
||||
onFocus={() => setEditing(true)}
|
||||
onBlur={() => setEditing(false)}
|
||||
onInput={(e) => onUrlInput(e.currentTarget.value)}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function ClusterToggle() {
|
||||
const { status, cluster, customUrl } = useCluster();
|
||||
const { status, cluster } = useCluster();
|
||||
|
||||
let activeSuffix = "";
|
||||
switch (status) {
|
||||
|
|
@ -193,13 +186,10 @@ function ClusterToggle() {
|
|||
return (
|
||||
<Link
|
||||
key={index}
|
||||
className={`btn text-left col-12 mb-3 ${btnClass}`}
|
||||
className={`btn col-12 mb-3 ${btnClass}`}
|
||||
to={clusterLocation}
|
||||
>
|
||||
{`${clusterName(net)}: `}
|
||||
<span className="text-muted d-inline-block">
|
||||
{clusterUrl(net, customUrl).replace("explorer-", "")}
|
||||
</span>
|
||||
{clusterName(net)}
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -36,13 +36,13 @@ function Button() {
|
|||
return `btn d-block btn-${variant}`;
|
||||
};
|
||||
|
||||
const spinnerClasses = "spinner-grow spinner-grow-sm mr-2";
|
||||
const spinnerClasses = "spinner-grow spinner-grow-sm me-2";
|
||||
|
||||
switch (status) {
|
||||
case ClusterStatus.Connected:
|
||||
return (
|
||||
<span className={btnClasses("primary")}>
|
||||
<span className="fe fe-check-circle mr-2"></span>
|
||||
<span className="fe fe-check-circle me-2"></span>
|
||||
{statusName}
|
||||
</span>
|
||||
);
|
||||
|
|
@ -62,7 +62,7 @@ function Button() {
|
|||
case ClusterStatus.Failure:
|
||||
return (
|
||||
<span className={btnClasses("danger")}>
|
||||
<span className="fe fe-alert-circle mr-2"></span>
|
||||
<span className="fe fe-alert-circle me-2"></span>
|
||||
{statusName}
|
||||
</span>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -67,7 +67,7 @@ export function MessageBanner() {
|
|||
<div className="container">
|
||||
<div className="d-flex flex-column align-items-center justify-content-center text-center py-3">
|
||||
<h3 className="mb-0 line-height-md">
|
||||
<span className="fe fe-alert-circle mr-2"></span>
|
||||
<span className="fe fe-alert-circle me-2"></span>
|
||||
{message}
|
||||
</h3>
|
||||
{timeframe}
|
||||
|
|
|
|||
|
|
@ -24,11 +24,11 @@ export function Navbar() {
|
|||
</button>
|
||||
|
||||
<div
|
||||
className={`collapse navbar-collapse ml-auto mr-4 ${
|
||||
className={`collapse navbar-collapse ms-auto me-4 ${
|
||||
collapse ? "show" : ""
|
||||
}`}
|
||||
>
|
||||
<ul className="navbar-nav mr-auto">
|
||||
<ul className="navbar-nav me-auto">
|
||||
<li className="nav-item">
|
||||
<NavLink className="nav-link" to={clusterPath("/")} exact>
|
||||
Cluster Stats
|
||||
|
|
|
|||
|
|
@ -42,13 +42,13 @@ export function ProgramLogsCardBody({
|
|||
<tr key={index}>
|
||||
<td>
|
||||
<div className="d-flex align-items-center">
|
||||
<span className={`badge badge-soft-${badgeColor} mr-2`}>
|
||||
<span className={`badge bg-${badgeColor}-soft me-2`}>
|
||||
#{index + 1}
|
||||
</span>
|
||||
{programName} Instruction
|
||||
</div>
|
||||
{programLogs && (
|
||||
<div className="d-flex align-items-start flex-column text-monospace p-2 font-size-sm">
|
||||
<div className="d-flex align-items-start flex-column font-monospace p-2 font-size-sm">
|
||||
{programLogs.logs.map((log, key) => {
|
||||
return (
|
||||
<span key={key}>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ export function SearchBar() {
|
|||
const history = useHistory();
|
||||
const location = useLocation();
|
||||
const { tokenRegistry } = useTokenRegistry();
|
||||
const { cluster, epochInfo } = useCluster();
|
||||
const { cluster, clusterInfo } = useCluster();
|
||||
|
||||
const onChange = (
|
||||
{ pathname }: ValueType<any, false>,
|
||||
|
|
@ -48,7 +48,7 @@ export function SearchBar() {
|
|||
search,
|
||||
cluster,
|
||||
tokenRegistry,
|
||||
epochInfo?.epoch
|
||||
clusterInfo?.epochInfo.epoch
|
||||
)}
|
||||
noOptionsMessage={() => "No Results"}
|
||||
placeholder="Search for blocks, accounts, transactions, programs, and tokens"
|
||||
|
|
|
|||
|
|
@ -32,14 +32,14 @@ export function SupplyCard() {
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td className="w-100">Total Supply (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={supply.total} maximumFractionDigits={0} />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td className="w-100">Circulating Supply (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance
|
||||
lamports={supply.circulating}
|
||||
maximumFractionDigits={0}
|
||||
|
|
@ -49,7 +49,7 @@ export function SupplyCard() {
|
|||
|
||||
<tr>
|
||||
<td className="w-100">Non-Circulating Supply (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance
|
||||
lamports={supply.nonCirculating}
|
||||
maximumFractionDigits={0}
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ export function TopAccountsCard() {
|
|||
{richList === Status.Idle && (
|
||||
<div className="card-body">
|
||||
<span
|
||||
className="btn btn-white ml-3 d-none d-md-inline"
|
||||
className="btn btn-white ms-3 d-none d-md-inline"
|
||||
onClick={fetchRichList}
|
||||
>
|
||||
Load Largest Accounts
|
||||
|
|
@ -101,10 +101,8 @@ export function TopAccountsCard() {
|
|||
<tr>
|
||||
<th className="text-muted">Rank</th>
|
||||
<th className="text-muted">Address</th>
|
||||
<th className="text-muted text-right">Balance (SOL)</th>
|
||||
<th className="text-muted text-right">
|
||||
% of {header} Supply
|
||||
</th>
|
||||
<th className="text-muted text-end">Balance (SOL)</th>
|
||||
<th className="text-muted text-end">% of {header} Supply</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="list">
|
||||
|
|
@ -128,18 +126,17 @@ const renderAccountRow = (
|
|||
return (
|
||||
<tr key={index}>
|
||||
<td>
|
||||
<span className="badge badge-soft-gray badge-pill">{index + 1}</span>
|
||||
<span className="badge bg-gray-soft badge-pill">{index + 1}</span>
|
||||
</td>
|
||||
<td>
|
||||
<Address pubkey={account.address} link />
|
||||
</td>
|
||||
<td className="text-right">
|
||||
<td className="text-end">
|
||||
<SolBalance lamports={account.lamports} maximumFractionDigits={0} />
|
||||
</td>
|
||||
<td className="text-right">{`${(
|
||||
(100 * account.lamports) /
|
||||
supply
|
||||
).toFixed(3)}%`}</td>
|
||||
<td className="text-end">{`${((100 * account.lamports) / supply).toFixed(
|
||||
3
|
||||
)}%`}</td>
|
||||
</tr>
|
||||
);
|
||||
};
|
||||
|
|
@ -203,9 +200,7 @@ const FilterDropdown = ({ filter, toggle, show }: DropdownProps) => {
|
|||
>
|
||||
{filterTitle(filter)}
|
||||
</button>
|
||||
<div
|
||||
className={`dropdown-menu-right dropdown-menu${show ? " show" : ""}`}
|
||||
>
|
||||
<div className={`dropdown-menu-end dropdown-menu${show ? " show" : ""}`}>
|
||||
{FILTERS.map((filterOption) => {
|
||||
return (
|
||||
<Link
|
||||
|
|
|
|||
|
|
@ -172,11 +172,11 @@ function TpsBarChart({ performanceInfo }: TpsBarChartProps) {
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td className="w-100">Transaction count</td>
|
||||
<td className="text-lg-right text-monospace">{transactionCount} </td>
|
||||
<td className="text-lg-end font-monospace">{transactionCount} </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Transactions per second (TPS)</td>
|
||||
<td className="text-lg-right text-monospace">{averageTps} </td>
|
||||
<td className="text-lg-end font-monospace">{averageTps} </td>
|
||||
</tr>
|
||||
</TableCardBody>
|
||||
|
||||
|
|
@ -192,7 +192,7 @@ function TpsBarChart({ performanceInfo }: TpsBarChartProps) {
|
|||
<button
|
||||
key={key}
|
||||
onClick={() => setSeries(key)}
|
||||
className={classNames("btn btn-sm btn-white ml-2", {
|
||||
className={classNames("btn btn-sm btn-white ms-2", {
|
||||
active: series === key,
|
||||
})}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ const renderAccountRow = (entry: RecentBlockhashesEntry, index: number) => {
|
|||
return (
|
||||
<tr key={index}>
|
||||
<td className="w-1">{index + 1}</td>
|
||||
<td className="w-1 text-monospace">{entry.blockhash}</td>
|
||||
<td className="w-1 font-monospace">{entry.blockhash}</td>
|
||||
<td className="">
|
||||
{entry.feeCalculator.lamportsPerSignature} lamports per signature
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -67,12 +67,12 @@ function StakeConfigCard({
|
|||
|
||||
<tr>
|
||||
<td>Warmup / Cooldown Rate</td>
|
||||
<td className="text-lg-right">{warmupCooldownFormatted}</td>
|
||||
<td className="text-lg-end">{warmupCooldownFormatted}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Slash Penalty</td>
|
||||
<td className="text-lg-right">{slashPenaltyFormatted}</td>
|
||||
<td className="text-lg-end">{slashPenaltyFormatted}</td>
|
||||
</tr>
|
||||
</TableCardBody>
|
||||
</div>
|
||||
|
|
@ -101,7 +101,7 @@ function ValidatorInfoCard({
|
|||
{configAccount.info.configData.name && (
|
||||
<tr>
|
||||
<td>Name</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{configAccount.info.configData.name}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -110,7 +110,7 @@ function ValidatorInfoCard({
|
|||
{configAccount.info.configData.keybaseUsername && (
|
||||
<tr>
|
||||
<td>Keybase Username</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{configAccount.info.configData.keybaseUsername}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -119,7 +119,7 @@ function ValidatorInfoCard({
|
|||
{configAccount.info.configData.website && (
|
||||
<tr>
|
||||
<td>Website</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<a
|
||||
href={configAccount.info.configData.website}
|
||||
target="_blank"
|
||||
|
|
@ -134,7 +134,7 @@ function ValidatorInfoCard({
|
|||
{configAccount.info.configData.details && (
|
||||
<tr>
|
||||
<td>Details</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{configAccount.info.configData.details}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -143,7 +143,7 @@ function ValidatorInfoCard({
|
|||
{configAccount.info.keys && configAccount.info.keys.length > 1 && (
|
||||
<tr>
|
||||
<td>Signer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={new PublicKey(configAccount.info.keys[1].pubkey)}
|
||||
link
|
||||
|
|
|
|||
|
|
@ -30,12 +30,12 @@ export function HistoryCardHeader({
|
|||
>
|
||||
{fetching ? (
|
||||
<>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</>
|
||||
)}
|
||||
|
|
@ -65,7 +65,7 @@ export function HistoryCardFooter({
|
|||
>
|
||||
{fetching ? (
|
||||
<>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -17,20 +17,20 @@ export function NFTHeader({
|
|||
const metadata = nftData.metadata;
|
||||
return (
|
||||
<div className="row">
|
||||
<div className="col-auto ml-2 d-flex align-items-center">
|
||||
<div className="col-auto ms-2 d-flex align-items-center">
|
||||
<ArtContent metadata={metadata} pubkey={address} />
|
||||
</div>
|
||||
<div className="col mb-3 ml-0.5 mt-3">
|
||||
{<h6 className="header-pretitle ml-1">Metaplex NFT</h6>}
|
||||
<div className="col mb-3 ms-0.5 mt-3">
|
||||
{<h6 className="header-pretitle ms-1">Metaplex NFT</h6>}
|
||||
<div className="d-flex align-items-center">
|
||||
<h2 className="header-title ml-1 align-items-center no-overflow-with-ellipsis">
|
||||
<h2 className="header-title ms-1 align-items-center no-overflow-with-ellipsis">
|
||||
{metadata.data.name !== ""
|
||||
? metadata.data.name
|
||||
: "No NFT name was found"}
|
||||
</h2>
|
||||
{getEditionPill(nftData.editionInfo)}
|
||||
</div>
|
||||
<h4 className="header-pretitle ml-1 mt-1 no-overflow-with-ellipsis">
|
||||
<h4 className="header-pretitle ms-1 mt-1 no-overflow-with-ellipsis">
|
||||
{metadata.data.symbol !== ""
|
||||
? metadata.data.symbol
|
||||
: "No Symbol was found"}
|
||||
|
|
@ -43,7 +43,7 @@ export function NFTHeader({
|
|||
<button
|
||||
className="btn btn-dark btn-sm dropdown-toggle creators-dropdown-button-width"
|
||||
type="button"
|
||||
data-toggle="dropdown"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-haspopup="true"
|
||||
aria-expanded="false"
|
||||
>
|
||||
|
|
@ -72,12 +72,12 @@ function getCreatorDropdownItems(creators: Creator[] | null) {
|
|||
"d-flex align-items-center dropdown-header creator-dropdown-entry"
|
||||
}
|
||||
>
|
||||
<div className="d-flex text-monospace creator-dropdown-header">
|
||||
<div className="d-flex font-monospace creator-dropdown-header">
|
||||
<span>Creator Address</span>
|
||||
<InfoTooltip bottom text={creatorTooltip} />
|
||||
</div>
|
||||
<div className="d-flex text-monospace">
|
||||
<span className="text-monospace">Royalty</span>
|
||||
<div className="d-flex font-monospace">
|
||||
<span className="font-monospace">Royalty</span>
|
||||
<InfoTooltip bottom text={shareTooltip} />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -86,24 +86,24 @@ function getCreatorDropdownItems(creators: Creator[] | null) {
|
|||
|
||||
const getVerifiedIcon = (isVerified: boolean) => {
|
||||
const className = isVerified ? "fe fe-check" : "fe fe-alert-octagon";
|
||||
return <i className={`ml-3 ${className}`}></i>;
|
||||
return <i className={`ms-3 ${className}`}></i>;
|
||||
};
|
||||
|
||||
const CreatorEntry = (creator: Creator) => {
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
"d-flex align-items-center text-monospace creator-dropdown-entry ml-3 mr-3"
|
||||
"d-flex align-items-center font-monospace creator-dropdown-entry ms-3 me-3"
|
||||
}
|
||||
>
|
||||
{getVerifiedIcon(creator.verified)}
|
||||
<Link
|
||||
className="dropdown-item text-monospace creator-dropdown-entry-address"
|
||||
className="dropdown-item font-monospace creator-dropdown-entry-address"
|
||||
to={clusterPath(`/address/${creator.address}`)}
|
||||
>
|
||||
{creator.address}
|
||||
</Link>
|
||||
<div className="mr-3"> {`${creator.share}%`}</div>
|
||||
<div className="me-3"> {`${creator.share}%`}</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
@ -120,8 +120,8 @@ function getCreatorDropdownItems(creators: Creator[] | null) {
|
|||
}
|
||||
|
||||
return (
|
||||
<div className={"dropdown-item text-monospace"}>
|
||||
<div className="mr-3">No creators are associated with this NFT.</div>
|
||||
<div className={"dropdown-item font-monospace"}>
|
||||
<div className="me-3">No creators are associated with this NFT.</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -131,8 +131,8 @@ function getEditionPill(editionInfo: EditionInfo) {
|
|||
const edition = editionInfo.edition;
|
||||
|
||||
return (
|
||||
<div className={"d-inline-flex ml-2"}>
|
||||
<span className="badge badge-pill badge-dark">{`${
|
||||
<div className={"d-inline-flex ms-2"}>
|
||||
<span className="badge badge-pill bg-dark">{`${
|
||||
edition && masterEdition
|
||||
? `Edition ${edition.edition.toNumber()} / ${masterEdition.supply.toNumber()}`
|
||||
: masterEdition
|
||||
|
|
@ -152,7 +152,7 @@ function getSaleTypePill(hasPrimarySaleHappened: boolean) {
|
|||
|
||||
return (
|
||||
<div className={"d-inline-flex align-items-center"}>
|
||||
<span className="badge badge-pill badge-dark">{`${
|
||||
<span className="badge badge-pill bg-dark">{`${
|
||||
hasPrimarySaleHappened ? "Secondary Market" : "Primary Market"
|
||||
}`}</span>
|
||||
<InfoTooltip
|
||||
|
|
@ -167,7 +167,7 @@ function getSaleTypePill(hasPrimarySaleHappened: boolean) {
|
|||
|
||||
function getIsMutablePill(isMutable: boolean) {
|
||||
return (
|
||||
<span className="badge badge-pill badge-dark">{`${
|
||||
<span className="badge badge-pill bg-dark">{`${
|
||||
isMutable ? "Mutable" : "Immutable"
|
||||
}`}</span>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -30,21 +30,21 @@ export function NonceAccountSection({
|
|||
|
||||
<tr>
|
||||
<td>Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={nonceAccount.info.authority} alignRight raw link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Blockhash</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<code>{nonceAccount.info.blockhash}</code>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Fee</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{nonceAccount.info.feeCalculator.lamportsPerSignature} lamports per
|
||||
signature
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -253,9 +253,7 @@ const DisplayDropdown = ({ display, toggle, show }: DropdownProps) => {
|
|||
>
|
||||
{display === "detail" ? "Detailed" : "Summary"}
|
||||
</button>
|
||||
<div
|
||||
className={`dropdown-menu-right dropdown-menu${show ? " show" : ""}`}
|
||||
>
|
||||
<div className={`dropdown-menu-end dropdown-menu${show ? " show" : ""}`}>
|
||||
{DISPLAY_OPTIONS.map((displayOption) => {
|
||||
return (
|
||||
<Link
|
||||
|
|
|
|||
|
|
@ -113,7 +113,7 @@ export function RewardsCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
>
|
||||
{fetching ? (
|
||||
<>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</>
|
||||
) : (
|
||||
|
|
|
|||
|
|
@ -51,10 +51,10 @@ export function SlotHashesCard({
|
|||
const renderAccountRow = (entry: SlotHashEntry, index: number) => {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="w-1 text-monospace">
|
||||
<td className="w-1 font-monospace">
|
||||
<Slot slot={entry.slot} link />
|
||||
</td>
|
||||
<td className="text-monospace">{entry.hash}</td>
|
||||
<td className="font-monospace">{entry.hash}</td>
|
||||
</tr>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -111,7 +111,7 @@ function OverviewCard({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -119,26 +119,26 @@ function OverviewCard({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right text-uppercase">
|
||||
<td className="text-lg-end text-uppercase">
|
||||
<SolBalance lamports={account.lamports || 0} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Rent Reserve (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={stakeAccount.meta.rentExemptReserve} />
|
||||
</td>
|
||||
</tr>
|
||||
{hideDelegation && (
|
||||
<tr>
|
||||
<td>Status</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{isFullyInactivated(stakeAccount, activation)
|
||||
? "Not delegated"
|
||||
: displayStatus(stakeAccountType, activation)}
|
||||
|
|
@ -181,7 +181,7 @@ function DelegationCard({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Status</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{displayStatus(stakeAccountType, activation)}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -190,7 +190,7 @@ function DelegationCard({
|
|||
<>
|
||||
<tr>
|
||||
<td>Delegated Stake (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={stake.delegation.stake} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -199,14 +199,14 @@ function DelegationCard({
|
|||
<>
|
||||
<tr>
|
||||
<td>Active Stake (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={activation.active} />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Inactive Stake (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={activation.inactive} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -216,7 +216,7 @@ function DelegationCard({
|
|||
{voterPubkey && (
|
||||
<tr>
|
||||
<td>Delegated Vote Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={voterPubkey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -224,7 +224,7 @@ function DelegationCard({
|
|||
|
||||
<tr>
|
||||
<td>Activation Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{activationEpoch !== undefined ? (
|
||||
<Epoch epoch={activationEpoch} link />
|
||||
) : (
|
||||
|
|
@ -234,7 +234,7 @@ function DelegationCard({
|
|||
</tr>
|
||||
<tr>
|
||||
<td>Deactivation Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{deactivationEpoch !== undefined ? (
|
||||
<Epoch epoch={deactivationEpoch} link />
|
||||
) : (
|
||||
|
|
@ -261,14 +261,14 @@ function AuthoritiesCard({ meta }: { meta: StakeMeta }) {
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Stake Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={meta.authorized.staker} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Withdraw Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={meta.authorized.withdrawer} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -276,7 +276,7 @@ function AuthoritiesCard({ meta }: { meta: StakeMeta }) {
|
|||
{hasLockup && (
|
||||
<tr>
|
||||
<td>Lockup Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={meta.lockup.custodian} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -56,16 +56,16 @@ export function StakeHistoryCard({
|
|||
const renderAccountRow = (entry: StakeHistoryEntry, index: number) => {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="w-1 text-monospace">
|
||||
<td className="w-1 font-monospace">
|
||||
<Epoch epoch={entry.epoch} link />
|
||||
</td>
|
||||
<td className="text-monospace">
|
||||
<td className="font-monospace">
|
||||
<SolBalance lamports={entry.stakeHistory.effective} />
|
||||
</td>
|
||||
<td className="text-monospace">
|
||||
<td className="font-monospace">
|
||||
<SolBalance lamports={entry.stakeHistory.activating} />
|
||||
</td>
|
||||
<td className="text-monospace">
|
||||
<td className="font-monospace">
|
||||
<SolBalance lamports={entry.stakeHistory.deactivating} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -170,7 +170,7 @@ function SysvarAccountSlotHistory({
|
|||
Slot History{" "}
|
||||
<span className="text-muted">(previous 100 slots)</span>
|
||||
</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{history.map((val) => (
|
||||
<p key={val} className="mb-0">
|
||||
<Slot slot={val} link />
|
||||
|
|
@ -226,7 +226,7 @@ function SysvarAccountFeesCard({
|
|||
|
||||
<tr>
|
||||
<td>Lamports Per Signature</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{sysvarAccount.info.feeCalculator.lamportsPerSignature}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -256,33 +256,31 @@ function SysvarAccountEpochScheduleCard({
|
|||
|
||||
<tr>
|
||||
<td>Slots Per Epoch</td>
|
||||
<td className="text-lg-right">{sysvarAccount.info.slotsPerEpoch}</td>
|
||||
<td className="text-lg-end">{sysvarAccount.info.slotsPerEpoch}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Leader Schedule Slot Offset</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{sysvarAccount.info.leaderScheduleSlotOffset}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Epoch Warmup Enabled</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<code>{sysvarAccount.info.warmup ? "true" : "false"}</code>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>First Normal Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
{sysvarAccount.info.firstNormalEpoch}
|
||||
</td>
|
||||
<td className="text-lg-end">{sysvarAccount.info.firstNormalEpoch}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>First Normal Slot</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Slot slot={sysvarAccount.info.firstNormalSlot} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -312,28 +310,28 @@ function SysvarAccountClockCard({
|
|||
|
||||
<tr>
|
||||
<td>Timestamp</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{displayTimestamp(sysvarAccount.info.unixTimestamp * 1000)}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Epoch epoch={sysvarAccount.info.epoch} link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Leader Schedule Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Epoch epoch={sysvarAccount.info.leaderScheduleEpoch} link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Slot</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Slot slot={sysvarAccount.info.slot} link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -363,21 +361,21 @@ function SysvarAccountRentCard({
|
|||
|
||||
<tr>
|
||||
<td>Burn Percent</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{sysvarAccount.info.burnPercent + "%"}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Exemption Threshold</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{sysvarAccount.info.exemptionThreshold} years
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Lamports Per Byte Year</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{sysvarAccount.info.lamportsPerByteYear}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -412,7 +410,7 @@ function SysvarAccountRewardsCard({
|
|||
|
||||
<tr>
|
||||
<td>Validator Point Value</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{validatorPointValueFormatted} lamports
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -130,7 +130,7 @@ function FungibleTokenMintAccountCard({
|
|||
<h4>
|
||||
Price{" "}
|
||||
{tokenPriceInfo.market_cap_rank && (
|
||||
<span className="ml-2 badge badge-primary rank">
|
||||
<span className="ms-2 badge bg-primary rank">
|
||||
Rank #{tokenPriceInfo.market_cap_rank}
|
||||
</span>
|
||||
)}
|
||||
|
|
@ -190,14 +190,14 @@ function FungibleTokenMintAccountCard({
|
|||
{tokenInfo ? "Overview" : "Token Mint"}
|
||||
</h3>
|
||||
<button className="btn btn-white btn-sm" onClick={refresh}>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -205,7 +205,7 @@ function FungibleTokenMintAccountCard({
|
|||
<td>
|
||||
{info.mintAuthority === null ? "Fixed Supply" : "Current Supply"}
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{normalizeTokenAmount(info.supply, info.decimals).toLocaleString(
|
||||
"en-US",
|
||||
{
|
||||
|
|
@ -217,14 +217,14 @@ function FungibleTokenMintAccountCard({
|
|||
{tokenInfo?.extensions?.website && (
|
||||
<tr>
|
||||
<td>Website</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<a
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
href={tokenInfo.extensions.website}
|
||||
>
|
||||
{tokenInfo.extensions.website}
|
||||
<span className="fe fe-external-link ml-2"></span>
|
||||
<span className="fe fe-external-link ms-2"></span>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -232,7 +232,7 @@ function FungibleTokenMintAccountCard({
|
|||
{info.mintAuthority && (
|
||||
<tr>
|
||||
<td>Mint Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mintAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -240,25 +240,25 @@ function FungibleTokenMintAccountCard({
|
|||
{info.freezeAuthority && (
|
||||
<tr>
|
||||
<td>Freeze Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.freezeAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Decimals</td>
|
||||
<td className="text-lg-right">{info.decimals}</td>
|
||||
<td className="text-lg-end">{info.decimals}</td>
|
||||
</tr>
|
||||
{!info.isInitialized && (
|
||||
<tr>
|
||||
<td>Status</td>
|
||||
<td className="text-lg-right">Uninitialized</td>
|
||||
<td className="text-lg-end">Uninitialized</td>
|
||||
</tr>
|
||||
)}
|
||||
{tokenInfo?.extensions?.bridgeContract && bridgeContractAddress && (
|
||||
<tr>
|
||||
<td>Bridge Contract</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Copyable text={bridgeContractAddress}>
|
||||
<a
|
||||
href={tokenInfo.extensions.bridgeContract}
|
||||
|
|
@ -274,7 +274,7 @@ function FungibleTokenMintAccountCard({
|
|||
{tokenInfo?.extensions?.assetContract && assetContractAddress && (
|
||||
<tr>
|
||||
<td>Bridged Asset Contract</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Copyable text={assetContractAddress}>
|
||||
<a
|
||||
href={tokenInfo.extensions.bridgeContract}
|
||||
|
|
@ -312,21 +312,21 @@ function NonFungibleTokenMintAccountCard({
|
|||
Overview
|
||||
</h3>
|
||||
<button className="btn btn-white btn-sm" onClick={refresh}>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
{nftData.editionInfo.masterEdition?.maxSupply && (
|
||||
<tr>
|
||||
<td>Max Total Supply</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{nftData.editionInfo.masterEdition.maxSupply.toNumber() === 0
|
||||
? 1
|
||||
: nftData.editionInfo.masterEdition.maxSupply.toNumber()}
|
||||
|
|
@ -336,7 +336,7 @@ function NonFungibleTokenMintAccountCard({
|
|||
{nftData?.editionInfo.masterEdition?.supply && (
|
||||
<tr>
|
||||
<td>Current Supply</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{nftData.editionInfo.masterEdition.supply.toNumber() === 0
|
||||
? 1
|
||||
: nftData.editionInfo.masterEdition.supply.toNumber()}
|
||||
|
|
@ -346,14 +346,14 @@ function NonFungibleTokenMintAccountCard({
|
|||
{mintInfo.mintAuthority && (
|
||||
<tr>
|
||||
<td>Mint Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={mintInfo.mintAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Update Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={new PublicKey(nftData.metadata.updateAuthority)}
|
||||
alignRight
|
||||
|
|
@ -364,7 +364,7 @@ function NonFungibleTokenMintAccountCard({
|
|||
{nftData?.metadata.data && (
|
||||
<tr>
|
||||
<td>Seller Fee</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{`${nftData?.metadata.data.sellerFeeBasisPoints / 100}%`}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -392,7 +392,7 @@ function TokenAccountCard({
|
|||
balance = (
|
||||
<>
|
||||
◎
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{new BigNumber(info.tokenAmount.uiAmountString).toFormat(9)}
|
||||
</span>
|
||||
</>
|
||||
|
|
@ -412,7 +412,7 @@ function TokenAccountCard({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -420,45 +420,45 @@ function TokenAccountCard({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
{label && (
|
||||
<tr>
|
||||
<td>Address Label</td>
|
||||
<td className="text-lg-right">{label}</td>
|
||||
<td className="text-lg-end">{label}</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mint} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Token balance ({unit})</td>
|
||||
<td className="text-lg-right">{balance}</td>
|
||||
<td className="text-lg-end">{balance}</td>
|
||||
</tr>
|
||||
{info.state === "uninitialized" && (
|
||||
<tr>
|
||||
<td>Status</td>
|
||||
<td className="text-lg-right">Uninitialized</td>
|
||||
<td className="text-lg-end">Uninitialized</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.rentExemptReserve && (
|
||||
<tr>
|
||||
<td>Rent-exempt reserve (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<>
|
||||
◎
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{new BigNumber(
|
||||
info.rentExemptReserve.uiAmountString
|
||||
).toFormat(9)}
|
||||
|
|
@ -491,7 +491,7 @@ function MultisigAccountCard({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -499,22 +499,22 @@ function MultisigAccountCard({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Required Signers</td>
|
||||
<td className="text-lg-right">{info.numRequiredSigners}</td>
|
||||
<td className="text-lg-end">{info.numRequiredSigners}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Valid Signers</td>
|
||||
<td className="text-lg-right">{info.numValidSigners}</td>
|
||||
<td className="text-lg-end">{info.numValidSigners}</td>
|
||||
</tr>
|
||||
{info.signers.map((signer) => (
|
||||
<tr key={signer.toString()}>
|
||||
<td>Signer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={signer} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -522,7 +522,7 @@ function MultisigAccountCard({
|
|||
{!info.isInitialized && (
|
||||
<tr>
|
||||
<td>Status</td>
|
||||
<td className="text-lg-right">Uninitialized</td>
|
||||
<td className="text-lg-end">Uninitialized</td>
|
||||
</tr>
|
||||
)}
|
||||
</TableCardBody>
|
||||
|
|
|
|||
|
|
@ -242,12 +242,12 @@ function TokenHistoryTable({ tokens }: { tokens: TokenInfoWithPubkey[] }) {
|
|||
>
|
||||
{fetching ? (
|
||||
<>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</>
|
||||
)}
|
||||
|
|
@ -289,7 +289,7 @@ function TokenHistoryTable({ tokens }: { tokens: TokenInfoWithPubkey[] }) {
|
|||
>
|
||||
{fetching ? (
|
||||
<>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</>
|
||||
) : (
|
||||
|
|
@ -331,8 +331,8 @@ const FilterDropdown = ({ filter, toggle, show, tokens }: FilterProps) => {
|
|||
});
|
||||
|
||||
return (
|
||||
<div className="dropdown mr-2">
|
||||
<small className="mr-2">Filter:</small>
|
||||
<div className="dropdown me-2">
|
||||
<small className="me-2">Filter:</small>
|
||||
<button
|
||||
className="btn btn-white btn-sm dropdown-toggle"
|
||||
type="button"
|
||||
|
|
@ -341,7 +341,7 @@ const FilterDropdown = ({ filter, toggle, show, tokens }: FilterProps) => {
|
|||
{filter === ALL_TOKENS ? "All Tokens" : nameLookup.get(filter)}
|
||||
</button>
|
||||
<div
|
||||
className={`token-filter dropdown-menu-right dropdown-menu${
|
||||
className={`token-filter dropdown-menu-end dropdown-menu${
|
||||
show ? " show" : ""
|
||||
}`}
|
||||
>
|
||||
|
|
@ -404,9 +404,7 @@ const TokenTransactionRow = React.memo(
|
|||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
{statusText}
|
||||
</span>
|
||||
<span className={`badge bg-${statusClass}-soft`}>{statusText}</span>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
|
|
@ -414,7 +412,7 @@ const TokenTransactionRow = React.memo(
|
|||
</td>
|
||||
|
||||
<td>
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
Loading
|
||||
</td>
|
||||
|
||||
|
|
@ -546,7 +544,7 @@ const TokenTransactionRow = React.memo(
|
|||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
<span className={`badge bg-${statusClass}-soft`}>
|
||||
{statusText}
|
||||
</span>
|
||||
</td>
|
||||
|
|
@ -597,7 +595,7 @@ function InstructionDetails({
|
|||
e.preventDefault();
|
||||
setExpanded(!expanded);
|
||||
}}
|
||||
className={`c-pointer fe mr-2 ${
|
||||
className={`c-pointer fe me-2 ${
|
||||
expanded ? "fe-minus-square" : "fe-plus-square"
|
||||
}`}
|
||||
></span>
|
||||
|
|
|
|||
|
|
@ -91,8 +91,8 @@ export function TokenLargestAccountsCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
<th className="text-muted">Rank</th>
|
||||
<th className="text-muted">Address</th>
|
||||
<th className="text-muted">Owner</th>
|
||||
<th className="text-muted text-right">Balance {unitLabel}</th>
|
||||
<th className="text-muted text-right">% of Total Supply</th>
|
||||
<th className="text-muted text-end">Balance {unitLabel}</th>
|
||||
<th className="text-muted text-end">% of Total Supply</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="list">
|
||||
|
|
@ -131,7 +131,7 @@ const renderAccountRow = (
|
|||
return (
|
||||
<tr key={index}>
|
||||
<td>
|
||||
<span className="badge badge-soft-gray badge-pill">{index + 1}</span>
|
||||
<span className="badge bg-gray-soft badge-pill">{index + 1}</span>
|
||||
</td>
|
||||
<td className="td">
|
||||
<Address pubkey={account.address} link truncate />
|
||||
|
|
@ -139,11 +139,11 @@ const renderAccountRow = (
|
|||
<td>
|
||||
{account.owner && <Address pubkey={account.owner} link truncate />}
|
||||
</td>
|
||||
<td className="text-right text-monospace">
|
||||
<td className="text-end font-monospace">
|
||||
{account.uiAmountString &&
|
||||
new BigNumber(account.uiAmountString).toFormat(balanceFixedPoint)}
|
||||
</td>
|
||||
<td className="text-right text-monospace">{percent}</td>
|
||||
<td className="text-end font-monospace">{percent}</td>
|
||||
</tr>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -23,19 +23,19 @@ export function UnknownAccountCard({ account }: { account: Account }) {
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
{label && (
|
||||
<tr>
|
||||
<td>Address Label</td>
|
||||
<td className="text-lg-right">{label}</td>
|
||||
<td className="text-lg-end">{label}</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={lamports} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -43,14 +43,14 @@ export function UnknownAccountCard({ account }: { account: Account }) {
|
|||
{details?.space !== undefined && (
|
||||
<tr>
|
||||
<td>Allocated Data Size</td>
|
||||
<td className="text-lg-right">{details.space} byte(s)</td>
|
||||
<td className="text-lg-end">{details.space} byte(s)</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
{details && (
|
||||
<tr>
|
||||
<td>Assigned Program Id</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={details.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -59,9 +59,7 @@ export function UnknownAccountCard({ account }: { account: Account }) {
|
|||
{details && (
|
||||
<tr>
|
||||
<td>Executable</td>
|
||||
<td className="text-lg-right">
|
||||
{details.executable ? "Yes" : "No"}
|
||||
</td>
|
||||
<td className="text-lg-end">{details.executable ? "Yes" : "No"}</td>
|
||||
</tr>
|
||||
)}
|
||||
</TableCardBody>
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ export function UpgradeableProgramSection({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -89,48 +89,48 @@ export function UpgradeableProgramSection({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
{label && (
|
||||
<tr>
|
||||
<td>Address Label</td>
|
||||
<td className="text-lg-right">{label}</td>
|
||||
<td className="text-lg-end">{label}</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right text-uppercase">
|
||||
<td className="text-lg-end text-uppercase">
|
||||
<SolBalance lamports={account.lamports || 0} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Executable</td>
|
||||
<td className="text-lg-right">Yes</td>
|
||||
<td className="text-lg-end">Yes</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Executable Data</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={programAccount.programData} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Upgradeable</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{programData.authority !== null ? "Yes" : "No"}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Last Deployed Slot</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Slot slot={programData.slot} link />
|
||||
</td>
|
||||
</tr>
|
||||
{programData.authority !== null && (
|
||||
<tr>
|
||||
<td>Upgrade Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={programData.authority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -158,7 +158,7 @@ export function UpgradeableProgramDataSection({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -166,38 +166,38 @@ export function UpgradeableProgramDataSection({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right text-uppercase">
|
||||
<td className="text-lg-end text-uppercase">
|
||||
<SolBalance lamports={account.lamports || 0} />
|
||||
</td>
|
||||
</tr>
|
||||
{account.details?.space !== undefined && (
|
||||
<tr>
|
||||
<td>Data (Bytes)</td>
|
||||
<td className="text-lg-right">{account.details.space}</td>
|
||||
<td className="text-lg-end">{account.details.space}</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Upgradeable</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{programData.authority !== null ? "Yes" : "No"}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Last Deployed Slot</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Slot slot={programData.slot} link />
|
||||
</td>
|
||||
</tr>
|
||||
{programData.authority !== null && (
|
||||
<tr>
|
||||
<td>Upgrade Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={programData.authority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -225,7 +225,7 @@ export function UpgradeableProgramBufferSection({
|
|||
className="btn btn-white btn-sm"
|
||||
onClick={() => refresh(account.pubkey)}
|
||||
>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -233,26 +233,26 @@ export function UpgradeableProgramBufferSection({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right text-uppercase">
|
||||
<td className="text-lg-end text-uppercase">
|
||||
<SolBalance lamports={account.lamports || 0} />
|
||||
</td>
|
||||
</tr>
|
||||
{account.details?.space !== undefined && (
|
||||
<tr>
|
||||
<td>Data (Bytes)</td>
|
||||
<td className="text-lg-right">{account.details.space}</td>
|
||||
<td className="text-lg-end">{account.details.space}</td>
|
||||
</tr>
|
||||
)}
|
||||
{programBuffer.authority !== null && (
|
||||
<tr>
|
||||
<td>Deploy Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={programBuffer.authority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -260,7 +260,7 @@ export function UpgradeableProgramBufferSection({
|
|||
{account.details && (
|
||||
<tr>
|
||||
<td>Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.details.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ export function VoteAccountSection({
|
|||
Authorized Voter
|
||||
{voteAccount.info.authorizedVoters.length > 1 ? "s" : ""}
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{voteAccount.info.authorizedVoters.map((voter) => {
|
||||
return (
|
||||
<Address
|
||||
|
|
@ -53,7 +53,7 @@ export function VoteAccountSection({
|
|||
|
||||
<tr>
|
||||
<td>Authorized Withdrawer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={voteAccount.info.authorizedWithdrawer}
|
||||
alignRight
|
||||
|
|
@ -65,19 +65,19 @@ export function VoteAccountSection({
|
|||
|
||||
<tr>
|
||||
<td>Last Timestamp</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{displayTimestamp(voteAccount.info.lastTimestamp.timestamp * 1000)}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Commission</td>
|
||||
<td className="text-lg-right">{voteAccount.info.commission + "%"}</td>
|
||||
<td className="text-lg-end">{voteAccount.info.commission + "%"}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Root Slot</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{rootSlot !== null ? <Slot slot={rootSlot} link /> : "N/A"}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -44,10 +44,10 @@ export function VotesCard({ voteAccount }: { voteAccount: VoteAccount }) {
|
|||
const renderAccountRow = (vote: Vote, index: number) => {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="w-1 text-monospace">
|
||||
<td className="w-1 font-monospace">
|
||||
<Slot slot={vote.slot} link />
|
||||
</td>
|
||||
<td className="text-monospace">{vote.confirmationCount}</td>
|
||||
<td className="font-monospace">{vote.confirmationCount}</td>
|
||||
</tr>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -109,7 +109,7 @@ export function TokenInstructionsCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
<span className={`badge bg-${statusClass}-soft`}>
|
||||
{statusText}
|
||||
</span>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -185,7 +185,7 @@ export function TokenTransfersCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
</td>
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
<span className={`badge bg-${statusClass}-soft`}>
|
||||
{statusText}
|
||||
</span>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -70,9 +70,7 @@ export function TransactionHistoryCard({ pubkey }: { pubkey: PublicKey }) {
|
|||
)}
|
||||
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
{statusText}
|
||||
</span>
|
||||
<span className={`badge bg-${statusClass}-soft`}>{statusText}</span>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -151,7 +151,7 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) {
|
|||
<tr key={i}>
|
||||
<td>{tx.index + 1}</td>
|
||||
<td>
|
||||
<span className={`badge badge-soft-${statusClass}`}>
|
||||
<span className={`badge bg-${statusClass}-soft`}>
|
||||
{statusText}
|
||||
</span>
|
||||
</td>
|
||||
|
|
@ -164,7 +164,7 @@ export function BlockHistoryCard({ block }: { block: BlockResponse }) {
|
|||
return (
|
||||
<div key={i} className="d-flex align-items-center">
|
||||
<Address pubkey={new PublicKey(programId)} link />
|
||||
<span className="ml-2 text-muted">{`(${count})`}</span>
|
||||
<span className="ms-2 text-muted">{`(${count})`}</span>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
|
|
@ -252,7 +252,7 @@ const FilterDropdown = ({
|
|||
filterOptions.sort();
|
||||
|
||||
return (
|
||||
<div className="dropdown mr-2">
|
||||
<div className="dropdown me-2">
|
||||
<button
|
||||
className="btn btn-white btn-sm dropdown-toggle"
|
||||
type="button"
|
||||
|
|
@ -261,7 +261,7 @@ const FilterDropdown = ({
|
|||
{currentFilterOption.name}
|
||||
</button>
|
||||
<div
|
||||
className={`token-filter dropdown-menu-right dropdown-menu${
|
||||
className={`token-filter dropdown-menu-end dropdown-menu${
|
||||
show ? " show" : ""
|
||||
}`}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ export function BlockOverviewCard({
|
|||
}) {
|
||||
const confirmedBlock = useBlock(slot);
|
||||
const fetchBlock = useFetchBlock();
|
||||
const { epochSchedule, status } = useCluster();
|
||||
const { clusterInfo, status } = useCluster();
|
||||
const refresh = () => fetchBlock(slot);
|
||||
|
||||
// Fetch block on load
|
||||
|
|
@ -45,7 +45,7 @@ export function BlockOverviewCard({
|
|||
|
||||
const block = confirmedBlock.data.block;
|
||||
const committedTxs = block.transactions.filter((tx) => tx.meta?.err === null);
|
||||
const epoch = epochSchedule?.getEpoch(slot);
|
||||
const epoch = clusterInfo?.epochSchedule.getEpoch(slot);
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
@ -58,13 +58,13 @@ export function BlockOverviewCard({
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td className="w-100">Slot</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<Slot slot={slot} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Blockhash</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<span>{block.blockhash}</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -72,16 +72,16 @@ export function BlockOverviewCard({
|
|||
<>
|
||||
<tr>
|
||||
<td>Timestamp (Local)</td>
|
||||
<td className="text-lg-right">
|
||||
<span className="text-monospace">
|
||||
<td className="text-lg-end">
|
||||
<span className="font-monospace">
|
||||
{displayTimestamp(block.blockTime * 1000, true)}
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Timestamp (UTC)</td>
|
||||
<td className="text-lg-right">
|
||||
<span className="text-monospace">
|
||||
<td className="text-lg-end">
|
||||
<span className="font-monospace">
|
||||
{displayTimestampUtc(block.blockTime * 1000, true)}
|
||||
</span>
|
||||
</td>
|
||||
|
|
@ -90,46 +90,46 @@ export function BlockOverviewCard({
|
|||
) : (
|
||||
<tr>
|
||||
<td className="w-100">Timestamp</td>
|
||||
<td className="text-lg-right">Unavailable</td>
|
||||
<td className="text-lg-end">Unavailable</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td className="w-100">Parent Slot</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<Slot slot={block.parentSlot} link />
|
||||
</td>
|
||||
</tr>
|
||||
{epoch !== undefined && (
|
||||
<tr>
|
||||
<td className="w-100">Epoch</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<Epoch epoch={epoch} link />
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td className="w-100">Parent Blockhash</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<span>{block.previousBlockhash}</span>
|
||||
</td>
|
||||
</tr>
|
||||
{confirmedBlock.data.child && (
|
||||
<tr>
|
||||
<td className="w-100">Child Slot</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<Slot slot={confirmedBlock.data.child} link />
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td className="w-100">Processed Transactions</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<span>{block.transactions.length}</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Successful Transactions</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
<span>{committedTxs.length}</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -62,15 +62,13 @@ export function BlockProgramsCard({ block }: { block: BlockResponse }) {
|
|||
<TableCardBody>
|
||||
<tr>
|
||||
<td className="w-100">Unique Programs Count</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{programEntries.length}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="w-100">Total Instructions</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
{totalInstructions}
|
||||
</td>
|
||||
<td className="text-lg-end font-monospace">{totalInstructions}</td>
|
||||
</tr>
|
||||
</TableCardBody>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ export function AccountHeader({ title, refresh }: AccountHeaderProps) {
|
|||
<div className="card-header align-items-center">
|
||||
<h3 className="card-header-title">{title}</h3>
|
||||
<button className="btn btn-white btn-sm" onClick={() => refresh()}>
|
||||
<span className="fe fe-refresh-cw mr-2"></span>
|
||||
<span className="fe fe-refresh-cw me-2"></span>
|
||||
Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -28,7 +28,7 @@ export function AccountAddressRow({ account }: AccountProps) {
|
|||
return (
|
||||
<tr>
|
||||
<td>Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={account.pubkey} alignRight raw />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -40,7 +40,7 @@ export function AccountBalanceRow({ account }: AccountProps) {
|
|||
return (
|
||||
<tr>
|
||||
<td>Balance (SOL)</td>
|
||||
<td className="text-lg-right text-uppercase">
|
||||
<td className="text-lg-end text-uppercase">
|
||||
<SolBalance lamports={lamports} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ export function Address({
|
|||
|
||||
const content = (
|
||||
<Copyable text={address} replaceText={!alignRight}>
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{link ? (
|
||||
<Link
|
||||
className={truncate ? "text-truncate address-truncate" : ""}
|
||||
|
|
|
|||
|
|
@ -17,17 +17,17 @@ export function BalanceDelta({
|
|||
|
||||
if (delta.gt(0)) {
|
||||
return (
|
||||
<span className="badge badge-soft-success">
|
||||
<span className="badge bg-success-soft">
|
||||
+{isSol ? sols : delta.toString()}
|
||||
</span>
|
||||
);
|
||||
} else if (delta.lt(0)) {
|
||||
return (
|
||||
<span className="badge badge-soft-warning">
|
||||
<span className="badge bg-warning-soft">
|
||||
{isSol ? <>-{sols}</> : delta.toString()}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
return <span className="badge badge-soft-secondary">0</span>;
|
||||
return <span className="badge bg-secondary-soft">0</span>;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -54,9 +54,9 @@ export function Copyable({
|
|||
function PrependCopyIcon() {
|
||||
return (
|
||||
<>
|
||||
<span className="font-size-tiny mr-2">
|
||||
<span className="font-size-tiny me-2">
|
||||
<span className={textColor}>
|
||||
{message !== undefined && <span className="mr-2">{message}</span>}
|
||||
{message !== undefined && <span className="me-2">{message}</span>}
|
||||
<CopyIcon />
|
||||
</span>
|
||||
</span>
|
||||
|
|
@ -71,7 +71,7 @@ export function Copyable({
|
|||
<span className="font-size-tiny">
|
||||
<span className={textColor}>
|
||||
<CopyIcon />
|
||||
<span className="ml-2">{message}</span>
|
||||
<span className="ms-2">{message}</span>
|
||||
</span>
|
||||
</span>
|
||||
<span className="v-hidden">{children}</span>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ type Props = {
|
|||
};
|
||||
export function Epoch({ epoch, link }: Props) {
|
||||
return (
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{link ? (
|
||||
<Copyable text={epoch.toString()}>
|
||||
<Link to={clusterPath(`/epoch/${epoch}`)}>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ export function ErrorCard({
|
|||
{retry && (
|
||||
<>
|
||||
<span
|
||||
className="btn btn-white ml-3 d-none d-md-inline"
|
||||
className="btn btn-white ms-3 d-none d-md-inline"
|
||||
onClick={retry}
|
||||
>
|
||||
{buttonText}
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ export function HexData({ raw }: { raw: Buffer }) {
|
|||
function Content() {
|
||||
return (
|
||||
<Copyable text={hexString}>
|
||||
<pre className="d-inline-block text-left mb-0">{divs}</pre>
|
||||
<pre className="d-inline-block text-start mb-0">{divs}</pre>
|
||||
</Copyable>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ export function InfoTooltip({ bottom, right, text, children }: Props) {
|
|||
>
|
||||
<div className={`d-flex align-items-center justify-content-${justify}`}>
|
||||
{children}
|
||||
<span className="fe fe-help-circle ml-2"></span>
|
||||
<span className="fe fe-help-circle ms-2"></span>
|
||||
</div>
|
||||
<Popover bottom={bottom} right={right} state={state} text={text} />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ export function InstructionDetails({
|
|||
e.preventDefault();
|
||||
setExpanded(!expanded);
|
||||
}}
|
||||
className={`c-pointer fe mr-2 ${
|
||||
className={`c-pointer fe me-2 ${
|
||||
expanded ? "fe-minus-square" : "fe-plus-square"
|
||||
}`}
|
||||
></span>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ export function LoadingCard({ message }: { message?: string }) {
|
|||
return (
|
||||
<div className="card">
|
||||
<div className="card-body text-center">
|
||||
<span className="spinner-grow spinner-grow-sm mr-2"></span>
|
||||
<span className="spinner-grow spinner-grow-sm me-2"></span>
|
||||
{message || "Loading"}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,5 +5,11 @@ type OverlayProps = {
|
|||
};
|
||||
|
||||
export function Overlay({ show }: OverlayProps) {
|
||||
return <div className={`modal-backdrop fade${show ? " show" : ""}`}></div>;
|
||||
return (
|
||||
<div
|
||||
className={`modal-backdrop fade ${
|
||||
show ? "show" : "disable-pointer-events"
|
||||
}`}
|
||||
></div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ export function Signature({
|
|||
}`}
|
||||
>
|
||||
<Copyable text={signature} replaceText={!alignRight}>
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{link ? (
|
||||
<Link
|
||||
className={truncate ? "text-truncate signature-truncate" : ""}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ type Props = {
|
|||
};
|
||||
export function Slot({ slot, link }: Props) {
|
||||
return (
|
||||
<span className="text-monospace">
|
||||
<span className="font-monospace">
|
||||
{link ? (
|
||||
<Copyable text={slot.toString()}>
|
||||
<Link to={clusterPath(`/block/${slot}`)}>
|
||||
|
|
|
|||
|
|
@ -28,28 +28,28 @@ export function AssociatedTokenDetailsCard({
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={ix.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={new PublicKey(info.account)} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={new PublicKey(info.mint)} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Wallet</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={new PublicKey(info.wallet)} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@ export function InstructionCard({
|
|||
<div className="card">
|
||||
<div className="card-header">
|
||||
<h3 className="card-header-title mb-0 d-flex align-items-center">
|
||||
<span className={`badge badge-soft-${resultClass} mr-2`}>
|
||||
<span className={`badge bg-${resultClass}-soft me-2`}>
|
||||
#{index + 1}
|
||||
{childIndex !== undefined ? `.${childIndex + 1}` : ""}
|
||||
</span>
|
||||
|
|
@ -73,7 +73,7 @@ export function InstructionCard({
|
|||
}`}
|
||||
onClick={rawClickHandler}
|
||||
>
|
||||
<span className="fe fe-code mr-1"></span>
|
||||
<span className="fe fe-code me-1"></span>
|
||||
Raw
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -84,7 +84,7 @@ export function InstructionCard({
|
|||
<>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={ix.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,15 +29,15 @@ export function MemoDetailsCard({
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={ix.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Data (UTF-8)</td>
|
||||
<td className="text-lg-right">
|
||||
<pre className="d-inline-block text-left mb-0">{data}</pre>
|
||||
<td className="text-lg-end">
|
||||
<pre className="d-inline-block text-start mb-0">{data}</pre>
|
||||
</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
|
|
|
|||
|
|
@ -9,15 +9,15 @@ export function RawDetails({ ix }: { ix: TransactionInstruction }) {
|
|||
{ix.keys.map(({ pubkey, isSigner, isWritable }, keyIndex) => (
|
||||
<tr key={keyIndex}>
|
||||
<td>
|
||||
<div className="mr-2 d-md-inline">Account #{keyIndex + 1}</div>
|
||||
<div className="me-2 d-md-inline">Account #{keyIndex + 1}</div>
|
||||
{isWritable && (
|
||||
<span className="badge badge-soft-info mr-1">Writable</span>
|
||||
<span className="badge bg-info-soft me-1">Writable</span>
|
||||
)}
|
||||
{isSigner && (
|
||||
<span className="badge badge-soft-info mr-1">Signer</span>
|
||||
<span className="badge bg-info-soft me-1">Signer</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={pubkey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -27,7 +27,7 @@ export function RawDetails({ ix }: { ix: TransactionInstruction }) {
|
|||
<td>
|
||||
Instruction Data <span className="text-muted">(Hex)</span>
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<HexData raw={ix.data} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ export function RawParsedDetails({
|
|||
<td>
|
||||
Instruction Data <span className="text-muted">(JSON)</span>
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<pre className="d-inline-block text-left json-wrap">
|
||||
<td className="text-lg-end">
|
||||
<pre className="d-inline-block text-start json-wrap">
|
||||
{JSON.stringify(ix.parsed, null, 2)}
|
||||
</pre>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -25,80 +25,80 @@ export function CancelOrderDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Signal Provider Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.signalProviderKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.openOrdersKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumEventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumMarketBids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumMarketAsks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Program ID</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.dexProgramKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.side}</td>
|
||||
<td className="text-lg-end">{info.side}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Id</td>
|
||||
<td className="text-lg-right">{info.orderId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.orderId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,35 +25,35 @@ export function CollectFeesDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Signal Provider</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.signalProviderPoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Insurance Fund</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.bonfidaFeePoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Buy and Burn</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.bonfidaBnBPTKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,69 +25,69 @@ export function CreateBotDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Token Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mintKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Target Pool Token Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.targetPoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Program ID</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumProgramId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Signal Provider Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.signalProviderKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Fee Ratio</td>
|
||||
<td className="text-lg-right">{info.feeRatio}</td>
|
||||
<td className="text-lg-end">{info.feeRatio}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Fee Collection Period</td>
|
||||
<td className="text-lg-right">{info.feeCollectionPeriod}</td>
|
||||
<td className="text-lg-end">{info.feeCollectionPeriod}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Markets</td>
|
||||
<td className="text-lg-right">{info.markets}</td>
|
||||
<td className="text-lg-end">{info.markets}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Deposit Amounts</td>
|
||||
<td className="text-lg-right">{info.depositAmounts}</td>
|
||||
<td className="text-lg-end">{info.depositAmounts}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -29,135 +29,135 @@ export function CreateOrderDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Signal Provider Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.signalProviderKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Payer Bot Asset Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.payerPoolAssetKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Order</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.openOrdersKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumRequestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumEventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumMarketBids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.serumMarketAsks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Coin Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.coinVaultKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pc Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.pcVaultKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Program ID</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.dexProgramKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Token Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={new PublicKey(info.targetMint)} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.side}</td>
|
||||
<td className="text-lg-end">{info.side}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Limit Price</td>
|
||||
<td className="text-lg-right">{info.limitPrice}</td>
|
||||
<td className="text-lg-end">{info.limitPrice}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Ratio to Trade</td>
|
||||
<td className="text-lg-right">{info.ratioOfPoolAssetsToTrade}</td>
|
||||
<td className="text-lg-end">{info.ratioOfPoolAssetsToTrade}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Type</td>
|
||||
<td className="text-lg-right">{info.orderType}</td>
|
||||
<td className="text-lg-end">{info.orderType}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Coin Lot Size</td>
|
||||
<td className="text-lg-right">{info.coinLotSize.toString()}</td>
|
||||
<td className="text-lg-end">{info.coinLotSize.toString()}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pc Lot Size</td>
|
||||
<td className="text-lg-right">{info.pcLotSize.toString()}</td>
|
||||
<td className="text-lg-end">{info.pcLotSize.toString()}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,61 +25,61 @@ export function DepositDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Signal Provider Fee Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.sigProviderFeeReceiverKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Insurance Funds</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.bonfidaFeeReceiverKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Buy and Burn</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.bonfidaBuyAndBurnKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Token Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mintKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Target Pool Token Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.targetPoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Token Amount</td>
|
||||
<td className="text-lg-right">{info.poolTokenAmount.toString()}</td>
|
||||
<td className="text-lg-end">{info.poolTokenAmount.toString()}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,38 +25,38 @@ export function InitializeBotDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Account</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Mint Account</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mintAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Max Number of Assets</td>
|
||||
<td className="text-lg-right">{info.maxNumberOfAsset}</td>
|
||||
<td className="text-lg-end">{info.maxNumberOfAsset}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Number of Markets</td>
|
||||
<td className="text-lg-right">{info.numberOfMarkets}</td>
|
||||
<td className="text-lg-end">{info.numberOfMarkets}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,47 +25,47 @@ export function RedeemDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Token Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.mintKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Source Bot Token Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.sourcePoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Source Bot Token Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.sourcePoolTokenKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Token Amount</td>
|
||||
<td className="text-lg-right">{info.poolTokenAmount}</td>
|
||||
<td className="text-lg-end">{info.poolTokenAmount}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -24,84 +24,84 @@ export function SettleFundsDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.openOrdersKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot Token Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.poolMintKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Coin Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.coinVaultKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pc Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.pcVaultKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot's Coin Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.coinPoolAssetKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bot's Pc Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.pcPoolAssetKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Vault Signer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.vaultSignerKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Serum Program ID</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.dexProgramKey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Pool Seed</td>
|
||||
<td className="text-lg-right">{info.poolSeed}</td>
|
||||
<td className="text-lg-end">{info.poolSeed}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -70,14 +70,14 @@ export function BpfLoaderWriteDetailsCard(props: Props<WriteInfo>) {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={BPF_LOADER_PROGRAM_ID} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -86,14 +86,14 @@ export function BpfLoaderWriteDetailsCard(props: Props<WriteInfo>) {
|
|||
<td>
|
||||
Bytes <span className="text-muted">(Base 64)</span>
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<pre className="d-inline-block text-left mb-0">{bytes}</pre>
|
||||
<td className="text-lg-end">
|
||||
<pre className="d-inline-block text-start mb-0">{bytes}</pre>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Offset</td>
|
||||
<td className="text-lg-right">{info.offset}</td>
|
||||
<td className="text-lg-end">{info.offset}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
@ -113,14 +113,14 @@ export function BpfLoaderFinalizeDetailsCard(props: Props<FinalizeInfo>) {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={BPF_LOADER_PROGRAM_ID} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ function renderDetails<T>(
|
|||
value = <Address pubkey={value} alignRight link />;
|
||||
} else if (key === "bytes") {
|
||||
value = (
|
||||
<pre className="d-inline-block text-left mb-0 data-wrap">{value}</pre>
|
||||
<pre className="d-inline-block text-start mb-0 data-wrap">{value}</pre>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -90,7 +90,7 @@ function renderDetails<T>(
|
|||
{camelToTitleCase(key)}{" "}
|
||||
{key === "bytes" && <span className="text-muted">(Base 64)</span>}
|
||||
</td>
|
||||
<td className="text-lg-right">{value}</td>
|
||||
<td className="text-lg-end">{value}</td>
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
|
|
@ -102,7 +102,7 @@ function renderDetails<T>(
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={props.ix.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -24,50 +24,50 @@ export function AddPerpMarketDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Market index</td>
|
||||
<td className="text-lg-right">{info.marketIndex}</td>
|
||||
<td className="text-lg-end">{info.marketIndex}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Maintenance leverage</td>
|
||||
<td className="text-lg-right">{info.maintLeverage}</td>
|
||||
<td className="text-lg-end">{info.maintLeverage}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Initial leverage</td>
|
||||
<td className="text-lg-right">{info.initLeverage}</td>
|
||||
<td className="text-lg-end">{info.initLeverage}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Liquidation fee</td>
|
||||
<td className="text-lg-right">{info.liquidationFee}</td>
|
||||
<td className="text-lg-end">{info.liquidationFee}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Maker fee</td>
|
||||
<td className="text-lg-right">{info.makerFee}</td>
|
||||
<td className="text-lg-end">{info.makerFee}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Taker fee</td>
|
||||
<td className="text-lg-right">{info.takerFee}</td>
|
||||
<td className="text-lg-end">{info.takerFee}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Base lot size</td>
|
||||
<td className="text-lg-right">{info.baseLotSize}</td>
|
||||
<td className="text-lg-end">{info.baseLotSize}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Quote lot size</td>
|
||||
<td className="text-lg-right">{info.quoteLotSize}</td>
|
||||
<td className="text-lg-end">{info.quoteLotSize}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Rate</td>
|
||||
<td className="text-lg-right">{info.rate}</td>
|
||||
<td className="text-lg-end">{info.rate}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Max depth bps</td>
|
||||
<td className="text-lg-right">{info.maxDepthBps}</td>
|
||||
<td className="text-lg-end">{info.maxDepthBps}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
MNGO per{" "}
|
||||
{moment.duration(info.targetPeriodLength, "seconds").humanize()}
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.mngoPerPeriod} {}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -24,38 +24,38 @@ export function AddSpotMarketDetailsCard(props: {
|
|||
{spotMarketFromIndex(ix, info.marketIndex) !== "UNKNOWN" && (
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{spotMarketFromIndex(ix, info.marketIndex)}
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
<tr>
|
||||
<td>Market index</td>
|
||||
<td className="text-lg-right">{info.marketIndex}</td>
|
||||
<td className="text-lg-end">{info.marketIndex}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Maint leverage</td>
|
||||
<td className="text-lg-right">{info.maintLeverage}</td>
|
||||
<td className="text-lg-end">{info.maintLeverage}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Init leverage</td>
|
||||
<td className="text-lg-right">{info.initLeverage}</td>
|
||||
<td className="text-lg-end">{info.initLeverage}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Liquidation fee</td>
|
||||
<td className="text-lg-right">{info.liquidationFee}</td>
|
||||
<td className="text-lg-end">{info.liquidationFee}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Optimal util</td>
|
||||
<td className="text-lg-right">{info.optimalUtil}</td>
|
||||
<td className="text-lg-end">{info.optimalUtil}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Optimal rate</td>
|
||||
<td className="text-lg-right">{info.optimalRate}</td>
|
||||
<td className="text-lg-end">{info.optimalRate}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Max rate</td>
|
||||
<td className="text-lg-right">{info.maxRate}</td>
|
||||
<td className="text-lg-end">{info.maxRate}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ export function CancelPerpOrderDetailsCard(props: {
|
|||
{mangoPerpMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Perp market</td>
|
||||
<td className="text-lg-right">{mangoPerpMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoPerpMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
@ -51,7 +51,7 @@ export function CancelPerpOrderDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Order Id</td>
|
||||
<td className="text-lg-right">{info.orderId}</td>
|
||||
<td className="text-lg-end">{info.orderId}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ export function CancelSpotOrderDetailsCard(props: {
|
|||
{mangoSpotMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Spot market</td>
|
||||
<td className="text-lg-right">{mangoSpotMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoSpotMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
@ -51,7 +51,7 @@ export function CancelSpotOrderDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Order Id</td>
|
||||
<td className="text-lg-right">{info.orderId}</td>
|
||||
<td className="text-lg-end">{info.orderId}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -59,25 +59,25 @@ export function ChangePerpMarketParamsDetailsCard(props: {
|
|||
{info.initLeverageOption && (
|
||||
<tr>
|
||||
<td>Init leverage</td>
|
||||
<td className="text-lg-right">{info.initLeverage}</td>
|
||||
<td className="text-lg-end">{info.initLeverage}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.liquidationFeeOption && (
|
||||
<tr>
|
||||
<td>Liquidation fee</td>
|
||||
<td className="text-lg-right">{info.liquidationFee}</td>
|
||||
<td className="text-lg-end">{info.liquidationFee}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.maintLeverageOption && (
|
||||
<tr>
|
||||
<td>Maint leverage</td>
|
||||
<td className="text-lg-right">{info.maintLeverage}</td>
|
||||
<td className="text-lg-end">{info.maintLeverage}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.makerFeeOption && (
|
||||
<tr>
|
||||
<td>Maker fee</td>
|
||||
<td className="text-lg-right">{info.makerFee}</td>
|
||||
<td className="text-lg-end">{info.makerFee}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.mngoPerPeriodOption && (
|
||||
|
|
@ -87,7 +87,7 @@ export function ChangePerpMarketParamsDetailsCard(props: {
|
|||
{targetPeriodLength !== null &&
|
||||
moment.duration(targetPeriodLength, "seconds").humanize()}
|
||||
</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.mngoPerPeriod} {}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -96,25 +96,25 @@ export function ChangePerpMarketParamsDetailsCard(props: {
|
|||
{info.maxDepthBpsOption && (
|
||||
<tr>
|
||||
<td>Max depth bps</td>
|
||||
<td className="text-lg-right">{info.maxDepthBps}</td>
|
||||
<td className="text-lg-end">{info.maxDepthBps}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.rateOption && (
|
||||
<tr>
|
||||
<td>Rate</td>
|
||||
<td className="text-lg-right">{info.rate}</td>
|
||||
<td className="text-lg-end">{info.rate}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.takerFeeOption && (
|
||||
<tr>
|
||||
<td>Taker fee</td>
|
||||
<td className="text-lg-right">{info.takerFee}</td>
|
||||
<td className="text-lg-end">{info.takerFee}</td>
|
||||
</tr>
|
||||
)}
|
||||
{info.targetPeriodLengthOption && (
|
||||
<tr>
|
||||
<td>Target period length</td>
|
||||
<td className="text-lg-right">{info.targetPeriodLength}</td>
|
||||
<td className="text-lg-end">{info.targetPeriodLength}</td>
|
||||
</tr>
|
||||
)}
|
||||
</InstructionCard>
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ export function ConsumeEventsDetailsCard(props: {
|
|||
{mangoPerpMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Perp market</td>
|
||||
<td className="text-lg-right">{mangoPerpMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoPerpMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ export function GenericPerpMngoDetailsCard(props: {
|
|||
{mangoPerpMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Perp market</td>
|
||||
<td className="text-lg-right">{mangoPerpMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoPerpMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ export function GenericSpotMngoDetailsCard(props: {
|
|||
{mangoSpotMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Spot market</td>
|
||||
<td className="text-lg-right">{mangoSpotMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoSpotMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@ export function PlacePerpOrderDetailsCard(props: {
|
|||
{mangoPerpMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Perp market</td>
|
||||
<td className="text-lg-right">{mangoPerpMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoPerpMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
@ -87,30 +87,30 @@ export function PlacePerpOrderDetailsCard(props: {
|
|||
{info.clientOrderId !== "0" && (
|
||||
<tr>
|
||||
<td>Client order Id</td>
|
||||
<td className="text-lg-right">{info.clientOrderId}</td>
|
||||
<td className="text-lg-end">{info.clientOrderId}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
<tr>
|
||||
<td>Order type</td>
|
||||
<td className="text-lg-right">{info.orderType}</td>
|
||||
<td className="text-lg-end">{info.orderType}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>side</td>
|
||||
<td className="text-lg-right">{info.side}</td>
|
||||
<td className="text-lg-end">{info.side}</td>
|
||||
</tr>
|
||||
|
||||
{orderLotDetails !== null && (
|
||||
<tr>
|
||||
<td>price</td>
|
||||
<td className="text-lg-right">{orderLotDetails?.price} USDC</td>
|
||||
<td className="text-lg-end">{orderLotDetails?.price} USDC</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
{orderLotDetails !== null && (
|
||||
<tr>
|
||||
<td>quantity</td>
|
||||
<td className="text-lg-right">{orderLotDetails?.size}</td>
|
||||
<td className="text-lg-end">{orderLotDetails?.size}</td>
|
||||
</tr>
|
||||
)}
|
||||
</InstructionCard>
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ export function PlaceSpotOrderDetailsCard(props: {
|
|||
{mangoSpotMarketConfig !== undefined && (
|
||||
<tr>
|
||||
<td>Spot market</td>
|
||||
<td className="text-lg-right">{mangoSpotMarketConfig.name}</td>
|
||||
<td className="text-lg-end">{mangoSpotMarketConfig.name}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
|
|
@ -96,33 +96,33 @@ export function PlaceSpotOrderDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Order type</td>
|
||||
<td className="text-lg-right">{info.orderType}</td>
|
||||
<td className="text-lg-end">{info.orderType}</td>
|
||||
</tr>
|
||||
|
||||
{info.clientId !== "0" && (
|
||||
<tr>
|
||||
<td>Client Id</td>
|
||||
<td className="text-lg-right">{info.clientId}</td>
|
||||
<td className="text-lg-end">{info.clientId}</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.side}</td>
|
||||
<td className="text-lg-end">{info.side}</td>
|
||||
</tr>
|
||||
|
||||
{orderLotDetails !== null && (
|
||||
<tr>
|
||||
<td>Limit price</td>
|
||||
{/* todo fix price */}
|
||||
<td className="text-lg-right">{orderLotDetails?.price} USDC</td>
|
||||
<td className="text-lg-end">{orderLotDetails?.price} USDC</td>
|
||||
</tr>
|
||||
)}
|
||||
|
||||
{orderLotDetails !== null && (
|
||||
<tr>
|
||||
<td>Size</td>
|
||||
<td className="text-lg-right">{orderLotDetails?.size}</td>
|
||||
<td className="text-lg-end">{orderLotDetails?.size}</td>
|
||||
</tr>
|
||||
)}
|
||||
</InstructionCard>
|
||||
|
|
|
|||
|
|
@ -25,35 +25,35 @@ export function CancelOrderByClientIdDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Client Id</td>
|
||||
<td className="text-lg-right">{info.data.clientId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.clientId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,49 +25,49 @@ export function CancelOrderByClientIdV2DetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Client Id</td>
|
||||
<td className="text-lg-right">{info.data.clientId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.clientId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,52 +25,52 @@ export function CancelOrderDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.data.side}</td>
|
||||
<td className="text-lg-end">{info.data.side}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Slot</td>
|
||||
<td className="text-lg-right">{info.data.openOrdersSlot}</td>
|
||||
<td className="text-lg-end">{info.data.openOrdersSlot}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Id</td>
|
||||
<td className="text-lg-right">{info.data.orderId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.orderId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,61 +25,61 @@ export function CancelOrderV2DetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.data.side}</td>
|
||||
<td className="text-lg-end">{info.data.side}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Id</td>
|
||||
<td className="text-lg-right">{info.data.orderId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.orderId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,35 +25,35 @@ export function CloseOpenOrdersDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Rent Receiver</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.rentReceiver} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -25,28 +25,28 @@ export function ConsumeEventsDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Accounts</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.accounts.openOrders.map((account, index) => {
|
||||
return <Address pubkey={account} key={index} alignRight link />;
|
||||
})}
|
||||
|
|
@ -55,7 +55,7 @@ export function ConsumeEventsDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Limit</td>
|
||||
<td className="text-lg-right">{info.data.limit}</td>
|
||||
<td className="text-lg-end">{info.data.limit}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,35 +25,35 @@ export function ConsumeEventsPermissionedDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Crank Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.crankAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Accounts</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.accounts.openOrders.map((account, index) => {
|
||||
return <Address pubkey={account} key={index} alignRight link />;
|
||||
})}
|
||||
|
|
@ -62,7 +62,7 @@ export function ConsumeEventsPermissionedDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Limit</td>
|
||||
<td className="text-lg-right">{info.data.limit}</td>
|
||||
<td className="text-lg-end">{info.data.limit}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,21 +25,21 @@ export function DisableMarketDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Disable Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.disableAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -25,28 +25,28 @@ export function InitOpenOrdersDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -54,7 +54,7 @@ export function InitOpenOrdersDetailsCard(props: {
|
|||
{info.accounts.openOrdersMarketAuthority && (
|
||||
<tr>
|
||||
<td>Open Orders Market Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={info.accounts.openOrdersMarketAuthority}
|
||||
alignRight
|
||||
|
|
|
|||
|
|
@ -25,99 +25,99 @@ export function InitializeMarketDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseMint} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Mint</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteMint} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Lot Size</td>
|
||||
<td className="text-lg-right">{info.data.baseLotSize.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.baseLotSize.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Lot Size</td>
|
||||
<td className="text-lg-right">{info.data.quoteLotSize.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.quoteLotSize.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Fee Rate Bps</td>
|
||||
<td className="text-lg-right">{info.data.feeRateBps}</td>
|
||||
<td className="text-lg-end">{info.data.feeRateBps}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Dust Threshold</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.data.quoteDustThreshold.toString(10)}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Vault Signer Nonce</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.data.vaultSignerNonce.toString(10)}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -25,49 +25,49 @@ export function MatchOrdersDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Limit</td>
|
||||
<td className="text-lg-right">{info.data.limit}</td>
|
||||
<td className="text-lg-end">{info.data.limit}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,83 +25,83 @@ export function NewOrderDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Payer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.payer} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.data.side}</td>
|
||||
<td className="text-lg-end">{info.data.side}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Type</td>
|
||||
<td className="text-lg-right">{info.data.orderType}</td>
|
||||
<td className="text-lg-end">{info.data.orderType}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Limit Price</td>
|
||||
<td className="text-lg-right">{info.data.limitPrice.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.limitPrice.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Max Quantity</td>
|
||||
<td className="text-lg-right">{info.data.maxQuantity.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.maxQuantity.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Client Id</td>
|
||||
<td className="text-lg-right">{info.data.clientId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.clientId.toString(10)}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,77 +25,77 @@ export function NewOrderV3DetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Request Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.requestQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Payer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.payer} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -103,7 +103,7 @@ export function NewOrderV3DetailsCard(props: {
|
|||
{info.accounts.feeDiscountPubkey && (
|
||||
<tr>
|
||||
<td>Fee Discount</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.feeDiscountPubkey} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -111,41 +111,41 @@ export function NewOrderV3DetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Side</td>
|
||||
<td className="text-lg-right">{info.data.side.toUpperCase()}</td>
|
||||
<td className="text-lg-end">{info.data.side.toUpperCase()}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Order Type</td>
|
||||
<td className="text-lg-right">{info.data.orderType}</td>
|
||||
<td className="text-lg-end">{info.data.orderType}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Limit Price</td>
|
||||
<td className="text-lg-right">{info.data.limitPrice.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.limitPrice.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Max Base Quantity</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.data.maxBaseQuantity.toString(10)}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Max Quote Quantity</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
{info.data.maxQuoteQuantity.toString(10)}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Client Id</td>
|
||||
<td className="text-lg-right">{info.data.clientId.toString(10)}</td>
|
||||
<td className="text-lg-end">{info.data.clientId.toString(10)}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Match Iteration Limit</td>
|
||||
<td className="text-lg-right">{info.data.limit}</td>
|
||||
<td className="text-lg-end">{info.data.limit}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,63 +25,63 @@ export function PruneDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Bids</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.bids} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Asks</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.asks} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Prune Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.pruneAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Event Queue</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.eventQueue} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Iteration Limit</td>
|
||||
<td className="text-lg-right">{info.data.limit}</td>
|
||||
<td className="text-lg-end">{info.data.limit}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,63 +25,63 @@ export function SettleFundsDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrders} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Open Orders Owner</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.openOrdersOwner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Wallet</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.baseWallet} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Wallet</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteWallet} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Vault Signer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.vaultSigner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -89,7 +89,7 @@ export function SettleFundsDetailsCard(props: {
|
|||
{info.accounts.referrerQuoteWallet && (
|
||||
<tr>
|
||||
<td>Referrer Quote Wallet</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={info.accounts.referrerQuoteWallet}
|
||||
alignRight
|
||||
|
|
|
|||
|
|
@ -25,28 +25,28 @@ export function SweepFeesDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Market</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.market} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Quote Vault</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteVault} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Fee Sweeping Authority</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address
|
||||
pubkey={info.accounts.feeSweepingAuthority}
|
||||
alignRight
|
||||
|
|
@ -57,14 +57,14 @@ export function SweepFeesDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Fee Receiver</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.quoteFeeReceiver} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Vault Signer</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.accounts.vaultSigner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,35 +29,35 @@ export function AuthorizeDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Old Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.authority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>New Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.newAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Type</td>
|
||||
<td className="text-lg-right">{info.authorityType}</td>
|
||||
<td className="text-lg-end">{info.authorityType}</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -29,21 +29,21 @@ export function DeactivateDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,28 +29,28 @@ export function DelegateDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Delegated Vote Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.voteAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -32,28 +32,28 @@ export function InitializeDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.authorized.staker} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Withdraw Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.authorized.withdrawer} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -61,7 +61,7 @@ export function InitializeDetailsCard(props: {
|
|||
{info.lockup.epoch > 0 && (
|
||||
<tr>
|
||||
<td>Lockup Expiry Epoch</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Epoch epoch={info.lockup.epoch} link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -70,7 +70,7 @@ export function InitializeDetailsCard(props: {
|
|||
{info.lockup.unixTimestamp > 0 && (
|
||||
<tr>
|
||||
<td>Lockup Expiry Timestamp</td>
|
||||
<td className="text-lg-right text-monospace">
|
||||
<td className="text-lg-end font-monospace">
|
||||
{displayTimestampUtc(info.lockup.unixTimestamp * 1000)}
|
||||
</td>
|
||||
</tr>
|
||||
|
|
@ -79,7 +79,7 @@ export function InitializeDetailsCard(props: {
|
|||
{!info.lockup.custodian.equals(SystemProgram.programId) && (
|
||||
<tr>
|
||||
<td>Lockup Custodian Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.lockup.custodian} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,42 +29,42 @@ export function MergeDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Source</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.source} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Destination</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.destination} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Clock Sysvar</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.clockSysvar} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake History Sysvar</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeHistorySysvar} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -30,35 +30,35 @@ export function SplitDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>New Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.newSplitAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Split Amount (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={info.lamports} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -30,35 +30,35 @@ export function WithdrawDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={StakeProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Stake Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.stakeAccount} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Authority Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.withdrawAuthority} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>To Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.destination} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Withdraw Amount (SOL)</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<SolBalance lamports={info.lamports} />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,21 +29,21 @@ export function AllocateDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={SystemProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Allocated Data Size</td>
|
||||
<td className="text-lg-right">{info.space} byte(s)</td>
|
||||
<td className="text-lg-end">{info.space} byte(s)</td>
|
||||
</tr>
|
||||
</InstructionCard>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -30,28 +30,28 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={SystemProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.base} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Seed</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Copyable text={info.seed}>
|
||||
<code>{info.seed}</code>
|
||||
</Copyable>
|
||||
|
|
@ -60,12 +60,12 @@ export function AllocateWithSeedDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Allocated Data Size</td>
|
||||
<td className="text-lg-right">{info.space} byte(s)</td>
|
||||
<td className="text-lg-end">{info.space} byte(s)</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Assigned Program Id</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -29,21 +29,21 @@ export function AssignDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={SystemProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Assigned Program Id</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -30,28 +30,28 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
>
|
||||
<tr>
|
||||
<td>Program</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={SystemProgram.programId} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Account Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.account} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Base Address</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.base} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Seed</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Copyable text={info.seed}>
|
||||
<code>{info.seed}</code>
|
||||
</Copyable>
|
||||
|
|
@ -60,7 +60,7 @@ export function AssignWithSeedDetailsCard(props: {
|
|||
|
||||
<tr>
|
||||
<td>Assigned Program Id</td>
|
||||
<td className="text-lg-right">
|
||||
<td className="text-lg-end">
|
||||
<Address pubkey={info.owner} alignRight link />
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue