@openzeppelin/ui-renderer 1.1.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +69 -28
- package/dist/index.cjs +179 -104
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +45 -25
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.mts +45 -25
- package/dist/index.d.mts.map +1 -1
- package/dist/index.mjs +177 -105
- package/dist/index.mjs.map +1 -1
- package/package.json +6 -6
package/dist/index.mjs
CHANGED
|
@@ -178,8 +178,8 @@ const ExecutionConfigCard = ({ config }) => {
|
|
|
178
178
|
//#region src/components/ExecutionConfigDisplay/components/RelayerConfigDetails.tsx
|
|
179
179
|
const RelayerConfigDetails = ({ config, enhancedDetails, loading = false }) => {
|
|
180
180
|
const { relayer } = config;
|
|
181
|
-
const {
|
|
182
|
-
const labels =
|
|
181
|
+
const { activeRuntime } = useWalletState();
|
|
182
|
+
const labels = activeRuntime?.uiLabels.getUiLabels();
|
|
183
183
|
return /* @__PURE__ */ jsxs("div", {
|
|
184
184
|
className: "space-y-4",
|
|
185
185
|
children: [
|
|
@@ -216,18 +216,18 @@ const RelayerConfigDetails = ({ config, enhancedDetails, loading = false }) => {
|
|
|
216
216
|
|
|
217
217
|
//#endregion
|
|
218
218
|
//#region src/components/ExecutionConfigDisplay/hooks/useExecutionValidation.ts
|
|
219
|
-
const useExecutionValidation = ({ executionConfig,
|
|
219
|
+
const useExecutionValidation = ({ executionConfig, execution, runtimeApiKey }) => {
|
|
220
220
|
const [validationResult, setValidationResult] = useState({ isValid: true });
|
|
221
221
|
const validateConfig = useCallback(async () => {
|
|
222
|
-
if (!
|
|
222
|
+
if (!execution) {
|
|
223
223
|
setValidationResult({
|
|
224
224
|
isValid: false,
|
|
225
|
-
error: "No
|
|
225
|
+
error: "No execution capability available for validation"
|
|
226
226
|
});
|
|
227
227
|
return;
|
|
228
228
|
}
|
|
229
229
|
try {
|
|
230
|
-
const result = await
|
|
230
|
+
const result = await execution.validateExecutionConfig(executionConfig);
|
|
231
231
|
if (result === true) {
|
|
232
232
|
let runtimeError;
|
|
233
233
|
if (executionConfig.method === "relayer" && (!runtimeApiKey || runtimeApiKey.trim() === "")) runtimeError = "Relayer API key is required for transaction execution";
|
|
@@ -246,8 +246,8 @@ const useExecutionValidation = ({ executionConfig, adapter, runtimeApiKey }) =>
|
|
|
246
246
|
});
|
|
247
247
|
}
|
|
248
248
|
}, [
|
|
249
|
+
execution,
|
|
249
250
|
executionConfig,
|
|
250
|
-
adapter,
|
|
251
251
|
runtimeApiKey
|
|
252
252
|
]);
|
|
253
253
|
useEffect(() => {
|
|
@@ -258,7 +258,7 @@ const useExecutionValidation = ({ executionConfig, adapter, runtimeApiKey }) =>
|
|
|
258
258
|
|
|
259
259
|
//#endregion
|
|
260
260
|
//#region src/components/ExecutionConfigDisplay/ExecutionConfigDisplay.tsx
|
|
261
|
-
const ExecutionConfigDisplay = ({ executionConfig,
|
|
261
|
+
const ExecutionConfigDisplay = ({ executionConfig, execution, relayer, error, onRuntimeApiKeyChange }) => {
|
|
262
262
|
const { control, watch } = useForm({ defaultValues: { runtimeApiKey: "" } });
|
|
263
263
|
const runtimeApiKey = watch("runtimeApiKey");
|
|
264
264
|
const [isOpen, setIsOpen] = useState(false);
|
|
@@ -266,17 +266,17 @@ const ExecutionConfigDisplay = ({ executionConfig, adapter, error, onRuntimeApiK
|
|
|
266
266
|
const [relayerDetailsLoading, setRelayerDetailsLoading] = useState(false);
|
|
267
267
|
const { isValid, error: validationError } = useExecutionValidation({
|
|
268
268
|
executionConfig,
|
|
269
|
-
|
|
269
|
+
execution,
|
|
270
270
|
runtimeApiKey
|
|
271
271
|
});
|
|
272
272
|
useEffect(() => {
|
|
273
273
|
onRuntimeApiKeyChange?.(runtimeApiKey);
|
|
274
274
|
}, [runtimeApiKey, onRuntimeApiKeyChange]);
|
|
275
275
|
useEffect(() => {
|
|
276
|
-
if (isOpen && executionConfig.method === "relayer" && runtimeApiKey &&
|
|
276
|
+
if (isOpen && executionConfig.method === "relayer" && runtimeApiKey && relayer?.getRelayer) {
|
|
277
277
|
const relayerConfig = executionConfig;
|
|
278
278
|
setRelayerDetailsLoading(true);
|
|
279
|
-
|
|
279
|
+
relayer.getRelayer(relayerConfig.serviceUrl, runtimeApiKey, relayerConfig.relayer.relayerId).then((details) => {
|
|
280
280
|
setEnhancedRelayerDetails(details);
|
|
281
281
|
}).catch((err) => {
|
|
282
282
|
logger.error("ExecutionConfigDisplay", "Failed to fetch enhanced relayer details:", err);
|
|
@@ -286,10 +286,10 @@ const ExecutionConfigDisplay = ({ executionConfig, adapter, error, onRuntimeApiK
|
|
|
286
286
|
});
|
|
287
287
|
}
|
|
288
288
|
}, [
|
|
289
|
-
isOpen,
|
|
290
289
|
executionConfig,
|
|
291
|
-
|
|
292
|
-
|
|
290
|
+
isOpen,
|
|
291
|
+
relayer,
|
|
292
|
+
runtimeApiKey
|
|
293
293
|
]);
|
|
294
294
|
const getExecutionContent = () => {
|
|
295
295
|
switch (executionConfig.method) {
|
|
@@ -410,10 +410,10 @@ function validateField(value, validation) {
|
|
|
410
410
|
/**
|
|
411
411
|
* Creates a transform for address fields
|
|
412
412
|
*
|
|
413
|
-
* @param
|
|
413
|
+
* @param addressing The addressing capability to use for validation
|
|
414
414
|
* @returns Transform functions for address fields
|
|
415
415
|
*/
|
|
416
|
-
function createAddressTransform(
|
|
416
|
+
function createAddressTransform(addressing) {
|
|
417
417
|
return {
|
|
418
418
|
input: (value) => {
|
|
419
419
|
if (value === null || value === void 0) return "";
|
|
@@ -421,7 +421,7 @@ function createAddressTransform(adapter) {
|
|
|
421
421
|
},
|
|
422
422
|
output: (value) => {
|
|
423
423
|
const address = String(value || "");
|
|
424
|
-
if (
|
|
424
|
+
if (addressing.isValidAddress(address)) return address;
|
|
425
425
|
return "";
|
|
426
426
|
}
|
|
427
427
|
};
|
|
@@ -525,14 +525,14 @@ function createTextTransform() {
|
|
|
525
525
|
* Creates a transform function based on field type
|
|
526
526
|
*
|
|
527
527
|
* @param fieldType The type of field to create transforms for
|
|
528
|
-
* @param
|
|
528
|
+
* @param addressing Optional addressing capability for address validation
|
|
529
529
|
* @returns Transform functions for the field type
|
|
530
530
|
*/
|
|
531
|
-
function createTransformForFieldType(fieldType,
|
|
531
|
+
function createTransformForFieldType(fieldType, addressing) {
|
|
532
532
|
switch (fieldType) {
|
|
533
533
|
case "blockchain-address":
|
|
534
|
-
if (!
|
|
535
|
-
return createAddressTransform(
|
|
534
|
+
if (!addressing) throw new Error(`createTransformForFieldType: Addressing capability is required for 'blockchain-address' field type but was not provided.`);
|
|
535
|
+
return createAddressTransform(addressing);
|
|
536
536
|
case "number":
|
|
537
537
|
case "amount": return createNumberTransform();
|
|
538
538
|
case "bigint": return createBigIntTransform();
|
|
@@ -733,6 +733,44 @@ function extractRuntimeSecrets(data, fields) {
|
|
|
733
733
|
};
|
|
734
734
|
}
|
|
735
735
|
|
|
736
|
+
//#endregion
|
|
737
|
+
//#region src/utils/transactionSuccessCallback.ts
|
|
738
|
+
/**
|
|
739
|
+
* Normalizes adapter `txHash` for the success callback (non-empty trimmed string or omitted).
|
|
740
|
+
* Expects the `txHash` string from `signAndBroadcast`, not arbitrary values (avoids coercing objects).
|
|
741
|
+
*/
|
|
742
|
+
function normalizeTransactionSuccessHash(finalTxHash) {
|
|
743
|
+
if (finalTxHash == null) return;
|
|
744
|
+
const trimmed = finalTxHash.trim();
|
|
745
|
+
return trimmed !== "" ? trimmed : void 0;
|
|
746
|
+
}
|
|
747
|
+
/**
|
|
748
|
+
* Builds the {@link TransactionSuccessPayload} passed to `onTransactionSuccess`.
|
|
749
|
+
*/
|
|
750
|
+
function buildTransactionSuccessPayload(options) {
|
|
751
|
+
const hash = normalizeTransactionSuccessHash(options.finalTxHash);
|
|
752
|
+
return {
|
|
753
|
+
network_id: options.networkId,
|
|
754
|
+
ecosystem: options.ecosystem,
|
|
755
|
+
execution_method: options.executionMethod,
|
|
756
|
+
...hash !== void 0 ? { transaction_hash: hash } : {}
|
|
757
|
+
};
|
|
758
|
+
}
|
|
759
|
+
/**
|
|
760
|
+
* Invokes `onTransactionSuccess` with error containment: synchronous throws and async
|
|
761
|
+
* rejections are logged and never rethrown, so host callbacks cannot break transaction flow.
|
|
762
|
+
*/
|
|
763
|
+
function invokeOnTransactionSuccess(callback, payload, log) {
|
|
764
|
+
try {
|
|
765
|
+
const maybePromise = callback?.(payload);
|
|
766
|
+
Promise.resolve(maybePromise).catch((error) => {
|
|
767
|
+
log.error("TransactionForm", "onTransactionSuccess callback rejected with an error", error);
|
|
768
|
+
});
|
|
769
|
+
} catch (error) {
|
|
770
|
+
log.error("TransactionForm", "onTransactionSuccess callback threw an error", error);
|
|
771
|
+
}
|
|
772
|
+
}
|
|
773
|
+
|
|
736
774
|
//#endregion
|
|
737
775
|
//#region src/components/fieldRegistry.ts
|
|
738
776
|
/**
|
|
@@ -805,11 +843,15 @@ function useShouldRenderField(field, control) {
|
|
|
805
843
|
*
|
|
806
844
|
* @returns The rendered form field component or null if the field should not be visible
|
|
807
845
|
*/
|
|
808
|
-
function DynamicFormField({ field, control,
|
|
846
|
+
function DynamicFormField({ field, control, addressing, typeMapping, contractSchema }) {
|
|
847
|
+
const requireTypeMapping = useCallback((fieldName, fieldType) => {
|
|
848
|
+
if (!typeMapping) throw new Error(`DynamicFormField: Missing typeMapping capability for field "${fieldName}" (${fieldType}).`);
|
|
849
|
+
return typeMapping;
|
|
850
|
+
}, [typeMapping]);
|
|
809
851
|
const renderPayloadField = useCallback((payloadField, payloadIndex) => {
|
|
810
852
|
let enhancedPayloadField;
|
|
811
853
|
if (payloadField.originalParameterType) {
|
|
812
|
-
const generatedField =
|
|
854
|
+
const generatedField = requireTypeMapping(payloadField.name, payloadField.type).generateDefaultField({
|
|
813
855
|
name: payloadField.name || `payload_${payloadIndex}`,
|
|
814
856
|
type: payloadField.originalParameterType
|
|
815
857
|
}, contractSchema);
|
|
@@ -828,17 +870,20 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
828
870
|
return /* @__PURE__ */ jsx(DynamicFormField, {
|
|
829
871
|
field: enhancedPayloadField,
|
|
830
872
|
control,
|
|
831
|
-
|
|
873
|
+
addressing,
|
|
874
|
+
typeMapping,
|
|
832
875
|
contractSchema
|
|
833
876
|
}, `${field.id}-payload-${payloadIndex}`);
|
|
834
877
|
}, [
|
|
835
878
|
field.id,
|
|
836
879
|
control,
|
|
837
|
-
|
|
838
|
-
|
|
880
|
+
contractSchema,
|
|
881
|
+
addressing,
|
|
882
|
+
requireTypeMapping,
|
|
883
|
+
typeMapping
|
|
839
884
|
]);
|
|
840
885
|
const renderKeyField = useCallback((keyField, entryIndex) => {
|
|
841
|
-
const mappedKeyType = keyField.originalParameterType ?
|
|
886
|
+
const mappedKeyType = keyField.originalParameterType ? requireTypeMapping(keyField.name, keyField.type).mapParameterTypeToFieldType(keyField.originalParameterType) : keyField.type;
|
|
842
887
|
return /* @__PURE__ */ jsx(DynamicFormField, {
|
|
843
888
|
field: {
|
|
844
889
|
...keyField,
|
|
@@ -846,18 +891,21 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
846
891
|
readOnly: keyField.readOnly ?? field.readOnly
|
|
847
892
|
},
|
|
848
893
|
control,
|
|
849
|
-
|
|
894
|
+
addressing,
|
|
895
|
+
typeMapping,
|
|
850
896
|
contractSchema
|
|
851
897
|
}, `${field.id}-key-${entryIndex}`);
|
|
852
898
|
}, [
|
|
853
899
|
field.id,
|
|
854
900
|
field.readOnly,
|
|
855
901
|
control,
|
|
856
|
-
|
|
857
|
-
|
|
902
|
+
contractSchema,
|
|
903
|
+
addressing,
|
|
904
|
+
requireTypeMapping,
|
|
905
|
+
typeMapping
|
|
858
906
|
]);
|
|
859
907
|
const renderValueField = useCallback((valueField, entryIndex) => {
|
|
860
|
-
const mappedValueType = valueField.originalParameterType ?
|
|
908
|
+
const mappedValueType = valueField.originalParameterType ? requireTypeMapping(valueField.name, valueField.type).mapParameterTypeToFieldType(valueField.originalParameterType) : valueField.type;
|
|
861
909
|
return /* @__PURE__ */ jsx(DynamicFormField, {
|
|
862
910
|
field: {
|
|
863
911
|
...valueField,
|
|
@@ -865,15 +913,18 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
865
913
|
readOnly: valueField.readOnly ?? field.readOnly
|
|
866
914
|
},
|
|
867
915
|
control,
|
|
868
|
-
|
|
916
|
+
addressing,
|
|
917
|
+
typeMapping,
|
|
869
918
|
contractSchema
|
|
870
919
|
}, `${field.id}-value-${entryIndex}`);
|
|
871
920
|
}, [
|
|
872
921
|
field.id,
|
|
873
922
|
field.readOnly,
|
|
874
923
|
control,
|
|
875
|
-
|
|
876
|
-
|
|
924
|
+
contractSchema,
|
|
925
|
+
addressing,
|
|
926
|
+
requireTypeMapping,
|
|
927
|
+
typeMapping
|
|
877
928
|
]);
|
|
878
929
|
if (!useShouldRenderField(field, control)) return null;
|
|
879
930
|
const FieldComponent = fieldComponents[field.type];
|
|
@@ -893,7 +944,8 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
893
944
|
readOnly: elementField.readOnly ?? field.readOnly
|
|
894
945
|
},
|
|
895
946
|
control,
|
|
896
|
-
|
|
947
|
+
addressing,
|
|
948
|
+
typeMapping,
|
|
897
949
|
contractSchema
|
|
898
950
|
}, `${field.id}-element-${index}`) },
|
|
899
951
|
...field.type === "object" && { renderProperty: (propertyField, propertyName) => /* @__PURE__ */ jsx(DynamicFormField, {
|
|
@@ -902,7 +954,8 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
902
954
|
readOnly: propertyField.readOnly ?? field.readOnly
|
|
903
955
|
},
|
|
904
956
|
control,
|
|
905
|
-
|
|
957
|
+
addressing,
|
|
958
|
+
typeMapping,
|
|
906
959
|
contractSchema
|
|
907
960
|
}, `${field.id}-property-${propertyName}`) },
|
|
908
961
|
...field.type === "array-object" && { renderProperty: (propertyField, itemIndex, propertyName) => /* @__PURE__ */ jsx(DynamicFormField, {
|
|
@@ -911,7 +964,8 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
911
964
|
readOnly: propertyField.readOnly ?? field.readOnly
|
|
912
965
|
},
|
|
913
966
|
control,
|
|
914
|
-
|
|
967
|
+
addressing,
|
|
968
|
+
typeMapping,
|
|
915
969
|
contractSchema
|
|
916
970
|
}, `${field.id}-item-${itemIndex}-property-${propertyName}`) }
|
|
917
971
|
};
|
|
@@ -924,7 +978,8 @@ function DynamicFormField({ field, control, adapter, contractSchema }) {
|
|
|
924
978
|
validation: field.validation,
|
|
925
979
|
control,
|
|
926
980
|
name: field.name,
|
|
927
|
-
|
|
981
|
+
addressing,
|
|
982
|
+
typeMapping,
|
|
928
983
|
readOnly: field.readOnly,
|
|
929
984
|
contractSchema,
|
|
930
985
|
...enhancedProps
|
|
@@ -1057,7 +1112,7 @@ function formatErrorWithHash(errorMsg) {
|
|
|
1057
1112
|
});
|
|
1058
1113
|
}
|
|
1059
1114
|
/** Displays the current status of a transaction with appropriate icons and messages. */
|
|
1060
|
-
function TransactionStatusDisplay({ status, txHash, error, explorerUrl, className, customTitle, customMessage, result, functionDetails,
|
|
1115
|
+
function TransactionStatusDisplay({ status, txHash, error, explorerUrl, className, customTitle, customMessage, result, functionDetails, query, explorer }) {
|
|
1061
1116
|
if (status === "idle") return null;
|
|
1062
1117
|
let variant = "default";
|
|
1063
1118
|
let defaultTitle = "";
|
|
@@ -1090,12 +1145,14 @@ function TransactionStatusDisplay({ status, txHash, error, explorerUrl, classNam
|
|
|
1090
1145
|
}
|
|
1091
1146
|
const title = customTitle || defaultTitle;
|
|
1092
1147
|
let formattedResult = null;
|
|
1093
|
-
if (result !== void 0 && result !== null &&
|
|
1094
|
-
|
|
1148
|
+
if (result !== void 0 && result !== null && query && functionDetails) try {
|
|
1149
|
+
const nextFormattedResult = query.formatFunctionResult(result, functionDetails);
|
|
1150
|
+
formattedResult = typeof nextFormattedResult === "string" ? nextFormattedResult : JSON.stringify(nextFormattedResult, null, 2);
|
|
1095
1151
|
} catch {
|
|
1096
1152
|
formattedResult = JSON.stringify(result, null, 2);
|
|
1097
1153
|
}
|
|
1098
1154
|
else if (result !== void 0 && result !== null) formattedResult = JSON.stringify(result, null, 2);
|
|
1155
|
+
const resolvedExplorerUrl = explorerUrl ?? (txHash ? explorer?.getExplorerTxUrl?.(txHash) ?? explorer?.getExplorerUrl(txHash) ?? null : null);
|
|
1099
1156
|
let content = null;
|
|
1100
1157
|
if (status === "error") content = /* @__PURE__ */ jsxs("div", { children: [error ? formatErrorWithHash(error) : customMessage ? /* @__PURE__ */ jsx("span", {
|
|
1101
1158
|
className: "break-word",
|
|
@@ -1105,7 +1162,7 @@ function TransactionStatusDisplay({ status, txHash, error, explorerUrl, classNam
|
|
|
1105
1162
|
children: "An unknown error occurred."
|
|
1106
1163
|
}), txHash && /* @__PURE__ */ jsx(TransactionHashDisplay, {
|
|
1107
1164
|
txHash,
|
|
1108
|
-
explorerUrl:
|
|
1165
|
+
explorerUrl: resolvedExplorerUrl
|
|
1109
1166
|
})] });
|
|
1110
1167
|
else {
|
|
1111
1168
|
const messageText = customMessage || defaultMessage || "";
|
|
@@ -1115,7 +1172,7 @@ function TransactionStatusDisplay({ status, txHash, error, explorerUrl, classNam
|
|
|
1115
1172
|
messageText && /* @__PURE__ */ jsx("p", { children: messageText }),
|
|
1116
1173
|
txHash && /* @__PURE__ */ jsx(TransactionHashDisplay, {
|
|
1117
1174
|
txHash,
|
|
1118
|
-
explorerUrl:
|
|
1175
|
+
explorerUrl: resolvedExplorerUrl
|
|
1119
1176
|
}),
|
|
1120
1177
|
formattedResult && /* @__PURE__ */ jsxs("div", {
|
|
1121
1178
|
className: "mt-3 pt-3 border-t border-border",
|
|
@@ -1180,7 +1237,7 @@ const PENDING_STATES = [
|
|
|
1180
1237
|
*
|
|
1181
1238
|
* @returns The rendered form component
|
|
1182
1239
|
*/
|
|
1183
|
-
function TransactionForm({ schema, contractSchema, adapter, isWalletConnected = false, executionConfig }) {
|
|
1240
|
+
function TransactionForm({ schema, contractSchema, adapter, isWalletConnected = false, executionConfig, onTransactionSuccess }) {
|
|
1184
1241
|
const [formError, setFormError] = useState(null);
|
|
1185
1242
|
const [executionConfigError, setExecutionConfigError] = useState(null);
|
|
1186
1243
|
const [runtimeApiKey, setRuntimeApiKey] = useState("");
|
|
@@ -1267,9 +1324,19 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1267
1324
|
setTxResult(result);
|
|
1268
1325
|
logger.info("TransactionForm", "Execution result received:", result);
|
|
1269
1326
|
}
|
|
1327
|
+
const reportTransactionSuccess = () => {
|
|
1328
|
+
const executionMethod = executionConfig?.method ?? "eoa";
|
|
1329
|
+
invokeOnTransactionSuccess(onTransactionSuccess, buildTransactionSuccessPayload({
|
|
1330
|
+
networkId: adapter.networkConfig.id,
|
|
1331
|
+
ecosystem: adapter.networkConfig.ecosystem,
|
|
1332
|
+
executionMethod,
|
|
1333
|
+
finalTxHash
|
|
1334
|
+
}), logger);
|
|
1335
|
+
};
|
|
1270
1336
|
if (canExecuteLocally) {
|
|
1271
1337
|
setTxStatus("success");
|
|
1272
1338
|
setTxError(null);
|
|
1339
|
+
reportTransactionSuccess();
|
|
1273
1340
|
return;
|
|
1274
1341
|
}
|
|
1275
1342
|
if (adapter.waitForTransactionConfirmation) {
|
|
@@ -1280,6 +1347,7 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1280
1347
|
logger.info("TransactionForm", `Transaction confirmed: ${finalTxHash}`, confirmationResult.receipt);
|
|
1281
1348
|
setTxStatus("success");
|
|
1282
1349
|
setTxError(null);
|
|
1350
|
+
reportTransactionSuccess();
|
|
1283
1351
|
} else {
|
|
1284
1352
|
logger.error("TransactionForm", `Transaction failed confirmation: ${finalTxHash}`, confirmationResult.error);
|
|
1285
1353
|
setTxError(confirmationResult.error?.message ?? "Transaction failed during confirmation.");
|
|
@@ -1289,6 +1357,7 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1289
1357
|
logger.warn("TransactionForm", "Adapter does not support waitForTransactionConfirmation. Marking as success after submission.");
|
|
1290
1358
|
setTxStatus("success");
|
|
1291
1359
|
setTxError(null);
|
|
1360
|
+
reportTransactionSuccess();
|
|
1292
1361
|
}
|
|
1293
1362
|
} catch (error) {
|
|
1294
1363
|
logger.error("TransactionForm", "Transaction error during submission process:", error);
|
|
@@ -1308,7 +1377,8 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1308
1377
|
field,
|
|
1309
1378
|
control: methods.control,
|
|
1310
1379
|
error: errors[field.name]?.message,
|
|
1311
|
-
adapter,
|
|
1380
|
+
addressing: adapter,
|
|
1381
|
+
typeMapping: adapter,
|
|
1312
1382
|
contractSchema
|
|
1313
1383
|
}, field.id))
|
|
1314
1384
|
});
|
|
@@ -1367,7 +1437,8 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1367
1437
|
customMessage: txStatusDetails?.message,
|
|
1368
1438
|
result: txResult,
|
|
1369
1439
|
functionDetails: currentFunction,
|
|
1370
|
-
adapter
|
|
1440
|
+
query: adapter,
|
|
1441
|
+
explorer: adapter
|
|
1371
1442
|
})
|
|
1372
1443
|
}),
|
|
1373
1444
|
/* @__PURE__ */ jsxs("form", {
|
|
@@ -1387,7 +1458,8 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1387
1458
|
className: "w-full",
|
|
1388
1459
|
children: /* @__PURE__ */ jsx(ExecutionConfigDisplay, {
|
|
1389
1460
|
executionConfig,
|
|
1390
|
-
adapter,
|
|
1461
|
+
execution: adapter,
|
|
1462
|
+
relayer: adapter,
|
|
1391
1463
|
error: executionConfigError,
|
|
1392
1464
|
onRuntimeApiKeyChange: setRuntimeApiKey
|
|
1393
1465
|
})
|
|
@@ -1417,22 +1489,22 @@ function TransactionForm({ schema, contractSchema, adapter, isWalletConnected =
|
|
|
1417
1489
|
//#endregion
|
|
1418
1490
|
//#region src/components/AddressBookWidget/AddAliasDialog.tsx
|
|
1419
1491
|
/** Dialog for creating a new address alias entry. */
|
|
1420
|
-
function AddAliasDialog({ open, onOpenChange, onSave, currentNetworkId,
|
|
1492
|
+
function AddAliasDialog({ open, onOpenChange, onSave, currentNetworkId, addressing: defaultAddressing, resolveAddressing, addressPlaceholder: defaultPlaceholder, resolveAddressPlaceholder, resolveNetwork, networks }) {
|
|
1421
1493
|
const [saving, setSaving] = useState(false);
|
|
1422
1494
|
const initialNetwork = useMemo(() => currentNetworkId && resolveNetwork ? resolveNetwork(currentNetworkId) : void 0, [currentNetworkId, resolveNetwork]);
|
|
1423
1495
|
const [selectedNetwork, setSelectedNetwork] = useState(initialNetwork ?? null);
|
|
1424
|
-
const [
|
|
1496
|
+
const [activeAddressing, setActiveAddressing] = useState(defaultAddressing);
|
|
1425
1497
|
const [activePlaceholder, setActivePlaceholder] = useState(defaultPlaceholder);
|
|
1426
1498
|
useEffect(() => {
|
|
1427
1499
|
if (open) {
|
|
1428
1500
|
setSelectedNetwork(initialNetwork ?? null);
|
|
1429
|
-
|
|
1501
|
+
setActiveAddressing(defaultAddressing);
|
|
1430
1502
|
setActivePlaceholder(defaultPlaceholder);
|
|
1431
1503
|
}
|
|
1432
1504
|
}, [
|
|
1433
1505
|
open,
|
|
1434
1506
|
initialNetwork,
|
|
1435
|
-
|
|
1507
|
+
defaultAddressing,
|
|
1436
1508
|
defaultPlaceholder
|
|
1437
1509
|
]);
|
|
1438
1510
|
const { control, handleSubmit, reset, trigger, formState } = useForm({
|
|
@@ -1445,12 +1517,12 @@ function AddAliasDialog({ open, onOpenChange, onSave, currentNetworkId, adapter:
|
|
|
1445
1517
|
const handleNetworkChange = useCallback(async (network) => {
|
|
1446
1518
|
setSelectedNetwork(network);
|
|
1447
1519
|
if (resolveAddressPlaceholder) setActivePlaceholder(resolveAddressPlaceholder(network));
|
|
1448
|
-
if (
|
|
1449
|
-
|
|
1520
|
+
if (resolveAddressing) {
|
|
1521
|
+
setActiveAddressing(await resolveAddressing(network));
|
|
1450
1522
|
trigger("address");
|
|
1451
1523
|
}
|
|
1452
1524
|
}, [
|
|
1453
|
-
|
|
1525
|
+
resolveAddressing,
|
|
1454
1526
|
resolveAddressPlaceholder,
|
|
1455
1527
|
trigger
|
|
1456
1528
|
]);
|
|
@@ -1479,12 +1551,12 @@ function AddAliasDialog({ open, onOpenChange, onSave, currentNetworkId, adapter:
|
|
|
1479
1551
|
if (!nextOpen) {
|
|
1480
1552
|
reset();
|
|
1481
1553
|
setSelectedNetwork(initialNetwork ?? null);
|
|
1482
|
-
|
|
1554
|
+
setActiveAddressing(defaultAddressing);
|
|
1483
1555
|
setActivePlaceholder(defaultPlaceholder);
|
|
1484
1556
|
}
|
|
1485
1557
|
onOpenChange(nextOpen);
|
|
1486
1558
|
}, [
|
|
1487
|
-
|
|
1559
|
+
defaultAddressing,
|
|
1488
1560
|
defaultPlaceholder,
|
|
1489
1561
|
initialNetwork,
|
|
1490
1562
|
onOpenChange,
|
|
@@ -1528,7 +1600,7 @@ function AddAliasDialog({ open, onOpenChange, onSave, currentNetworkId, adapter:
|
|
|
1528
1600
|
placeholder: activePlaceholder,
|
|
1529
1601
|
control,
|
|
1530
1602
|
validation: { required: true },
|
|
1531
|
-
|
|
1603
|
+
addressing: activeAddressing
|
|
1532
1604
|
}),
|
|
1533
1605
|
/* @__PURE__ */ jsx(TextField, {
|
|
1534
1606
|
id: "new-alias-name",
|
|
@@ -1733,7 +1805,7 @@ function ImportExportBar({ onExport, onImport, exportDisabled }) {
|
|
|
1733
1805
|
//#endregion
|
|
1734
1806
|
//#region src/components/AddressBookWidget/AddressBookWidget.tsx
|
|
1735
1807
|
/** Widget for managing a personal address book with aliases, search, and network filtering. */
|
|
1736
|
-
function AddressBookWidget({ aliases, isLoading, onSave, onRemove, onClear, onExport, onImport, currentNetworkId, resolveNetwork, resolveExplorerUrl,
|
|
1808
|
+
function AddressBookWidget({ aliases, isLoading, onSave, onRemove, onClear, onExport, onImport, currentNetworkId, resolveNetwork, resolveExplorerUrl, addressing, resolveAddressing, addressPlaceholder, resolveAddressPlaceholder, networks, filterNetworkIds, onFilterNetworkIdsChange, title = "Address Book", className }) {
|
|
1737
1809
|
const [search, setSearch] = useState("");
|
|
1738
1810
|
const [addDialogOpen, setAddDialogOpen] = useState(false);
|
|
1739
1811
|
const [confirmClear, setConfirmClear] = useState(false);
|
|
@@ -1806,8 +1878,8 @@ function AddressBookWidget({ aliases, isLoading, onSave, onRemove, onClear, onEx
|
|
|
1806
1878
|
onOpenChange: setAddDialogOpen,
|
|
1807
1879
|
onSave,
|
|
1808
1880
|
currentNetworkId,
|
|
1809
|
-
|
|
1810
|
-
|
|
1881
|
+
addressing,
|
|
1882
|
+
resolveAddressing,
|
|
1811
1883
|
addressPlaceholder,
|
|
1812
1884
|
resolveAddressPlaceholder,
|
|
1813
1885
|
resolveNetwork,
|
|
@@ -2175,8 +2247,8 @@ function FunctionResult({ functionDetails, result, loading }) {
|
|
|
2175
2247
|
/**
|
|
2176
2248
|
* Panel for displaying and querying simple view functions (functions without parameters)
|
|
2177
2249
|
*/
|
|
2178
|
-
function ViewFunctionsPanel({ functions, contractAddress,
|
|
2179
|
-
const safeFunctions =
|
|
2250
|
+
function ViewFunctionsPanel({ functions, contractAddress, query, schema, contractSchema, className }) {
|
|
2251
|
+
const safeFunctions = schema.filterAutoQueryableFunctions ? schema.filterAutoQueryableFunctions(functions) : functions;
|
|
2180
2252
|
const [results, setResults] = useState({});
|
|
2181
2253
|
const [loadingStates, setLoadingStates] = useState({});
|
|
2182
2254
|
const [hasQueried, setHasQueried] = useState(false);
|
|
@@ -2196,10 +2268,11 @@ function ViewFunctionsPanel({ functions, contractAddress, adapter, contractSchem
|
|
|
2196
2268
|
try {
|
|
2197
2269
|
await rateLimitedBatch(safeFunctions.map((func) => async () => {
|
|
2198
2270
|
try {
|
|
2199
|
-
const result = await
|
|
2271
|
+
const result = await query.queryViewFunction(contractAddress, func.id, [], contractSchema);
|
|
2200
2272
|
let formattedResult;
|
|
2201
2273
|
try {
|
|
2202
|
-
|
|
2274
|
+
const nextResult = query.formatFunctionResult(result, func);
|
|
2275
|
+
formattedResult = typeof nextResult === "string" ? nextResult : JSON.stringify(nextResult, null, 2);
|
|
2203
2276
|
} catch (formatError) {
|
|
2204
2277
|
logger.error("ViewFunctionsPanel", `Error formatting result for ${func.name}:`, formatError);
|
|
2205
2278
|
formattedResult = `Error formatting result: ${formatError instanceof Error ? formatError.message : "Unknown error"}`;
|
|
@@ -2241,11 +2314,11 @@ function ViewFunctionsPanel({ functions, contractAddress, adapter, contractSchem
|
|
|
2241
2314
|
setIsQueryInProgress(false);
|
|
2242
2315
|
}
|
|
2243
2316
|
}, [
|
|
2244
|
-
safeFunctions,
|
|
2245
2317
|
contractAddress,
|
|
2246
|
-
adapter,
|
|
2247
2318
|
contractSchema,
|
|
2248
|
-
isQueryInProgress
|
|
2319
|
+
isQueryInProgress,
|
|
2320
|
+
query,
|
|
2321
|
+
safeFunctions
|
|
2249
2322
|
]);
|
|
2250
2323
|
useEffect(() => {
|
|
2251
2324
|
let mounted = true;
|
|
@@ -2267,13 +2340,13 @@ function ViewFunctionsPanel({ functions, contractAddress, adapter, contractSchem
|
|
|
2267
2340
|
handleQueryAll
|
|
2268
2341
|
]);
|
|
2269
2342
|
useEffect(() => {
|
|
2270
|
-
const networkId =
|
|
2343
|
+
const networkId = query.networkConfig?.id;
|
|
2271
2344
|
if (!networkId) return;
|
|
2272
2345
|
return userRpcConfigService.subscribe(networkId, (event) => {
|
|
2273
2346
|
logger.info("ViewFunctionsPanel", "RPC configuration changed:", event);
|
|
2274
2347
|
handleQueryAll();
|
|
2275
2348
|
});
|
|
2276
|
-
}, [
|
|
2349
|
+
}, [handleQueryAll, query.networkConfig?.id]);
|
|
2277
2350
|
if (safeFunctions.length === 0) return /* @__PURE__ */ jsx("div", {
|
|
2278
2351
|
className: "text-xs text-muted-foreground",
|
|
2279
2352
|
children: "No simple view functions found in this contract."
|
|
@@ -2320,19 +2393,19 @@ function ViewFunctionsPanel({ functions, contractAddress, adapter, contractSchem
|
|
|
2320
2393
|
* ContractStateWidget - Compact widget for displaying contract state
|
|
2321
2394
|
* Shows contract state by allowing users to query simple view functions (no parameters)
|
|
2322
2395
|
*/
|
|
2323
|
-
function ContractStateWidget({ contractSchema, contractAddress,
|
|
2396
|
+
function ContractStateWidget({ contractSchema, contractAddress, query, schema, isVisible = true, onToggle, className, error }) {
|
|
2324
2397
|
const [viewFunctions, setViewFunctions] = useState([]);
|
|
2325
2398
|
const [animationState, setAnimationState] = useState(isVisible ? "entered" : "exited");
|
|
2326
|
-
const networkConfig =
|
|
2399
|
+
const networkConfig = query?.networkConfig;
|
|
2327
2400
|
const [lastSchema, setLastSchema] = useState(contractSchema ?? null);
|
|
2328
2401
|
useEffect(() => {
|
|
2329
2402
|
if (contractSchema) setLastSchema(contractSchema);
|
|
2330
2403
|
}, [contractSchema]);
|
|
2331
2404
|
const effectiveSchema = useMemo(() => contractSchema ?? lastSchema, [contractSchema, lastSchema]);
|
|
2332
2405
|
useEffect(() => {
|
|
2333
|
-
if (!effectiveSchema
|
|
2334
|
-
setViewFunctions(effectiveSchema.functions.filter((fn) =>
|
|
2335
|
-
}, [effectiveSchema,
|
|
2406
|
+
if (!effectiveSchema) return;
|
|
2407
|
+
setViewFunctions(effectiveSchema.functions.filter((fn) => schema.isViewFunction(fn)).filter((fn) => fn.inputs.length === 0));
|
|
2408
|
+
}, [effectiveSchema, schema]);
|
|
2336
2409
|
useEffect(() => {
|
|
2337
2410
|
if (isVisible) {
|
|
2338
2411
|
setAnimationState("entering");
|
|
@@ -2351,7 +2424,7 @@ function ContractStateWidget({ contractSchema, contractAddress, adapter, isVisib
|
|
|
2351
2424
|
const handleToggle = () => {
|
|
2352
2425
|
if (onToggle) onToggle();
|
|
2353
2426
|
};
|
|
2354
|
-
if (!contractAddress || !
|
|
2427
|
+
if (!contractAddress || !networkConfig) return null;
|
|
2355
2428
|
return /* @__PURE__ */ jsxs(Fragment, { children: [(animationState === "entering" || animationState === "entered" || animationState === "exiting") && /* @__PURE__ */ jsx("div", {
|
|
2356
2429
|
className: cn("fixed inset-0 z-[9998] md:hidden bg-background/60 backdrop-blur-sm transition-opacity duration-500 ease-in-out", animationState === "entering" || animationState === "entered" ? "opacity-100" : "opacity-0"),
|
|
2357
2430
|
"aria-hidden": "true",
|
|
@@ -2386,7 +2459,7 @@ function ContractStateWidget({ contractSchema, contractAddress, adapter, isVisib
|
|
|
2386
2459
|
className: "mt-1 text-xs text-center",
|
|
2387
2460
|
children: error.message
|
|
2388
2461
|
})]
|
|
2389
|
-
}) : !effectiveSchema && !lastSchema
|
|
2462
|
+
}) : !effectiveSchema && !lastSchema ? /* @__PURE__ */ jsxs("div", {
|
|
2390
2463
|
className: "flex flex-col items-center justify-center h-full space-y-3 py-6",
|
|
2391
2464
|
children: [/* @__PURE__ */ jsx(Loader2, { className: "h-8 w-8 text-primary animate-spin opacity-70" }), /* @__PURE__ */ jsxs("div", {
|
|
2392
2465
|
className: "text-center space-y-1",
|
|
@@ -2401,7 +2474,8 @@ function ContractStateWidget({ contractSchema, contractAddress, adapter, isVisib
|
|
|
2401
2474
|
}) : viewFunctions.length > 0 && effectiveSchema ? /* @__PURE__ */ jsx(ViewFunctionsPanel, {
|
|
2402
2475
|
functions: viewFunctions,
|
|
2403
2476
|
contractAddress,
|
|
2404
|
-
|
|
2477
|
+
query,
|
|
2478
|
+
schema,
|
|
2405
2479
|
contractSchema: effectiveSchema,
|
|
2406
2480
|
className: "flex-grow flex flex-col min-h-0"
|
|
2407
2481
|
}) : /* @__PURE__ */ jsxs("div", {
|
|
@@ -2452,7 +2526,7 @@ function ContractActionBar({ networkConfig, contractAddress = null, onToggleCont
|
|
|
2452
2526
|
//#endregion
|
|
2453
2527
|
//#region src/components/network/NetworkServiceSettingsPanel.tsx
|
|
2454
2528
|
/** Panel for configuring network service settings like RPC endpoints. */
|
|
2455
|
-
function NetworkServiceSettingsPanel({
|
|
2529
|
+
function NetworkServiceSettingsPanel({ relayer, networkId, service, onSettingsChanged }) {
|
|
2456
2530
|
const [isTesting, setIsTesting] = useState(false);
|
|
2457
2531
|
const [result, setResult] = useState(null);
|
|
2458
2532
|
const { control, handleSubmit, setValue, getValues, watch, formState: { isDirty } } = useForm({ defaultValues: {} });
|
|
@@ -2497,12 +2571,12 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2497
2571
|
getValues
|
|
2498
2572
|
]);
|
|
2499
2573
|
const testConnection = useCallback(async () => {
|
|
2500
|
-
if (!
|
|
2574
|
+
if (!relayer.testNetworkServiceConnection) return;
|
|
2501
2575
|
setIsTesting(true);
|
|
2502
2576
|
setResult(null);
|
|
2503
2577
|
try {
|
|
2504
2578
|
const data = getValues();
|
|
2505
|
-
const r = await
|
|
2579
|
+
const r = await relayer.testNetworkServiceConnection(service.id, data);
|
|
2506
2580
|
setResult({
|
|
2507
2581
|
success: r.success,
|
|
2508
2582
|
message: r.error || (r.success ? "Connection successful" : "Connection failed"),
|
|
@@ -2517,15 +2591,15 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2517
2591
|
setIsTesting(false);
|
|
2518
2592
|
}
|
|
2519
2593
|
}, [
|
|
2520
|
-
|
|
2594
|
+
relayer,
|
|
2521
2595
|
service.id,
|
|
2522
2596
|
getValues
|
|
2523
2597
|
]);
|
|
2524
2598
|
return /* @__PURE__ */ jsxs("form", {
|
|
2525
2599
|
onSubmit: handleSubmit(useCallback(async (formData) => {
|
|
2526
2600
|
const data = formData;
|
|
2527
|
-
if (
|
|
2528
|
-
if (!await
|
|
2601
|
+
if (relayer.validateNetworkServiceConfig) {
|
|
2602
|
+
if (!await relayer.validateNetworkServiceConfig(service.id, data)) {
|
|
2529
2603
|
setResult({
|
|
2530
2604
|
success: false,
|
|
2531
2605
|
message: "Invalid configuration"
|
|
@@ -2541,7 +2615,7 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2541
2615
|
message: "Settings saved successfully"
|
|
2542
2616
|
});
|
|
2543
2617
|
}, [
|
|
2544
|
-
|
|
2618
|
+
relayer,
|
|
2545
2619
|
networkId,
|
|
2546
2620
|
service.id,
|
|
2547
2621
|
onSettingsChanged
|
|
@@ -2583,8 +2657,7 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2583
2657
|
className: "space-y-4",
|
|
2584
2658
|
children: primaryFields.map((field) => /* @__PURE__ */ jsx(DynamicFormField, {
|
|
2585
2659
|
field,
|
|
2586
|
-
control
|
|
2587
|
-
adapter
|
|
2660
|
+
control
|
|
2588
2661
|
}, field.id))
|
|
2589
2662
|
}),
|
|
2590
2663
|
Object.keys(sectionGroups).length > 0 && /* @__PURE__ */ jsx(Accordion, {
|
|
@@ -2630,8 +2703,7 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2630
2703
|
className: indentUnder ? "ml-6" : "",
|
|
2631
2704
|
children: /* @__PURE__ */ jsx(DynamicFormField, {
|
|
2632
2705
|
field: wrappedField,
|
|
2633
|
-
control
|
|
2634
|
-
adapter
|
|
2706
|
+
control
|
|
2635
2707
|
})
|
|
2636
2708
|
}, field.id);
|
|
2637
2709
|
})
|
|
@@ -2674,7 +2746,7 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2674
2746
|
const hideTest = fields.some((f) => {
|
|
2675
2747
|
return f.metadata?.hideTestConnection === true;
|
|
2676
2748
|
});
|
|
2677
|
-
return Boolean(
|
|
2749
|
+
return Boolean(relayer.testNetworkServiceConnection) && !hideTest;
|
|
2678
2750
|
})() ? /* @__PURE__ */ jsx(Button, {
|
|
2679
2751
|
type: "button",
|
|
2680
2752
|
variant: "outline",
|
|
@@ -2695,14 +2767,14 @@ function NetworkServiceSettingsPanel({ adapter, networkId, service, onSettingsCh
|
|
|
2695
2767
|
|
|
2696
2768
|
//#endregion
|
|
2697
2769
|
//#region src/components/network/NetworkSettingsDialog.tsx
|
|
2698
|
-
const NetworkSettingsDialog = ({ isOpen, onOpenChange, networkConfig,
|
|
2699
|
-
const services = filterEnabledServiceForms(
|
|
2770
|
+
const NetworkSettingsDialog = ({ isOpen, onOpenChange, networkConfig, relayer, onSettingsChanged }) => {
|
|
2771
|
+
const services = filterEnabledServiceForms(relayer?.getNetworkServiceForms() ?? []);
|
|
2700
2772
|
return /* @__PURE__ */ jsx(Dialog, {
|
|
2701
2773
|
open: isOpen,
|
|
2702
2774
|
onOpenChange,
|
|
2703
2775
|
children: /* @__PURE__ */ jsxs(DialogContent, {
|
|
2704
2776
|
className: "max-w-2xl sm:max-w-3xl",
|
|
2705
|
-
children: [/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Network Settings" }), /* @__PURE__ */ jsxs(DialogDescription, { children: ["Configure settings for ", networkConfig?.name] })] }), networkConfig &&
|
|
2777
|
+
children: [/* @__PURE__ */ jsxs(DialogHeader, { children: [/* @__PURE__ */ jsx(DialogTitle, { children: "Network Settings" }), /* @__PURE__ */ jsxs(DialogDescription, { children: ["Configure settings for ", networkConfig?.name] })] }), networkConfig && relayer && services.length > 0 ? /* @__PURE__ */ jsxs(Tabs, {
|
|
2706
2778
|
defaultValue: services[0]?.id,
|
|
2707
2779
|
className: "w-full",
|
|
2708
2780
|
children: [/* @__PURE__ */ jsx(TabsList, {
|
|
@@ -2715,16 +2787,10 @@ const NetworkSettingsDialog = ({ isOpen, onOpenChange, networkConfig, adapter })
|
|
|
2715
2787
|
value: svc.id,
|
|
2716
2788
|
className: "px-2",
|
|
2717
2789
|
children: /* @__PURE__ */ jsx(NetworkServiceSettingsPanel, {
|
|
2718
|
-
|
|
2790
|
+
relayer,
|
|
2719
2791
|
networkId: networkConfig.id,
|
|
2720
2792
|
service: svc,
|
|
2721
|
-
onSettingsChanged
|
|
2722
|
-
const cfg = appConfigService.getTypedNestedConfig("walletui", "config");
|
|
2723
|
-
adapter.configureUiKit?.(cfg ?? {
|
|
2724
|
-
kitName: "custom",
|
|
2725
|
-
kitConfig: {}
|
|
2726
|
-
});
|
|
2727
|
-
}
|
|
2793
|
+
onSettingsChanged
|
|
2728
2794
|
})
|
|
2729
2795
|
}, svc.id))]
|
|
2730
2796
|
}) : /* @__PURE__ */ jsx("div", {
|
|
@@ -2751,7 +2817,7 @@ const NetworkSettingsDialog = ({ isOpen, onOpenChange, networkConfig, adapter })
|
|
|
2751
2817
|
* Used in exported apps to provide access to RPC and Explorer configuration.
|
|
2752
2818
|
*/
|
|
2753
2819
|
const WalletConnectionWithSettings = () => {
|
|
2754
|
-
const {
|
|
2820
|
+
const { isRuntimeLoading, activeRuntime, activeNetworkConfig, reconfigureActiveUiKit } = useWalletState();
|
|
2755
2821
|
const { setOpenNetworkSettingsHandler } = useNetworkErrors();
|
|
2756
2822
|
const [showNetworkSettings, setShowNetworkSettings] = useState(false);
|
|
2757
2823
|
const openNetworkSettings = useCallback((networkId) => {
|
|
@@ -2760,10 +2826,10 @@ const WalletConnectionWithSettings = () => {
|
|
|
2760
2826
|
useEffect(() => {
|
|
2761
2827
|
setOpenNetworkSettingsHandler(openNetworkSettings);
|
|
2762
2828
|
}, [openNetworkSettings, setOpenNetworkSettingsHandler]);
|
|
2763
|
-
if (
|
|
2829
|
+
if (isRuntimeLoading) return /* @__PURE__ */ jsx("div", { className: "h-9 w-28 animate-pulse rounded bg-muted" });
|
|
2764
2830
|
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
|
|
2765
2831
|
className: "flex items-center gap-2",
|
|
2766
|
-
children: [/* @__PURE__ */ jsx(WalletConnectionUI, {}),
|
|
2832
|
+
children: [/* @__PURE__ */ jsx(WalletConnectionUI, {}), activeRuntime?.relayer && activeNetworkConfig && /* @__PURE__ */ jsx(Button, {
|
|
2767
2833
|
variant: "ghost",
|
|
2768
2834
|
size: "icon",
|
|
2769
2835
|
className: "h-9 w-9",
|
|
@@ -2775,10 +2841,16 @@ const WalletConnectionWithSettings = () => {
|
|
|
2775
2841
|
isOpen: showNetworkSettings,
|
|
2776
2842
|
onOpenChange: setShowNetworkSettings,
|
|
2777
2843
|
networkConfig: activeNetworkConfig,
|
|
2778
|
-
|
|
2844
|
+
relayer: activeRuntime?.relayer ?? null,
|
|
2845
|
+
onSettingsChanged: () => {
|
|
2846
|
+
reconfigureActiveUiKit(appConfigService.getTypedNestedConfig("walletui", "config") ?? {
|
|
2847
|
+
kitName: "custom",
|
|
2848
|
+
kitConfig: {}
|
|
2849
|
+
});
|
|
2850
|
+
}
|
|
2779
2851
|
})] });
|
|
2780
2852
|
};
|
|
2781
2853
|
|
|
2782
2854
|
//#endregion
|
|
2783
|
-
export { AddressBookWidget, AliasEditPopover, ContractActionBar, ContractStateWidget, DynamicFormField, ExecutionConfigDisplay, NetworkSettingsDialog, TransactionExecuteButton, TransactionForm, WalletConnectionWithSettings, createAddressTransform, createArrayObjectTransform, createArrayTransform, createBigIntTransform, createBooleanTransform, createComplexTypeTransform, createDefaultFormValues, createNumberTransform, createObjectTransform, createTextTransform, createTransformForFieldType, generateDefaultValue, getDefaultValueByFieldType, rendererConfig, useAliasEditState, validateField };
|
|
2855
|
+
export { AddressBookWidget, AliasEditPopover, ContractActionBar, ContractStateWidget, DynamicFormField, ExecutionConfigDisplay, NetworkSettingsDialog, TransactionExecuteButton, TransactionForm, WalletConnectionWithSettings, buildTransactionSuccessPayload, createAddressTransform, createArrayObjectTransform, createArrayTransform, createBigIntTransform, createBooleanTransform, createComplexTypeTransform, createDefaultFormValues, createNumberTransform, createObjectTransform, createTextTransform, createTransformForFieldType, generateDefaultValue, getDefaultValueByFieldType, invokeOnTransactionSuccess, normalizeTransactionSuccessHash, rendererConfig, useAliasEditState, validateField };
|
|
2784
2856
|
//# sourceMappingURL=index.mjs.map
|