Added export-log icon. Removed unnecessary variable assignment.

src/devtools/views/ButtonIcon.js

@@ -56,7 +56,7 @@ export default function ButtonIcon({ type }: Props) {
       pathData = PATH_IMPORT;
       break;
     case 'log-data':
-      pathData = PATH_EXPORT; // TODO: real icon
+      pathData = PATH_LOG_DATA;
       break;
     case 'more':
       pathData = PATH_MORE;
@@ -134,6 +134,13 @@ const PATH_FILTER = 'M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z';
 
 const PATH_IMPORT = 'M8.18,18.13v-7H3l9-8.95,9,9H15.82v7ZM3,20.13H21v1.73H3Z';
 
+const PATH_LOG_DATA = `
+  M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41
+  3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04
+  1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6
+  8h-4v-2h4v2zm0-4h-4v-2h4v2z
+`;
+
 const PATH_MORE = `
   M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 
   2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z

src/devtools/views/Components/SelectedElement.js

@@ -39,14 +39,13 @@ export default function SelectedElement(_: Props) {
   const inspectedElement = useInspectedElement(selectedElementID);
 
   const highlightElement = useCallback(() => {
-    const id = selectedElementID;
-    if (element !== null && id !== null) {
-      const rendererID = store.getRendererIDForElement(id);
+    if (element !== null && selectedElementID !== null) {
+      const rendererID = store.getRendererIDForElement(selectedElementID);
       if (rendererID !== null) {
         bridge.send('highlightElementInDOM', {
           displayName: element.displayName,
           hideAfterTimeout: true,
-          id,
+          id: selectedElementID,
           rendererID,
           scrollIntoView: true,
         });
@@ -55,12 +54,11 @@ export default function SelectedElement(_: Props) {
   }, [bridge, element, selectedElementID, store]);
 
   const logElement = useCallback(() => {
-    const id = selectedElementID;
-    if (id !== null) {
-      const rendererID = store.getRendererIDForElement(id);
+    if (selectedElementID !== null) {
+      const rendererID = store.getRendererIDForElement(selectedElementID);
       if (rendererID !== null) {
         bridge.send('logElementToConsole', {
-          id,
+          id: selectedElementID,
           rendererID,
         });
       }

src/devtools/views/Components/types.js

@@ -35,6 +35,8 @@ export type Owner = {|
 export type InspectedElement = {|
   id: number,
 
+  displayName: string | null,
+
   // Does the current renderer support editable hooks?
   canEditHooks: boolean,
 
@@ -58,8 +60,6 @@ export type InspectedElement = {|
 
   // Location of component in source coude.
   source: Object | null,
-
-  displayName: string | null,
 |};
 
 // TODO: Add profiling type