feat: storybook hooks docs #1010

zakybilfagih · 2022-10-12T14:19:53Z

Details(context, Jira ticket, how was the bug fixed, what does the new feature do)

added storybook docs for react sdk hooks
hooks list
- useVideo
- useVideoList
- useScreenShare
- useCustomEvent
- useDevices
- useParticipants
- usePreviewJoin
- useAVToggle
- useRemoteAVToggle
- useAutoplayError
- useAudioLevelStyles

Choose one of these(put a 'x' in the bracket):

The change doesn't require a change to the documentation.
The documentation is updated accordingly.

Implementation note, gotchas, related work and Future TODOs (optional)

vercel · 2022-10-12T14:19:57Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
dashboard-app	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Oct 26, 2022 at 8:56AM (UTC)
storybook-app	✅ Ready (Inspect)	Visit Preview		Oct 26, 2022 at 8:56AM (UTC)

github-actions · 2022-10-12T14:20:10Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

raviteja83 · 2022-10-13T07:23:42Z

packages/react-ui/src/Video/UseCustomEvent.stories.tsx

@@ -0,0 +1,45 @@
+import { StyledVideo } from './Video';


this file should be wherever the component is ideally. does it not come under the same section? if not let's create a separate folder for all hooks.

raviteja83 · 2022-10-13T07:25:07Z

packages/react-ui/src/Video/UseAVToggle.stories.tsx

