From a96272e27eeee0c7a26e73bb32e55d3ef8d741aa Mon Sep 17 00:00:00 2001
From: Joe Vilches <joevilches@meta.com>
Date: Mon, 15 Jul 2024 16:09:43 -0700
Subject: [PATCH] Add drop-shadow test (#45306)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45306

Adding missing drop-shadow test to rn-tester.
Added with alpha-hotdog image to show we are creating the shadow with the alpha channel of the view.

Changelog: [Internal]

Reviewed By: cortinico

Differential Revision: D59410148

fbshipit-source-id: 5a03ee84313979f99585b8ca7e07abf9cdbe2396
---
 .../js/examples/Filter/FilterExample.js       | 36 +++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/packages/rn-tester/js/examples/Filter/FilterExample.js b/packages/rn-tester/js/examples/Filter/FilterExample.js
index 66324534372..36ed2d74c71 100644
--- a/packages/rn-tester/js/examples/Filter/FilterExample.js
+++ b/packages/rn-tester/js/examples/Filter/FilterExample.js
@@ -15,13 +15,19 @@ import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 import React from 'react';
 import {Image, StyleSheet, Text, View} from 'react-native';
 
+const alphaHotdog = require('../../assets/alpha-hotdog.png');
 const hotdog = require('../../assets/hotdog.jpg');
 
 type Props = $ReadOnly<{
   style: ViewStyleProp,
   testID?: string,
+  imageSource?: number,
 }>;
 
+const defaultProps = {
+  imageSource: hotdog,
+};
+
 function StaticViewAndImage(props: Props): React.Node {
   return (
     <>
@@ -40,12 +46,21 @@ function StaticViewAndImage(props: Props): React.Node {
         </View>
       </View>
       <View style={styles.container}>
-        <Image source={hotdog} style={[props.style, styles.commonImage]} />
-        <Image source={hotdog} style={styles.commonImage} />
+        <Image
+          source={props.imageSource}
+          style={[props.style, styles.commonImage]}
+          resizeMode="contain"
+        />
+        <Image
+          source={props.imageSource}
+          style={styles.commonImage}
+          resizeMode="contain"
+        />
       </View>
     </>
   );
 }
+StaticViewAndImage.defaultProps = defaultProps;
 
 function StaticViewAndImageWithState(props: Props): React.Node {
   const [s, setS] = React.useState(true);
@@ -195,6 +210,23 @@ exports.examples = [
       );
     },
   },
+  {
+    title: 'Drop Shadow',
+    description: 'drop-shadow(30px 10px 4px #4444dd)',
+    name: 'drop-shadow',
+    platform: 'android',
+    render(): React.Node {
+      return (
+        <StaticViewAndImage
+          style={{
+            experimental_filter: [{'drop-shadow': '30px 10px 4px #4444dd'}],
+          }}
+          testID="filter-test-drop-shadow"
+          imageSource={alphaHotdog}
+        />
+      );
+    },
+  },
   {
     title: 'Chained filters',
     description: 'brightness(1.5) opacity(0.5)',