From 101a3eff8ddf9b91562ce9eb1809f556e0a212e4 Mon Sep 17 00:00:00 2001 From: shoonia Date: Mon, 29 Apr 2024 16:01:10 +0300 Subject: [PATCH] Remove unnecessary abstraction --- src/components/CopyLinkButton/index.tsx | 11 ++++--- src/components/Jobs/CronTrue.tsx | 3 +- src/components/Jobs/Item.tsx | 4 +-- src/components/Parser/EditButton.tsx | 4 +-- src/components/UploadModal/index.tsx | 39 ++++++++++++------------- src/store/index.ts | 4 +-- 6 files changed, 29 insertions(+), 36 deletions(-) diff --git a/src/components/CopyLinkButton/index.tsx b/src/components/CopyLinkButton/index.tsx index 4d97d83..071fa53 100644 --- a/src/components/CopyLinkButton/index.tsx +++ b/src/components/CopyLinkButton/index.tsx @@ -1,6 +1,6 @@ import { useState } from 'preact/hooks'; -import { useStore } from '../../store'; +import { getState } from '../../store'; import { createValidatorLink } from '../../util/validatorValue'; import { IconCopyLink } from '../Icons/IconCopyLink'; import { BlankButton } from '../Button'; @@ -10,23 +10,22 @@ interface Props { } export const CopyLinkButton: FC = ({ className }) => { - const store = useStore(); - const [isCopied, setState] = useState(false); + const [isCopied, setCopy] = useState(false); const label = isCopied ? 'Copied!' : 'Copy link to validation results'; const onClick: EventListener = async () => { - const { validatorValue } = store.get(); + const { validatorValue } = getState(); const link = createValidatorLink(validatorValue); if (link) { history.pushState(null, '', link); await navigator.clipboard.writeText(link); - setState(true); - setTimeout(setState, 2_000, false); + setCopy(true); + setTimeout(setCopy, 2_000, false); } }; diff --git a/src/components/Jobs/CronTrue.tsx b/src/components/Jobs/CronTrue.tsx index 38c73f4..948f8be 100644 --- a/src/components/Jobs/CronTrue.tsx +++ b/src/components/Jobs/CronTrue.tsx @@ -4,10 +4,9 @@ import s from './CronTrue.css'; import { parseCron } from '../../util/parseCron'; import { classNames } from '../../util/component'; import { useFormScope } from '../../hooks/formScope'; -import { useDispatch } from '../../store'; +import { dispatch } from '../../store'; export const CronTrue: FC = () => { - const dispatch = useDispatch(); const { id, cronExpression } = useFormScope(); const [isError, message] = parseCron(cronExpression); diff --git a/src/components/Jobs/Item.tsx b/src/components/Jobs/Item.tsx index a3053b8..07ff98b 100644 --- a/src/components/Jobs/Item.tsx +++ b/src/components/Jobs/Item.tsx @@ -6,7 +6,7 @@ import { ItemMenu } from './ItemMenu'; import { FunctionInfo } from './FunctionInfo'; import { ExecutionConfig } from './ExecutionConfig'; import { classNames, preventDefault } from '../../util/component'; -import { useDispatch } from '../../store'; +import { dispatch } from '../../store'; interface Props { id: string; @@ -14,8 +14,6 @@ interface Props { } export const Item: FC = ({ id, isNew }) => { - const dispatch = useDispatch(); - useEffect(() => { if (isNew) { const t = setTimeout(() => { diff --git a/src/components/Parser/EditButton.tsx b/src/components/Parser/EditButton.tsx index 8da1e41..d755b8e 100644 --- a/src/components/Parser/EditButton.tsx +++ b/src/components/Parser/EditButton.tsx @@ -1,4 +1,4 @@ -import { useDispatch } from '../../store'; +import { dispatch } from '../../store'; import { Button } from '../Button'; import { IconEdit } from '../Icons/IconEdit'; import { type IConfig, createItems } from '../../util/items'; @@ -9,8 +9,6 @@ interface Props { } export const EditButton: FC = ({ config }) => { - const dispatch = useDispatch(); - const onClick: EventListener = () => { dispatch('items/replace', createItems(config)); location.hash = ROUTER.BUILDER; diff --git a/src/components/UploadModal/index.tsx b/src/components/UploadModal/index.tsx index 48ae8a0..f65bb00 100644 --- a/src/components/UploadModal/index.tsx +++ b/src/components/UploadModal/index.tsx @@ -2,7 +2,7 @@ import type { JSX } from 'preact'; import { useRef } from 'preact/hooks'; import s from './styles.css'; -import { useDispatch } from '../../store'; +import { dispatch } from '../../store'; import { preventDefault } from '../../util/component'; import { parseJSONC } from '../Parser/parseJSONC'; import { isValidConfig } from '../Parser/isValidConfig'; @@ -15,34 +15,33 @@ import { UploadFile } from '../UploadFile'; import { IconCancel } from '../Icons/IconCancel'; import { IconConfirm } from '../Icons/IconConfirm'; -const close = (): void => { +const close = () => { location.hash = ROUTER.BUILDER; }; -export const UploadModal: FC = () => { - const ref = useRef(''); - const dispatch = useDispatch(); - - const onLoad = (val: string): void => { - if (val.trim() === '') { - return close(); - } +const onLoad = (val: string) => { + if (val.trim() === '') { + return close(); + } - const [parsingError, config] = parseJSONC(val); + const [parsingError, config] = parseJSONC(val); - if (!parsingError) { - const [validationError] = isValidConfig(config); + if (!parsingError) { + const [validationError] = isValidConfig(config); - if (!validationError) { - dispatch('items/replace', createItems(config as IConfig)); + if (!validationError) { + dispatch('items/replace', createItems(config as IConfig)); - return close(); - } + return close(); } + } - dispatch('validator/input', val); - location.hash = ROUTER.VALIDATOR; - }; + dispatch('validator/input', val); + location.hash = ROUTER.VALIDATOR; +}; + +export const UploadModal: FC = () => { + const ref = useRef(''); const onInput: JSX.InputEventHandler = (event) => { ref.current = event.currentTarget.value; diff --git a/src/store/index.ts b/src/store/index.ts index 3e53434..ed441ea 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -12,5 +12,5 @@ export const store = createStoreon([ export const useStoreon = _useStoreon; -export const useStore = () => store; -export const useDispatch = () => store.dispatch; +export const getState = store.get; +export const dispatch = store.dispatch;