From c07762c5b490e5d4977eb1c7797bf920bd84f8b4 Mon Sep 17 00:00:00 2001 From: mydearxym Date: Sat, 24 Apr 2021 17:37:44 +0800 Subject: [PATCH 1/3] fix(drawer): event cycle error --- src/containers/thread/PostsThread/logic.js | 4 ++-- src/containers/tool/Drawer/AddOn.js | 2 +- src/containers/tool/Drawer/Content/renderContent.js | 8 ++++---- src/containers/tool/Drawer/Header/CloseLine.js | 2 +- src/containers/tool/Drawer/Viewer/DesktopView.js | 2 +- src/containers/tool/Drawer/Viewer/MobileView.js | 2 +- src/containers/tool/Drawer/logic.js | 2 +- utils/constant/event.ts | 1 + 8 files changed, 12 insertions(+), 11 deletions(-) diff --git a/src/containers/thread/PostsThread/logic.js b/src/containers/thread/PostsThread/logic.js index 47d36d2e7..a2a9fe55c 100755 --- a/src/containers/thread/PostsThread/logic.js +++ b/src/containers/thread/PostsThread/logic.js @@ -29,7 +29,7 @@ const { SR71, $solver, asyncRes, asyncErr } = asyncSuit const sr71$ = new SR71({ receive: [ EVENT.REFRESH_POSTS, - EVENT.DRAWER.CLOSE, + EVENT.DRAWER.AFTER_CLOSE, EVENT.COMMUNITY_CHANGE, EVENT.THREAD_CHANGE, EVENT.C11N_DENSITY_CHANGE, @@ -215,7 +215,7 @@ const DataSolver = [ }, }, { - match: asyncRes(EVENT.DRAWER.CLOSE), + match: asyncRes(EVENT.DRAWER.AFTER_CLOSE), action: () => { store.setViewing({ post: {} }) store.markRoute({ ...store.filtersData, ...store.tagQuery }) diff --git a/src/containers/tool/Drawer/AddOn.js b/src/containers/tool/Drawer/AddOn.js index ebe3ad668..770f11cd9 100755 --- a/src/containers/tool/Drawer/AddOn.js +++ b/src/containers/tool/Drawer/AddOn.js @@ -16,7 +16,7 @@ import { closeDrawer } from './logic' const AddOn = ({ type, imageUploading }) => { return ( - + closeDrawer()}> diff --git a/src/containers/tool/Drawer/Content/renderContent.js b/src/containers/tool/Drawer/Content/renderContent.js index 30b2bc552..7aac7d61d 100644 --- a/src/containers/tool/Drawer/Content/renderContent.js +++ b/src/containers/tool/Drawer/Content/renderContent.js @@ -33,20 +33,20 @@ const renderContent = (type, attachment, attUser, mmType) => { return case TYPE.DRAWER.POST_CREATE: - return + return case TYPE.DRAWER.POST_EDIT: - return + return // job case TYPE.DRAWER.JOB_CREATE: - return + return case TYPE.DRAWER.JOB_VIEW: return case TYPE.DRAWER.JOB_EDIT: - return + return // repo case TYPE.DRAWER.REPO_VIEW: diff --git a/src/containers/tool/Drawer/Header/CloseLine.js b/src/containers/tool/Drawer/Header/CloseLine.js index f1faf9d50..764b2117b 100644 --- a/src/containers/tool/Drawer/Header/CloseLine.js +++ b/src/containers/tool/Drawer/Header/CloseLine.js @@ -6,7 +6,7 @@ import { closeDrawer } from '../logic' const CloseLine = ({ curve }) => { return ( - + closeDrawer()}> diff --git a/src/containers/tool/Drawer/Viewer/DesktopView.js b/src/containers/tool/Drawer/Viewer/DesktopView.js index b4e7ed666..2a1ede2b2 100644 --- a/src/containers/tool/Drawer/Viewer/DesktopView.js +++ b/src/containers/tool/Drawer/Viewer/DesktopView.js @@ -15,7 +15,7 @@ const DesktopView = ({ }) => { return ( - + closeDrawer()} /> - + closeDrawer()} /> { // force call MDEditor's componentWillUnmount to store the draft // wait until drawer move out of the screean setTimeout(() => { - send(EVENT.DRAWER.CLOSE) + send(EVENT.DRAWER.AFTER_CLOSE) store.setViewing({ viewingThread: null }) }, 200) diff --git a/utils/constant/event.ts b/utils/constant/event.ts index 45855e4ed..ac9decdc1 100755 --- a/utils/constant/event.ts +++ b/utils/constant/event.ts @@ -11,6 +11,7 @@ const EVENT = { DRAWER: { OPEN: 'DRAWER_OPEN', CLOSE: 'DRAWER_CLOSE', + AFTER_CLOSE: 'AFTER_DRAWER_CLOSE', CONTENT_DRAGABLE: 'CONTENT_DRAGABLE', }, // new end From 0cd91c571450241d4d5051dfc74f775a152336e7 Mon Sep 17 00:00:00 2001 From: mydearxym Date: Sat, 24 Apr 2021 21:55:21 +0800 Subject: [PATCH 2/3] chore(drawer): covert js -> ts --- .../tool/Drawer/{AddOn.js => AddOn.tsx} | 7 ++- .../{DesktopView.js => DesktopView.tsx} | 9 +++- .../Content/{MobileView.js => MobileView.tsx} | 30 +++++++++--- .../{PlaceHolder.js => PlaceHolder.tsx} | 2 +- .../Drawer/Content/{index.js => index.tsx} | 0 .../tool/Drawer/Content/renderContent.js | 2 - .../Header/{CloseLine.js => CloseLine.tsx} | 6 ++- .../Drawer/Header/{index.js => index.tsx} | 12 ++++- .../{DesktopView.js => DesktopView.tsx} | 16 ++++++- .../Viewer/{MobileView.js => MobileView.tsx} | 22 +++++++-- .../Drawer/Viewer/{index.js => index.tsx} | 0 .../tool/Drawer/{dynamics.js => dynamics.tsx} | 2 + .../tool/Drawer/{index.js => index.tsx} | 8 +++- .../tool/Drawer/{logic.js => logic.ts} | 47 ++++++++++++------- src/containers/tool/Drawer/spec.ts | 6 +-- src/containers/tool/Drawer/store.ts | 6 ++- src/containers/tool/Drawer/styles/index.ts | 9 +++- src/hooks/useResize.ts | 2 +- src/spec/index.ts | 1 + src/spec/theme.ts | 3 ++ src/spec/utils.ts | 1 + 21 files changed, 146 insertions(+), 45 deletions(-) rename src/containers/tool/Drawer/{AddOn.js => AddOn.tsx} (83%) rename src/containers/tool/Drawer/Content/{DesktopView.js => DesktopView.tsx} (77%) rename src/containers/tool/Drawer/Content/{MobileView.js => MobileView.tsx} (84%) rename src/containers/tool/Drawer/Content/{PlaceHolder.js => PlaceHolder.tsx} (90%) rename src/containers/tool/Drawer/Content/{index.js => index.tsx} (100%) rename src/containers/tool/Drawer/Header/{CloseLine.js => CloseLine.tsx} (77%) rename src/containers/tool/Drawer/Header/{index.js => index.tsx} (80%) rename src/containers/tool/Drawer/Viewer/{DesktopView.js => DesktopView.tsx} (69%) rename src/containers/tool/Drawer/Viewer/{MobileView.js => MobileView.tsx} (84%) rename src/containers/tool/Drawer/Viewer/{index.js => index.tsx} (100%) rename src/containers/tool/Drawer/{dynamics.js => dynamics.tsx} (97%) rename src/containers/tool/Drawer/{index.js => index.tsx} (90%) rename src/containers/tool/Drawer/{logic.js => logic.ts} (85%) diff --git a/src/containers/tool/Drawer/AddOn.js b/src/containers/tool/Drawer/AddOn.tsx similarity index 83% rename from src/containers/tool/Drawer/AddOn.js rename to src/containers/tool/Drawer/AddOn.tsx index 770f11cd9..89eb3a9f5 100755 --- a/src/containers/tool/Drawer/AddOn.js +++ b/src/containers/tool/Drawer/AddOn.tsx @@ -13,7 +13,12 @@ import { import { closeDrawer } from './logic' -const AddOn = ({ type, imageUploading }) => { +type TProps = { + type: string + imageUploading?: boolean +} + +const AddOn: React.FC = ({ type, imageUploading = false }) => { return ( closeDrawer()}> diff --git a/src/containers/tool/Drawer/Content/DesktopView.js b/src/containers/tool/Drawer/Content/DesktopView.tsx similarity index 77% rename from src/containers/tool/Drawer/Content/DesktopView.js rename to src/containers/tool/Drawer/Content/DesktopView.tsx index 32414d557..91c63fafd 100644 --- a/src/containers/tool/Drawer/Content/DesktopView.js +++ b/src/containers/tool/Drawer/Content/DesktopView.tsx @@ -5,7 +5,14 @@ import CustomScroller from '@/components/CustomScroller' import renderContent from './renderContent' import { Wrapper } from '../styles/content' -const Content = ({ visible, type, attachment, attUser }) => { +type TProps = { + visible: boolean + type: string // TODO: + attachment: any // TODO: + attUser: any // TODO: +} + +const Content: React.FC = ({ visible, type, attachment, attUser }) => { const ref = useRef(null) /* diff --git a/src/containers/tool/Drawer/Content/MobileView.js b/src/containers/tool/Drawer/Content/MobileView.tsx similarity index 84% rename from src/containers/tool/Drawer/Content/MobileView.js rename to src/containers/tool/Drawer/Content/MobileView.tsx index 58e66acc7..871841f9b 100644 --- a/src/containers/tool/Drawer/Content/MobileView.js +++ b/src/containers/tool/Drawer/Content/MobileView.tsx @@ -2,13 +2,29 @@ import React, { useEffect, useRef, useState } from 'react' import CustomScroller from '@/components/CustomScroller' +import type { TSwipeOption } from '../spec' import renderContent from './renderContent' - -import { Wrapper } from '../styles/content' import { getMobileContentHeight } from '../styles/metrics' +import { Wrapper } from '../styles/content' import { toggleSwipeAviliable, toggleHeaderTextVisiable } from '../logic' -const Content = ({ visible, options, type, attachment, attUser, mmType }) => { +type TProps = { + visible: boolean + options: TSwipeOption + type: string // TODO + attachment: any // TODO + attUser: any // TODO + mmType: string // TODO +} + +const Content: React.FC = ({ + visible, + options, + type, + attachment, + attUser, + mmType, +}) => { const ref = useRef(null) const [topEnterTimer, setTopEnterTimer] = useState(null) @@ -48,7 +64,7 @@ const Content = ({ visible, options, type, attachment, attUser, mmType }) => { * 注意这个值是在桌面浏览器上反复试出的最佳值，过大或过小都不自然 */ const topEnterTimer = setTimeout(() => { - toggleSwipeAviliable('Down', true) + toggleSwipeAviliable('down', true) }, 800) /* @@ -76,10 +92,10 @@ const Content = ({ visible, options, type, attachment, attUser, mmType }) => { setTopEnterTimer(null) } - toggleSwipeAviliable('Down', false) + toggleSwipeAviliable('down', false) }} - onBottomEnter={() => toggleSwipeAviliable('Up', true)} - onBottomLeave={() => toggleSwipeAviliable('Up', false)} + onBottomEnter={() => toggleSwipeAviliable('up', true)} + onBottomLeave={() => toggleSwipeAviliable('up', false)} autoHide > diff --git a/src/containers/tool/Drawer/Content/PlaceHolder.js b/src/containers/tool/Drawer/Content/PlaceHolder.tsx similarity index 90% rename from src/containers/tool/Drawer/Content/PlaceHolder.js rename to src/containers/tool/Drawer/Content/PlaceHolder.tsx index bbf334154..d63d4012b 100644 --- a/src/containers/tool/Drawer/Content/PlaceHolder.js +++ b/src/containers/tool/Drawer/Content/PlaceHolder.tsx @@ -4,7 +4,7 @@ import { ICON_CMD } from '@/config' // import { ICON_CMD } from '../../config' import { Wrapper, SiteLogo, Desc } from '../styles/content/place_holder' -const PlaceHolder = () => { +const PlaceHolder: React.FC = () => { return ( diff --git a/src/containers/tool/Drawer/Content/index.js b/src/containers/tool/Drawer/Content/index.tsx similarity index 100% rename from src/containers/tool/Drawer/Content/index.js rename to src/containers/tool/Drawer/Content/index.tsx diff --git a/src/containers/tool/Drawer/Content/renderContent.js b/src/containers/tool/Drawer/Content/renderContent.js index 7aac7d61d..a872c6205 100644 --- a/src/containers/tool/Drawer/Content/renderContent.js +++ b/src/containers/tool/Drawer/Content/renderContent.js @@ -5,8 +5,6 @@ import ModeLineMenu from '@/containers/unit/ModeLineMenu' import PlaceHolder from './PlaceHolder' -import { closeDrawer } from '../logic' - import { PostViewer, JobViewer, diff --git a/src/containers/tool/Drawer/Header/CloseLine.js b/src/containers/tool/Drawer/Header/CloseLine.tsx similarity index 77% rename from src/containers/tool/Drawer/Header/CloseLine.js rename to src/containers/tool/Drawer/Header/CloseLine.tsx index 764b2117b..d950b33ce 100644 --- a/src/containers/tool/Drawer/Header/CloseLine.js +++ b/src/containers/tool/Drawer/Header/CloseLine.tsx @@ -4,7 +4,11 @@ import { Wrapper, LeftLine, RightLine } from '../styles/header/close_line' import { closeDrawer } from '../logic' -const CloseLine = ({ curve }) => { +type TProps = { + curve: boolean +} + +const CloseLine: React.FC = ({ curve }) => { return ( closeDrawer()}> diff --git a/src/containers/tool/Drawer/Header/index.js b/src/containers/tool/Drawer/Header/index.tsx similarity index 80% rename from src/containers/tool/Drawer/Header/index.js rename to src/containers/tool/Drawer/Header/index.tsx index 9d1976351..35779d9eb 100644 --- a/src/containers/tool/Drawer/Header/index.js +++ b/src/containers/tool/Drawer/Header/index.tsx @@ -3,13 +3,23 @@ import React from 'react' import { useSwipe } from '@/hooks' import { nilOrEmpty } from '@/utils' +import type { TSwipeOption } from '../spec' import CloseLine from './CloseLine' import { TopWrapper, BottomWrapper, TextWrapper } from '../styles/header' import { onSwipedYHandler, onSwipingYHandler } from '../logic' /* 评论共 167 条 */ -const Header = ({ +type TProps = { + headerText?: string + options: TSwipeOption + setSwipeUpY: (i: number) => void + setSwipeDownY: (i: number) => void + canBeClose: boolean + showHeaderText: boolean +} + +const Header: React.FC = ({ headerText, options, setSwipeUpY, diff --git a/src/containers/tool/Drawer/Viewer/DesktopView.js b/src/containers/tool/Drawer/Viewer/DesktopView.tsx similarity index 69% rename from src/containers/tool/Drawer/Viewer/DesktopView.js rename to src/containers/tool/Drawer/Viewer/DesktopView.tsx index 2a1ede2b2..a8181f447 100644 --- a/src/containers/tool/Drawer/Viewer/DesktopView.js +++ b/src/containers/tool/Drawer/Viewer/DesktopView.tsx @@ -1,11 +1,23 @@ import React from 'react' +import type { TSwipeOption } from '../spec' import AddOn from '../AddOn' import { DrawerOverlay, DrawerWrapper, DrawerContent } from '../styles' import { closeDrawer } from '../logic' -const DesktopView = ({ +type TProps = { + testid?: string + options: TSwipeOption + visible: boolean + rightOffset: string + type: string + imageUploading: boolean + children: React.ReactNode +} + +const DesktopView: React.FC = ({ + testid = 'drawer-sidebar-panel', options, visible, rightOffset, @@ -17,7 +29,7 @@ const DesktopView = ({ closeDrawer()} /> = ({ + testid = 'drawer-sidebar-panel', headerText, options, visible, @@ -31,7 +47,7 @@ const Viewer = ({ disableContentDrag, children, }) => { - const theme = useTheme() + const theme: TThemeMap = useTheme() // swipe action state for top && bottom // null means restore and close const [swipeDownY, setSwipeDownY] = useState(null) @@ -67,7 +83,7 @@ const Viewer = ({
closeDrawer()} /> (

+ {/* @ts-ignore */}
) @@ -22,6 +23,7 @@ const commonConfig = { // editor style loading config const editorConfig = { + // @ts-ignore loading: () => , ssr: false, } diff --git a/src/containers/tool/Drawer/index.js b/src/containers/tool/Drawer/index.tsx similarity index 90% rename from src/containers/tool/Drawer/index.js rename to src/containers/tool/Drawer/index.tsx index df5641d9b..2a8a1bb18 100755 --- a/src/containers/tool/Drawer/index.js +++ b/src/containers/tool/Drawer/index.tsx @@ -10,6 +10,8 @@ import T from 'prop-types' import { pluggedIn, buildLog } from '@/utils' import { useShortcut, useResize } from '@/hooks' +import type { TStore } from './store' + import Viewer from './Viewer/index' import Content from './Content' @@ -18,7 +20,11 @@ import { useInit, closeDrawer } from './logic' /* eslint-disable-next-line */ const log = buildLog('C:Preview') -const DrawerContainer = ({ drawer: store }) => { +type TProps = { + drawer: TStore +} + +const DrawerContainer: React.FC = ({ drawer: store }) => { const { width: windowWidth } = useResize() useInit(store, windowWidth) useShortcut('Escape', closeDrawer) diff --git a/src/containers/tool/Drawer/logic.js b/src/containers/tool/Drawer/logic.ts similarity index 85% rename from src/containers/tool/Drawer/logic.js rename to src/containers/tool/Drawer/logic.ts index 99a172bc4..c70911226 100755 --- a/src/containers/tool/Drawer/logic.js +++ b/src/containers/tool/Drawer/logic.ts @@ -1,6 +1,7 @@ import { useEffect } from 'react' import { contains, values } from 'ramda' +import type { TDirection } from '@/spec' import { TYPE, EVENT } from '@/constant' import { @@ -14,11 +15,13 @@ import { clearGlobalBlur, } from '@/utils' +import type { TStore } from './store' /* eslint-disable-next-line */ const log = buildLog('L:Preview') const { SR71, $solver, asyncRes } = asyncSuit const sr71$ = new SR71({ + /* @ts-ignore */ receive: [ ...values(EVENT.DRAWER), EVENT.UPLOAD_IMG_START, @@ -26,7 +29,7 @@ const sr71$ = new SR71({ ], }) -let store = null +let store: TStore | undefined let sub$ = null // those types will not treat as page link @@ -35,7 +38,7 @@ const FUNCTION_TYPES = [TYPE.DRAWER.C11N_SETTINGS, TYPE.DRAWER.MODELINE_MENU] /** * close current drawer */ -export const closeDrawer = () => { +export const closeDrawer = (): void => { unlockPage() store.close() store.mark({ imageUploading: false, type: null }) @@ -60,7 +63,7 @@ export const onSwipedYHandler = ( setSwipeUpY, setSwipeDownY, ignoreSwipeAviliable = false, -) => { +): void => { const { optionsData: options, swipeThreshold, @@ -95,14 +98,22 @@ export const onSwipedYHandler = ( } } -const handleClearEffect = debounce(() => { - clearGlobalBlur(true) - store.mark({ canBeClose: true }) -}, 200) -const handleRestoreEffect = debounce(() => { - toggleGlobalBlur(true) - store.mark({ canBeClose: false }) -}, 200) +const handleClearEffect = debounce( + () => { + clearGlobalBlur() + store.mark({ canBeClose: true }) + }, + 200, + true, +) +const handleRestoreEffect = debounce( + () => { + toggleGlobalBlur(true) + store.mark({ canBeClose: false }) + }, + 200, + true, +) // handler swiping event for up/down swipe export const onSwipingYHandler = ( @@ -110,7 +121,7 @@ export const onSwipingYHandler = ( setSwipeUpY, setSwipeDownY, ignoreSwipeAviliable = false, -) => { +): void => { // when top/bottom has no content, the whole panel can be swipeable // like tiktok style const { @@ -146,17 +157,17 @@ export const onSwipingYHandler = ( } // -export const toggleSwipeAviliable = (type, bool) => { - type === 'Down' +export const toggleSwipeAviliable = (type: TDirection, bool: boolean): void => { + type === 'down' ? store.mark({ swipeDownAviliable: bool }) : store.mark({ swipeUpAviliable: bool }) } -export const toggleHeaderTextVisiable = (bool) => { +export const toggleHeaderTextVisiable = (bool: boolean): void => { store.mark({ showHeaderText: bool }) } -export const resetSwipeAviliable = () => store.resetSwipeAviliable() +export const resetSwipeAviliable = (): void => store.resetSwipeAviliable() const DataResolver = [ { @@ -208,8 +219,8 @@ const DataResolver = [ // ############################### // init & uninit // ############################### -export const useInit = (_store, windowWidth) => { - useEffect(() => { +export const useInit = (_store: TStore, windowWidth: number): void => { + useEffect((): (() => void) => { store = _store if (!sub$) { sub$ = sr71$.data().subscribe($solver(DataResolver, [])) diff --git a/src/containers/tool/Drawer/spec.ts b/src/containers/tool/Drawer/spec.ts index 3f1f8076c..5dd90d883 100644 --- a/src/containers/tool/Drawer/spec.ts +++ b/src/containers/tool/Drawer/spec.ts @@ -6,8 +6,8 @@ export type TSwipeOption = { } export type TSwipe = { - swipeUpY: number - swipeDownY: number + swipeUpY?: number + swipeDownY?: number // options: Record options: TSwipeOption } @@ -16,6 +16,6 @@ export type TDrawer = TTestable & TActive & TSwipe & { mobile: boolean - rightOffset: string + rightOffset?: string type: string } diff --git a/src/containers/tool/Drawer/store.ts b/src/containers/tool/Drawer/store.ts index a1c16e99e..52973108c 100755 --- a/src/containers/tool/Drawer/store.ts +++ b/src/containers/tool/Drawer/store.ts @@ -133,11 +133,13 @@ const DrawerStore = T.model('DrawerStore', { return SWIPE_THRESHOLD[direction][position] }, // 预览面板从最右侧滑出的偏移量 - get rightOffset() { + get rightOffset(): string { const { windowWidth } = self const MAX_WIDTH = Number(WIDTH.COMMUNITY.PAGE.slice(0, -2)) - return `${windowWidth <= MAX_WIDTH ? 0 : (windowWidth - MAX_WIDTH) / 2}px` + return `${ + windowWidth <= MAX_WIDTH ? '0' : (windowWidth - MAX_WIDTH) / 2 + }px` }, get curCommunity(): TCommunity { const root = getParent(self) as TRootStore diff --git a/src/containers/tool/Drawer/styles/index.ts b/src/containers/tool/Drawer/styles/index.ts index 725f8c208..3e972e6b4 100755 --- a/src/containers/tool/Drawer/styles/index.ts +++ b/src/containers/tool/Drawer/styles/index.ts @@ -32,7 +32,14 @@ export const DrawerOverlay = styled.div` // - Use styled components for static styles and dynamic styles that don't change very often; // - Use inline styles (through .attrs) for styles that change frequently, like for animations. export const DrawerWrapper = styled.div.attrs( - ({ testid, visible, mobile, swipeUpY, swipeDownY, options }: TDrawer) => ({ + ({ + testid, + visible, + mobile, + swipeUpY = 0, + swipeDownY = 0, + options, + }: TDrawer) => ({ 'data-test-id': testid, style: { transform: getTransform(visible, mobile, swipeUpY, swipeDownY, options), diff --git a/src/hooks/useResize.ts b/src/hooks/useResize.ts index 43500bd8e..1a056fd3b 100755 --- a/src/hooks/useResize.ts +++ b/src/hooks/useResize.ts @@ -11,7 +11,7 @@ type TSize = { * * @returns */ -const useWindowSize = (cb: (size: TSize) => void): TSize => { +const useWindowSize = (cb?: (size: TSize) => void): TSize => { const isClient = typeof window === 'object' const getSize = useCallback(() => { diff --git a/src/spec/index.ts b/src/spec/index.ts index 311ce720f..508b0897f 100644 --- a/src/spec/index.ts +++ b/src/spec/index.ts @@ -26,6 +26,7 @@ export type { TLink, TPlatform, Nullable, + TDirection, TScrollDirection, TTooltipAnimation, TTooltipPlacement, diff --git a/src/spec/theme.ts b/src/spec/theme.ts index dc28a76f7..a6e7f0010 100644 --- a/src/spec/theme.ts +++ b/src/spec/theme.ts @@ -26,4 +26,7 @@ export type TThemeMap = { text: string hover: string } + drawer?: { + bg: string + } } diff --git a/src/spec/utils.ts b/src/spec/utils.ts index 2d99356eb..7063cb2b0 100644 --- a/src/spec/utils.ts +++ b/src/spec/utils.ts @@ -46,6 +46,7 @@ export type TPlatform = { isMobile: boolean } +export type TDirection = 'down' | 'up' export type TScrollDirection = 'up' | 'down' export type TTooltipAnimation = From bdb644807d67cab0e0da3063d5f22f76c2260bf1 Mon Sep 17 00:00:00 2001 From: mydearxym Date: Sat, 24 Apr 2021 21:57:58 +0800 Subject: [PATCH 3/3] chore(drawer): covert js -> ts --- src/containers/tool/Drawer/logic.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/containers/tool/Drawer/logic.ts b/src/containers/tool/Drawer/logic.ts index c70911226..eb4f63672 100755 --- a/src/containers/tool/Drawer/logic.ts +++ b/src/containers/tool/Drawer/logic.ts @@ -60,8 +60,8 @@ export const closeDrawer = (): void => { // 判断最终是回到原来的位置还是隐藏 panel export const onSwipedYHandler = ( ev, - setSwipeUpY, - setSwipeDownY, + setSwipeUpY: (i: number) => void, + setSwipeDownY: (i: number) => void, ignoreSwipeAviliable = false, ): void => { const { @@ -118,8 +118,8 @@ const handleRestoreEffect = debounce( // handler swiping event for up/down swipe export const onSwipingYHandler = ( ev, - setSwipeUpY, - setSwipeDownY, + setSwipeUpY: (i: number) => void, + setSwipeDownY: (i: number) => void, ignoreSwipeAviliable = false, ): void => { // when top/bottom has no content, the whole panel can be swipeable