From 6947ff49e044be9e8e7c7efd155899bd1d128b97 Mon Sep 17 00:00:00 2001
From: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Date: Fri, 10 Jan 2020 10:32:24 -0330
Subject: [PATCH] Convert AccountPanel component to ES6 class (#7775)

---
 ui/app/components/app/account-panel.js | 83 ++++++++++++--------------
 1 file changed, 38 insertions(+), 45 deletions(-)

diff --git a/ui/app/components/app/account-panel.js b/ui/app/components/app/account-panel.js
index 55d35b3c5..faf5f31f4 100644
--- a/ui/app/components/app/account-panel.js
+++ b/ui/app/components/app/account-panel.js
@@ -1,55 +1,48 @@
 import React, { Component } from 'react'
-import { inherits } from 'util'
 import Identicon from '../ui/identicon'
 import { addressSummary, formatBalance } from '../../helpers/utils/util'
 
-export default AccountPanel
+export default class AccountPanel extends Component {
+  render () {
+    const state = this.props
+    const identity = state.identity || {}
+    const account = state.account || {}
+    const isFauceting = state.isFauceting
 
+    const panelState = {
+      key: `accountPanel${identity.address}`,
+      identiconKey: identity.address,
+      identiconLabel: identity.name || '',
+      attributes: [
+        {
+          key: 'ADDRESS',
+          value: addressSummary(identity.address),
+        },
+        balanceOrFaucetingIndication(account, isFauceting),
+      ],
+    }
 
-inherits(AccountPanel, Component)
-function AccountPanel () {
-  Component.call(this)
-}
-
-AccountPanel.prototype.render = function () {
-  const state = this.props
-  const identity = state.identity || {}
-  const account = state.account || {}
-  const isFauceting = state.isFauceting
-
-  const panelState = {
-    key: `accountPanel${identity.address}`,
-    identiconKey: identity.address,
-    identiconLabel: identity.name || '',
-    attributes: [
-      {
-        key: 'ADDRESS',
-        value: addressSummary(identity.address),
-      },
-      balanceOrFaucetingIndication(account, isFauceting),
-    ],
+    return (
+      <div
+        className="identity-panel flex-row flex-space-between"
+        style={{ flex: '1 0 auto', cursor: panelState.onClick ? 'pointer' : undefined }}
+        onClick={panelState.onClick}
+      >
+        <div className="identicon-wrapper flex-column select-none">
+          <Identicon address={panelState.identiconKey} imageify={state.imageifyIdenticons} />
+          <span className="font-small">{panelState.identiconLabel.substring(0, 7) + '...'}</span>
+        </div>
+        <div className="identity-data flex-column flex-justify-center flex-grow select-none">
+          {panelState.attributes.map((attr, index) => (
+            <div className="flex-row flex-space-between" key={index}>
+              <label className="font-small no-select">{attr.key}</label>
+              <span className="font-small">{attr.value}</span>
+            </div>
+          ))}
+        </div>
+      </div>
+    )
   }
-
-  return (
-    <div
-      className="identity-panel flex-row flex-space-between"
-      style={{ flex: '1 0 auto', cursor: panelState.onClick ? 'pointer' : undefined }}
-      onClick={panelState.onClick}
-    >
-      <div className="identicon-wrapper flex-column select-none">
-        <Identicon address={panelState.identiconKey} imageify={state.imageifyIdenticons} />
-        <span className="font-small">{panelState.identiconLabel.substring(0, 7) + '...'}</span>
-      </div>
-      <div className="identity-data flex-column flex-justify-center flex-grow select-none">
-        {panelState.attributes.map((attr, index) => (
-          <div className="flex-row flex-space-between" key={index}>
-            <label className="font-small no-select">{attr.key}</label>
-            <span className="font-small">{attr.value}</span>
-          </div>
-        ))}
-      </div>
-    </div>
-  )
 }
 
 function balanceOrFaucetingIndication (account) {