fix: refine search, display unlock condition, stardust git workflow

Author: brancoder

.github/workflows/build-stardust.yml

@@ -0,0 +1,28 @@
+name: Client Build Stardust
+
+on: 
+  push:
+    branches: [feat/stardust]
+    paths:
+      - "src/**"
+      - ".github/workflows/build-stardust.yml"
+  pull_request:
+    branches: [feat/stardust]
+    paths:
+      - "src/**"
+      - ".github/workflows/build-stardust.yml"
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+      - name: Use Node.js 14.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: "14"
+      - name: Client Build
+        run: |
+          npm install
+          npm run build

package-lock.json

@@ -9,8 +9,7 @@
     },
     "license": "MIT",
     "dependencies": {
-        "@iota/crypto.js": "^1.9.0-stardust.4",
-        "@iota/util.js": "^1.9.0-stardust.4",
+        "@iota/iota.js": "^1.9.0-stardust.6",
         "classnames": "^2.3.1",
         "humanize-duration": "^3.25.2",
         "moment": "^2.29.1",

package.json

@@ -34,7 +34,7 @@ class Output extends Component<OutputProps, OutputState> {
     public render(): ReactNode {
         return (
             <div className="output">
-                <h2>{NameHelper.getOutputTypeName(this.state.output.type)} {this.props.index}</h2>
+                <h2>{this.props.index}. {NameHelper.getOutputTypeName(this.state.output.type)}</h2>
                 {/* Diplay metadata for Output Response */}
                 {this.isOutputResponse(this.props.output) && (
                     <React.Fragment>

src/app/components/tangle/Output.tsx

@@ -92,11 +92,9 @@ class UnlockCondition extends Component<UnlockConditionProps> {
                     </React.Fragment>
                 )}
                 {this.props.unlockCondition.type === IMMUTABLE_ALIAS_UNLOCK_CONDITION_TYPE && (
-                    <React.Fragment>
-                        <Address
-                            address={this.props.unlockCondition.address}
-                        />
-                    </React.Fragment>
+                    <Address
+                        address={this.props.unlockCondition.address}
+                    />
                 )}
                 <div className="card--label">
                     Type:

src/app/components/tangle/UnlockCondition.tsx

@@ -1,6 +1,6 @@
 import { Blake2b } from "@iota/crypto.js";
-import { serializeMessage, deserializeMessage, IMessage, ADDRESS_UNLOCK_CONDITION_TYPE } from "@iota/iota.js";
-import { Converter, WriteStream, ReadStream } from "@iota/util.js";
+import { serializeMessage } from "@iota/iota.js";
+import { Converter, WriteStream } from "@iota/util.js";
 import React, { ReactNode } from "react";
 import { Link, Redirect, RouteComponentProps } from "react-router-dom";
 import { ReactComponent as ChevronLeftIcon } from "../../assets/chevron-left.svg";
@@ -93,17 +93,25 @@ class Search extends AsyncComponent<RouteComponentProps<SearchRouteProps>, Searc
                                             <span>Addresses</span>
                                             <span>64 Hex characters or Bech32 Format</span>
                                         </li>
+                                        <li>
+                                            <span>Nft/Alias Addresses</span>
+                                            <span>40 Hex characters or Bech32 Format</span>
+                                        </li>
                                         <li>
                                             <span>Outputs</span>
-                                            <span>68 Hex characters</span>
+                                            <span>68 Hex characters or tag</span>
                                         </li>
                                         <li>
-                                            <span>Milestone Index</span>
-                                            <span>Numeric</span>
+                                            <span>Foundry Id</span>
+                                            <span>52 Hex characters</span>
                                         </li>
                                         <li>
-                                            <span>Indexes</span>
-                                            <span>Maximum 64 UTF-8 chars or maximum 128 hex chars</span>
+                                            <span>Token Id</span>
+                                            <span>76 Hex characters</span>
+                                        </li>
+                                        <li>
+                                            <span>Milestone Index</span>
+                                            <span>Numeric</span>
                                         </li>
                                     </ul>
                                 </React.Fragment>
@@ -136,8 +144,6 @@ class Search extends AsyncComponent<RouteComponentProps<SearchRouteProps>, Searc
 
                         if (response.message) {
                             objType = "message";
-                            console.log("message");
-                            console.log(response.message);
                             // Recalculate the message id from the content, in case
                             // the lookup was a response to a transaction id lookup
                             const writeStream = new WriteStream();
@@ -149,17 +155,7 @@ class Search extends AsyncComponent<RouteComponentProps<SearchRouteProps>, Searc
                                     console.log(error.message);
                                 }
                             }
-                            // console.log("writeStream.finalHex()")
-                            // console.log(writeStream.finalHex())
                             objParam = Converter.bytesToHex(Blake2b.sum256(writeStream.finalBytes()), true);
-                            // console.log(objParam);
-                            // let rs = new ReadStream(writeStream.finalBytes())
-            //                 const hex =
-            // "020239210d349a33c361bf98ada707663f3f7da71ffff1531c58c1c5c770a60c4223c2f5cc3f1161b74e84a5afc9f4739ab51d0d01c3786334a1877436a3c2cc9ebda101000007000000300401000dad4e62000000000239210d349a33c361bf98ada707663f3f7da71ffff1531c58c1c5c770a60c4223c2f5cc3f1161b74e84a5afc9f4739ab51d0d01c3786334a1877436a3c2cc9ebd0e5751c026e543b2e8ab2eb06099daa1d1e5df47778f7787faab45cdf12fe3a80000000000000000000000000300d85e5b1590d898d1e0cdebb2e3b5337c8b76270142663d78811683ba47c17c9815188080d5ef2f8a8fd08498243a30b2a8eb08e0910573101632bb244c9e27db26121c8af619d90de6cb5e5c407e4edd709e0e06702170e311a1668e0a12480d00d9922819a39e94ddf3907f4b9c8df93f39f026244fcb609205b9a879022599f248afb8e21fbba0ba473b6798ecad3a33e10d1575fd5e3822e2922db4cc24b0808fd6792ee6eaaade15cdc14e43da16883962d15358dc064ba5bb2726cf07790a00f9d9656a60049083eef61487632187b351294c1fa23d118060d813db6d03e8b6105c244d6cd7d831d7f661e985fed1461cdda0ef48e9b973015aa1e28ff1cdd1089f910789cccaeeb24c74b17a36d9777199056d54fea8d28c1e16abee4b710c8038aeaaaaaaaaaa";
-            //                 let rs = new ReadStream(Converter.hexToBytes(hex))
-            //                 let de = deserializeMessage(rs)
-            //                 console.log("deserialize")
-            //                 console.log(JSON.stringify(de))
                         } else if (response?.address) {
                             objType = "address";
                         } else if (response.indexMessageIds) {

src/app/routes/Search.tsx

@@ -14,10 +14,10 @@ import AsyncComponent from "../../components/layout/AsyncComponent";
 import MessageButton from "../../components/layout/MessageButton";
 import Spinner from "../../components/layout/Spinner";
 import InclusionState from "../../components/tangle/InclusionState";
-import TaggedDataPayload from "../../components/tangle/TaggedDataPayload";
 import MessageTangleState from "../../components/tangle/MessageTangleState";
 import MilestonePayload from "../../components/tangle/MilestonePayload";
 import ReceiptPayload from "../../components/tangle/ReceiptPayload";
+import TaggedDataPayload from "../../components/tangle/TaggedDataPayload";
 import TransactionPayload from "../../components/tangle/TransactionPayload";
 import "./Message.scss";
 import { MessageRouteProps } from "./MessageRouteProps";