From 5d1ddcb90e4d295e5c21de125509f677b3780416 Mon Sep 17 00:00:00 2001
From: sheldon-welinga <sheldonwelinga@gmail.com>
Date: Sun, 20 Mar 2022 18:51:45 +0300
Subject: [PATCH] chore(docs): Add useGeolocation documentation

---
 README.md              | 19 +++++++++++++++++--
 docs/useFullScreen.md  |  2 +-
 docs/useGeolocation.md | 30 ++++++++++++++++++++++++++++++
 3 files changed, 48 insertions(+), 3 deletions(-)
 create mode 100644 docs/useGeolocation.md

diff --git a/README.md b/README.md
index e7a3e15..d8647c0 100644
--- a/README.md
+++ b/README.md
@@ -23,7 +23,7 @@ yarn add react-modern-hooks
 - [`useFetch`](./docs/useFetch.md) - Hook for fetching/refetching data from an API endpoint
 - [`useNetwork`](./docs/useNetwork.md) - Hook for getting the network status
 - [`useFullScreen`](./docs/useFullScreen.md) - Hook to toggle a given HTMLElement to fullscreen and exit fullscreen
-- `useGeolocation` - Hook to get a users current geographic location
+- [`useGeolocation`](./docs/useGeolocation.md) - Hook to get a users current geographic location
 - `useSelectedText` - Hook to get the highlighted text on a page
 - `useCopyToClipboad` - Hook to copy text to clipboad
 - `useStateCallback` - Hook that acts as a state callback i.e. functionality same as react class-based setState that provides a fallback with your current set state
@@ -77,7 +77,7 @@ import { useFullScreen } from 'react-modern-hooks';
 
 const App = () => {
   const ref = useRef(null);
-  const { fullScreen, open, close, toggle, error } = useFullScreen();
+  const { fullScreen, open, close, toggle, error } = useFullScreen(ref);
 
   return (
     <div>
@@ -90,3 +90,18 @@ const App = () => {
   );
 };
 ```
+
+### useGeolocation
+
+Hook to get a users current geographic location
+
+```jsx
+import { useGeolocation } from 'react-modern-hooks';
+
+const App = () => {
+  const ref = useRef(null);
+  const { longitude, latitude, location, userIP, country, city, region, error, loading } = useGeolocation();
+
+  return <div>Current city: {city}</div>;
+};
+```
diff --git a/docs/useFullScreen.md b/docs/useFullScreen.md
index 50c8ed7..2cf8b3b 100644
--- a/docs/useFullScreen.md
+++ b/docs/useFullScreen.md
@@ -9,7 +9,7 @@ import { useFullScreen } from 'react-modern-hooks';
 
 const App = () => {
   const ref = useRef(null);
-  const { fullScreen, open, close, toggle, error } = useFullScreen();
+  const { fullScreen, open, close, toggle, error } = useFullScreen(ref);
 
   return (
     <div>
diff --git a/docs/useGeolocation.md b/docs/useGeolocation.md
new file mode 100644
index 0000000..072a51c
--- /dev/null
+++ b/docs/useGeolocation.md
@@ -0,0 +1,30 @@
+# useGeolocation
+
+Hook to get a users current geographic location
+
+## Usage
+
+```jsx
+import { useGeolocation } from 'react-modern-hooks';
+
+const App = () => {
+  const ref = useRef(null);
+  const { longitude, latitude, location, userIP, country, city, region, error, loading } = useGeolocation();
+
+  return <div>Current city: {city}</div>;
+};
+```
+
+## References
+
+### Output Variables
+
+`location` - Location object with all users details <br/>
+`latitude` - Users latitude position<br/>
+`longitude` - Users longitude position<br/>
+`userIP` - Users IP address<br/>
+`city` - City the user is currently located<br/>
+`region` - Region the user is currently located<br/>
+`country` - Country the user is currently located<br/>
+`error` - Error occured during geolocating a users<br/>
+`loading` - Loading state when users location is still being fetched