+import React from 'react';
+import { ComponentStory } from '@storybook/react';
+
+const VideoHook: ComponentStory<typeof StyledVideo> = () => {


.mdx would be needed for each hook. adding here just in case you missed this.

github-actions · 2022-10-17T13:38:35Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

raviteja83 · 2022-10-17T13:55:19Z

packages/react-ui/src/store/StorybookSDK.ts

@@ -128,7 +132,8 @@ export class StoryBookSDK implements Partial<HMSActions> {
  }

  async detachVideo(_trackID: string, videoElement: HTMLVideoElement): Promise<void> {
-    videoElement.srcObject = null;
+    videoElement.removeAttribute('src');
+    videoElement.load();


what is the issue with previous code? that is what we do internally in sdk as well.

raviteja83 · 2022-10-17T13:57:06Z

packages/react-ui/src/store/StorybookSDK.ts

+      this.ignoredMessageTypes = msgTypes;
+    } else {
+      for (const msgType of msgTypes) {
+        if (!this.ignoredMessageTypes.includes(msgType)) {


this can be made as Set as well.

github-actions · 2022-10-18T01:12:09Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-24T05:19:53Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-26T05:23:47Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-26T06:05:46Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-26T08:28:58Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-26T08:38:12Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

github-actions · 2022-10-26T08:55:04Z

A JIRA Issue ID is missing from your branch name! 🦄

Your branch: feat/storybook-hooks

If this is your first time contributing to this repository - welcome!

Please refer to jira-lint to get started.

Without the JIRA Issue ID in your branch name you would lose out on automatic updates to JIRA via SCM; some GitHub status checks might fail.

Valid sample branch names:

‣ feature/shiny-new-feature--mojo-10'
‣ 'chore/changelogUpdate_mojo-123'
‣ 'bugfix/fix-some-strange-bug_GAL-2345'

zakybilfagih added 13 commits October 12, 2022 21:07

fix: remove unused @param peerId from jsdoc

7b56f48

fix: export pagination component from story

26c42a8

fix: role should be roleName

98e22e3

feat: add fake role on fake store

c2585cc

feat: add more stub on storybooksdk reactsdk stub

86b5b26

feat: useAVToggle hook example

d0b9e72

feat: useCustomEvent example

8ad1b1c

feat: useRemoteAVToggle example

3611ad5

feat: useVideo example

2b9148c

feat: useVideoList example

48703b7

fix: useState dependency array errors

0c9ac1f

fix: add type to custom event message

2337b7c

fix: remove unused block statement

8a37720

github-actions bot added react-sdk react-ui labels Oct 12, 2022

zakybilfagih changed the title ~~Feat/storybook hooks~~ feat: storybook hooks docs Oct 12, 2022

raviteja83 reviewed Oct 13, 2022

View reviewed changes

fix: move hooks stories to seperate folder

5e2049f

vercel bot deployed to Preview – dashboard-app October 17, 2022 13:40 View deployment

raviteja83 reviewed Oct 17, 2022

View reviewed changes

vercel bot had a problem deploying to Preview – storybook-app October 17, 2022 14:23 Failure

zakybilfagih added 3 commits October 18, 2022 08:10

fix: move mdx file

233a82b

feat: add useDevices hook

eec1050

feat: add useScreenShare hook

e405300

vercel bot deployed to Preview – dashboard-app October 24, 2022 05:21 View deployment

vercel bot deployed to Preview – storybook-app October 24, 2022 05:21 View deployment

zakybilfagih added 2 commits October 26, 2022 12:22

fix: video list remove overflow

0721770

fix: theme map merging

91289df

vercel bot deployed to Preview – storybook-app October 26, 2022 05:25 View deployment

vercel bot deployed to Preview – dashboard-app October 26, 2022 05:25 View deployment

zakybilfagih added 2 commits October 26, 2022 13:04

fix: remove value from effect deps

0ff2f24

fix: fix not adding className

89bfbd7

vercel bot deployed to Preview – storybook-app October 26, 2022 06:06 View deployment

vercel bot deployed to Preview – dashboard-app October 26, 2022 06:07 View deployment

zakybilfagih added 3 commits October 26, 2022 15:10

Merge branch 'main' into feat/storybook-hooks

0f31e86

fix: dark mode styling issue

4ebeb83

fix: eslint rule and prettier error

7369a18

vercel bot deployed to Preview – storybook-app October 26, 2022 08:32 View deployment

vercel bot deployed to Preview – dashboard-app October 26, 2022 08:32 View deployment

fix: try removing base css

a74dd6e

vercel bot deployed to Preview – storybook-app October 26, 2022 08:39 View deployment

vercel bot deployed to Preview – dashboard-app October 26, 2022 08:39 View deployment

fix: change merging strategy

e8cb426

vercel bot deployed to Preview – storybook-app October 26, 2022 08:56 View deployment

vercel bot deployed to Preview – dashboard-app October 26, 2022 08:56 View deployment

zakybilfagih closed this Oct 26, 2022

raviteja83 deleted the feat/storybook-hooks branch July 3, 2024 07:10

raviteja83 restored the feat/storybook-hooks branch July 3, 2024 07:10

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: storybook hooks docs #1010

feat: storybook hooks docs #1010

zakybilfagih commented Oct 12, 2022 •

edited

Loading

vercel bot commented Oct 12, 2022 •

edited

Loading

github-actions bot commented Oct 12, 2022

raviteja83 Oct 13, 2022

raviteja83 Oct 13, 2022

github-actions bot commented Oct 17, 2022

raviteja83 Oct 17, 2022

raviteja83 Oct 17, 2022

github-actions bot commented Oct 18, 2022

github-actions bot commented Oct 24, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

feat: storybook hooks docs #1010

feat: storybook hooks docs #1010

Conversation

zakybilfagih commented Oct 12, 2022 • edited Loading

Details(context, Jira ticket, how was the bug fixed, what does the new feature do)

Choose one of these(put a 'x' in the bracket):

Implementation note, gotchas, related work and Future TODOs (optional)

vercel bot commented Oct 12, 2022 • edited Loading

github-actions bot commented Oct 12, 2022

raviteja83 Oct 13, 2022

Choose a reason for hiding this comment

raviteja83 Oct 13, 2022

Choose a reason for hiding this comment

github-actions bot commented Oct 17, 2022

raviteja83 Oct 17, 2022

Choose a reason for hiding this comment

raviteja83 Oct 17, 2022

Choose a reason for hiding this comment

github-actions bot commented Oct 18, 2022

github-actions bot commented Oct 24, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

github-actions bot commented Oct 26, 2022

zakybilfagih commented Oct 12, 2022 •

edited

Loading

vercel bot commented Oct 12, 2022 •

edited

Loading