Small Improvements (#136)

* fix javascript error

* check if timings exists before accessing its properties

* revert status change

src/Components/Import/ImportHAR.jsx

@@ -13,16 +13,14 @@ const DROP_FILE_CONFIG = {
   multiple: false,
 };
 
-const ImportHar = ({ showButton, className }) => {
+const ImportHar = ({
+  showButton,
+  className,
+}) => {
   const { actions } = useNetwork();
   const { updateErrorMessage } = actions;
 
-  const prepareData = (newNetworkData) => (
-    actions.updateData({
-      entries: newNetworkData.log.entries,
-      pages: newNetworkData.log.pages,
-    })
-  );
+  const prepareData = (newNetworkData) => actions.updateData(newNetworkData);
 
   const onDrop = (files) => {
     const reader = new FileReader();
@@ -39,7 +37,10 @@ const ImportHar = ({ showButton, className }) => {
     reader.readAsText(files[0]);
   };
 
-  const { getRootProps, getInputProps } = useDropzone({
+  const {
+    getRootProps,
+    getInputProps,
+  } = useDropzone({
     ...DROP_FILE_CONFIG,
     onDrop,
   });
@@ -49,7 +50,12 @@ const ImportHar = ({ showButton, className }) => {
       <input {...getInputProps()} />
       {showButton ?
         (<ImportHarButton />) :
-        (<p className={Styles['drag-drop']}>Drag and drop HAR file here, or click to select file</p>)}
+        (
+          <p className={Styles['drag-drop']}>
+            Drag and drop HAR file here, or click to select
+            file
+          </p>
+        )}
     </div>
   );
 };

src/utils.js

@@ -164,19 +164,23 @@ export const sortHeaders = (current, next) => {
   return current.name > next.name ? 1 : 0;
 };
 
-export const getHeaders = (entry) => ({
-  request: entry.request.headers.sort(sortHeaders),
-  response: entry.response.headers.sort(sortHeaders),
-  queryString: entry.request.queryString,
-  postData: entry.request.postData,
-});
+export const getHeaders = (entry) => {
+  const requestHeaders = [...entry.request.headers];
+  const responseHeaders = [...entry.response.headers];
+  return {
+    request: requestHeaders.sort(sortHeaders),
+    response: responseHeaders.sort(sortHeaders),
+    queryString: entry.request.queryString,
+    postData: entry.request.postData,
+  };
+};
 
 export const getTotalTimeOfEntry = ({
   startedDateTime,
   time,
   timings,
 }) => (
-  new Date(startedDateTime).getTime() + time + (timings._blocked_queueing || timings._queued || 0)
+  new Date(startedDateTime).getTime() + time + (timings?._blocked_queueing || timings?._queued || 0)
 );
 
 export const getInterceptError = ({ response }) => (