test(suite): test new device renders

packages/components/src/components/animations/DeviceAnimation.tsx

@@ -55,7 +55,9 @@ export const DeviceAnimation = forwardRef<HTMLVideoElement, DeviceAnimationProps
 
         // Animations on following devices are transparent.
         const themeSuffix = [
+            DeviceModelInternal.T1B1,
             DeviceModelInternal.T2B1,
+            DeviceModelInternal.T2T1,
             DeviceModelInternal.T3B1,
             DeviceModelInternal.T3T1,
             DeviceModelInternal.T3W1,

packages/product-components/src/components/RotateDeviceImage/RotateDeviceImage.tsx

@@ -1,8 +1,6 @@
 import React from 'react';
 
-import styled from 'styled-components';
-
-import { DeviceAnimation, Image } from '@trezor/components';
+import { DeviceAnimation } from '@trezor/components';
 import { DeviceModelInternal } from '@trezor/connect';
 
 export type RotateDeviceImageProps = {
@@ -13,12 +11,6 @@ export type RotateDeviceImageProps = {
     animationWidth?: string;
 };
 
-// eslint-disable-next-line local-rules/no-override-ds-component
-const StyledImage = styled(Image)`
-    /* do not apply the darkening filter in dark mode on device images */
-    filter: none;
-`;
-
 export const RotateDeviceImage = ({
     deviceModel,
     deviceColor,
@@ -30,32 +22,14 @@ export const RotateDeviceImage = ({
         return null;
     }
 
-    const isDeviceImageRotating =
-        deviceModel &&
-        [DeviceModelInternal.T2B1, DeviceModelInternal.T3B1, DeviceModelInternal.T3T1].includes(
-            deviceModel,
-        );
-
     return (
-        <>
-            {isDeviceImageRotating ? (
-                <DeviceAnimation
-                    className={className}
-                    type="ROTATE"
-                    deviceModelInternal={deviceModel}
-                    deviceUnitColor={deviceColor}
-                    height={animationHeight}
-                    width={animationWidth}
-                />
-            ) : (
-                <StyledImage
-                    width={animationWidth}
-                    height={animationHeight}
-                    alt="Trezor"
-                    image={`TREZOR_${deviceModel}`}
-                    className={className}
-                />
-            )}
-        </>
+        <DeviceAnimation
+            className={className}
+            type="ROTATE"
+            deviceModelInternal={deviceModel}
+            deviceUnitColor={deviceColor}
+            height={animationHeight}
+            width={animationWidth}
+        />
     );
 };