From 2b4fba3ad8e8d523c838c8158181b5d4f3ae5ddb Mon Sep 17 00:00:00 2001
From: Dylan Vann <dylan@dylanvann.com>
Date: Mon, 25 Feb 2019 01:40:39 -0500
Subject: [PATCH] feat: Use forwardRef to allow access to ref.measure and
 others. (#419)

This uses forwardRef to allow access to the View that wraps the native FastImage component.

closes #69
---
 src/index.js | 32 +++++++++++++-------------------
 1 file changed, 13 insertions(+), 19 deletions(-)

diff --git a/src/index.js b/src/index.js
index f8e42b628..ea2187e98 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react'
+import React, { forwardRef } from 'react'
 import PropTypes from 'prop-types'
 import {
     View,
@@ -11,15 +11,9 @@ import {
 
 const FastImageViewNativeModule = NativeModules.FastImageView
 
-class FastImage extends Component {
-    setNativeProps(nativeProps) {
-        this._root.setNativeProps(nativeProps)
-    }
-
-    captureRef = e => (this._root = e)
-
-    render() {
-        const {
+const FastImage = forwardRef(
+    (
+        {
             source,
             onLoadStart,
             onProgress,
@@ -30,16 +24,14 @@ class FastImage extends Component {
             children,
             fallback,
             ...props
-        } = this.props
-
+        },
+        ref,
+    ) => {
         const resolvedSource = Image.resolveAssetSource(source)
 
         if (fallback) {
             return (
-                <View
-                    style={[styles.imageContainer, style]}
-                    ref={this.captureRef}
-                >
+                <View style={[styles.imageContainer, style]} ref={ref}>
                     <Image
                         {...props}
                         style={StyleSheet.absoluteFill}
@@ -56,7 +48,7 @@ class FastImage extends Component {
         }
 
         return (
-            <View style={[styles.imageContainer, style]} ref={this.captureRef}>
+            <View style={[styles.imageContainer, style]} ref={ref}>
                 <FastImageView
                     {...props}
                     style={StyleSheet.absoluteFill}
@@ -70,8 +62,10 @@ class FastImage extends Component {
                 {children}
             </View>
         )
-    }
-}
+    },
+)
+
+FastImage.displayName = 'FastImage'
 
 const styles = StyleSheet.create({
     imageContainer: {