From c0ffc65609dca6ee6b9af1025c1eba747f036335 Mon Sep 17 00:00:00 2001
From: Mikael Sand <msand@abo.fi>
Date: Mon, 9 Dec 2019 21:26:14 +0200
Subject: [PATCH] chore: refactor props and styles extraction

---
 src/elements/Circle.tsx         |  4 ++--
 src/elements/ClipPath.tsx       |  7 ++-----
 src/elements/Ellipse.tsx        |  4 ++--
 src/elements/Image.tsx          |  4 ++--
 src/elements/Line.tsx           |  4 ++--
 src/elements/Mask.tsx           |  4 ++--
 src/elements/Path.tsx           |  8 ++------
 src/elements/Rect.tsx           | 11 ++---------
 src/elements/TextPath.tsx       | 11 ++---------
 src/elements/Use.tsx            |  4 ++--
 src/lib/extract/extractProps.ts | 11 +++++++++++
 11 files changed, 31 insertions(+), 41 deletions(-)

diff --git a/src/elements/Circle.tsx b/src/elements/Circle.tsx
index 9199f310..a3c2c503 100644
--- a/src/elements/Circle.tsx
+++ b/src/elements/Circle.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { extract } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import Shape from './Shape';
 
@@ -23,7 +23,7 @@ export default class Circle extends Shape<{
     return (
       <RNSVGCircle
         ref={this.refMethod}
-        {...extractProps(propsAndStyles(props), this)}
+        {...extract(this, props)}
         cx={cx}
         cy={cy}
         r={r}
diff --git a/src/elements/ClipPath.tsx b/src/elements/ClipPath.tsx
index 9af66729..47fe7433 100644
--- a/src/elements/ClipPath.tsx
+++ b/src/elements/ClipPath.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { extract } from '../lib/extract/extractProps';
 import Shape from './Shape';
 
 export default class ClipPath extends Shape<{}> {
@@ -9,10 +9,7 @@ export default class ClipPath extends Shape<{}> {
   render() {
     const { props } = this;
     return (
-      <RNSVGClipPath
-        ref={this.refMethod}
-        {...extractProps(propsAndStyles(props), this)}
-      >
+      <RNSVGClipPath ref={this.refMethod} {...extract(this, props)}>
         {props.children}
       </RNSVGClipPath>
     );
diff --git a/src/elements/Ellipse.tsx b/src/elements/Ellipse.tsx
index dd5913b9..bb31d45c 100644
--- a/src/elements/Ellipse.tsx
+++ b/src/elements/Ellipse.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { extract } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import Shape from './Shape';
 
@@ -25,7 +25,7 @@ export default class Ellipse extends Shape<{
     return (
       <RNSVGEllipse
         ref={this.refMethod}
-        {...extractProps(propsAndStyles(props), this)}
+        {...extract(this, props)}
         cx={cx}
         cy={cy}
         rx={rx}
diff --git a/src/elements/Image.tsx b/src/elements/Image.tsx
index 7dc6d95b..99b09098 100644
--- a/src/elements/Image.tsx
+++ b/src/elements/Image.tsx
@@ -5,7 +5,7 @@ import {
   requireNativeComponent,
 } from 'react-native';
 import { meetOrSliceTypes, alignEnum } from '../lib/extract/extractViewBox';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { withoutXY } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import Shape from './Shape';
 
@@ -50,7 +50,7 @@ export default class SvgImage extends Shape<{
     return (
       <RNSVGImage
         ref={this.refMethod}
-        {...extractProps({ ...propsAndStyles(props), x: null, y: null }, this)}
+        {...withoutXY(this, props)}
         x={x}
         y={y}
         width={width}
diff --git a/src/elements/Line.tsx b/src/elements/Line.tsx
index b35f419a..2ddf1a99 100644
--- a/src/elements/Line.tsx
+++ b/src/elements/Line.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { extract } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import Shape from './Shape';
 
@@ -25,7 +25,7 @@ export default class Line extends Shape<{
     return (
       <RNSVGLine
         ref={this.refMethod}
-        {...extractProps(propsAndStyles(props), this)}
+        {...extract(this, props)}
         x1={x1}
         y1={y1}
         x2={x2}
diff --git a/src/elements/Mask.tsx b/src/elements/Mask.tsx
index e40aefb5..63515a5e 100644
--- a/src/elements/Mask.tsx
+++ b/src/elements/Mask.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
 import extractTransform from '../lib/extract/extractTransform';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { withoutXY } from '../lib/extract/extractProps';
 import { NumberProp, TransformProps } from '../lib/extract/types';
 import units from '../lib/units';
 import Shape from './Shape';
@@ -41,7 +41,7 @@ export default class Mask extends Shape<{
     return (
       <RNSVGMask
         ref={this.refMethod}
-        {...extractProps({ ...propsAndStyles(props), x: null, y: null }, this)}
+        {...withoutXY(this, props)}
         x={x}
         y={y}
         width={width}
diff --git a/src/elements/Path.tsx b/src/elements/Path.tsx
index 28832ce9..1f9df65e 100644
--- a/src/elements/Path.tsx
+++ b/src/elements/Path.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { extract } from '../lib/extract/extractProps';
 import Shape from './Shape';
 
 export default class Path extends Shape<{
@@ -11,11 +11,7 @@ export default class Path extends Shape<{
   render() {
     const { props } = this;
     return (
-      <RNSVGPath
-        ref={this.refMethod}
-        {...extractProps(propsAndStyles(props), this)}
-        d={props.d}
-      />
+      <RNSVGPath ref={this.refMethod} {...extract(this, props)} d={props.d} />
     );
   }
 }
diff --git a/src/elements/Rect.tsx b/src/elements/Rect.tsx
index 7856e449..07bfe43b 100644
--- a/src/elements/Rect.tsx
+++ b/src/elements/Rect.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { withoutXY } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import Shape from './Shape';
 
@@ -27,14 +27,7 @@ export default class Rect extends Shape<{
     return (
       <RNSVGRect
         ref={this.refMethod}
-        {...extractProps(
-          {
-            ...propsAndStyles(props),
-            x: null,
-            y: null,
-          },
-          this,
-        )}
+        {...withoutXY(this, props)}
         x={x}
         y={y}
         width={width}
diff --git a/src/elements/TextPath.tsx b/src/elements/TextPath.tsx
index e6272707..54c68c25 100644
--- a/src/elements/TextPath.tsx
+++ b/src/elements/TextPath.tsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { requireNativeComponent } from 'react-native';
 import extractTransform from '../lib/extract/extractTransform';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { withoutXY } from '../lib/extract/extractProps';
 import { NumberProp, TransformProps } from '../lib/extract/types';
 import extractText from '../lib/extract/extractText';
 import { idPattern, pickNotNil } from '../lib/util';
@@ -51,14 +51,7 @@ export default class TextPath extends Shape<{
     const matched = href && href.match(idPattern);
     const match = matched && matched[1];
     if (match) {
-      const props = extractProps(
-        {
-          ...propsAndStyles(prop),
-          x: null,
-          y: null,
-        },
-        this,
-      );
+      const props = withoutXY(this, prop);
       Object.assign(
         props,
         extractText(
diff --git a/src/elements/Use.tsx b/src/elements/Use.tsx
index c24fbc42..a554e26f 100644
--- a/src/elements/Use.tsx
+++ b/src/elements/Use.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { requireNativeComponent } from 'react-native';
-import extractProps, { propsAndStyles } from '../lib/extract/extractProps';
+import { withoutXY } from '../lib/extract/extractProps';
 import { NumberProp } from '../lib/extract/types';
 import { idPattern } from '../lib/util';
 import Shape from './Shape';
@@ -48,7 +48,7 @@ export default class Use extends Shape<{
     return (
       <RNSVGUse
         ref={this.refMethod}
-        {...extractProps({ ...propsAndStyles(props), x: null, y: null }, this)}
+        {...withoutXY(this, props)}
         href={match}
         x={x}
         y={y}
diff --git a/src/lib/extract/extractProps.ts b/src/lib/extract/extractProps.ts
index d7253134..bdc3a475 100644
--- a/src/lib/extract/extractProps.ts
+++ b/src/lib/extract/extractProps.ts
@@ -149,3 +149,14 @@ export default function extractProps(
 
   return extracted;
 }
+
+export function extract(instance: Object, props: Object & { style?: [] | {} }) {
+  return extractProps(propsAndStyles(props), instance);
+}
+
+export function withoutXY(
+  instance: Object,
+  props: Object & { style?: [] | {} },
+) {
+  return extractProps({ ...propsAndStyles(props), x: null, y: null }, instance);
+}