@stream-io/video-react-native-sdk 0.1.14 → 0.2.1

package/expo-config-plugin/static/SocketConnection.swift

@@ -0,0 +1,195 @@
+//
+//  SocketConnection.swift
+//  Broadcast Extension
+//
+import Foundation
+import OSLog
+
+class SocketConnection: NSObject {
+    var didOpen: (() -> Void)?
+    var didClose: ((Error?) -> Void)?
+    var streamHasSpaceAvailable: (() -> Void)?
+
+    private let filePath: String
+    private var socketHandle: Int32 = -1
+    private var address: sockaddr_un?
+
+    private var inputStream: InputStream?
+    private var outputStream: OutputStream?
+
+    private var networkQueue: DispatchQueue?
+    private var shouldKeepRunning = false
+
+    init?(filePath path: String) {
+        filePath = path
+        socketHandle = Darwin.socket(AF_UNIX, SOCK_STREAM, 0)
+
+        guard socketHandle != -1 else {
+            os_log(.debug, log: broadcastLogger, "failure: create socket")
+            return nil
+        }
+    }
+
+    func open() -> Bool {
+        os_log(.debug, log: broadcastLogger, "open socket connection")
+
+        guard FileManager.default.fileExists(atPath: filePath) else {
+            os_log(.debug, log: broadcastLogger, "failure: socket file missing")
+            return false
+        }
+
+        guard setupAddress() == true else {
+            return false
+        }
+
+        guard connectSocket() == true else {
+            return false
+        }
+
+        setupStreams()
+
+        inputStream?.open()
+        outputStream?.open()
+
+        return true
+    }
+
+    func close() {
+        unscheduleStreams()
+
+        inputStream?.delegate = nil
+        outputStream?.delegate = nil
+
+        inputStream?.close()
+        outputStream?.close()
+
+        inputStream = nil
+        outputStream = nil
+    }
+
+    func writeToStream(buffer: UnsafePointer<UInt8>, maxLength length: Int) -> Int {
+        outputStream?.write(buffer, maxLength: length) ?? 0
+    }
+}
+
+extension SocketConnection: StreamDelegate {
+
+    func stream(_ aStream: Stream, handle eventCode: Stream.Event) {
+        switch eventCode {
+        case .openCompleted:
+            os_log(.debug, log: broadcastLogger, "client stream open completed")
+            if aStream == outputStream {
+                didOpen?()
+            }
+        case .hasBytesAvailable:
+            if aStream == inputStream {
+                var buffer: UInt8 = 0
+                let numberOfBytesRead = inputStream?.read(&buffer, maxLength: 1)
+                if numberOfBytesRead == 0 && aStream.streamStatus == .atEnd {
+                    os_log(.debug, log: broadcastLogger, "server socket closed")
+                    close()
+                    notifyDidClose(error: nil)
+                }
+            }
+        case .hasSpaceAvailable:
+            if aStream == outputStream {
+                streamHasSpaceAvailable?()
+            }
+        case .errorOccurred:
+            os_log(.debug, log: broadcastLogger, "client stream error occured: \(String(describing: aStream.streamError))")
+            close()
+            notifyDidClose(error: aStream.streamError)
+
+        default:
+            break
+        }
+    }
+}
+
+private extension SocketConnection {
+
+    func setupAddress() -> Bool {
+        var addr = sockaddr_un()
+        guard filePath.count < MemoryLayout.size(ofValue: addr.sun_path) else {
+            os_log(.debug, log: broadcastLogger, "failure: fd path is too long")
+            return false
+        }
+
+        _ = withUnsafeMutablePointer(to: &addr.sun_path.0) { ptr in
+            filePath.withCString {
+                strncpy(ptr, $0, filePath.count)
+            }
+        }
+
+        address = addr
+        return true
+    }
+
+    func connectSocket() -> Bool {
+        guard var addr = address else {
+            return false
+        }
+
+        let status = withUnsafePointer(to: &addr) { ptr in
+            ptr.withMemoryRebound(to: sockaddr.self, capacity: 1) {
+                Darwin.connect(socketHandle, $0, socklen_t(MemoryLayout<sockaddr_un>.size))
+            }
+        }
+
+        guard status == noErr else {
+            os_log(.debug, log: broadcastLogger, "failure: \(status)")
+            return false
+        }
+
+        return true
+    }
+
+    func setupStreams() {
+        var readStream: Unmanaged<CFReadStream>?
+        var writeStream: Unmanaged<CFWriteStream>?
+
+        CFStreamCreatePairWithSocket(kCFAllocatorDefault, socketHandle, &readStream, &writeStream)
+
+        inputStream = readStream?.takeRetainedValue()
+        inputStream?.delegate = self
+        inputStream?.setProperty(kCFBooleanTrue, forKey: Stream.PropertyKey(kCFStreamPropertyShouldCloseNativeSocket as String))
+
+        outputStream = writeStream?.takeRetainedValue()
+        outputStream?.delegate = self
+        outputStream?.setProperty(kCFBooleanTrue, forKey: Stream.PropertyKey(kCFStreamPropertyShouldCloseNativeSocket as String))
+
+        scheduleStreams()
+    }
+
+    func scheduleStreams() {
+        shouldKeepRunning = true
+
+        networkQueue = DispatchQueue.global(qos: .userInitiated)
+        networkQueue?.async { [weak self] in
+            self?.inputStream?.schedule(in: .current, forMode: .common)
+            self?.outputStream?.schedule(in: .current, forMode: .common)
+            RunLoop.current.run()
+
+            var isRunning = false
+
+            repeat {
+                isRunning = self?.shouldKeepRunning ?? false && RunLoop.current.run(mode: .default, before: .distantFuture)
+            } while (isRunning)
+        }
+    }
+
+    func unscheduleStreams() {
+        networkQueue?.sync { [weak self] in
+            self?.inputStream?.remove(from: .current, forMode: .common)
+            self?.outputStream?.remove(from: .current, forMode: .common)
+        }
+
+        shouldKeepRunning = false
+    }
+
+    func notifyDidClose(error: Error?) {
+        if didClose != nil {
+            didClose?(error)
+        }
+    }
+}

