Skip to content

Commit

Permalink
Merge branch 'dev' into chore/stardust/remove-identity-resolver
Browse files Browse the repository at this point in the history
  • Loading branch information
begonaalvarezd authored Jan 22, 2024
2 parents a191573 + 3389eb2 commit 79cdae2
Show file tree
Hide file tree
Showing 7 changed files with 79 additions and 45 deletions.
16 changes: 6 additions & 10 deletions client/src/app/components/stardust/history/TransactionCard.tsx
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import classNames from "classnames";
import React from "react";
import TruncatedId from "../TruncatedId";
import Tooltip from "~app/components/Tooltip";
import { ITransactionEntryProps } from "./TransactionEntryProps";
import TransactionIdView from "./TransactionIdView";

const TransactionCard: React.FC<ITransactionEntryProps> = ({
isGenesisByDate,
Expand Down Expand Up @@ -30,14 +29,11 @@ const TransactionCard: React.FC<ITransactionEntryProps> = ({
<div className="field">
<div className="card--label">Transaction Id</div>
<div className="row card--value">
<TruncatedId id={transactionId} link={transactionLink} />
{isTransactionFromStardustGenesis && (
<Tooltip tooltipContent="This link opens the transaction on Chrysalis Mainnet" childrenClass="row middle">
<span className="material-icons" style={{ fontSize: "14px" }}>
warning
</span>
</Tooltip>
)}
<TransactionIdView
transactionId={transactionId}
isTransactionFromStardustGenesis={isTransactionFromStardustGenesis}
transactionLink={transactionLink}
/>
</div>
</div>
<div className="field">
Expand Down
33 changes: 33 additions & 0 deletions client/src/app/components/stardust/history/TransactionIdView.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import React from "react";
import { STARDUST_SUPPLY_INCREASE_TRANSACTION_ID } from "~/helpers/stardust/transactionsHelper";
import TruncatedId from "../TruncatedId";
import Tooltip from "../../Tooltip";

export interface ITransactionIdProps {
transactionId: string;
isTransactionFromStardustGenesis: boolean;
transactionLink: string;
}

const TransactionIdView: React.FC<ITransactionIdProps> = ({ transactionId, isTransactionFromStardustGenesis, transactionLink }) => {
return (
<>
{isTransactionFromStardustGenesis && transactionId.includes(STARDUST_SUPPLY_INCREASE_TRANSACTION_ID) ? (
<span>Stardust Genesis</span>
) : (
<>
<TruncatedId id={transactionId} link={transactionLink} />
{isTransactionFromStardustGenesis && (
<Tooltip tooltipContent="This link opens the transaction on Chrysalis Mainnet" childrenClass="row middle">
<span className="material-icons" style={{ fontSize: "14px" }}>
warning
</span>
</Tooltip>
)}
</>
)}
</>
);
};

export default TransactionIdView;
21 changes: 8 additions & 13 deletions client/src/app/components/stardust/history/TransactionRow.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
import classNames from "classnames";
import React from "react";
import { Link } from "react-router-dom";
import Tooltip from "../../Tooltip";
import TruncatedId from "../TruncatedId";
import { ITransactionEntryProps } from "./TransactionEntryProps";
import TransactionIdView from "./TransactionIdView";

const TransactionRow: React.FC<ITransactionEntryProps> = ({
isGenesisByDate,
Expand All @@ -26,16 +24,13 @@ const TransactionRow: React.FC<ITransactionEntryProps> = ({
<tr>
{isGenesisByDate ? <td className="date">Genesis</td> : <td className="date">{dateFormatted}</td>}
<td className="transaction-id">
<Link to={transactionLink} className="row center margin-r-t">
<TruncatedId id={transactionId} />
{isTransactionFromStardustGenesis && (
<Tooltip tooltipContent="This link opens the transaction on Chrysalis Mainnet" childrenClass="row middle">
<span className="material-icons" style={{ fontSize: "14px" }}>
warning
</span>
</Tooltip>
)}
</Link>
<div className="row center">
<TransactionIdView
transactionId={transactionId}
isTransactionFromStardustGenesis={isTransactionFromStardustGenesis}
transactionLink={transactionLink}
/>
</div>
</td>
<td className={classNames("amount", { negative: isSpent })}>{valueView}</td>
</tr>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import moment from "moment/moment";

import { DateHelper } from "~helpers/dateHelper";
import { OutputWithDetails } from "~helpers/hooks/useAddressHistory";
import { TransactionsHelper } from "~helpers/stardust/transactionsHelper";
import { STARDUST_SUPPLY_INCREASE_TRANSACTION_ID, TransactionsHelper } from "~helpers/stardust/transactionsHelper";
import { formatAmount } from "~helpers/stardust/valueFormatHelper";
import { CHRYSALIS_MAINNET } from "~models/config/networkType";

Expand Down Expand Up @@ -69,9 +69,7 @@ export const getTransactionHistoryRecords = (
TransactionsHelper.isTransactionFromIotaStardustGenesis(network, milestoneIndex),
);

const transactionLink = isTransactionFromStardustGenesis
? `/${CHRYSALIS_MAINNET}/search/${transactionId}`
: `/${network}/transaction/${transactionId}`;
const transactionLink = getTransactionLink(network, transactionId, isTransactionFromStardustGenesis);

const isSpent = balanceChange < 0;

Expand Down Expand Up @@ -111,3 +109,9 @@ export const calculateBalanceChange = (outputs: OutputWithDetails[]) => {
return acc + amount;
}, 0);
};

export const getTransactionLink = (network: string, transactionId: string, isTransactionFromStardustGenesis: boolean) => {
return isTransactionFromStardustGenesis && !transactionId.includes(STARDUST_SUPPLY_INCREASE_TRANSACTION_ID)
? `/${CHRYSALIS_MAINNET}/search/${transactionId}`
: `/${network}/transaction/${transactionId}`;
};
10 changes: 10 additions & 0 deletions client/src/app/routes/stardust/OutputPage.scss
Original file line number Diff line number Diff line change
Expand Up @@ -83,4 +83,14 @@
}
}
}

.output-page__transaction-id {
.tooltip {
margin-left: 10px;

@include phone-down {
margin-left: 0;
}
}
}
}
30 changes: 12 additions & 18 deletions client/src/app/routes/stardust/OutputPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,15 @@ import OutputPageProps from "./OutputPageProps";
import mainMessage from "~assets/modals/stardust/output/main-header.json";
import { DateHelper } from "~helpers/dateHelper";
import { useOutputDetails } from "~helpers/hooks/useOutputDetails";
import { TransactionsHelper } from "~helpers/stardust/transactionsHelper";
import { formatSpecialBlockId } from "~helpers/stardust/valueFormatHelper";
import { CHRYSALIS_MAINNET } from "~models/config/networkType";
import CopyButton from "../../components/CopyButton";
import Modal from "../../components/Modal";
import NotFound from "../../components/NotFound";
import Output from "../../components/stardust/Output";
import TruncatedId from "../../components/stardust/TruncatedId";
import Tooltip from "../../components/Tooltip";
import "./OutputPage.scss";
import TransactionIdView from "~/app/components/stardust/history/TransactionIdView";
import { TransactionsHelper } from "~/helpers/stardust/transactionsHelper";
import { getTransactionLink } from "~/app/components/stardust/history/transactionHistoryUtils";

const OutputPage: React.FC<RouteComponentProps<OutputPageProps>> = ({
match: {
Expand Down Expand Up @@ -51,11 +50,8 @@ const OutputPage: React.FC<RouteComponentProps<OutputPageProps>> = ({
milestoneTimestampBooked,
} = outputMetadata ?? {};

const isTransactionFromStardustGenesis =
milestoneIndexBooked && TransactionsHelper.isTransactionFromIotaStardustGenesis(network, milestoneIndexBooked);
const transctionLink = isTransactionFromStardustGenesis
? `/${CHRYSALIS_MAINNET}/search/${transactionId}`
: `/${network}/transaction/${transactionId}`;
const isTransactionFromStardustGenesis = TransactionsHelper.isTransactionFromIotaStardustGenesis(network, milestoneIndexBooked ?? 0);
const transactionLink = getTransactionLink(network, transactionId ?? "", isTransactionFromStardustGenesis);

return (
(output && (
Expand Down Expand Up @@ -101,16 +97,14 @@ const OutputPage: React.FC<RouteComponentProps<OutputPageProps>> = ({
{transactionId && (
<div className="section--data">
<div className="label">Transaction ID</div>
<div className="value code highlight row middle">
{isTransactionFromStardustGenesis && (
<Tooltip
tooltipContent="This link opens the transaction on Chrysalis Mainnet"
childrenClass="row middle"
>
<span className="material-icons">warning</span>
</Tooltip>
<div className="value code highlight row middle output-page__transaction-id">
{milestoneIndexBooked && (
<TransactionIdView
transactionId={transactionId}
isTransactionFromStardustGenesis={isTransactionFromStardustGenesis}
transactionLink={transactionLink}
/>
)}
<TruncatedId id={transactionId} link={transctionLink} showCopyButton />
</div>
</div>
)}
Expand Down
2 changes: 2 additions & 0 deletions client/src/helpers/stardust/transactionsHelper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,8 @@ const HEX_PARTICIPATE = "0x5041525449434950415445";
*/
export const STARDUST_GENESIS_MILESTONE = 7669900;

export const STARDUST_SUPPLY_INCREASE_TRANSACTION_ID = "0xb191c4bc825ac6983789e50545d5ef07a1d293a98ad974fc9498cb18";

export class TransactionsHelper {
public static async getInputsAndOutputs(
block: Block | undefined,
Expand Down

0 comments on commit 79cdae2

Please sign in to comment.