Skip to content
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit 2813a98

Browse files
mydearxymmydearxym
committed
Merge branch 'wiki-thread' into dev
2 parents e75f0a9 + bfb001d commit 2813a98

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+1293
-416
lines changed

‎components/GithubRepoPage/StatesContainers.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ const StatesContainers = ({ repo }) => (
9191
<BoxWrapper>
9292
<Label>License</Label>
9393
<Number small={repo.license.length > 5}>
94-
{R.toUpper(repo.license)}
94+
{R.toUpper(repo.license) || '--'}
9595
</Number>
9696
</BoxWrapper>
9797
</Linker>

‎components/GithubUserCard/index.js

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
/*
2+
*
3+
* GithubUserCard
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import PropTypes from 'prop-types'
9+
10+
import { ICON_CMD } from '../../config'
11+
12+
import {
13+
Wrapper,
14+
PopAvatarWrapper,
15+
UserPopInfo,
16+
PopAvatar,
17+
Username,
18+
UserBio,
19+
UserLocation,
20+
UserCompany,
21+
LabelIcon,
22+
LabelText,
23+
} from './styles'
24+
25+
import { makeDebugger, nilOrEmpty } from '../../utils'
26+
/* eslint-disable no-unused-vars */
27+
const debug = makeDebugger('c:GithubUserCard:index')
28+
/* eslint-enable no-unused-vars */
29+
30+
const GithubUserCard = ({ user }) => (
31+
<Wrapper>
32+
<PopAvatarWrapper>
33+
<PopAvatar src={user.avatar} />
34+
</PopAvatarWrapper>
35+
<UserPopInfo>
36+
<Username>{user.nickname}</Username>
37+
{!nilOrEmpty(user.bio) ? <UserBio>{user.bio}</UserBio> : null}
38+
{!nilOrEmpty(user.location) ? (
39+
<UserLocation>
40+
<LabelIcon src={`${ICON_CMD}/city_map.svg`} />
41+
<LabelText> {user.location}</LabelText>
42+
</UserLocation>
43+
) : null}
44+
{!nilOrEmpty(user.company) ? (
45+
<UserCompany>
46+
<LabelIcon src={`${ICON_CMD}/profile_company.svg`} />
47+
<LabelText> {user.company}</LabelText>
48+
</UserCompany>
49+
) : null}
50+
</UserPopInfo>
51+
</Wrapper>
52+
)
53+
54+
GithubUserCard.propTypes = {
55+
// https://www.npmjs.com/package/prop-types
56+
user: PropTypes.shape({
57+
nickname: PropTypes.string.isRequired,
58+
avatar: PropTypes.string.isRequired,
59+
bio: PropTypes.string,
60+
location: PropTypes.string,
61+
company: PropTypes.string,
62+
}),
63+
}
64+
65+
GithubUserCard.defaultProps = {
66+
user: {
67+
location: '',
68+
company: '',
69+
bio: '',
70+
},
71+
}
72+
73+
export default GithubUserCard

‎components/GithubUserCard/styles/index.js

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import styled from 'styled-components'
2+
3+
import Img from '../../Img'
4+
import { theme } from '../../../utils'
5+
6+
export const Wrapper = styled.div`
7+
display: flex;
8+
max-width: 300px;
9+
`
10+
export const PopAvatarWrapper = styled.div`
11+
margin-right: 10px;
12+
padding-top: 4px;
13+
`
14+
export const PopAvatar = styled(Img)`
15+
width: 80px;
16+
height: 80px;
17+
`
18+
export const UserPopInfo = styled.div`
19+
display: flex;
20+
flex-direction: column;
21+
`
22+
export const Username = styled.div`
23+
color: ${theme('thread.articleTitle')};
24+
font-weight: bolder;
25+
font-size: 1rem;
26+
`
27+
export const UserBio = styled.div`
28+
color: ${theme('thread.articleDigest')};
29+
font-size: 0.9rem;
30+
margin-bottom: 10px;
31+
`
32+
export const UserLocation = styled.div`
33+
display: flex;
34+
align-items: center;
35+
`
36+
export const LabelIcon = styled(Img)`
37+
fill: ${theme('thread.articleTitle')};
38+
width: 15px;
39+
height: 15px;
40+
display: block;
41+
margin-right: 5px;
42+
`
43+
export const LabelText = styled.div`
44+
color: ${theme('thread.articleTitle')};
45+
`
46+
export const UserCompany = styled.div`
47+
display: flex;
48+
align-items: center;
49+
`

‎components/GithubUserCard/tests/index.test.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
// import React from 'react'
2+
// import { shallow } from 'enzyme'
3+
4+
// import GithubUserCard from '../index'
5+
6+
describe('TODO <GithubUserCard />', () => {
7+
it('Expect to have unit tests specified', () => {
8+
expect(true).toEqual(true)
9+
})
10+
})

‎components/MarkDownRender/index.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,22 @@ const debug = makeDebugger('c:MarkDownRender:index')
3030
/* eslint-enable no-unused-vars */
3131

3232
class MarkDownRender extends React.Component {
33+
state = {
34+
body: '',
35+
}
36+
3337
componentDidMount() {
3438
Prism.highlightAll()
39+
setTimeout(() => Prism.highlightAll(), 1000)
40+
}
41+
42+
componentWillReceiveProps(nextProps) {
43+
const { body } = this.state
44+
45+
if (nextProps.body !== body) {
46+
this.setState({ body: nextProps.body })
47+
setTimeout(() => Prism.highlightAll(), 1000)
48+
}
3549
}
3650

3751
render() {

‎components/OauthHinter/styles/index.js

Lines changed: 3 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import styled, { keyframes } from 'styled-components'
1+
import styled from 'styled-components'
22

33
import Img from '../../Img'
4-
import { theme } from '../../../utils'
4+
import { theme, Animate } from '../../../utils'
55

66
export const Container = styled.div`
77
display: flex;
@@ -49,25 +49,14 @@ export const CPSLogoIcon = styled(Img)`
4949
height: 53px;
5050
margin-top: -5px;
5151
`
52-
53-
const rotate360 = keyframes`
54-
from {
55-
transform: rotate(0deg);
56-
}
57-
58-
to {
59-
transform: rotate(360deg);
60-
}
61-
`
62-
6352
export const LinkIcon = styled(Img)`
6453
fill: #6e967f;
6554
width: 23px;
6655
height: 23px;
6756
margin-left: 25px;
6857
margin-right: 25px;
6958
margin-top: 16px;
70-
animation: ${rotate360} 2s linear infinite;
59+
animation: ${Animate.rotate360} 2s linear infinite;
7160
`
7261

7362
export const GithubLogoIcon = styled(Img)`

‎components/RepoItem/styles/footer.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ export const PopoverInfo = styled.div`
3737
export const PopAvatar = styled(Img)`
3838
width: 80px;
3939
height: 80px;
40+
border-radius: 3px;
4041
`
4142
export const PopLink = styled.a`
4243
color: ${theme('thread.articleTitle')};

‎components/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ export { default as BuyMeChuanChuan } from './BuyMeChuanChuan'
4444
export { default as VideoSourceInfo } from './VideoSourceInfo'
4545

4646
export { default as GithubRepoPage } from './GithubRepoPage'
47+
export { default as GithubUserCard } from './GithubUserCard'
4748

4849
// loading component
4950
export {

‎containers/AvatarAdder/AdderPanel.js

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
import React from 'react'
2+
3+
import { ICON_CMD } from '../../config'
4+
5+
import { GithubUserCard, Maybe } from '../../components'
6+
7+
import {
8+
Wrapper,
9+
Header,
10+
SearchWrapper,
11+
LabelIcon,
12+
SearchInput,
13+
Result,
14+
Divider,
15+
Footer,
16+
AddBtn,
17+
AdderIcon,
18+
} from './styles/adder_panel'
19+
20+
import SearchLoing from './SearchLoading'
21+
22+
import * as logic from './logic'
23+
24+
const AdderPanel = ({ user, searchValue, searching, onConfirm }) => (
25+
<Wrapper>
26+
<Header>
27+
<LabelIcon src={`${ICON_CMD}/github.svg`} />
28+
<SearchInput
29+
value={searchValue}
30+
placeholder="github username"
31+
onChange={logic.inputOnChange}
32+
onKeyPress={logic.onSearch}
33+
/>
34+
</Header>
35+
<Maybe
36+
test={!searching}
37+
loading={
38+
<SearchWrapper>
39+
<SearchLoing />
40+
</SearchWrapper>
41+
}
42+
>
43+
<Maybe test={user}>
44+
<Result>
45+
<Divider />
46+
<GithubUserCard user={user} />
47+
<Divider />
48+
<Footer>
49+
<AddBtn onClick={onConfirm}>
50+
<AdderIcon src={`${ICON_CMD}/add.svg`} />
51+
<div>添加</div>
52+
</AddBtn>
53+
</Footer>
54+
</Result>
55+
</Maybe>
56+
</Maybe>
57+
</Wrapper>
58+
)
59+
60+
export default AdderPanel

‎containers/AvatarAdder/SearchLoading.js

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import React from 'react'
2+
3+
import { ICON_CMD } from '../../config'
4+
5+
import { Wrapper, LoadingIcon, LoadingText } from './styles/search_loading'
6+
7+
const SearchLoing = () => (
8+
<Wrapper>
9+
<LoadingIcon src={`${ICON_CMD}/loading_sand.svg`} />
10+
<LoadingText>Searching ...</LoadingText>
11+
</Wrapper>
12+
)
13+
14+
export default SearchLoing

‎containers/AvatarAdder/index.js

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
/*
2+
*
3+
* AvatarAdder
4+
*
5+
*/
6+
7+
import React from 'react'
8+
import { inject, observer } from 'mobx-react'
9+
import PropTypes from 'prop-types'
10+
11+
import { Popover } from '../../components'
12+
13+
import { Wrapper, AddText } from './styles'
14+
15+
import AdderPanel from './AdderPanel'
16+
17+
import { makeDebugger, storePlug } from '../../utils'
18+
import * as logic from './logic'
19+
20+
/* eslint-disable no-unused-vars */
21+
const debug = makeDebugger('C:AvatarAdder')
22+
/* eslint-enable no-unused-vars */
23+
24+
class AvatarAdderContainer extends React.Component {
25+
componentWillMount() {
26+
const { avatarAdder } = this.props
27+
logic.init(avatarAdder)
28+
}
29+
30+
onConfirm(user) {
31+
const { onConfirm } = this.props
32+
logic.onConfirm()
33+
onConfirm(user)
34+
}
35+
36+
render() {
37+
const { avatarAdder } = this.props
38+
const {
39+
popoverVisiable,
40+
githubUserData,
41+
searching,
42+
searchValue,
43+
} = avatarAdder
44+
45+
return (
46+
<Popover
47+
visible={popoverVisiable}
48+
content={
49+
<AdderPanel
50+
user={githubUserData}
51+
searchValue={searchValue}
52+
searching={searching}
53+
onConfirm={this.onConfirm.bind(this, githubUserData)}
54+
/>
55+
}
56+
placement="bottom"
57+
trigger="click"
58+
onVisibleChange={logic.onPopoverVisible.bind(this)}
59+
>
60+
<Wrapper>
61+
<AddText>+</AddText>
62+
</Wrapper>
63+
</Popover>
64+
)
65+
}
66+
}
67+
68+
AvatarAdderContainer.propTypes = {
69+
avatarAdder: PropTypes.object.isRequired,
70+
onConfirm: PropTypes.func,
71+
}
72+
73+
AvatarAdderContainer.defaultProps = {
74+
onConfirm: debug,
75+
}
76+
77+
export default inject(storePlug('avatarAdder'))(observer(AvatarAdderContainer))

‎containers/AvatarAdder/lang.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/*
2+
* AvatarAdder Langs
3+
*
4+
* This contains all the text for the AvatarAdder component.
5+
*/
6+
import { defineMessages } from 'react-intl'
7+
8+
export default defineMessages({
9+
header: {
10+
id: 'containers.AvatarAdder.header',
11+
defaultMessage: 'This is the AvatarAdder component !',
12+
},
13+
})

0 commit comments

Comments
 (0)