package/ios/StreamVideoReactNative-Bridging-Header.h

@@ -1,2 +1,3 @@
 #import <React/RCTBridgeModule.h>
-#import <React/RCTViewManager.h>
+#import <React/RCTViewManager.h>
+#import <React/RCTEventEmitter.h>

package/ios/StreamVideoReactNative.h

@@ -1,5 +1,7 @@
-@interface StreamVideoReactNative : NSObject <RCTBridgeModule>
+@interface StreamVideoReactNative : RCTEventEmitter <RCTBridgeModule>
+
+-(void)screenShareEventReceived:(NSString*)event;
 
 +(void)setup;
 
-@end
+@end

package/ios/StreamVideoReactNative.m

@@ -1,9 +1,29 @@
 #import <React/RCTBridgeModule.h>
+#import <React/RCTEventEmitter.h>
 #import "StreamVideoReactNative.h"
 #import "WebRTCModule.h"
 #import "WebRTCModuleOptions.h"
 
+// Do not change these consts, it is what is used react-native-webrtc
+NSNotificationName const kBroadcastStartedNotification = @"iOS_BroadcastStarted";
+NSNotificationName const kBroadcastStoppedNotification = @"iOS_BroadcastStopped";
+
+void broadcastNotificationCallback(CFNotificationCenterRef center,
+                                   void *observer,
+                                   CFStringRef name,
+                                   const void *object,
+                                   CFDictionaryRef userInfo) {
+    StreamVideoReactNative *this = (__bridge StreamVideoReactNative*)observer;
+    NSString *eventName = (__bridge NSString*)name;
+    [this screenShareEventReceived: eventName];
+    
+}
+
 @implementation StreamVideoReactNative
+{
+    bool hasListeners;
+    CFNotificationCenterRef _notificationCenter;
+}
 RCT_EXPORT_MODULE();
 
 +(BOOL)requiresMainQueueSetup {
@@ -16,4 +36,65 @@ RCT_EXPORT_MODULE();
     WebRTCModuleOptions *options = [WebRTCModuleOptions sharedInstance];
     options.videoEncoderFactory = simulcastVideoEncoderFactory;
 }
