From 5dd2f2e4b7669397f8bfa9b3845afee7e4e47626 Mon Sep 17 00:00:00 2001
From: David <4661784+retyui@users.noreply.github.com>
Date: Wed, 12 Oct 2022 13:05:35 -0700
Subject: [PATCH] fix: Update incorrect `SwitchChangeEvent` type (#34931)

Summary:
I noticed that typescript type for `onChange`  event of `<Switch/>` was incorrect

```tsx
<Switch
  onChange={(event) => {
    // TS
    event.value; // boolean
    event.nativeEvent.value; //TS2339: Property 'value' does not exist on type 'Event'.
    // JS
    console.log(event.nativeEvent); // {value:false,target:87}
    console.log(event.value); // undefined
  }}
/>
```

## Changelog

[General] [Changed] - Typescript: update incorrect `SwitchChangeEvent` type

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

Test Plan: ...

Reviewed By: lunaleaps

Differential Revision: D40240552

Pulled By: skinsshark

fbshipit-source-id: 4d39d547778de4ac4dc6c94471f05bfbe157d0e5
---
 .../Components/Switch/AndroidSwitchNativeComponent.js      | 7 ++++++-
 Libraries/Components/Switch/Switch.d.ts                    | 6 +++++-
 Libraries/Components/Switch/Switch.js                      | 1 +
 Libraries/Components/Switch/SwitchNativeComponent.js       | 7 ++++++-
 types/__typetests__/index.tsx                              | 2 +-
 5 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/Libraries/Components/Switch/AndroidSwitchNativeComponent.js b/Libraries/Components/Switch/AndroidSwitchNativeComponent.js
index 91a5951690de48..a31d7a0244abd5 100644
--- a/Libraries/Components/Switch/AndroidSwitchNativeComponent.js
+++ b/Libraries/Components/Switch/AndroidSwitchNativeComponent.js
@@ -10,7 +10,11 @@
 
 import type {HostComponent} from '../../Renderer/shims/ReactNativeTypes';
 import type {ColorValue} from '../../StyleSheet/StyleSheet';
-import type {BubblingEventHandler, WithDefault} from '../../Types/CodegenTypes';
+import type {
+  BubblingEventHandler,
+  Int32,
+  WithDefault,
+} from '../../Types/CodegenTypes';
 import type {ViewProps} from '../View/ViewPropTypes';
 
 import codegenNativeCommands from '../../Utilities/codegenNativeCommands';
@@ -19,6 +23,7 @@ import * as React from 'react';
 
 type SwitchChangeEvent = $ReadOnly<{|
   value: boolean,
+  target: Int32,
 |}>;
 
 type NativeProps = $ReadOnly<{|
diff --git a/Libraries/Components/Switch/Switch.d.ts b/Libraries/Components/Switch/Switch.d.ts
index 263c9845fe985a..ea52709c54d5e1 100644
--- a/Libraries/Components/Switch/Switch.d.ts
+++ b/Libraries/Components/Switch/Switch.d.ts
@@ -13,6 +13,7 @@ import {NativeMethods} from '../../Renderer/shims/ReactNativeTypes';
 import {ColorValue, StyleProp} from '../../StyleSheet/StyleSheet';
 import {ViewStyle} from '../../StyleSheet/StyleSheetTypes';
 import {ViewProps} from '../View/ViewPropTypes';
+import {NativeSyntheticEvent, TargetedEvent} from '../../Types/CoreEventTypes';
 
 export interface SwitchPropsIOS extends ViewProps {
   /**
@@ -37,10 +38,13 @@ export interface SwitchPropsIOS extends ViewProps {
   tintColor?: ColorValue | undefined;
 }
 
-export interface SwitchChangeEvent extends React.SyntheticEvent {
+export interface SwitchChangeEventData extends TargetedEvent {
   value: boolean;
 }
 
+export interface SwitchChangeEvent
+  extends NativeSyntheticEvent<SwitchChangeEventData> {}
+
 export interface SwitchProps extends SwitchPropsIOS {
   /**
    * Color of the foreground switch grip.
diff --git a/Libraries/Components/Switch/Switch.js b/Libraries/Components/Switch/Switch.js
index a25f60efcb9d2c..ea89d7aeee170f 100644
--- a/Libraries/Components/Switch/Switch.js
+++ b/Libraries/Components/Switch/Switch.js
@@ -27,6 +27,7 @@ import * as React from 'react';
 type SwitchChangeEvent = SyntheticEvent<
   $ReadOnly<{|
     value: boolean,
+    target: number,
   |}>,
 >;
 
diff --git a/Libraries/Components/Switch/SwitchNativeComponent.js b/Libraries/Components/Switch/SwitchNativeComponent.js
index 04d9cc83e20965..71bf14fb833feb 100644
--- a/Libraries/Components/Switch/SwitchNativeComponent.js
+++ b/Libraries/Components/Switch/SwitchNativeComponent.js
@@ -10,7 +10,11 @@
 
 import type {HostComponent} from '../../Renderer/shims/ReactNativeTypes';
 import type {ColorValue} from '../../StyleSheet/StyleSheet';
-import type {BubblingEventHandler, WithDefault} from '../../Types/CodegenTypes';
+import type {
+  BubblingEventHandler,
+  Int32,
+  WithDefault,
+} from '../../Types/CodegenTypes';
 import type {ViewProps} from '../View/ViewPropTypes';
 
 import codegenNativeCommands from '../../Utilities/codegenNativeCommands';
@@ -19,6 +23,7 @@ import * as React from 'react';
 
 type SwitchChangeEvent = $ReadOnly<{|
   value: boolean,
+  target: Int32,
 |}>;
 
 type NativeProps = $ReadOnly<{|
diff --git a/types/__typetests__/index.tsx b/types/__typetests__/index.tsx
index acf7713e18afa4..9e74cc4c675e95 100644
--- a/types/__typetests__/index.tsx
+++ b/types/__typetests__/index.tsx
@@ -1429,7 +1429,7 @@ const SwitchOnChangePromiseTest = () => (
   <Switch
     onChange={event => {
       const e: SwitchChangeEvent = event;
-      return new Promise(() => e.value);
+      return new Promise(() => e.nativeEvent.value);
     }}
   />
 );