diff --git a/package-lock.json b/package-lock.json index 40082368..a70399bb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,9 +15,9 @@ "@fortawesome/react-fontawesome": "^0.2.0", "@json2csv/plainjs": "^7.0.3", "@reduxjs/toolkit": "^1.9.5", - "@shlinkio/shlink-frontend-kit": "^0.2.1", + "@shlinkio/shlink-frontend-kit": "^0.3.0", "@shlinkio/shlink-js-sdk": "^0.1.0", - "@shlinkio/shlink-web-component": "^0.3.3", + "@shlinkio/shlink-web-component": "^0.3.4", "bootstrap": "5.2.3", "bottlejs": "^2.0.1", "classnames": "^2.3.2", @@ -2801,9 +2801,9 @@ } }, "node_modules/@shlinkio/shlink-frontend-kit": { - "version": "0.2.1", - "resolved": "https://registry.npmjs.org/@shlinkio/shlink-frontend-kit/-/shlink-frontend-kit-0.2.1.tgz", - "integrity": "sha512-5mRpQII9bGHAJQ1ghgGY+jFC5tD0y0ufgPqco9vLVGXGVf+BSNQrTiw/Cx6f9eCInqFPgFo8CdJzWUHbIzvC+Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@shlinkio/shlink-frontend-kit/-/shlink-frontend-kit-0.3.0.tgz", + "integrity": "sha512-MjftbQKc+Vq2rGsjsTQHcnq4IFSjaazBZ82T/TSEz9wza/y/Siy7bBQlTdALyaHW+FT0Lv5nOf/V5RH+iotsCA==", "dependencies": { "classnames": "^2.3.2", "qs": "^6.11.2", @@ -2825,9 +2825,9 @@ "integrity": "sha512-03xlTFZH/XbjTDxrMJPD+fhJp+Vysb/lS4MKyOodcxdFieIeiBogCJrRuXiiAwNaXzJoxaon7T3s6yz5DVsbTQ==" }, "node_modules/@shlinkio/shlink-web-component": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@shlinkio/shlink-web-component/-/shlink-web-component-0.3.3.tgz", - "integrity": "sha512-xoRfeAmZ1VE5UyP3z4KtuemMQJYEYcjgvmBM79+en1XHrHyf/NVBZbcIE0U77IPb9hTcCU0fWmElQFboBSXSmw==", + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/@shlinkio/shlink-web-component/-/shlink-web-component-0.3.4.tgz", + "integrity": "sha512-2oGkrYmzMzbpZae2pjzU0jHQ0UBHnQdmPDg3ODkC2/aRGtOh5tXZhtEmwEJsLHU/seKheL83E0WRowxLqUjqew==", "dependencies": { "@json2csv/plainjs": "^7.0.3", "bottlejs": "^2.0.1", @@ -2854,7 +2854,7 @@ "@fortawesome/free-solid-svg-icons": "^6.4.2", "@fortawesome/react-fontawesome": "^0.2.0", "@reduxjs/toolkit": "^1.9.5", - "@shlinkio/shlink-frontend-kit": "^0.2.0", + "@shlinkio/shlink-frontend-kit": "^0.3.0", "@shlinkio/shlink-js-sdk": "^0.1.0", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -12390,9 +12390,9 @@ } }, "@shlinkio/shlink-frontend-kit": { - "version": "0.2.1", - "resolved": "https://registry.npmjs.org/@shlinkio/shlink-frontend-kit/-/shlink-frontend-kit-0.2.1.tgz", - "integrity": "sha512-5mRpQII9bGHAJQ1ghgGY+jFC5tD0y0ufgPqco9vLVGXGVf+BSNQrTiw/Cx6f9eCInqFPgFo8CdJzWUHbIzvC+Q==", + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@shlinkio/shlink-frontend-kit/-/shlink-frontend-kit-0.3.0.tgz", + "integrity": "sha512-MjftbQKc+Vq2rGsjsTQHcnq4IFSjaazBZ82T/TSEz9wza/y/Siy7bBQlTdALyaHW+FT0Lv5nOf/V5RH+iotsCA==", "requires": { "classnames": "^2.3.2", "qs": "^6.11.2", @@ -12405,9 +12405,9 @@ "integrity": "sha512-03xlTFZH/XbjTDxrMJPD+fhJp+Vysb/lS4MKyOodcxdFieIeiBogCJrRuXiiAwNaXzJoxaon7T3s6yz5DVsbTQ==" }, "@shlinkio/shlink-web-component": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@shlinkio/shlink-web-component/-/shlink-web-component-0.3.3.tgz", - "integrity": "sha512-xoRfeAmZ1VE5UyP3z4KtuemMQJYEYcjgvmBM79+en1XHrHyf/NVBZbcIE0U77IPb9hTcCU0fWmElQFboBSXSmw==", + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/@shlinkio/shlink-web-component/-/shlink-web-component-0.3.4.tgz", + "integrity": "sha512-2oGkrYmzMzbpZae2pjzU0jHQ0UBHnQdmPDg3ODkC2/aRGtOh5tXZhtEmwEJsLHU/seKheL83E0WRowxLqUjqew==", "requires": { "@json2csv/plainjs": "^7.0.3", "bottlejs": "^2.0.1", diff --git a/package.json b/package.json index a064e41e..75c09498 100644 --- a/package.json +++ b/package.json @@ -31,9 +31,9 @@ "@fortawesome/react-fontawesome": "^0.2.0", "@json2csv/plainjs": "^7.0.3", "@reduxjs/toolkit": "^1.9.5", - "@shlinkio/shlink-frontend-kit": "^0.2.1", + "@shlinkio/shlink-frontend-kit": "^0.3.0", "@shlinkio/shlink-js-sdk": "^0.1.0", - "@shlinkio/shlink-web-component": "^0.3.3", + "@shlinkio/shlink-web-component": "^0.3.4", "bootstrap": "5.2.3", "bottlejs": "^2.0.1", "classnames": "^2.3.2", diff --git a/src/servers/CreateServer.tsx b/src/servers/CreateServer.tsx index 6d6787d8..5e66de55 100644 --- a/src/servers/CreateServer.tsx +++ b/src/servers/CreateServer.tsx @@ -1,3 +1,4 @@ +import type { TimeoutToggle } from '@shlinkio/shlink-frontend-kit'; import { Result, useToggle } from '@shlinkio/shlink-frontend-kit'; import type { FC } from 'react'; import { useCallback, useEffect, useState } from 'react'; @@ -7,7 +8,6 @@ import { v4 as uuid } from 'uuid'; import { NoMenuLayout } from '../common/NoMenuLayout'; import type { FCWithDeps } from '../container/utils'; import { componentFactory, useDependencies } from '../container/utils'; -import type { TimeoutToggle } from '../utils/helpers/hooks'; import { useGoBack } from '../utils/helpers/hooks'; import type { ServerData, ServersMap, ServerWithId } from './data'; import { DuplicatedServersModal } from './helpers/DuplicatedServersModal'; diff --git a/src/servers/ManageServers.tsx b/src/servers/ManageServers.tsx index ff24d552..067632d9 100644 --- a/src/servers/ManageServers.tsx +++ b/src/servers/ManageServers.tsx @@ -1,5 +1,6 @@ import { faFileDownload as exportIcon, faPlus as plusIcon } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import type { TimeoutToggle } from '@shlinkio/shlink-frontend-kit'; import { Result, SearchField, SimpleCard } from '@shlinkio/shlink-frontend-kit'; import type { FC } from 'react'; import { useEffect, useState } from 'react'; @@ -8,7 +9,6 @@ import { Button, Row } from 'reactstrap'; import { NoMenuLayout } from '../common/NoMenuLayout'; import type { FCWithDeps } from '../container/utils'; import { componentFactory, useDependencies } from '../container/utils'; -import type { TimeoutToggle } from '../utils/helpers/hooks'; import type { ServersMap } from './data'; import type { ImportServersBtnProps } from './helpers/ImportServersBtn'; import type { ManageServersRowProps } from './ManageServersRow'; diff --git a/src/utils/helpers/hooks.ts b/src/utils/helpers/hooks.ts index 97fa7367..52807e55 100644 --- a/src/utils/helpers/hooks.ts +++ b/src/utils/helpers/hooks.ts @@ -1,35 +1,6 @@ import { parseQuery } from '@shlinkio/shlink-frontend-kit'; -import { useCallback, useRef, useState } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -const DEFAULT_DELAY = 2000; - -export type TimeoutToggle = typeof useTimeoutToggle; - -export const useTimeoutToggle = ( - initialValue = false, - delay = DEFAULT_DELAY, - - // Test seams - setTimeout = window.setTimeout, - clearTimeout = window.clearTimeout, -): [boolean, () => void] => { - const [flag, setFlag] = useState(initialValue); - const initialValueRef = useRef(initialValue); - const timeout = useRef(undefined); - const callback = useCallback(() => { - setFlag(!initialValueRef.current); - - if (timeout.current) { - clearTimeout(timeout.current); - } - - timeout.current = setTimeout(() => setFlag(initialValueRef.current), delay); - }, [clearTimeout, delay, setTimeout]); - - return [flag, callback]; -}; - export const useGoBack = () => { const navigate = useNavigate(); return () => navigate(-1); diff --git a/src/utils/services/provideServices.ts b/src/utils/services/provideServices.ts index 404b041f..7c3920ef 100644 --- a/src/utils/services/provideServices.ts +++ b/src/utils/services/provideServices.ts @@ -1,6 +1,6 @@ +import { useTimeoutToggle } from '@shlinkio/shlink-frontend-kit'; import type Bottle from 'bottlejs'; import { csvToJson, jsonToCsv } from '../helpers/csvjson'; -import { useTimeoutToggle } from '../helpers/hooks'; import { LocalStorage } from './LocalStorage'; import { TagColorsStorage } from './TagColorsStorage';