-@end
+
+-(instancetype)init {
+    self = [super init];
+    if (self) {
+        _notificationCenter = CFNotificationCenterGetDarwinNotifyCenter();
+        [self setupObserver];
+    }
+    
+    return self;
+}
+
+-(void)dealloc {
+    [self clearObserver];
+}
+
+
+-(void)setupObserver {
+    CFNotificationCenterAddObserver(_notificationCenter,
+                                    (__bridge const void *)(self),
+                                    broadcastNotificationCallback,
+                                    (__bridge CFStringRef)kBroadcastStartedNotification,
+                                    NULL,
+                                    CFNotificationSuspensionBehaviorDeliverImmediately);
+    CFNotificationCenterAddObserver(_notificationCenter,
+                                    (__bridge const void *)(self),
+                                    broadcastNotificationCallback,
+                                    (__bridge CFStringRef)kBroadcastStoppedNotification,
+                                    NULL,
+                                    CFNotificationSuspensionBehaviorDeliverImmediately);
+}
+
+-(void)clearObserver {
+    CFNotificationCenterRemoveObserver(_notificationCenter,
+                                       (__bridge const void *)(self),
+                                       (__bridge CFStringRef)kBroadcastStartedNotification,
+                                       NULL);
+    CFNotificationCenterRemoveObserver(_notificationCenter,
+                                       (__bridge const void *)(self),
+                                       (__bridge CFStringRef)kBroadcastStoppedNotification,
+                                       NULL);
+}
+
+-(void)startObserving {
+    hasListeners = YES;
+}
+
+-(void)stopObserving {
+    hasListeners = NO;
+}
+
+-(void)screenShareEventReceived:(NSString*)event {
+    if (hasListeners) {
+        [self sendEventWithName:@"StreamVideoReactNative_Ios_Screenshare_Event" body:@{@"name": event}];
+    }
+}
+
+-(NSArray<NSString *> *)supportedEvents {
+    return @[@"StreamVideoReactNative_Ios_Screenshare_Event"];
+}
+
+
+@end

package/ios/StreamVideoReactNative.xcodeproj/project.pbxproj

@@ -39,7 +39,7 @@
 		134814211AA4EA7D00B7C361 /* Products */ = {
 			isa = PBXGroup;
 			children = (
-				134814201AA4EA6300B7C361 /* libLivekitReactNative.a */,
+				134814201AA4EA6300B7C361 /* libStreamVideoReactNative.a */,
 			);
 			name = Products;
 			sourceTree = "<group>";
@@ -71,7 +71,7 @@
 			);
 			name = StreamVideoReactNative;
 			productName = RCTDataManager;
-			productReference = 134814201AA4EA6300B7C361 /* libLivekitReactNative.a */;
+			productReference = 134814201AA4EA6300B7C361 /* libStreamVideoReactNative.a */;
 			productType = "com.apple.product-type.library.static";
 		};
 /* End PBXNativeTarget section */
@@ -271,4 +271,4 @@
 /* End XCConfigurationList section */
 	};
 	rootObject = 58B511D31A9E6C8500147676 /* Project object */;
-}
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-react-native-sdk",
-  "version": "0.1.14",
+  "version": "0.2.1",
   "packageManager": "yarn@3.2.4",
   "main": "dist/commonjs/index.js",
   "module": "dist/module/index.js",
@@ -30,6 +30,7 @@
     "package.json",
     "app.plugin.js",
     "expo-config-plugin/README.md",
+    "expo-config-plugin/static/**/*",
     "expo-config-plugin/dist/**/*",
     "!expo-config-plugin/src/*",
     "!expo-config-plugin/fixtures/*",
