siam-ui-utils 2.2.6 → 2.2.8

package/eslint.config.mjs

@@ -1,41 +1,41 @@
-import js from '@eslint/js';
-import globals from 'globals';
-import pluginReact from 'eslint-plugin-react';
-import pluginReactHooks from 'eslint-plugin-react-hooks';
-import pluginReactRefresh from 'eslint-plugin-react-refresh';
-import { defineConfig } from 'eslint/config';
-
-export default defineConfig([
-  { ignores: ['build', '**/*.d.ts'] },
-  {
-    files: ['**/*.{js,jsx,ts,tsx}'],
-    languageOptions: {
-      ecmaVersion: 'latest',
-      sourceType: 'module',
-      globals: globals.browser,
-      parserOptions: {
-        ecmaFeatures: { jsx: true },
-      },
-    },
-    plugins: {
-      react: pluginReact,
-      'react-hooks': pluginReactHooks,
-      'react-refresh': pluginReactRefresh,
-    },
-    rules: {
-      ...js.configs.recommended.rules,
-      ...pluginReact.configs.recommended.rules,
-      ...pluginReact.configs['jsx-runtime'].rules,
-      ...pluginReactHooks.configs.recommended.rules,
-      'react/jsx-no-target-blank': 'off',
-      'react-refresh/only-export-components': [
-        'off',
-        { allowConstantExport: true },
-      ],
-      'react/prop-types': 'off',
-      '@/no-default-export': 'off',
-      'no-unused-vars': 'warn',
-    },
-    settings: { react: { version: 'detect' } },
-  },
-]);
+import js from '@eslint/js';
+import globals from 'globals';
+import pluginReact from 'eslint-plugin-react';
+import pluginReactHooks from 'eslint-plugin-react-hooks';
+import pluginReactRefresh from 'eslint-plugin-react-refresh';
+import { defineConfig } from 'eslint/config';
+
+export default defineConfig([
+  { ignores: ['build', '**/*.d.ts'] },
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 'latest',
+      sourceType: 'module',
+      globals: globals.browser,
+      parserOptions: {
+        ecmaFeatures: { jsx: true },
+      },
+    },
+    plugins: {
+      react: pluginReact,
+      'react-hooks': pluginReactHooks,
+      'react-refresh': pluginReactRefresh,
+    },
+    rules: {
+      ...js.configs.recommended.rules,
+      ...pluginReact.configs.recommended.rules,
+      ...pluginReact.configs['jsx-runtime'].rules,
+      ...pluginReactHooks.configs.recommended.rules,
+      'react/jsx-no-target-blank': 'off',
+      'react-refresh/only-export-components': [
+        'off',
+        { allowConstantExport: true },
+      ],
+      'react/prop-types': 'off',
+      '@/no-default-export': 'off',
+      'no-unused-vars': 'warn',
+    },
+    settings: { react: { version: 'detect' } },
+  },
+]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "siam-ui-utils",
-  "version": "2.2.6",
+  "version": "2.2.8",
   "keywords": [
     "ampf-react",
     "ampf-utils",

package/src/App.jsx

@@ -81,7 +81,7 @@ const App = () => {
           <AccordionHeader targetId="4">Video Call Room</AccordionHeader>
           <AccordionBody accordionId="4">
             <WhereByRoom
-              src="https://whereby.com/test-ampf-room"
+              src="https://ampf.whereby.com/ampf-cons-virc92qft?displayName=Jose"
               title="Videollamada de ejemplo"
             />
           </AccordionBody>

package/src/where-by-room/index.jsx

@@ -2,7 +2,14 @@ import { WherebyProvider } from '@whereby.com/browser-sdk/react';
 import '@whereby.com/browser-sdk/embed';
 import Room from './room';
 
-export const WhereByRoom = ({ src, onEvent, onActions, iframeClass }) => {
+export const WhereByRoom = ({
+  src,
+  onEvent,
+  onActions,
+  iframeClass,
+  isChatEnabled = true,
+  isMinimalEnabled = false,
+}) => {
   return (
     <WherebyProvider>
       <Room
@@ -10,6 +17,8 @@ export const WhereByRoom = ({ src, onEvent, onActions, iframeClass }) => {
         onEvent={onEvent}
         onActions={onActions}
         iframeClass={iframeClass}
+        isChatEnabled={isChatEnabled}
+        isMinimalEnabled={isMinimalEnabled}
       />
     </WherebyProvider>
   );

package/src/where-by-room/room.jsx

@@ -1,7 +1,14 @@
 import { useEffect, useRef } from 'react';
 import '@whereby.com/browser-sdk/embed';
 
-export const Room = ({ src, onEvent, onActions, iframeClass }) => {
+export const Room = ({
+  src,
+  onEvent,
+  onActions,
+  iframeClass,
+  isChatEnabled = true,
+  isMinimalEnabled = false,
+}) => {
   const wherebyRef = useRef(null);
 
   useEffect(() => {
@@ -29,8 +36,16 @@ export const Room = ({ src, onEvent, onActions, iframeClass }) => {
 
     const events = [
       'ready',
+      'grant_device_permission',
+      'deny_device_permission',
+      'precall_check_completed',
+      'precall_check_skipped',
+      'knock',
+      'cancel_knock',
       'join',
       'leave',
+      'meeting_end',
+      'participantupdate',
       'participant_join',
       'participant_leave',
       'microphone_toggle',
@@ -39,10 +54,10 @@ export const Room = ({ src, onEvent, onActions, iframeClass }) => {
       'chat_toggle',
       'people_toggle',
       'pip_toggle',
-      'deny_device_permission',
       'streaming_status_change',
+      'recording_status_change',
+      'transcription_status_change',
       'connection_status_change',
-      'meeting_end',
     ];
     function handleEvent(e) {
       if (onEvent) onEvent(e.type, e.detail);
@@ -59,11 +74,12 @@ export const Room = ({ src, onEvent, onActions, iframeClass }) => {
         ref={wherebyRef}
         class={iframeClass}
         room={src}
-        chat="on"
+        chat={isChatEnabled ? 'on' : 'off'}
         screenshare="on"
         audio="on"
         video="on"
         allow="camera; microphone; fullscreen"
+        minimal={isMinimalEnabled ? 'on' : 'off'}
       />
     </div>
   );