From ceead23975e44c2a32e5db4525c0c956c787ffa1 Mon Sep 17 00:00:00 2001
From: Isaac Ezer <isaac.ezer@gmail.com>
Date: Fri, 30 Oct 2020 10:16:19 -0400
Subject: [PATCH] Sankey sorting (#269)

* remove deprecated refs definition

This old usage of defining refs via a string is deprecated and seems to break when debugging reactochart using `npm link` locally.

* add Sankey Sorting Function hooks

Co-authored-by: Isaac Ezer <isaace@spotify.com>
---
 src/SankeyDiagram.js | 10 ++++++++++
 src/ZoomContainer.js | 20 +++++++++++++++-----
 2 files changed, 25 insertions(+), 5 deletions(-)

diff --git a/src/SankeyDiagram.js b/src/SankeyDiagram.js
index 936f145e..adb8cc08 100644
--- a/src/SankeyDiagram.js
+++ b/src/SankeyDiagram.js
@@ -546,6 +546,10 @@ export default class SankeyDiagram extends React.Component {
      * or accessor function which returns a style object.
      */
     nodeStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
+    /**
+     * Node sort function
+     */
+    nodeSort: PropTypes.func,
     /**
      * Node `mouseenter` event handler, called when user's mouse enters a node.
      */
@@ -580,6 +584,10 @@ export default class SankeyDiagram extends React.Component {
      * or accessor function which returns a class (string).
      */
     linkClassName: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
+    /**
+     * Link sort function
+     */
+    linkSort: PropTypes.func,
     /**
      * Inline style object to be applied to each link,
      * or accessor function which returns a style object.
@@ -992,6 +1000,8 @@ export default class SankeyDiagram extends React.Component {
       .nodeId(props.nodeId)
       .nodeWidth(props.nodeWidth)
       .nodePadding(props.nodePadding)
+      .nodeSort(props.nodeSort)
+      .linkSort(props.linkSort)
       .nodeAlign(
         nodeAlignmentsByName[props.nodeAlignment] ||
           nodeAlignmentsByName.justify,
diff --git a/src/ZoomContainer.js b/src/ZoomContainer.js
index d84532e9..b832dda5 100644
--- a/src/ZoomContainer.js
+++ b/src/ZoomContainer.js
@@ -123,9 +123,14 @@ export default class ZoomContainer extends React.Component {
 
   state = { lastZoomTransform: null, selection: null };
 
+  constructor(props) {
+    super(props);
+    this.svgRef = React.createRef();
+  }
+
   componentDidMount() {
     const initialZoomTransform = zoomTransformFromProps(this.props);
-    const selection = d3.select(this.refs.svg);
+    const selection = d3.select(this.svgRef.current);
 
     this.zoom = d3.zoom();
     selection.call(this.zoom);
@@ -225,12 +230,17 @@ export default class ZoomContainer extends React.Component {
   }
 
   render() {
-    const zoomTransform = this.refs.svg
-      ? d3.zoomTransform(this.refs.svg)
-      : null;
+    const zoomTransform =
+      this.svgRef && this.svgRef.current
+        ? d3.zoomTransform(this.svgRef.current)
+        : null;
 
     return (
-      <svg ref="svg" width={this.props.width} height={this.props.height}>
+      <svg
+        ref={this.svgRef}
+        width={this.props.width}
+        height={this.props.height}
+      >
         <g
           width={this.props.width}
           height={this.props.height}