diff --git a/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js b/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js
index 008ae41cc9c..8e8d1a28da4 100644
--- a/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js
+++ b/packages/rn-tester/js/examples/Dimensions/DimensionsExample.js
@@ -8,38 +8,24 @@
  * @flow
  */
 
-import type {EventSubscription} from 'react-native/Libraries/vendor/emitter/EventEmitter';
 import {Dimensions, Text, useWindowDimensions} from 'react-native';
 import * as React from 'react';
+import {useState, useEffect} from 'react';
 
-class DimensionsSubscription extends React.Component<
-  {dim: string, ...},
-  {dims: Object, ...},
-> {
-  state: {dims: any, ...} = {
-    dims: Dimensions.get(this.props.dim),
-  };
+type Props = {dim: string};
 
-  _dimensionsSubscription: ?EventSubscription;
+function DimensionsSubscription(props: Props) {
+  const [dims, setDims] = useState(() => Dimensions.get(props.dim));
 
-  componentDidMount() {
-    this._dimensionsSubscription = Dimensions.addEventListener(
-      'change',
-      dimensions => {
-        this.setState({
-          dims: dimensions[this.props.dim],
-        });
-      },
-    );
-  }
+  useEffect(() => {
+    const subscription = Dimensions.addEventListener('change', dimensions => {
+      setDims(dimensions[props.dim]);
+    });
 
-  componentWillUnmount() {
-    this._dimensionsSubscription?.remove();
-  }
+    return () => subscription.remove();
+  }, [props.dim]);
 
-  render(): React.Node {
-    return <Text>{JSON.stringify(this.state.dims, null, 2)}</Text>;
-  }
+  return <Text>{JSON.stringify(dims, null, 2)}</Text>;
 }
 
 const DimensionsViaHook = () => {