hideSidebar()}>
diff --git a/src/servers/DeleteServerButton.js b/src/servers/DeleteServerButton.js
index e50610bc..23cab6e4 100644
--- a/src/servers/DeleteServerButton.js
+++ b/src/servers/DeleteServerButton.js
@@ -1,7 +1,8 @@
-import React, { useState } from 'react';
+import React from 'react';
import { faMinusCircle as deleteIcon } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import PropTypes from 'prop-types';
+import { useToggle } from '../utils/helpers/hooks';
import { serverType } from './prop-types';
const propTypes = {
@@ -13,16 +14,16 @@ const propTypes = {
const DeleteServerButton = (DeleteServerModal) => {
const DeleteServerButtonComp = ({ server, className, children, textClassName }) => {
- const [ isModalOpen, setModalOpen ] = useState(false);
+ const [ isModalOpen, , showModal, hideModal ] = useToggle();
return (
- setModalOpen(true)}>
+
{!children && }
{children || 'Remove this server'}
- setModalOpen(!isModalOpen)} />
+
);
};
diff --git a/src/short-urls/CreateShortUrl.js b/src/short-urls/CreateShortUrl.js
index 32544d9e..d2ee0cae 100644
--- a/src/short-urls/CreateShortUrl.js
+++ b/src/short-urls/CreateShortUrl.js
@@ -36,7 +36,7 @@ const CreateShortUrl = (TagsSelector, CreateShortUrlResult, ForServerVersion) =>
maxVisits: undefined,
findIfExists: false,
});
- const [ moreOptionsVisible, toggleMoreOptionsVisible ] = useToggle(false);
+ const [ moreOptionsVisible, toggleMoreOptionsVisible ] = useToggle();
const changeTags = (tags) => setShortUrlCreation({ ...shortUrlCreation, tags: tags.map(normalizeTag) });
const renderOptionalInput = (id, placeholder, type = 'text', props = {}) => (
diff --git a/src/short-urls/UseExistingIfFoundInfoIcon.js b/src/short-urls/UseExistingIfFoundInfoIcon.js
index cfbd2c54..803d4b23 100644
--- a/src/short-urls/UseExistingIfFoundInfoIcon.js
+++ b/src/short-urls/UseExistingIfFoundInfoIcon.js
@@ -38,7 +38,7 @@ const renderInfoModal = (isOpen, toggle) => (
);
const UseExistingIfFoundInfoIcon = () => {
- const [ isModalOpen, toggleModal ] = useToggle(false);
+ const [ isModalOpen, toggleModal ] = useToggle();
return (
diff --git a/src/short-urls/helpers/ShortUrlsRowMenu.js b/src/short-urls/helpers/ShortUrlsRowMenu.js
index fe490cc8..ae6dc1e7 100644
--- a/src/short-urls/helpers/ShortUrlsRowMenu.js
+++ b/src/short-urls/helpers/ShortUrlsRowMenu.js
@@ -26,13 +26,13 @@ const propTypes = {
const ShortUrlsRowMenu = (DeleteShortUrlModal, EditTagsModal, EditMetaModal, EditShortUrlModal, ForServerVersion) => {
const ShortUrlsRowMenuComp = ({ shortUrl, selectedServer }) => {
- const [ isOpen, toggle ] = useToggle(false);
- const [ isQrModalOpen, toggleQrCode ] = useToggle(false);
- const [ isPreviewModalOpen, togglePreview ] = useToggle(false);
- const [ isTagsModalOpen, toggleTags ] = useToggle(false);
- const [ isMetaModalOpen, toggleMeta ] = useToggle(false);
- const [ isDeleteModalOpen, toggleDelete ] = useToggle(false);
- const [ isEditModalOpen, toggleEdit ] = useToggle(false);
+ const [ isOpen, toggle ] = useToggle();
+ const [ isQrModalOpen, toggleQrCode ] = useToggle();
+ const [ isPreviewModalOpen, togglePreview ] = useToggle();
+ const [ isTagsModalOpen, toggleTags ] = useToggle();
+ const [ isMetaModalOpen, toggleMeta ] = useToggle();
+ const [ isDeleteModalOpen, toggleDelete ] = useToggle();
+ const [ isEditModalOpen, toggleEdit ] = useToggle();
const completeShortUrl = shortUrl && shortUrl.shortUrl ? shortUrl.shortUrl : '';
return (
diff --git a/src/utils/helpers/hooks.js b/src/utils/helpers/hooks.js
index 3eef15b5..81a60517 100644
--- a/src/utils/helpers/hooks.js
+++ b/src/utils/helpers/hooks.js
@@ -12,8 +12,9 @@ export const useStateFlagTimeout = (setTimeout) => (initialValue = true, delay =
return [ flag, callback ];
};
+// Return [ flag, toggle, enable, disable ]
export const useToggle = (initialValue = false) => {
const [ flag, setFlag ] = useState(initialValue);
- return [ flag, () => setFlag(!flag) ];
+ return [ flag, () => setFlag(!flag), () => setFlag(true), () => setFlag(false) ];
};
diff --git a/src/visits/helpers/OpenMapModalBtn.js b/src/visits/helpers/OpenMapModalBtn.js
index 5d3ec58b..fab798c3 100644
--- a/src/visits/helpers/OpenMapModalBtn.js
+++ b/src/visits/helpers/OpenMapModalBtn.js
@@ -3,6 +3,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faMapMarkedAlt as mapIcon } from '@fortawesome/free-solid-svg-icons';
import { Dropdown, DropdownItem, DropdownMenu, UncontrolledTooltip } from 'reactstrap';
import * as PropTypes from 'prop-types';
+import { useToggle } from '../../utils/helpers/hooks';
import './OpenMapModalBtn.scss';
const propTypes = {
@@ -13,26 +14,25 @@ const propTypes = {
const OpenMapModalBtn = (MapModal) => {
const OpenMapModalBtn = ({ modalTitle, locations = [], activeCities }) => {
- const [ mapIsOpened, setMapIsOpened ] = useState(false);
- const [ dropdownIsOpened, setDropdownIsOpened ] = useState(false);
+ const [ mapIsOpened, , openMap, closeMap ] = useToggle();
+ const [ dropdownIsOpened, toggleDropdown, openDropdown ] = useToggle();
const [ locationsToShow, setLocationsToShow ] = useState([]);
const buttonRef = React.createRef();
const filterLocations = (locations) => locations.filter(({ cityName }) => activeCities.includes(cityName));
- const toggleMap = () => setMapIsOpened(!mapIsOpened);
const onClick = () => {
if (!activeCities) {
setLocationsToShow(locations);
- setMapIsOpened(true);
+ openMap();
return;
}
- setDropdownIsOpened(true);
+ openDropdown();
};
const openMapWithLocations = (filtered) => () => {
setLocationsToShow(filtered ? filterLocations(locations) : locations);
- setMapIsOpened(true);
+ openMap();
};
return (
@@ -41,13 +41,13 @@ const OpenMapModalBtn = (MapModal) => {
buttonRef.current}>Show in map
- setDropdownIsOpened(!dropdownIsOpened)} inNavbar>
+
Show all locations
Show locations in current page
-
+
);
};