cleanup

lib/package.json

@@ -11,10 +11,9 @@
 		"styled-components": "^4.3.1"
   },
   "peerDependencies": {
-    "@react-native-community/async-storage": "^1.5.0",
 		"prop-types": "^15.6.0",
-		"react": "16.8.3",
-		"react-native": "0.59.8"
+		"react": "^16.8.3",
+		"react-native": "^0.59.8"
   },
   "devDependencies": {}
 }

lib/src/components/DevTool/Requests/Details.js

@@ -72,11 +72,19 @@ const Data = ({
         <Cell left="Method" right={method} />
         <Cell left="Url" right={url} />
         <CellHeader>Response Headers</CellHeader>
-        <Indented><Fixed>{requestHeaders}</Fixed></Indented>
-        {headerInfo && (
+        <Indented>
+          <Fixed>
+            {requestHeaders}
+          </Fixed>
+        </Indented>
+        {headerInfo.length > 0 && (
           <Fragment>
             <CellHeader>Request Headers</CellHeader>
-            <Indented><Fixed selectable={true}>{headerInfo}</Fixed></Indented>
+            <Indented>
+              <Fixed selectable={true}>
+                {headerInfo}
+              </Fixed>
+            </Indented>
           </Fragment>
         )}
         {args[0] && (

lib/src/components/DevTool/Storage/index.js

@@ -13,10 +13,12 @@ const Wrapper = styled.View`
   flex: 1;
 `;
 
-const StorageView = () => (
+const StorageView = ({
+  provider,
+}) => (
   <State>
     {({ selected }, setState) => (
-      <Storage>
+      <Storage provider={provider}>
         {(data, update, removeItem, clear) => (
           <Wrapper>
             <Toolbar>

lib/src/components/DevTool/index.js

@@ -23,9 +23,9 @@ const DevTool = ({
   includeStackTrace,
   onClose,
   showNetwork = true,
-  showStorage = true,
   showConsole = true,
   additionalTools = [],
+  storage,
 }) => {
   const views = [];
 
@@ -45,10 +45,10 @@ const DevTool = ({
     });
   }
 
-  if (showStorage) {
+  if (storage) {
     views.push({
       name: 'Storage',
-      view: <Storage />,
+      view: <Storage provider={storage} />,
     });
   }
 

lib/src/components/base/Toolbar/Selector.js

@@ -51,6 +51,7 @@ const Selector = ({
             />
             {options.map((option) => (
               <TouchableOpacity
+                key={option.name}
                 onPress={() => {
                   if (!multiSelect) {
                     options.forEach(o => o.selected = false);

lib/src/components/data/Storage.js

@@ -1,5 +1,4 @@
 import { Component } from 'react';
-import AsyncStorage from '@react-native-community/async-storage';
 
 class Storage extends Component {
   constructor() {
@@ -17,19 +16,19 @@ class Storage extends Component {
   }
 
   async removeItem(name) {
-    await AsyncStorage.removeItem(name);
+    await this.props.provider.removeItem(name);
     await this.update();
   }
 
   async clear() {
-    await AsyncStorage.clear();
+    await this.props.provider.clear();
     await this.update();
   }
 
   async update() {
     try {
-      const keys = await AsyncStorage.getAllKeys();
-      const values = await Promise.all(keys.map(key => AsyncStorage.getItem(key)));
+      const keys = await this.props.provider.getAllKeys();
+      const values = await Promise.all(keys.map(key => this.props.provider.getItem(key)));
       const data = {};
       for (let i = 0; i < keys.length; i++) {
         const key = keys[i];

lib/src/console.js

@@ -1,8 +1,6 @@
 import log from './log';
-import AsyncStorage from '@react-native-community/async-storage';
 
 export const context = {
-  storage: AsyncStorage,
   log: (...args) => console.log(...args),
   clear: log.clear,
 };