Merge pull request #109 from bosonprotocol/add-event-tag-parameter

feat: add event tag parameter

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@bosonprotocol/react-kit": "^0.24.2-alpha.0",
+    "@bosonprotocol/react-kit": "^0.24.2-alpha.1",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",

public/example.html

@@ -165,6 +165,15 @@ <h2>Redemption Widget</h2>
               <button onclick="setValue('input-target-origin', window.location.origin)" >Example</button>
             </td>
           </tr>
+          <tr>
+            <td>EventTag</td>
+            <td>
+              <input type="url" id="input-event-tag" onchange="updateRedeemButton('data-event-tag', encodeURI(this.value))" size="30">
+            </td>
+            <td>
+              <button onclick="setValue('input-event-tag', 'bosonModal')" >Example</button>
+            </td>
+          </tr>
           <tr>
             <td>Should Wait For Response</td>
             <td>
@@ -274,7 +283,7 @@ <h2>Redemption Widget</h2>
       window.addEventListener("message", (event) => {
         if (event.data.type === constants.deliveryInfoMessage) {
           console.log(
-            `Received message '${event.data.type}' from '${event.origin}'. Content: '${JSON.stringify(event.data.message)}'  Signature: '${event.data.signature}'`
+            `Received message '${event.data.type}' from '${event.origin}'. Content: '${JSON.stringify(event.data)}'`
           );
           if (getValue('input-wait-for-response', 'checked')) {
             // wait for a bit and send a response to the iFrame (only relevant when )

public/scripts/boson-widgets.js

@@ -18,6 +18,7 @@ const constants = {
   showRedemptionOverviewTag: "data-show-redemption-overview",
   widgetActionTag: "data-widget-action",
   deliveryInfoTag: "data-delivery-info",
+  eventTagTag: "data-event-tag",
   postDeliveryInfoUrlTag: "data-post-delivery-info-url",
   postDeliveryInfoHeadersTag: "data-post-delivery-info-headers",
   dataTargetOrigin: "data-target-origin",
@@ -175,6 +176,7 @@ function bosonWidgetReload(onLoadIframe) {
         showRedeemId.attributes[constants.dataSendDeliveryInfoXMTP]?.value;
       const withExternalSigner =
         showRedeemId.attributes[constants.dataWithExternalSigner]?.value;
+      const eventTag = showRedeemId.attributes[constants.eventTagTag]?.value;
 
       bosonWidgetShowRedeem(
         {
@@ -197,7 +199,8 @@ function bosonWidgetReload(onLoadIframe) {
           targetOrigin,
           shouldWaitForResponse,
           sendDeliveryInfoThroughXMTP,
-          withExternalSigner
+          withExternalSigner,
+          eventTag
         },
         onLoadIframe
       );
@@ -254,7 +257,8 @@ function bosonWidgetShowRedeem(args, onLoadIframe) {
     {
       tag: "withExternalSigner",
       value: args.withExternalSigner
-    }
+    },
+    { tag: "eventTag", value: args.eventTag }
   ]);
   showLoading();
   hideIFrame();

src/components/widgets/redeem/Redeem.tsx

@@ -109,6 +109,8 @@ export function Redeem() {
   const signaturesStr = searchParams.get("signatures") as string;
   const signatures = signaturesStr ? signaturesStr.split(",") : undefined;
 
+  const eventTag = searchParams.get("eventTag") as string;
+
   // In case the deliveryInfo shall be transferred between frontend windows, the targetOrigin
   //  the deliveryInfo message shall be posted to
   //  (see https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage#targetorigin)
@@ -161,7 +163,8 @@ export function Redeem() {
                 const event = {
                   type: "boson-delivery-info",
                   message,
-                  signature
+                  signature,
+                  tag: eventTag
                 };
                 // precaution: register to the response before posting the message
                 const responseType = "boson-delivery-info-response";