Extract custom event code snippet to remove duplication

GetStream · Jun 28, 2024 · 45094d8 · 45094d8
1 parent f4f30fe
commit 45094d8
Show file tree

Hide file tree

Showing 3 changed files with 84 additions and 121 deletions.
diff --git a/docusaurus/video/docusaurus/docs/api/_common_/custom-events.mdx b/docusaurus/video/docusaurus/docs/api/_common_/custom-events.mdx
@@ -0,0 +1,40 @@
+import Tabs from '@theme/Tabs';
+import TabItem from '@theme/TabItem';
+
+<Tabs groupId="examples">
+<TabItem value="js" label="JavaScript">
+
+```js
+// send a custom event to all users watching the call
+call.sendCustomEvent({
+  custom: {
+    'render-animation': 'balloons',
+  },
+  user_id: 'john',
+});
+```
+
+</TabItem>
+<TabItem value="py" label="Python">
+
+```py
+# send a custom event to all users watching the call
+call.send_call_event(user_id=user.id, custom={"render-animation": "balloons"})
+```
+
+</TabItem>
+<TabItem value="curl" label="cURL">
+
+```bash
+curl -X POST https://video.stream-io-api.com/api/v2/video/call/${CALL_TYPE}/${CALL_ID}/event?api_key=${API_KEY} \
+  -H "Authorization: ${TOKEN}" \
+  -H "stream-auth-type: jwt" \
+  -H 'Content-Type: application/json' \
+  -d '{
+    "custom": {"render-animation": "balloons"},
+    "user_id": "john"
+  }'
+```
+
+</TabItem>
+</Tabs>
diff --git a/docusaurus/video/docusaurus/docs/api/basics/calls.mdx b/docusaurus/video/docusaurus/docs/api/basics/calls.mdx
@@ -17,6 +17,7 @@ import CallSort from '../../../shared/video/_call-sort-fields.mdx';
 import CallMemberSort from '../../../shared/video/_call-member-sort-fields.mdx';
 import OpenApiModels from '../_common_/OpenApiModels';
 import CallTypesSum from '../_common_/call-types-overview.mdx';
+import CustomEvents from '../_common_/custom-events.mdx';
 
 ## Creating calls
 
