Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit5b3821b

Browse files
authored
refactor(article-sticker): convert to ts (#1054)
1 parent85216e6 commit5b3821b

File tree

10 files changed

+125
-84
lines changed

10 files changed

+125
-84
lines changed

‎src/containers/tool/ArticleSticker/ArticleSticker.js‎renamed to ‎src/containers/tool/ArticleSticker/ArticleSticker.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
importReactfrom'react'
22

3+
importtype{TArticle}from'@/spec'
34
import{ICON}from'@/config'
45
import{Br}from'@/components/Common'
56

@@ -14,7 +15,12 @@ import {
1415
Text,
1516
}from'./styles/article_sticker'
1617

17-
constCommonSticker=({ show, viewing})=>{
18+
typeTProps={
19+
show:boolean
20+
viewing:TArticle
21+
}
22+
23+
constArticleSticker:React.FC<TProps>=({ show, viewing})=>{
1824
return(
1925
<Wrappershow={show}>
2026
<ItemWrapper>
@@ -37,4 +43,4 @@ const CommonSticker = ({ show, viewing }) => {
3743
)
3844
}
3945

40-
exportdefaultReact.memo(CommonSticker)
46+
exportdefaultReact.memo(ArticleSticker)

‎src/containers/tool/ArticleSticker/CommentSticker.js‎renamed to ‎src/containers/tool/ArticleSticker/CommentSticker.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,12 @@ import {
2929
/* eslint-disable-next-line */
3030
constlog=buildLog('c:CommentSticker:index')
3131

32-
constCommentSticker=({
32+
typeTProps={
33+
show:boolean
34+
data?:any// TODO
35+
}
36+
37+
constCommentSticker:React.FC<TProps>=({
3338
show,
3439
data:{pagedCommentsParticipators:users},
3540
})=>{

‎src/containers/tool/ArticleSticker/CommunitySticker.js‎renamed to ‎src/containers/tool/ArticleSticker/CommunitySticker.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
importReactfrom'react'
22

3+
importtype{TViewing}from'@/spec'
34
import{ICON_BASE}from'@/config'
45
import{Button}from'@/components/Buttons'
56

@@ -10,7 +11,12 @@ import {
1011
Divider,
1112
}from'./styles/community_sticker'
1213

13-
constCommunitySticker=()=>{
14+
typeTProps={
15+
data?:TViewing
16+
show?:boolean
17+
}
18+
19+
constCommunitySticker:React.FC<TProps>=({ show, data})=>{
1420
return(
1521
<React.Fragment>
1622
<ItemWrapper>

‎src/containers/tool/ArticleSticker/LeftSticker/Toc.js‎renamed to ‎src/containers/tool/ArticleSticker/LeftSticker/Toc.tsx‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,14 @@ import {
1414
}from'../styles/left_sticker/toc'
1515
import{toggleTocMenu}from'../logic'
1616

17-
constToc=({ show})=>{
17+
typeTProps={
18+
show:boolean
19+
testid?:string
20+
}
21+
22+
constToc:React.FC<TProps>=({ show, testid='article-sticker-toc'})=>{
1823
return(
19-
<Wrapper>
24+
<Wrappertestid={testid}>
2025
<HeaderWrapperonClick={toggleTocMenu}>
2126
<TitleWrapper>
2227
<TocIconsrc={`${ICON}/article/outline.svg`}/>

‎src/containers/tool/ArticleSticker/LeftSticker/index.js‎renamed to ‎src/containers/tool/ArticleSticker/LeftSticker/index.tsx‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,21 @@ import {
1313
BackText,
1414
}from'../styles/left_sticker'
1515

16-
constLeftSticker=({ show, title, isTocMenuOpened})=>{
16+
typeTProps={
17+
show:boolean
18+
title:string
19+
isTocMenuOpened:boolean
20+
testid?:string
21+
}
22+
23+
constLeftSticker:React.FC<TProps>=({
24+
show,
25+
title,
26+
isTocMenuOpened,
27+
testid='article-sticker-left-sidebar',
28+
})=>{
1729
return(
18-
<Wrappershow={show}>
30+
<Wrappershow={show}testid={testid}>
1931
<BackWrapper>
2032
<ArrowIconsrc={`${ICON}/shape/arrow-simple.svg`}/>
2133
<BackText>Elixir 社区</BackText>

‎src/containers/tool/ArticleSticker/index.js‎renamed to ‎src/containers/tool/ArticleSticker/index.tsx‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,14 @@
77
*/
88

99
importReactfrom'react'
10-
importTfrom'prop-types'
1110

1211
import{pluggedIn,buildLog}from'@/utils'
1312

1413
importStickyfrom'@/components/Sticky'
1514
importGotoTopfrom'@/components/GotoTop'
1615

16+
importtype{TStore}from'./store'
17+
1718
importLeftStickerfrom'./LeftSticker/index'
1819
importCommunityStickerfrom'./CommunitySticker'
1920
importArticleStickerfrom'./ArticleSticker'
@@ -25,7 +26,15 @@ import { useInit } from './logic'
2526
/* eslint-disable-next-line */
2627
constlog=buildLog('C:ArticleSticker')
2728

28-
constArticleStickerContainer=({articleSticker:store, testid})=>{
29+
typeTProps={
30+
articleSticker?:TStore
31+
testid?:string
32+
}
33+
34+
constArticleStickerContainer:React.FC<TProps>=({
35+
articleSticker:store,
36+
testid='article-sticker',
37+
})=>{
2938
useInit(store)
3039

3140
const{
@@ -65,13 +74,4 @@ const ArticleStickerContainer = ({ articleSticker: store, testid }) => {
6574
)
6675
}
6776

68-
ArticleStickerContainer.propTypes={
69-
articleSticker:T.any.isRequired,
70-
testid:T.string,
71-
}
72-
73-
ArticleStickerContainer.defaultProps={
74-
testid:'article-sticker',
75-
}
76-
77-
exportdefaultpluggedIn(ArticleStickerContainer)
77+
exportdefaultpluggedIn(ArticleStickerContainer)asReact.FC<TProps>

‎src/containers/tool/ArticleSticker/logic.js‎renamed to ‎src/containers/tool/ArticleSticker/logic.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,14 @@ import { useEffect } from 'react'
33

44
import{buildLog}from'@/utils'
55
// import S from './service'
6+
importtype{TStore}from'./store'
67

7-
letstore=null
8+
letstore:TStore|undefined
89

910
/* eslint-disable-next-line */
1011
constlog=buildLog('L:ArticleSticker')
1112

12-
exportconsttoggleTocMenu=()=>{
13+
exportconsttoggleTocMenu=():void=>{
1314
constisTocMenuOpened=!store.isTocMenuOpened
1415
constisLeftStickerLocked=isTocMenuOpened
1516

@@ -20,7 +21,7 @@ export const toggleTocMenu = () => {
2021
// init & uninit handlers
2122
// ###############################
2223

23-
exportconstuseInit=(_store)=>{
24+
exportconstuseInit=(_store:TStore):void=>{
2425
useEffect(()=>{
2526
store=_store
2627
log('useInit: ',store)

‎src/containers/tool/ArticleSticker/store.js‎

Lines changed: 0 additions & 61 deletions
This file was deleted.
Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/*
2+
* ArticleSticker store
3+
*
4+
*/
5+
6+
import{typesasT,getParent,Instance}from'mobx-state-tree'
7+
// import {} from 'ramda'
8+
9+
importtype{TRootStore,TViewing,TScrollDirection}from'@/spec'
10+
import{markStates,buildLog}from'@/utils'
11+
/* eslint-disable-next-line */
12+
constlog=buildLog('S:ArticleSticker')
13+
14+
constArticleSticker=T.model('ArticleSticker',{
15+
isTocMenuOpened:T.optional(T.boolean,false),
16+
// is TOC is opend, then lock the lefsidebar
17+
isLeftStickerLocked:T.optional(T.boolean,false),
18+
})
19+
.views((self)=>({
20+
getviewingData():TViewing{
21+
constroot=getParent(self)asTRootStore
22+
returnroot.viewingData
23+
},
24+
getbodyScrollDirection():TScrollDirection{
25+
constroot=getParent(self)asTRootStore
26+
returnroot.globalLayout.bodyScrollDirection
27+
},
28+
getisArticleDigestInViewport():boolean{
29+
constroot=getParent(self)asTRootStore
30+
returnroot.articleDigest.inViewport
31+
},
32+
getisArticleInViewport():boolean{
33+
constroot=getParent(self)asTRootStore
34+
const{ articleInViewport}=root.postContent
35+
36+
returnarticleInViewport
37+
},
38+
getshowLeftSticker():boolean{
39+
const{
40+
isArticleDigestInViewport,
41+
isLeftStickerLocked,
42+
bodyScrollDirection,
43+
}=selfasTStore
44+
45+
if(isArticleDigestInViewport)returnfalse
46+
if(isLeftStickerLocked)returntrue
47+
48+
returnbodyScrollDirection==='down'
49+
},
50+
getshowCommunity():boolean{
51+
const{ isArticleDigestInViewport, isArticleInViewport}=selfasTStore
52+
return!isArticleDigestInViewport&&isArticleInViewport
53+
},
54+
getshowCommentSticker():boolean{
55+
const{ isArticleInViewport}=selfasTStore
56+
return!isArticleInViewport
57+
},
58+
}))
59+
.actions((self)=>({
60+
mark(sobj:Record<string,unknown>):void{
61+
markStates(sobj,self)
62+
},
63+
}))
64+
65+
exporttypeTStore=Instance<typeofArticleSticker>
66+
exportdefaultArticleSticker

‎src/spec/article.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export type TArticle = {
1212
nickname:string
1313
avatar:string
1414
}
15+
starredCount?:number
1516
origialCommunity?:TCommunity
1617
commentsParticipators?:TUser
1718
insertedAt?:string

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp