Share identities via link (#775)

* LocalIdentities: add shareable functionality * LocalIdentities: cleanup prop type declarations * LocalIdentities: add memoization to handlers * LocalIdentities: improve sharing link * SaveLocalIdentities: add component * Wrapper: add save local identities modal * SaveLocalIdentities: add copy * LocalIdentities: add visual designs * SaveLocalIdentities: add visual designs * SaveLocalIdentities: add toast on save * SaveLocalIdentities: fix on save process * SaveLocalIdentities: split logic into independent components * SaveLocalIdentities: fix dependencies on callbacks * SaveLocalIdentities: fix dependencies on callbacks * LocalIdentities: add toast when copying link and hide modal after doing so * Wrapper: remove save local identities * SaveLocalIdentities: remove component * Hooks: add useEsc, useSharedLink and useSelected * SharedLabels: add component * Refactor preferences to render share labels & local identities * EmptyLocalIdentities: add name to function for debugging * LocalIdentities: add names to anon functions and fix prop types * SharedLocalIdentities: add loading ring when saving * LocalIdentities: align remove button to the left * Fix the base64 conversion with unicode characters * SharedLabels: improve copy Co-Authored-By: Brett Sun <qisheng.brett.sun@gmail.com> * SharedLabels: refactor code syntax Co-Authored-By: Brett Sun <qisheng.brett.sun@gmail.com> * LocalIdentities: add useSelected hook and pass down props * LocalIdentities: remove unnecessary styled component * Preferences: remove deps on useEsc * Preferences: add tabbed navigation at this level * LocalIdentities: remove tabbed navigation at this level * SharedLabels: add fancy quotes
aragon · May 16, 2019 · c7f2623 · c7f2623
1 parent a67a760
commit c7f2623
Show file tree

Hide file tree

Showing 6 changed files with 986 additions and 333 deletions.
diff --git a/src/components/Preferences/EmptyLocalIdentities.js b/src/components/Preferences/EmptyLocalIdentities.js
@@ -5,35 +5,39 @@ import { IdentityBadge, breakpoint } from '@aragon/ui'
 import { getEmptyAddress } from '../../web3-utils'
 import Import from './Import'
 
-const EmptyLocalIdentities = ({ onImport }) => (
-  <Wrap>
-    <Title>Start adding labels</Title>
-    <Paragraph>
-      You can add labels by clicking on the{' '}
-      <span
-        css={`
-          display: inline-flex;
-          margin-right: 2px;
-          vertical-align: text-bottom;
-          position: relative;
-          top: 3px;
-        `}
-      >
-        <IdentityBadge
-          entity={getEmptyAddress()}
-          customLabel="Address badge"
-          compact
-          badgeOnly
-        />
-      </span>
-      anywhere in the app, or importing a .json file with labels by clicking
-      "Import" below.
-    </Paragraph>
-    <WrapImport>
-      <Import onImport={onImport} />
-    </WrapImport>
-  </Wrap>
-)
+const EmptyLocalIdentities = React.memo(function EmptyLocalIdentities({
+  onImport,
+}) {
+  return (
+    <Wrap>
+      <Title>Start adding labels</Title>
+      <Paragraph>
+        You can add labels by clicking on the{' '}
+        <span
+          css={`
+            display: inline-flex;
+            margin-right: 2px;
+            vertical-align: text-bottom;
+            position: relative;
+            top: 3px;
+          `}
+        >
+          <IdentityBadge
+            entity={getEmptyAddress()}
+            customLabel="Address badge"
+            compact
+            badgeOnly
+          />
+        </span>
+        anywhere in the app, or importing a .json file with labels by clicking
+        "Import" below.
+      </Paragraph>
+      <WrapImport>
+        <Import onImport={onImport} />
+      </WrapImport>
+    </Wrap>
+  )
+})
 
 EmptyLocalIdentities.propTypes = {
   onImport: PropTypes.func.isRequired,