@@ -180,7 +181,15 @@ if (!callMemberGrants.includes(VideoOwnCapability.JOIN_CALL)) {
 
 // Update the call type with the changes
 await client.video.updateCallType(callTypeName, {
-  grants: { user: [], call_member: [VideoOwnCapability.JOIN_CALL, VideoOwnCapability.GET_CALL, VideoOwnCapability.SEND_AUDIO, VideoOwnCapability.JOIN_CALL] },
+  grants: {
+    user: [],
+    call_member: [
+      VideoOwnCapability.JOIN_CALL,
+      VideoOwnCapability.GET_CALL,
+      VideoOwnCapability.SEND_AUDIO,
+      VideoOwnCapability.JOIN_CALL,
+    ],
+  },
 });
 ```
 
@@ -594,56 +603,7 @@ curl -X POST "https://video.stream-io-api.com/api/v2/video/call/members?api_key=
 
 It's possible to send any custom event for a call:
 
-<Tabs groupId="examples">
-<TabItem value="js" label="JavaScript">
-
-```js
-// the custom event can be any kind of data
-await call.sendCustomEvent({
-  type: 'draw',
-  x: 10,
-  y: 30,
-});
-```
-
-</TabItem>
-
-<TabItem value="py" label="Python">
-
-```python
-# custom events can contain arbitrary data
-call.send_call_event(
-    user_id="john",
-    custom={
-        "type": "draw",
-        "x": 10,
-        "y": 30,
-    },
-)
-```
-
-</TabItem>
-
-<TabItem value="curl" label="cURL">
-
-```bash
-curl -X POST "https://video.stream-io-api.com/api/v2/video/call/${CALL_TYPE}/${CALL_ID}/event?api_key=${API_KEY}" \
-  -H "Authorization: ${TOKEN}" \
-  -H "stream-auth-type: jwt" \
-  -H "Content-Type: application/json" \
-  -d '{
-    "event": {
-      "custom": {
-        "type": "draw",
-        "x": 10,
-        "y": 30
-      }
-    }
-  }'
-```
-
-</TabItem>
-</Tabs>
+<CustomEvents />
 
 Sending a custom event will dispatch the `custom` WebSocket event.
 
@@ -719,22 +679,22 @@ You can configure all calls to have a default max duration, this can be done fro
 
 ```js
 await client.video.updateCallType({
-    name: 'default',
-    settings: {
-        limits: {
-            max_duration_seconds: 3600
-        }
-    }
+  name: 'default',
+  settings: {
+    limits: {
+      max_duration_seconds: 3600,
+    },
+  },
 });
 
 // Disable the default session timer
 await client.video.updateCallType({
-    name: 'default',
-    settings: {
-        limits: {
-            max_duration_seconds: 0
-        }
-    }
+  name: 'default',
+  settings: {
+    limits: {
+      max_duration_seconds: 0,
+    },
+  },
 });
 ```
 
@@ -810,14 +770,14 @@ It is possible to create calls with a different max duration than the default de
 ```js
 // or call.create
 await client.call('default', 'test-outgoing-call').getOrCreate({
-    data: {
-        created_by_id: 'john',
-        settings_override: {
-            limits: {
-                max_duration_seconds: 3600,
-            },
-        },
+  data: {
+    created_by_id: 'john',
+    settings_override: {
+      limits: {
+        max_duration_seconds: 3600,
+      },
     },
+  },
 });
 ```
 
@@ -876,24 +836,24 @@ It is possible to update a call and extend the session time. In that case a `cal
 ```js
 // Update the call with session timer
 await client.call.update({
-    data: {
-        settings_override: {
-          limits: {
-            max_duration_seconds: call.settings.limits.max_duration_seconds + 300,
-          },
-        },
+  data: {
+    settings_override: {
+      limits: {
+        max_duration_seconds: call.settings.limits.max_duration_seconds + 300,
       },
+    },
+  },
 });
 
 // Disable the session timer
 await client.call.update({
-    data: {
-        settings_override: {
-          limits: {
-            max_duration_seconds: 0,
-          },
-        },
+  data: {
+    settings_override: {
+      limits: {
+        max_duration_seconds: 0,
       },
+    },
+  },
 });
 ```
 

diff --git a/docusaurus/video/docusaurus/docs/api/webhooks/overview.mdx b/docusaurus/video/docusaurus/docs/api/webhooks/overview.mdx
@@ -5,51 +5,14 @@ slug: /webhooks/overview
 title: Overview
 ---
 
-import Tabs from '@theme/Tabs';
-import TabItem from '@theme/TabItem';
+import CustomEvents from '../_common_/custom-events.mdx';
 
 ## Custom events
 
 You can send custom events to all users watching a call, events can be send client-side or server-side. It is not necessary for users to be part the call, you call objects can be "watched" before joining as well.
 Client-side you can observe calls and receive events by passing the `watch:true` parameter to any of these endpoints: `GetCall`, `QueryCalls`, `JoinCall`.
 
-<Tabs groupId="examples">
-<TabItem value="js" label="JavaScript">
-
-```js
-// send a custom event to all users watching the call
-call.sendCustomEvent({
-  custom: {
-    'render-animation': 'balloons',
-  },
-  user_id: 'john',
-});
-```
-
-</TabItem>
-<TabItem value="py" label="Python">
-
-```py
-# send a custom event to all users watching the call
-call.send_call_event(user_id=user.id, custom={"render-animation": "balloons"})
-```
-
-</TabItem>
-<TabItem value="curl" label="cURL">
-
-```bash
-curl -X POST https://video.stream-io-api.com/api/v2/video/call/${CALL_TYPE}/${CALL_ID}/event?api_key=${API_KEY} \
-  -H "Authorization: ${TOKEN}" \
-  -H "stream-auth-type: jwt" \
-  -H 'Content-Type: application/json' \
-  -d '{
-    "custom": {"render-animation": "balloons"},
-    "user_id": "john"
-  }'
-```
-
-</TabItem>
-</Tabs>
+<CustomEvents />
 
 You can configure your Stream app to send events to your HTTP/webhook and/or to your AWS SQS queue. Webhooks are usually
 the simplest way to receive events from your app and to perform additional action based on what happens to your application.