update yarn.lock

push-protocol · Dec 4, 2023 · 8c163a6 · 8c163a6
1 parent 85fece3
commit 8c163a6
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 19 deletions.
diff --git a/...ld/03-Examples/07-Showrunner-Example-Notification-Settings-With-Showrunners.mdx b/...ld/03-Examples/07-Showrunner-Example-Notification-Settings-With-Showrunners.mdx
@@ -5,7 +5,7 @@ hide_title: true
 slug: ./notification-settings-with-showrunners-example
 displayed_sidebar: pushNotificationSidebar
 sidebar_position: 7
-image: "/assets/docs/previews/docs_notifications_tutorials_push_react_component_playground_example--push_sdk_react_playground.png"
+image: "/assets/docs/previews/docs_notifications_settings_with_showrunners_example--showrunners_x_notification_settings.png"
 ---
 
 # Trigger Notification Settings in Showrunners
@@ -14,12 +14,13 @@ This tutorial is intended to get you up and going by providing a step-by-step tu
 
 <head>
   <title>
-    Notification Settings with Showrunners tutorial | Push Notification | Push Documentation
+    {`Notification Settings with Showrunners tutorial | Push Notification | Push
+    Documentation`}
   </title>
 </head>
 
-import Tabs from '@theme/Tabs'
-import TabItem from '@theme/TabItem'
+import Tabs from "@theme/Tabs";
+import TabItem from "@theme/TabItem";
 
 ### Setup the Showrunners in your local machine
 
@@ -29,15 +30,13 @@ For detailed, step-by-step guide visit the Showrunners [docs](https://push.org/d
 
 Navigate to the SDK directory and install required dependencies.
 
-
 ```bash
 cd push-showrunners-framework
 yarn install
 docker-compose up
 yarn run dev
 ```
 
-
 ### Import the Push SDK
 
 After you have created a channel folder. Refer to Showrunners [docs](https://push.org/docs/notifications/showrunners-scaffold/get-started/). Move to the [name]Channel.ts file and import the dependencies.
@@ -46,11 +45,11 @@ After you have created a channel folder. Refer to Showrunners [docs](https://pus
 import { PushAPI } from "@pushprotocol/restapi";
 ```
 
-
 #### [Channel File](https://github.com/ethereum-push-notification-service/push-showrunners-framework/blob/main/src/sample_showrunners/bank/bankChannel.ts)
 
 In order to send notification, we need to have the instance of the user channel. To get that, we need to add the below function in our 'Channel class'
 .
+
 ```jsx
 async initializeUser() {
   const provider = new ethers.providers.WebSocketProvider(process.env.ALCHEMY_WEBSOCKET);
@@ -69,27 +68,26 @@ async initializeUser() {
 ```
 
 ### Build the notification payload
-Design your own payload with custom values in the when you want to trigger notifications. To learn more about notification settings, refer to [docs](https://push.org/docs/notifications/build/create-channel-settings/)
 
+Design your own payload with custom values in the when you want to trigger notifications. To learn more about notification settings, refer to [docs](https://push.org/docs/notifications/build/create-channel-settings/)
 
 ```jsx
 const payload = {
   notification: {
-    title: 'Title',
-    body: 'Notif Body',
+    title: "Title",
+    body: "Notif Body",
   },
   payload: {
-    title: 'Title',
-    body: 'Payload body',
-    cta: 'https://google.com/',
-    embed: 'https://avatars.githubusercontent.com/u/64157541?s=200&v=4',
+    title: "Title",
+    body: "Payload body",
+    cta: "https://google.com/",
+    embed: "https://avatars.githubusercontent.com/u/64157541?s=200&v=4",
     // index of the notification the channel wants to trigger, in this for 1nd index which is for Boolean type
     category: 1, // Depending upon your use-case
-  }
-}
+  },
+};
 ```
 
-
 ### Setup Notification trigger
 
 We create a function that will send notifications depending upon the type. To get that, we need to add the below function in our 'Channel class'
@@ -105,14 +103,15 @@ async sendThroughNotifSettings(userAlice, payload) {
   }
 }
 ```
+
 ### How does it actually work?
 
-The Showrunner framework listens to the on-chain events through web-sockets. According to events emitted, an user can create respective notifications and subscribers can opt-in as per their wish. The `send` function takes in an array of all the addresses eligible to receive notifications. In case of `*`, all the addresses subscribed to the channel is eligible for it. You can have a custom array of addresses as well. Furthermore, the `payload` contains `category` which specifies the notification category (as setup by the user). So in the above example all addresses who opted-in for `category-1` (bank holiday - boolean in this case), will receive the notification. 
+The Showrunner framework listens to the on-chain events through web-sockets. According to events emitted, an user can create respective notifications and subscribers can opt-in as per their wish. The `send` function takes in an array of all the addresses eligible to receive notifications. In case of `*`, all the addresses subscribed to the channel is eligible for it. You can have a custom array of addresses as well. Furthermore, the `payload` contains `category` which specifies the notification category (as setup by the user). So in the above example all addresses who opted-in for `category-1` (bank holiday - boolean in this case), will receive the notification.
 
 Summarizing the entire process, web-sockets listen to on-chain events and notifies the showrunners framework. Depending upon the array provided in the `send` function and the `category` provided in the `payload`, users opted in for the notification type, receives it.
 
 You are all set to send notifications through the showrunners framework. Now, bundling up notification settings with web-sockets you can trigger custom notifications based on on-chain activities. Isn't this awesome?✨
 
 Explore more possibilities and ways to make it more useful for your users. Happy building🏆
 
-If you enjoyed this tutorial, Do join our [discord server](https://discord.com/invite/pushprotocol) to meet other dev and builders.
+If you enjoyed this tutorial, Do join our [discord server](https://discord.com/invite/pushprotocol) to meet other dev and builders.
diff --git a/...ions_settings_with_showrunners_example--showrunners_x_notification_settings.png b/...ions_settings_with_showrunners_example--showrunners_x_notification_settings.png