@@ -45,8 +46,8 @@
     "!**/.*"
   ],
   "dependencies": {
-    "@stream-io/video-client": "^0.3.36",
-    "@stream-io/video-react-bindings": "^0.2.37",
+    "@stream-io/video-client": "^0.4.0",
+    "@stream-io/video-react-bindings": "^0.3.0",
     "intl-pluralrules": "2.0.1",
     "lodash.merge": "^4.6.2",
     "react-native-url-polyfill": "1.3.0",

package/src/components/Call/CallControls/ScreenShareButton.tsx

@@ -0,0 +1,127 @@
+import React, { useEffect, useRef } from 'react';
+import { NativeModules, Platform, findNodeHandle } from 'react-native';
+import { ScreenCapturePickerView } from '@stream-io/react-native-webrtc';
+import { ScreenShare } from '../../../icons';
+import { CallControlsButton } from './CallControlsButton';
+import { SfuModels } from '@stream-io/video-client';
+import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
+import { useTheme } from '../../../contexts';
+import { useIsIosScreenshareBroadcastStarted } from '../../../hooks';
+import { usePrevious } from '../../../utils/hooks';
+
+/**
+ * The props for the Screen Share button in the Call Controls.
+ */
+export type ScreenShareButtonProps = {
+  /**
+   * Handler to be called when the screen-share has been started.
+   *
+   */
+  onScreenShareStartedHandler?: () => void;
+  /**
+   * Handler to be called when the screen-share has been stopped.
+   *
+   */
+  onScreenShareStoppedHandler?: () => void;
+};
+
+// ios >= 14.0 or android
+const CanScreenShare =
+  (Platform.OS === 'ios' &&
+    Number.parseInt(Platform.Version.split('.')[0], 10) >= 14) ||
+  Platform.OS === 'android';
+
+/**
+ * Button to start/stop screen share.
+ * Note: This button is enabled only on iOS >= 14.0 and any Android version.
+ */
+export const ScreenShareButton = ({
+  onScreenShareStartedHandler,
+  onScreenShareStoppedHandler,
+}: ScreenShareButtonProps) => {
+  const {
+    theme: { colors, screenShareButton },
+  } = useTheme();
+  const call = useCall();
+  const { useLocalParticipant } = useCallStateHooks();
+
+  const onScreenShareStartedHandlerRef = useRef(onScreenShareStartedHandler);
+  onScreenShareStartedHandlerRef.current = onScreenShareStartedHandler;
+  const onScreenShareStoppedHandlerRef = useRef(onScreenShareStoppedHandler);
+  onScreenShareStoppedHandlerRef.current = onScreenShareStoppedHandler;
+
+  const iosScreenShareStarted = useIsIosScreenshareBroadcastStarted();
+  const prevIosScreenShareStarted = usePrevious(iosScreenShareStarted);
+
+  const localParticipant = useLocalParticipant();
+  const hasPublishedScreenShare = localParticipant?.publishedTracks.includes(
+    SfuModels.TrackType.SCREEN_SHARE,
+  );
+
+  // listens to iOS screen share broadcast started event
+  useEffect(() => {
+    const run = async () => {
+      if (Platform.OS !== 'ios') {
+        return;
+      }
+      if (iosScreenShareStarted && !prevIosScreenShareStarted) {
+        onScreenShareStartedHandlerRef.current?.();
+        const media = await navigator.mediaDevices.getDisplayMedia({
+          // @ts-ignore
+          deviceId: 'broadcast',
+          video: true,
+          audio: true,
+        });
+        await call?.publishScreenShareStream(media);
+      } else if (!iosScreenShareStarted && prevIosScreenShareStarted) {
+        onScreenShareStoppedHandlerRef.current?.();
+        await call?.stopPublish(SfuModels.TrackType.SCREEN_SHARE);
+      }
+    };
+    run();
+  }, [call, iosScreenShareStarted, prevIosScreenShareStarted]);
+
+  const screenCaptureRef = React.useRef(null);
+
+  const onPress = async () => {
+    if (Platform.OS === 'ios') {
+      const reactTag = findNodeHandle(screenCaptureRef.current);
+      await NativeModules.ScreenCapturePickerViewManager.show(reactTag);
+      // After this the iOS screen share broadcast started/stopped event will be triggered
+      // and the useEffect listener will handle the rest
+    } else {
+      if (!hasPublishedScreenShare) {
+        try {
+          const media = await navigator.mediaDevices.getDisplayMedia({
+            video: true,
+            audio: true,
+          });
+          onScreenShareStartedHandlerRef.current?.();
+          await call?.publishScreenShareStream(media);
+        } catch (e) {
+          // ignored.. user didnt allow the screen share in the popup
+        }
+      } else if (hasPublishedScreenShare) {
+        onScreenShareStoppedHandlerRef.current?.();
+        await call?.stopPublish(SfuModels.TrackType.SCREEN_SHARE);
+      }
+    }
+  };
+
+  return (
+    <CallControlsButton
+      disabled={!CanScreenShare}
+      onPress={onPress}
+      color={colors.static_white}
+      style={{
+        container: screenShareButton.container,
+        svgContainer: screenShareButton.svgContainer,
+      }}
+    >
+      <ScreenShare color={colors.static_black} />
+      {Platform.OS === 'ios' && (
+        <ScreenCapturePickerView ref={screenCaptureRef} />
+      )}
+    </CallControlsButton>
+  );
+};

package/src/components/Call/CallControls/index.tsx

@@ -12,3 +12,4 @@ export * from './CallControls';
 export * from './LobbyControls';
 export * from './IncomingCallControls';
 export * from './OutgoingCallControls';
+export * from './ScreenShareButton';

package/src/components/Call/CallParticipantsList/CallParticipantsList.tsx

@@ -8,7 +8,6 @@ import React, {
 import { FlatList, StyleProp, StyleSheet, ViewStyle } from 'react-native';
 
 import {
-  StreamVideoLocalParticipant,
   StreamVideoParticipant,
   StreamVideoParticipantPatches,
   VisibilityState,
@@ -24,7 +23,7 @@ import {
 import { CallContentProps } from '../CallContent';
 
 type FlatListProps = React.ComponentProps<
-  typeof FlatList<StreamVideoParticipant | StreamVideoLocalParticipant>
+  typeof FlatList<StreamVideoParticipant>
 >;
 
 const VIEWABILITY_CONFIG: FlatListProps['viewabilityConfig'] = {
@@ -48,7 +47,7 @@ export type CallParticipantsListProps = CallParticipantsListComponentProps &
     /**
      * The list of participants to display in the list
      */
-    participants: (StreamVideoParticipant | StreamVideoLocalParticipant)[];
+    participants: StreamVideoParticipant[];
     /**
      * The number of columns to display in the list of participants while in vertical or horizontal scrolling mode. This property is only used when there are more than 2 participants.
      * @default 2

package/src/components/Participant/ParticipantView/ParticipantLabel.tsx

@@ -1,6 +1,11 @@
 import React from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
-import { MicOff, PinVertical, ScreenShare, VideoSlash } from '../../../icons';
+import {
+  MicOff,
+  PinVertical,
+  ScreenShareIndicator,
+  VideoSlash,
+} from '../../../icons';
 import { useCall, useI18n } from '@stream-io/video-react-bindings';
 import { ComponentTestIds } from '../../../constants/TestIds';
 import { ParticipantViewProps } from './ParticipantView';
@@ -43,6 +48,7 @@ export const ParticipantLabel = ({
   const call = useCall();
   const { t } = useI18n();
   const participantName = name ?? userId;
+
   const participantLabel = isLocalParticipant ? t('You') : participantName;
   const isPinningEnabled = pin?.isLocalPin;
   const isAudioMuted = !publishedTracks.includes(SfuModels.TrackType.AUDIO);
@@ -53,6 +59,11 @@ export const ParticipantLabel = ({
   };
 
   if (trackType === 'screenShareTrack') {
+    const screenShareText = isLocalParticipant
+      ? t('You are sharing your screen')
+      : t('{{ userName }} is sharing their screen', {
+          userName: participantName,
+        });
     return (
       <View
         style={[
@@ -72,7 +83,7 @@ export const ParticipantLabel = ({
             screenShareIconContainer,
           ]}
         >
-          <ScreenShare color={colors.static_white} />
+          <ScreenShareIndicator color={colors.static_white} />
         </View>
         <Text
           style={[
@@ -83,9 +94,7 @@ export const ParticipantLabel = ({
           ]}
           numberOfLines={1}
         >
-          {t('{{ userName }} is sharing their screen', {
-            userName: participantLabel,
-          })}
+          {screenShareText}
         </Text>
       </View>
     );

package/src/components/Participant/ParticipantView/VideoRenderer.tsx

@@ -74,7 +74,9 @@ export const VideoRenderer = ({
   const videoStreamToRender = (isScreenSharing
     ? screenShareStream
     : videoStream) as unknown as MediaStream | undefined;
-  const mirror = isLocalParticipant && direction === 'front';
+
+  const mirror =
+    isLocalParticipant && !isScreenSharing && direction === 'front';
 
   /**
    * This effect updates the participant's viewportVisibilityState

package/src/constants/TestIds.ts

@@ -1,6 +1,7 @@
 export enum IconTestIds {
   MUTED_VIDEO = 'muted-video-icon',
   HANG_UP_CALL = 'hang-up-call-icon',
+  SCREEN_SHARE_INDICATOR = 'screen-share-indicator-icon',
   SCREEN_SHARE = 'screen-share-icon',
 }
 

package/src/hooks/index.ts

@@ -3,5 +3,6 @@ export * from './usePermissionRequest';
 export * from './usePermissionNotification';
 export * from './push';
 export * from './useAndroidKeepCallAliveEffect';
+export * from './useIsIosScreenshareBroadcastStarted';
 export * from './useIsInPiPMode';
 export * from './useAutoEnterPiPEffect';

package/src/hooks/useIsIosScreenshareBroadcastStarted.ts

@@ -0,0 +1,33 @@
+import { useEffect, useState } from 'react';
+import { NativeEventEmitter, NativeModules, Platform } from 'react-native';
+
+type Event = {
+  name: 'iOS_BroadcastStarted' | 'iOS_BroadcastStopped';
+};
+
+export function useIsIosScreenshareBroadcastStarted() {
+  const [hasStarted, setHasStarted] = useState(false);
+
+  useEffect(() => {
+    if (Platform.OS !== 'ios') {
+      return;
+    }
+
+    const eventEmitter = new NativeEventEmitter(
+      NativeModules.StreamVideoReactNative,
+    );
+
+    const subscription = eventEmitter.addListener(
+      'StreamVideoReactNative_Ios_Screenshare_Event',
+      (event: Event) => {
+        setHasStarted(event.name === 'iOS_BroadcastStarted');
+      },
+    );
+
+    return () => {
+      subscription.remove();
+    };
+  }, []);
+
+  return hasStarted;
+}

package/src/icons/ScreenShare.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import Svg, { Mask, Path } from 'react-native-svg';
+import Svg, { Path } from 'react-native-svg';
 import { ColorValue } from 'react-native/types';
 import { IconTestIds } from '../constants/TestIds';
 
@@ -9,25 +9,10 @@ type Props = {
 
 export const ScreenShare = ({ color }: Props) => {
   return (
-    <Svg viewBox="0 0 24 24" testID={IconTestIds.SCREEN_SHARE}>
-      <Mask id="path-1-inside-1_1396_84816">
-        <Path
-          fillRule="evenodd"
-          clipRule="evenodd"
-          d="M 2 6.68176 C 2 5.57719 2.89543 4.68176 4 4.68176 H 20 C 21.1046 4.68176 22 5.57719 22 6.68176 V 16.3181 C 22 17.4227 21.1046 18.3181 20 18.3181 H 4 C 2.89543 18.3181 2 17.4227 2 16.3181 V 6.68176 Z M 10.4209 11.5243 L 8.3635 11.5 L 11.9999 7.25755 L 15.6362 11.5 L 13.5065 11.5247 V 15.7424 L 10.4209 15.7424 V 11.5243 Z"
-        />
-      </Mask>
-
-      <Path
-        fill={color}
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M 2 6.68176 C 2 5.57719 2.89543 4.68176 4 4.68176 H 20 C 21.1046 4.68176 22 5.57719 22 6.68176 V 16.3181 C 22 17.4227 21.1046 18.3181 20 18.3181 H 4 C 2.89543 18.3181 2 17.4227 2 16.3181 V 6.68176 Z M 10.4209 11.5243 L 8.3635 11.5 L 11.9999 7.25755 L 15.6362 11.5 L 13.5065 11.5247 V 15.7424 L 10.4209 15.7424 V 11.5243 Z"
-      />
+    <Svg viewBox="0 0 36 36" testID={IconTestIds.SCREEN_SHARE}>
       <Path
-        mask="url(#path-1-inside-1_1396_84816)"
         fill={color}
-        d="M 8.3635 11.5 L 6.84499 10.1984 L 4.05865 13.4491 L 8.33982 13.4998 L 8.3635 11.5 Z M 10.4209 11.5243 H 12.4209 V 9.54789 L 10.4446 9.52449 L 10.4209 11.5243 Z M 11.9999 7.25755 L 13.5184 5.95597 L 11.9999 4.18437 L 10.4814 5.95597 L 11.9999 7.25755 Z M 15.6362 11.5 L 15.6594 13.4998 L 19.9419 13.4501 L 17.1547 10.1984 L 15.6362 11.5 Z M 13.5065 11.5247 L 13.4833 9.52483 L 11.5065 9.54778 V 11.5247 H 13.5065 Z M 13.5065 15.7424 L 13.5065 17.7424 L 15.5065 17.7424 V 15.7424 H 13.5065 Z M 10.4209 15.7424 H 8.42094 V 17.7424 H 10.4209 L 10.4209 15.7424 Z M 4 2.68176 C 1.79086 2.68176 0 4.47263 0 6.68176 H 4 V 6.68176 V 2.68176 Z M 20 2.68176 H 4 V 6.68176 H 20 V 2.68176 Z M 24 6.68176 C 24 4.47262 22.2091 2.68176 20 2.68176 V 6.68176 H 24 Z M 24 16.3181 V 6.68176 H 20 V 16.3181 H 24 Z M 20 20.3181 C 22.2091 20.3181 24 18.5273 24 16.3181 H 20 V 16.3181 V 20.3181 Z M 4 20.3181 H 20 V 16.3181 H 4 V 20.3181 Z M 0 16.3181 C 0 18.5273 1.79086 20.3181 4 20.3181 V 16.3181 H 4 H 0 Z M 0 6.68176 V 16.3181 H 4 V 6.68176 H 0 Z M 8.33982 13.4998 L 10.3973 13.5242 L 10.4446 9.52449 L 8.38719 9.50012 L 8.33982 13.4998 Z M 10.4814 5.95597 L 6.84499 10.1984 L 9.88202 12.8016 L 13.5184 8.55913 L 10.4814 5.95597 Z M 17.1547 10.1984 L 13.5184 5.95597 L 10.4814 8.55913 L 14.1177 12.8016 L 17.1547 10.1984 Z M 13.5297 13.5246 L 15.6594 13.4998 L 15.613 9.50011 L 13.4833 9.52483 L 13.5297 13.5246 Z M 11.5065 11.5247 V 15.7424 H 15.5065 V 11.5247 H 11.5065 Z M 13.5065 13.7424 L 10.4209 13.7424 L 10.4209 17.7424 L 13.5065 17.7424 L 13.5065 13.7424 Z M 12.4209 15.7424 V 11.5243 H 8.42094 V 15.7424 H 12.4209 Z"
+        d="m25.407 1.718-14.814-.014a2.959 2.959 0 0 0-2.948 2.963v26.666a2.959 2.959 0 0 0 2.948 2.963h14.814a2.972 2.972 0 0 0 2.963-2.963V4.667a2.96 2.96 0 0 0-2.963-2.949Zm0 26.652H10.593V7.63h14.814v20.74Zm-6.222-8.563V22.4l4.741-4.43-4.74-4.414v2.518c-4.608.637-6.445 3.793-7.112 6.963 1.645-2.222 3.822-3.23 7.111-3.23Z"
       />
     </Svg>
   );