bitcoin-computer · ClemensLey · Jan 22, 2024 · Jan 22, 2024 · Jan 22, 2024 · Jan 22, 2024
diff --git a/packages/components/built/Auth.js b/packages/components/built/Auth.js
@@ -50,7 +50,7 @@ function getUrl(chain, network) {
     var index = "REACT_APP_".concat(chain.toUpperCase(), "_").concat(network.toUpperCase(), "_URL");
     var url = process.env[index];
     if (typeof url === "undefined")
-        throw new Error("Cannot find url");
+        throw new Error("Cannot find a url for ".concat(chain.toUpperCase(), " ").concat(network.toUpperCase(), ", please provide a variable \"REACT_APP_").concat(chain.toUpperCase(), "_").concat(network.toUpperCase(), "_URL\" in your .env file"));
     return url;
 }
 function defaultConfiguration() {

diff --git a/packages/components/built/Gallery.js b/packages/components/built/Gallery.js
@@ -107,7 +107,8 @@ export default function WithPagination(_a) {
     var _b = useState(0), pageNum = _b[0], setPageNum = _b[1];
     var _c = useState(true), isNextAvailable = _c[0], setIsNextAvailable = _c[1];
     var _d = useState(pageNum > 0), isPrevAvailable = _d[0], setIsPrevAvailable = _d[1];
-    var _e = useState([]), revs = _e[0], setRevs = _e[1];
+    var _e = useState(false), showNoAsset = _e[0], setShowNoAsset = _e[1];
+    var _f = useState([]), revs = _f[0], setRevs = _f[1];
     var location = useLocation();
     var pubKey = publicKey || new URLSearchParams(location.search).get("public-key");
     useEffect(function () {
@@ -133,6 +134,9 @@ export default function WithPagination(_a) {
                         queryRevs = _a.sent();
                         setIsNextAvailable(queryRevs.length > contractsPerPage);
                         setRevs(queryRevs);
+                        if (pageNum === 0 && (queryRevs === null || queryRevs === void 0 ? void 0 : queryRevs.length) === 0) {
+                            setShowNoAsset(true);
+                        }
                         return [3 /*break*/, 4];
                     case 3:
                         error_1 = _a.sent();
@@ -163,7 +167,7 @@ export default function WithPagination(_a) {
             return [2 /*return*/];
         });
     }); };
-    return (_jsxs("div", __assign({ className: "relative sm:rounded-lg pt-4" }, { children: [_jsx(FromRevs, { revs: revs, computer: computer }), !(pageNum === 0 && revs && revs.length === 0) && (_jsx(Pagination, { revs: revs, isPrevAvailable: isPrevAvailable, handlePrev: handlePrev, isNextAvailable: isNextAvailable, handleNext: handleNext }))] })));
+    return (_jsxs("div", __assign({ className: "relative sm:rounded-lg pt-4 w-full" }, { children: [_jsx(FromRevs, { revs: revs, computer: computer }), !(pageNum === 0 && revs && revs.length === 0) && (_jsx(Pagination, { revs: revs, isPrevAvailable: isPrevAvailable, handlePrev: handlePrev, isNextAvailable: isNextAvailable, handleNext: handleNext })), pageNum === 0 && revs && revs.length === 0 && showNoAsset && (_jsx("h1", __assign({ className: "w-full mb-4 text-2xl font-extrabold leading-none tracking-tight text-gray-900 dark:text-white text-center mx-auto" }, { children: "No Assets" })))] })));
 }
 export var Gallery = {
     FromRevs: FromRevs,

diff --git a/packages/components/built/SmartObject.d.ts b/packages/components/built/SmartObject.d.ts
@@ -1,7 +1,4 @@
-export declare const getErrorMessage: (error: any) => string;
 export declare const getFnParamNames: (fn: string) => string[];
-export declare const getValueForType: (type: string, stringValue: string) => string | number | true | null | undefined;
-export declare const TypeSelectionDropdown: ({ id, onSelectMethod, dropdownList, selectedType }: any) => import("react/jsx-runtime").JSX.Element;
 declare function Component(): import("react/jsx-runtime").JSX.Element;
 export declare const SmartObject: {
     Component: typeof Component;

diff --git a/packages/components/built/SmartObject.js b/packages/components/built/SmartObject.js
@@ -45,85 +45,22 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { Dropdown, initFlowbite, } from "flowbite";
 import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
-import { capitalizeFirstLetter, isValidRev, sleep, toObject } from "./common/utils";
+import { capitalizeFirstLetter, toObject } from "./common/utils";
 import reactStringReplace from "react-string-replace";
 import { Auth } from "./Auth";
 import { Card } from "./Card";
 import { Modal } from "./Modal";
 import { FunctionResultModalContent } from "./common/SmartCallExecutionResult";
+import { SmartObjectFunction } from "./SmartObjectFunction";
 var keywords = ["_id", "_rev", "_owners", "_root", "_amount"];
 var modalId = "smart-object-info-modal";
-export var getErrorMessage = function (error) {
-    var _a, _b, _c, _d, _e, _f;
-    if (((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.error) ===
-        "mandatory-script-verify-flag-failed (Operation not valid with the current stack size)") {
-        return "You are not authorized to make changes to this smart object";
-    }
-    else if ((_d = (_c = error === null || error === void 0 ? void 0 : error.response) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.error) {
-        return (_f = (_e = error === null || error === void 0 ? void 0 : error.response) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.error;
-    }
-    else {
-        return error.message ? error.message : "Error occurred";
-    }
-};
 export var getFnParamNames = function (fn) {
     var match = fn.toString().match(/\(.*?\)/);
     return match ? match[0].replace(/[()]/gi, "").replace(/\s/gi, "").split(",") : [];
 };
-export var getValueForType = function (type, stringValue) {
-    switch (type) {
-        case "number":
-            return Number(stringValue);
-        case "string":
-            return stringValue;
-        case "boolean":
-            return true; // make this dynamic
-        case "undefined":
-            return undefined;
-        case "null":
-            return null;
-        case "object":
-            return stringValue;
-        default:
-            return Number(stringValue);
-    }
-};
-export var TypeSelectionDropdown = function (_a) {
-    var id = _a.id, onSelectMethod = _a.onSelectMethod, dropdownList = _a.dropdownList, selectedType = _a.selectedType;
-    var _b = useState(), dropDown = _b[0], setDropdown = _b[1];
-    var _c = useState(selectedType ? selectedType : "Type"), type = _c[0], setType = _c[1];
-    var dropdownSelectionList = useState(dropdownList)[0];
-    useEffect(function () {
-        initFlowbite();
-        var $targetEl = document.getElementById("dropdownMenu".concat(id));
-        var $triggerEl = document.getElementById("dropdownButton".concat(id));
-        var options = {
-            placement: "bottom",
-            triggerType: "click",
-            offsetSkidding: 0,
-            offsetDistance: 10,
-            delay: 300,
-        };
-        var instanceOptions = {
-            id: "dropdownMenu".concat(id),
-            override: true,
-        };
-        setDropdown(new Dropdown($targetEl, $triggerEl, options, instanceOptions));
-    }, [id]);
-    var handleClick = function (type) {
-        setType(type);
-        onSelectMethod(type);
-        if (dropDown)
-            dropDown.hide();
-    };
-    return (_jsxs(_Fragment, { children: [_jsxs("button", __assign({ id: "dropdownButton".concat(id), "data-dropdown-toggle": "dropdownMenu".concat(id), className: "flex justify-between w-32 text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4 focus:ring-gray-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700", type: "button" }, { children: [type, _jsx("svg", __assign({ className: "w-2.5 h-2.5", "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 10 6" }, { children: _jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "m1 1 4 4 4-4" }) }))] })), _jsx("div", __assign({ id: "dropdownMenu".concat(id), className: "z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow w-44 dark:bg-gray-700" }, { children: _jsx("ul", __assign({ className: "py-2 text-sm text-gray-700 dark:text-gray-200", "aria-labelledby": "dropdownButton".concat(id) }, { children: dropdownSelectionList.map(function (option, index) { return (_jsx("li", { children: _jsx("span", __assign({ onClick: function () {
-                                handleClick(option);
-                            }, className: "block px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white" }, { children: option })) }, index)); }) })) }))] }));
-};
 function ObjectValueCard(_a) {
     var content = _a.content;
     var isRev = /([0-9a-fA-F]{64}:[0-9]+)/g;
@@ -145,21 +82,6 @@ var SmartObjectValues = function (_a) {
             return (_jsxs("div", { children: [_jsx("h3", __assign({ className: "mt-2 text-xl font-bold dark:text-white" }, { children: capitalizeFirstLetter(key) })), _jsx(ObjectValueCard, { content: toObject(value) })] }, i));
         }) }));
 };
