Obtain Variable name for Hook

[saphal1998]

Main Issue: #38

The Devtools backend returns the following element response as a part of the InspectedElement message call

const inspectedElement = {"canEditFunctionProps":true,"canEditFunctionPropsDeletePaths":true,"canEditFunctionPropsRenamePaths":true,"canEditHooks":true,"canEditHooksAndDeletePaths":true,"canEditHooksAndRenamePaths":true,"canToggleSuspense":true,"canViewSource":true,"hasLegacyContext":false,"id":3,"key":null,"rendererPackageName":"react-dom","rendererVersion":"17.0.1","rootType":"createLegacyRoot()","source":{"fileName":"/Users/saphal/Developer/personal/sample-app/src/App.js","lineNumber":28,"columnNumber":9},"type":5,"owners":[{"displayName":"App","id":2,"type":5,"hocDisplayNames":null}],"context":null,"hooks":[{"id":0,"isStateEditable":true,"name":"State","value":0,"subHooks":[]}],"props":{},"state":null}

The fileName, lineNumber and columnNumber property suggest that the Devtools backend has access to the source map. This implies that it might be possible to obtain the variable name here.

NOTE: This issue is a big one! 🐳 We need to break this down further.