Merge branch 'main' into expo-52

Author: kristian-mkd

packages/react-bindings/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.2.0](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-bindings-1.1.23...@stream-io/video-react-bindings-1.2.0) (2024-11-25)
+
+
+### Features
+
+* **design-v2:** sdk and dogfood app design-v2 changes ([#1549](https://github.com/GetStream/stream-video-js/issues/1549)) ([480a359](https://github.com/GetStream/stream-video-js/commit/480a3593516e6662b35a44f97c72259548d08445))
+
 ## [1.1.23](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-bindings-1.1.22...@stream-io/video-react-bindings-1.1.23) (2024-11-22)
 
 ### Dependency Updates

packages/react-bindings/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-react-bindings",
-  "version": "1.1.23",
+  "version": "1.2.0",
   "packageManager": "[email protected]",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",

packages/react-bindings/src/hooks/callUtilHooks.ts

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useState } from 'react';
 import { useCall } from '../contexts';
 import { useIsCallRecordingInProgress } from './callStateHooks';
+
 /**
  * Custom hook for toggling call recording in a video call.
  *

packages/react-native-sdk/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.4.0](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-native-sdk-1.3.8...@stream-io/video-react-native-sdk-1.4.0) (2024-11-25)
+
+### Dependency Updates
+
+* `@stream-io/video-react-bindings` updated to version `1.2.0`
+
+### Features
+
+* **design-v2:** sdk and dogfood app design-v2 changes ([#1549](https://github.com/GetStream/stream-video-js/issues/1549)) ([480a359](https://github.com/GetStream/stream-video-js/commit/480a3593516e6662b35a44f97c72259548d08445))
+
 ## [1.3.8](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-react-native-sdk-1.3.7...@stream-io/video-react-native-sdk-1.3.8) (2024-11-22)
 
 ### Dependency Updates

packages/react-native-sdk/__tests__/components/CallControls.test.tsx

@@ -3,11 +3,10 @@ import { mockClientWithUser } from '../mocks/client';
 import mockParticipant from '../mocks/participant';
 import { ButtonTestIds, ComponentTestIds } from '../../src/constants/TestIds';
 import { mockCall } from '../mocks/call';
-import { fireEvent, render, screen, waitFor } from '../utils/RNTLTools';
+import { fireEvent, render, screen } from '../utils/RNTLTools';
 import { OwnCapability } from '@stream-io/video-client';
 import { defaultEmojiReactions } from '../../src/constants';
-import { CallControls } from '../../src/components/Call/CallControls/CallControls';
-import { ChatButton } from '../../src/components/Call/CallControls/ChatButton';
+import { CallControls } from '../../src';
 import { HangUpCallButton } from '../../src/components/Call/CallControls/HangupCallButton';
 import { ReactionsButton } from '../../src/components/Call/CallControls/ReactionsButton';
 
@@ -18,48 +17,6 @@ enum P_IDS {
   LOCAL_1 = 'local-1',
 }
 
-describe('ChatButton', () => {
-  it('should render an unread badge indicator when the value is defined in the chatButton prop', async () => {
-    const call = mockCall(mockClientWithUser(), [
-      mockParticipant({
-        isLocalParticipant: true,
-        sessionId: P_IDS.LOCAL_1,
-        userId: P_IDS.LOCAL_1,
-      }),
-    ]);
-
-    render(<ChatButton onPressHandler={jest.fn()} unreadBadgeCount={1} />, {
-      call,
-    });
-
-    const indicator = await screen.findByText('1');
-
-    expect(indicator).toBeVisible();
-  });
-
-  it('should not render an unread badge indicator when the value is 0 in the chatButton prop', async () => {
-    const call = mockCall(mockClientWithUser(), [
-      mockParticipant({
-        isLocalParticipant: true,
-        sessionId: P_IDS.LOCAL_1,
-        userId: P_IDS.LOCAL_1,
-      }),
-    ]);
-
-    render(<ChatButton onPressHandler={jest.fn()} unreadBadgeCount={0} />, {
-      call,
-    });
-
-    await waitFor(() =>
-      expect(() =>
-        screen.getByTestId(ComponentTestIds.CHAT_UNREAD_BADGE_COUNT_INDICATOR)
-      ).toThrow(
-        /Unable to find an element with testID: chat-unread-badge-count-indicator/i
-      )
-    );
-  });
-});
-
 describe('ReactionsButton', () => {
   it('render reaction button in call controls component', async () => {
     const call = mockCall(

packages/react-native-sdk/__tests__/components/ParticipantView.test.tsx

@@ -43,7 +43,6 @@ describe('ParticipantView', () => {
     expect(
       await screen.findByTestId(ComponentTestIds.PARTICIPANT_AVATAR)
     ).toBeOnTheScreen();
-    expect(screen.getByTestId(IconTestIds.MUTED_VIDEO)).toBeOnTheScreen();
     expect(screen.getByText(testParticipant.name)).toBeOnTheScreen();
     // reaction is visible and then disappears after 5500 ms
     expect(screen.getByText('🎉')).toBeOnTheScreen();

packages/react-native-sdk/docusaurus/docs/reactnative/04-ui-components/call/call-content.mdx

@@ -10,7 +10,6 @@ import CallContentSpotlight from '../../assets/04-ui-components/call/call-conten
 
 import CallTopView from '../../common-content/ui-components/call/call-content/call-top-view.mdx';
 import CallControls from '../../common-content/ui-components/call/call-content/call-controls.mdx';
-import ParticipantsInfoBadge from '../../common-content/ui-components/call/call-content/participants-info-badge.mdx';
 import Landscape from '../../common-content/ui-components/call/call-content/landscape.mdx';
 import OnBackPressed from '../../common-content/ui-components/call/call-content/on-back-pressed.mdx';
 import OnParticipantInfoPress from '../../common-content/ui-components/call/call-content/on-participant-info-press.mdx';

packages/react-native-sdk/docusaurus/docs/reactnative/04-ui-components/call/call-top-view.mdx

@@ -3,7 +3,6 @@ id: call-top-view
 title: CallTopView
 ---
 
-import ParticipantsInfoBadge from '../../common-content/ui-components/call/call-content/participants-info-badge.mdx';
 import OnBackPressed from '../../common-content/ui-components/call/call-content/on-back-pressed.mdx';
 import OnParticipantInfoPress from '../../common-content/ui-components/call/call-content/on-participant-info-press.mdx';
 
@@ -60,10 +59,6 @@ Style to override the container of the `CallTopView`.
 | ---------------------------------------------------------- |
 | [ViewStyle](https://reactnative.dev/docs/view-style-props) |
 
-### `ParticipantsInfoBadge`
-
-<ParticipantsInfoBadge />
-
 ## Customization
 
 You can create your own custom `CallTopView` using the [Call Top View UI Cookbook guide](../../../ui-cookbook/replacing-call-top-view/).

packages/react-native-sdk/docusaurus/docs/reactnative/05-ui-cookbook/19-call-quality-rating.mdx

@@ -69,7 +69,7 @@ const FeedbackModal: = () => {
               <TouchableOpacity onPress={onClose} style={[styles.closeButton]}>
                 <IconWrapper>
                   <Close
-                    color={colors.typeSecondary}
+                    color={colors.iconPrimary}
                     size={variants.roundButtonSizes.sm}
                   />
                 </IconWrapper>
@@ -93,8 +93,8 @@ const FeedbackModal: = () => {
                 <Star
                   color={
                     selectedRating && selectedRating >= rating
-                      ? colors.iconAlertSuccess
-                      : colors.typeSecondary
+                      ? colors.iconSuccess
+                      : colors.iconPrimary
                   }
                 />
               </TouchableOpacity>