diff --git a/src/short-urls/UseExistingIfFoundInfoIcon.js b/src/short-urls/UseExistingIfFoundInfoIcon.js
index e96457cb..7e155ac4 100644
--- a/src/short-urls/UseExistingIfFoundInfoIcon.js
+++ b/src/short-urls/UseExistingIfFoundInfoIcon.js
@@ -1,8 +1,9 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons';
 import { Modal, ModalBody, ModalHeader } from 'reactstrap';
 import './UseExistingIfFoundInfoIcon.scss';
+import { useToggle } from '../utils/utils';
 
 const renderInfoModal = (isOpen, toggle) => (
   <Modal isOpen={isOpen} toggle={toggle} centered size="lg">
@@ -40,8 +41,7 @@ const renderInfoModal = (isOpen, toggle) => (
 );
 
 const UseExistingIfFoundInfoIcon = () => {
-  const [ isModalOpen, setIsModalOpen ] = useState(false);
-  const toggleModal = () => setIsModalOpen(!isModalOpen);
+  const [ isModalOpen, toggleModal ] = useToggle(false);
 
   return (
     <React.Fragment>
diff --git a/src/utils/utils.js b/src/utils/utils.js
index a49cc604..c727965c 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -3,6 +3,7 @@ import marker2x from 'leaflet/dist/images/marker-icon-2x.png';
 import marker from 'leaflet/dist/images/marker-icon.png';
 import markerShadow from 'leaflet/dist/images/marker-shadow.png';
 import { range } from 'ramda';
+import { useState } from 'react';
 
 const TEN_ROUNDING_NUMBER = 10;
 const DEFAULT_TIMEOUT_DELAY = 2000;
@@ -44,3 +45,9 @@ export const fixLeafletIcons = () => {
 export const rangeOf = (size, mappingFn, startAt = 1) => range(startAt, size + 1).map(mappingFn);
 
 export const roundTen = (number) => ceil(number / TEN_ROUNDING_NUMBER) * TEN_ROUNDING_NUMBER;
+
+export const useToggle = (initialValue = false) => {
+  const [ flag, setFlag ] = useState(initialValue);
+
+  return [ flag, () => setFlag(!flag) ];
+};