-var Functions = function (_a) {
-    var smartObject = _a.smartObject, functionsExist = _a.functionsExist, formState = _a.formState, updateFormValue = _a.updateFormValue, updateTypes = _a.updateTypes, handleSmartObjectMethod = _a.handleSmartObjectMethod, options = _a.options;
-    if (!functionsExist)
-        return _jsx(_Fragment, {});
-    return (_jsxs(_Fragment, { children: [_jsx("h2", __assign({ className: "mb-2 text-4xl font-bold dark:text-white" }, { children: "Functions" })), Object.getOwnPropertyNames(Object.getPrototypeOf(smartObject))
-                .filter(function (key) {
-                return key !== "constructor" && typeof Object.getPrototypeOf(smartObject)[key] === "function";
-            })
-                .map(function (key, fnIndex) {
-                var paramList = getFnParamNames(Object.getPrototypeOf(smartObject)[key]);
-                return (_jsxs("div", __assign({ className: "mt-6 mb-6" }, { children: [_jsx("h3", __assign({ className: "mt-2 text-xl font-bold dark:text-white" }, { children: key })), _jsxs("form", __assign({ id: "fn-index-".concat(fnIndex) }, { children: [paramList.map(function (paramName, paramIndex) { return (_jsxs("div", __assign({ className: "mb-4" }, { children: [_jsx("div", __assign({ className: "mb-2" }, { children: _jsx("label", __assign({ htmlFor: "".concat(key, "-").concat(paramName), className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: paramName })) })), _jsxs("div", __assign({ className: "flex items-center space-x-4" }, { children: [_jsx("input", { type: "text", id: "".concat(key, "-").concat(paramName), value: formState["".concat(key, "-").concat(paramName)], onChange: function (e) { return updateFormValue(e, "".concat(key, "-").concat(paramName)); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500", placeholder: "Value", required: true }), _jsx(TypeSelectionDropdown, { id: "".concat(key).concat(paramName), dropdownList: options, onSelectMethod: function (option) {
-                                                        return updateTypes(option, "".concat(key, "-").concat(paramName));
-                                                    } })] }))] }), paramIndex)); }), _jsx("button", __assign({ className: "mr-8 text-white bg-blue-700 hover:bg-blue-800 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium rounded-md text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800", onClick: function (evt) { return handleSmartObjectMethod(evt, smartObject, key, paramList); } }, { children: "Call Function" }))] }))] }), fnIndex));
-            })] }));
-};
 var revToId = function (rev) { return rev === null || rev === void 0 ? void 0 : rev.split(":")[0]; };
 var MetaData = function (_a) {
     var smartObject = _a.smartObject;
@@ -173,14 +95,11 @@ function Component() {
     var rev = useState(params.rev || "")[0];
     var computer = useState(Auth.getComputer())[0];
     var _a = useState(null), smartObject = _a[0], setSmartObject = _a[1];
-    var _b = useState({}), formState = _b[0], setFormState = _b[1];
-    var _c = useState(false), functionsExist = _c[0], setFunctionsExist = _c[1];
-    var _d = useState({}), functionResult = _d[0], setFunctionResult = _d[1];
-    var _e = useState(false), functionCallSuccess = _e[0], setFunctionCallSuccess = _e[1];
+    var _b = useState(false), functionsExist = _b[0], setFunctionsExist = _b[1];
+    var _c = useState({}), functionResult = _c[0], setFunctionResult = _c[1];
     var options = ["object", "string", "number", "bigint", "boolean", "undefined", "symbol"];
-    var _f = useState(""), modalTitle = _f[0], setModalTitle = _f[1];
+    var _d = useState(""), modalTitle = _d[0], setModalTitle = _d[1];
     var setShow = function (flag) {
-        functionCallSuccess ? setModalTitle("Sucess!") : setModalTitle("Error!");
         flag ? Modal.get(modalId).show() : Modal.get(modalId).hide();
     };
     useEffect(function () {
@@ -220,77 +139,8 @@ function Component() {
         }
         setFunctionsExist(funcExist);
     }, [smartObject]);
-    var handleSmartObjectMethod = function (event, smartObject, fnName, params) { return __awaiter(_this, void 0, void 0, function () {
-        var revMap_1, tx, res, error_2;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    event.preventDefault();
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, 6, , 7]);
-                    revMap_1 = {};
-                    params.forEach(function (param) {
-                        var key = "".concat(fnName, "-").concat(param);
-                        var paramValue = getValueForType(formState["".concat(key, "--types")], formState[key]);
-                        if (isValidRev(paramValue)) {
-                            revMap_1[param] = paramValue;
-                        }
-                    });
-                    return [4 /*yield*/, computer.encode({
-                            exp: "smartObject.".concat(fnName, "(").concat(params.map(function (param) {
-                                var key = "".concat(fnName, "-").concat(param);
-                                var paramValue = getValueForType(formState["".concat(key, "--types")], formState[key]);
-                                return isValidRev(paramValue)
-                                    ? param
-                                    : typeof paramValue === "string"
-                                        ? "'".concat(paramValue, "'")
-                                        : paramValue;
-                            }), ")"),
-                            env: __assign({ smartObject: smartObject._rev }, revMap_1),
-                            // @ts-ignore
-                            fund: true,
-                            sign: true,
-                        })];
-                case 2:
-                    tx = (_a.sent()).tx;
-                    return [4 /*yield*/, computer.broadcast(tx)];
-                case 3:
-                    _a.sent();
-                    return [4 /*yield*/, sleep(1000)];
-                case 4:
-                    _a.sent();
-                    return [4 /*yield*/, computer.query({ ids: [smartObject._id] })];
-                case 5:
-                    res = _a.sent();
-                    setFunctionResult({ _rev: res[0] });
-                    setFunctionCallSuccess(true);
-                    setShow(true);
-                    return [3 /*break*/, 7];
-                case 6:
-                    error_2 = _a.sent();
-                    setFunctionResult(getErrorMessage(error_2));
-                    setFunctionCallSuccess(false);
-                    setShow(true);
-                    return [3 /*break*/, 7];
-                case 7: return [2 /*return*/];
-            }
-        });
-    }); };
-    var updateFormValue = function (e, key) {
-        e.preventDefault();
-        console.log(e, key);
-        var value = __assign({}, formState);
-        value[key] = e.target.value;
-        setFormState(value);
-    };
-    var updateTypes = function (option, key) {
-        var value = __assign({}, formState);
-        value["".concat(key, "--types")] = option;
-        setFormState(value);
-    };
-    var _g = rev.split(":"), txId = _g[0], outNum = _g[1];
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsx("h1", __assign({ className: "mb-2 text-5xl font-extrabold dark:text-white" }, { children: "Output" })), _jsxs("p", __assign({ className: "mb-6 text-lg font-normal text-gray-500 lg:text-xl dark:text-gray-400" }, { children: [_jsx(Link, __assign({ to: "/transactions/".concat(txId), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: txId })), ":", outNum] })), _jsx("h2", __assign({ className: "mb-2 text-4xl font-bold dark:text-white" }, { children: "Data" })), _jsx(SmartObjectValues, { smartObject: smartObject }), _jsx(Functions, { smartObject: smartObject, functionsExist: functionsExist, formState: formState, updateFormValue: updateFormValue, updateTypes: updateTypes, handleSmartObjectMethod: handleSmartObjectMethod, options: options }), _jsx(MetaData, { smartObject: smartObject })] }), _jsx(Modal.Component, { title: modalTitle, content: FunctionResultModalContent, contentData: { functionResult: functionResult }, id: modalId })] }));
+    var _e = rev.split(":"), txId = _e[0], outNum = _e[1];
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsx("h1", __assign({ className: "mb-2 text-5xl font-extrabold dark:text-white" }, { children: "Output" })), _jsxs("p", __assign({ className: "mb-6 text-lg font-normal text-gray-500 lg:text-xl dark:text-gray-400" }, { children: [_jsx(Link, __assign({ to: "/transactions/".concat(txId), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: txId })), ":", outNum] })), _jsx("h2", __assign({ className: "mb-2 text-4xl font-bold dark:text-white" }, { children: "Data" })), _jsx(SmartObjectValues, { smartObject: smartObject }), _jsx(SmartObjectFunction, { computer: computer, smartObject: smartObject, functionsExist: functionsExist, options: options, setFunctionResult: setFunctionResult, setShow: setShow, setModalTitle: setModalTitle }), _jsx(MetaData, { smartObject: smartObject })] }), _jsx(Modal.Component, { title: modalTitle, content: FunctionResultModalContent, contentData: { functionResult: functionResult }, id: modalId })] }));
 }
 export var SmartObject = {
     Component: Component,

diff --git a/packages/components/built/SmartObjectFunction.d.ts b/packages/components/built/SmartObjectFunction.d.ts
@@ -0,0 +1,4 @@
+export declare const getErrorMessage: (error: any) => string;
+export declare const getFnParamNames: (fn: string) => string[];
+export declare const getValueForType: (type: string, stringValue: string) => string | number | true | null | undefined;
+export declare const SmartObjectFunction: ({ computer, smartObject, functionsExist, options, setFunctionResult, setShow, setModalTitle, }: any) => import("react/jsx-runtime").JSX.Element;