From fa6463a5758efe8b9e4e791596f67f7708321c31 Mon Sep 17 00:00:00 2001 From: jonty007 Date: Wed, 29 Jan 2025 20:17:20 +0530 Subject: [PATCH] disable call action and dark mode for prev/next --- packages/components/built/SmartObject.js | 4 ++-- packages/components/src/SmartObject.tsx | 4 ++-- .../src/components/playground/CreateNew.tsx | 16 +++++++++++----- .../components/playground/ExecuteExpression.tsx | 13 ++++++++++--- 4 files changed, 25 insertions(+), 12 deletions(-) diff --git a/packages/components/built/SmartObject.js b/packages/components/built/SmartObject.js index 221ae7efe..5c4b3ee3d 100644 --- a/packages/components/built/SmartObject.js +++ b/packages/components/built/SmartObject.js @@ -84,9 +84,9 @@ function MetaData(_a) { }; return (_jsxs("div", { children: [_jsx("div", { className: "pt-6 pb-6 space-y-4 border-t border-gray-300 dark:border-gray-700", children: _jsxs("div", { className: "flex", children: [_jsx("a", { href: prev ? "/objects/".concat(prev) : undefined, className: "flex items-center justify-center px-4 h-10 ms-3 text-sm font-medium border rounded-lg transition \n ".concat(prev ? 'bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700' - : 'bg-gray-200 text-gray-400 cursor-not-allowed'), "aria-disabled": !prev, children: "Previous" }), _jsx("a", { href: next ? "/objects/".concat(next) : undefined, className: "flex items-center justify-center px-4 h-10 ms-3 text-sm font-medium border rounded-lg transition \n ".concat(next + : 'bg-gray-200 text-gray-400 cursor-not-allowed dark:bg-gray-700 dark:text-gray-500'), "aria-disabled": !prev, children: "Previous" }), _jsx("a", { href: next ? "/objects/".concat(next) : undefined, className: "flex items-center justify-center px-4 h-10 ms-3 text-sm font-medium border rounded-lg transition \n ".concat(next ? 'bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700' - : 'bg-gray-200 text-gray-400 cursor-not-allowed'), "aria-disabled": !next, children: "Next" }), _jsx("button", { onClick: toggleVisibility, className: "flex items-center justify-center px-4 h-10 ms-3 text-sm font-medium border rounded-lg transition \n bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700", children: isVisible ? 'Hide Metadata' : 'Show Metadata' })] }) }), isVisible && (_jsxs("table", { className: "w-full mt-4 mb-8 text-[12px] text-left text-gray-500 dark:text-gray-400", children: [_jsx("thead", { className: "text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400", children: _jsxs("tr", { children: [_jsx("th", { scope: "col", className: "px-4 py-2", children: "Key" }), _jsx("th", { scope: "col", className: "px-4 py-2", children: "Short" }), _jsx("th", { scope: "col", className: "px-4 py-2", children: "Value" })] }) }), _jsxs("tbody", { children: [_jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Identity" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_id" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._id), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._id }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._id })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Revision" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_rev" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Root" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_root" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._root), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._root }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._root })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Owners" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_owners" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx("span", { className: "font-medium text-gray-900 dark:text-white", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._owners }), _jsx(Copy, { text: JSON.stringify(smartObject === null || smartObject === void 0 ? void 0 : smartObject._owners) })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Amount" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_amount" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsxs("span", { className: "font-medium text-gray-900 dark:text-white", children: [smartObject === null || smartObject === void 0 ? void 0 : smartObject._amount, " Satoshi"] }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._amount })] })] })] })] }))] })); + : 'bg-gray-200 text-gray-400 cursor-not-allowed dark:bg-gray-700 dark:text-gray-500'), "aria-disabled": !next, children: "Next" }), _jsx("button", { onClick: toggleVisibility, className: "flex items-center justify-center px-4 h-10 ms-3 text-sm font-medium border rounded-lg transition \n bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700", children: isVisible ? 'Hide Metadata' : 'Show Metadata' })] }) }), isVisible && (_jsxs("table", { className: "w-full mt-4 mb-8 text-[12px] text-left text-gray-500 dark:text-gray-400", children: [_jsx("thead", { className: "text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400", children: _jsxs("tr", { children: [_jsx("th", { scope: "col", className: "px-4 py-2", children: "Key" }), _jsx("th", { scope: "col", className: "px-4 py-2", children: "Short" }), _jsx("th", { scope: "col", className: "px-4 py-2", children: "Value" })] }) }), _jsxs("tbody", { children: [_jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Identity" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_id" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._id), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._id }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._id })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Revision" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_rev" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._rev })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Root" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_root" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx(Link, { to: "/objects/".concat(smartObject === null || smartObject === void 0 ? void 0 : smartObject._root), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._root }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._root })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Owners" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_owners" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsx("span", { className: "font-medium text-gray-900 dark:text-white", children: smartObject === null || smartObject === void 0 ? void 0 : smartObject._owners }), _jsx(Copy, { text: JSON.stringify(smartObject === null || smartObject === void 0 ? void 0 : smartObject._owners) })] })] }), _jsxs("tr", { className: "bg-white border-b dark:bg-gray-800 dark:border-gray-700", children: [_jsx("td", { className: "px-4 py-2", children: "Amount" }), _jsx("td", { className: "px-4 py-2", children: _jsx("pre", { children: "_amount" }) }), _jsxs("td", { className: "px-4 py-2", children: [_jsxs("span", { className: "font-medium text-gray-900 dark:text-white", children: [smartObject === null || smartObject === void 0 ? void 0 : smartObject._amount, " Satoshi"] }), _jsx(Copy, { text: smartObject === null || smartObject === void 0 ? void 0 : smartObject._amount })] })] })] })] }))] })); } function Component(_a) { var _this = this; diff --git a/packages/components/src/SmartObject.tsx b/packages/components/src/SmartObject.tsx index 81c2ddb91..24f9c4c00 100644 --- a/packages/components/src/SmartObject.tsx +++ b/packages/components/src/SmartObject.tsx @@ -78,7 +78,7 @@ function MetaData({ smartObject, prev, next }: any) { ${ prev ? 'bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700' - : 'bg-gray-200 text-gray-400 cursor-not-allowed' + : 'bg-gray-200 text-gray-400 cursor-not-allowed dark:bg-gray-700 dark:text-gray-500' }`} aria-disabled={!prev} > @@ -90,7 +90,7 @@ function MetaData({ smartObject, prev, next }: any) { ${ next ? 'bg-white text-black border-gray-300 hover:bg-gray-100 focus:ring-4 focus:ring-gray-100 dark:bg-gray-800 dark:text-white dark:border-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-700' - : 'bg-gray-200 text-gray-400 cursor-not-allowed' + : 'bg-gray-200 text-gray-400 cursor-not-allowed dark:bg-gray-700 dark:text-gray-500' }`} aria-disabled={!next} > diff --git a/packages/explorer/src/components/playground/CreateNew.tsx b/packages/explorer/src/components/playground/CreateNew.tsx index 199c58421..7e85acf14 100644 --- a/packages/explorer/src/components/playground/CreateNew.tsx +++ b/packages/explorer/src/components/playground/CreateNew.tsx @@ -1,4 +1,4 @@ -import { Dispatch, SetStateAction, useEffect, useState } from 'react' +import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react' import { IoMdRemoveCircleOutline } from 'react-icons/io' import { Computer } from '@bitcoin-computer/lib' import { UtilsContext } from '@bitcoin-computer/components' @@ -130,6 +130,11 @@ const CreateNew = (props: { } } + const isCallDisabled = useMemo( + () => argumentsList.some((arg) => !arg.type.trim() && !arg.hidden), + [argumentsList], + ) + return ( <>