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.

Commit5031f06

Browse files
committed
feat: prettfiy oauth callback window
1 parent9312855 commit5031f06

File tree

7 files changed

+224
-25
lines changed

7 files changed

+224
-25
lines changed

‎components/OauthHinter/index.js‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
/*
2+
*
3+
* OauthHinter
4+
*
5+
*/
6+
7+
importReactfrom'react'
8+
9+
import{withTheme}from'styled-components'
10+
11+
import{ICON_ASSETS}from'../../config'
12+
13+
import{
14+
Container,
15+
HintWrapper,
16+
IconsWrapper,
17+
TextWrapper,
18+
HintTitle,
19+
HintDesc,
20+
CPSMdLogoWrapper,
21+
CPSMdLogo,
22+
CPSLogoIcon,
23+
LinkIcon,
24+
GithubLogoIcon,
25+
FooterWrapper,
26+
IssueLink,
27+
}from'./styles'
28+
import{makeDebugger}from'../../utils'
29+
/* eslint-disable no-unused-vars */
30+
constdebug=makeDebugger('c:OauthHinter:index')
31+
/* eslint-enable no-unused-vars */
32+
33+
constOauthHinter=()=>{
34+
return(
35+
<Container>
36+
<CPSMdLogoWrapper>
37+
<CPSMdLogosrc={`${ICON_ASSETS}/cmd/cps_logo_md.png`}/>
38+
</CPSMdLogoWrapper>
39+
<HintWrapper>
40+
<IconsWrapper>
41+
<CPSLogoIconsrc={`${ICON_ASSETS}/cmd/keyboard_logo.svg`}/>
42+
<LinkIconsrc={`${ICON_ASSETS}/cmd/oauth_link.svg`}/>
43+
<GithubLogoIconsrc={`${ICON_ASSETS}/cmd/github.svg`}/>
44+
</IconsWrapper>
45+
<TextWrapper>
46+
<HintTitle>绑定成功，请稍等</HintTitle>
47+
<HintDesc>如果长时间未响应，请关闭页面重新尝试</HintDesc>
48+
</TextWrapper>
49+
</HintWrapper>
50+
<FooterWrapper>
51+
please{' '}
52+
<IssueLink
53+
href="https://github.com/coderplanets/coderplanets_server/issues/new"
54+
rel="noopener noreferrer"
55+
target="_blank"
56+
>
57+
report issue
58+
</IssueLink>{' '}
59+
if you think sth goes wrong.
60+
</FooterWrapper>
61+
</Container>
62+
)
63+
}
64+
65+
exportdefaultwithTheme(OauthHinter)
Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
importstyled,{keyframes}from'styled-components'
2+
3+
import{Img}from'../..'
4+
import{theme}from'../../../utils'
5+
6+
exportconstContainer=styled.div`
7+
display: flex;
8+
justify-content: space-between;
9+
align-items: center;
10+
flex-direction: column;
11+
height: 100vh;
12+
background:${theme('banner.bg')};
13+
background-image: url('https://www.transparenttextures.com/patterns/transparent-square-tiles.png');
14+
border-top: 4px solid;
15+
border-top-color:${theme('preview.topLine')};
16+
`
17+
18+
exportconstCPSMdLogoWrapper=styled.div`
19+
align-self: center;
20+
margin-right: -5px;
21+
margin-top: 5px;
22+
`
23+
exportconstCPSMdLogo=styled(Img)`
24+
width: 200px;
25+
`
26+
exportconstIconsWrapper=styled.div`
27+
display: flex;
28+
justify-content: center;
29+
`
30+
31+
exportconstTextWrapper=styled.div`
32+
display: flex;
33+
flex-direction: column;
34+
align-items: center;
35+
margin-top: 15px;
36+
`
37+
exportconstHintTitle=styled.div`
38+
color:${theme('thread.articleTitle')};
39+
font-size: 1.2rem;
40+
`
41+
exportconstHintDesc=styled.div`
42+
color:${theme('thread.articleDigest')};
43+
margin-top: 4px;
44+
`
45+
46+
// fill: ${theme('font')};
47+
exportconstCPSLogoIcon=styled(Img)`
48+
width: 53px;
49+
height: 53px;
50+
margin-top: -5px;
51+
`
52+
53+
constrotate360=keyframes`
54+
from {
55+
transform: rotate(0deg);
56+
}
57+
58+
to {
59+
transform: rotate(360deg);
60+
}
61+
`
62+
63+
exportconstLinkIcon=styled(Img)`
64+
fill: #6e967f;
65+
width: 23px;
66+
height: 23px;
67+
margin-left: 25px;
68+
margin-right: 25px;
69+
margin-top: 16px;
70+
animation:${rotate360} 2s linear infinite;
71+
`
72+
73+
exportconstGithubLogoIcon=styled(Img)`
74+
fill:${theme('sidebar.bg')};
75+
width: 50px;
76+
height: 50px;
77+
`
78+
79+
exportconstHintWrapper=styled.div`
80+
display: flex;
81+
flex-direction: column;
82+
margin-top: -15%;
83+
color:${theme('banner.title')};
84+
`
85+
86+
exportconstFooterWrapper=styled.div`
87+
color:${theme('thread.articleDigest')};
88+
margin-bottom: 10px;
89+
`
90+
91+
exportconstIssueLink=styled.a`
92+
text-decoration: underline;
93+
font-weight: bolder;
94+
transition: color 0.3s;
95+
color:${theme('thread.articleDigest')};
96+
97+
&:hover {
98+
color:${theme('banner.title')};
99+
cursor: pointer;
100+
}
101+
`
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 OauthHinter from '../index'
5+
6+
describe('TODO <OauthHinter />',()=>{
7+
it('Expect to have unit tests specified',()=>{
8+
expect(true).toEqual(true)
9+
})
10+
})

‎components/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ export { default as Popover } from './Popover'
99
export{Space,SpaceGrow}from'./BaseStyled'
1010

1111
// Utils component
12+
export{defaultasOauthHinter}from'./OauthHinter'
1213
export{defaultasMarkDownRender}from'./MarkDownRender'
1314
export{defaultasContentFilter}from'./ContentFilter'
1415
export{defaultasFileUploader}from'./FileUploader'

‎containers/Doraemon/logic.js‎

Lines changed: 1 addition & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -48,38 +48,17 @@ function queryPocket() {
4848
pockect$.query(store.inputValue)
4949
}
5050

51-
/*
52-
function simuUserLogin() {
53-
const data = {
54-
id: '112',
55-
token:
56-
'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJhdWQiOiJtYXN0YW5pX3NlcnZlciIsImV4cCI6MTUyNTI2Nzc3NCwiaWF0IjoxNTI0MDU4MTc0LCJpc3MiOiJtYXN0YW5pX3NlcnZlciIsImp0aSI6IjdiNjdhYzJmLTIwMjYtNDMzNy04MjcyLTVmYjY0ZDMxMGVjNyIsIm5iZiI6MTUyNDA1ODE3Mywic3ViIjoiMTEyIiwidHlwIjoiYWNjZXNzIn0.mm0GuOhzs8UYikPZGnIKQpnGYJQiwzEtCx2xeRn1qcT3sOT6Yg3GvM303OxDoGHnrNf72HSjwVxiCO6mXkq8mg',
57-
nickname: 'mydearxym',
58-
avatar: 'https://avatars2.githubusercontent.com/u/6184465?v=4',
59-
bio:
60-
"everyday is the opportunity you can't get back,so live life to the fullest",
61-
fromGithub: true,
62-
}
63-
64-
BStore.set('user', data)
65-
66-
store.updateAccount(data)
67-
}
68-
69-
*/
70-
7151
exportfunctiongithubLoginHandler(){
7252
// header.openPreview(type)
7353
debug('just previewAccount ..',process.env.GITHUB_CLIENT_ID)
7454

7555
constclientId=process.env.GITHUB_CLIENT_ID
7656
constinfo='from_github'
7757
// TODO: prettify signin page
78-
constcb='http://www.coderplanets.com'
58+
constcb='http://www.coderplanets.com/oauth'
7959
constgithub='https://github.com/login/oauth/authorize'
8060
consturl=`${github}?client_id=${clientId}&state=${info}&redirect_uri=${cb}`
8161

82-
console.log('oauthPopup url',url)
8362
oauthPopup(url)
8463

8564
Global.addEventListener('message',e=>{

‎pages/oauth.js‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
importReactfrom'react'
2+
import{Provider}from'mobx-react'
3+
4+
importGAWraperfrom'../components/GAWraper'
5+
importinitRootStorefrom'../stores/init'
6+
importThemeWrapperfrom'../containers/ThemeWrapper'
7+
8+
import{OauthHinter}from'../components'
9+
10+
exportdefaultclassIndexextendsReact.Component{
11+
staticgetInitialProps(){
12+
return{}
13+
}
14+
15+
constructor(props){
16+
super(props)
17+
this.store=initRootStore({langSetup:''})
18+
}
19+
20+
// <Doraemon />
21+
22+
render(){
23+
return(
24+
<Providerstore={this.store}>
25+
<GAWraper>
26+
<ThemeWrapper>
27+
<OauthHinter/>
28+
</ThemeWrapper>
29+
</GAWraper>
30+
</Provider>
31+
)
32+
}
33+
}

‎stores/AccountStore/index.js‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,9 @@ const AccountStore = t
3636
},
3737

3838
getsubscribedCommunities(){
39-
const{user:{ subscribedCommunities}}=self
39+
const{
40+
user:{ subscribedCommunities},
41+
}=self
4042
return{
4143
...stripMobx(subscribedCommunities),
4244
}
@@ -72,7 +74,11 @@ const AccountStore = t
7274
self.user.subscribedCommunities=data
7375
},
7476
addSubscribedCommunity(community){
75-
const{user:{subscribedCommunities:{ entries}}}=self
77+
const{
78+
user:{
79+
subscribedCommunities:{ entries},
80+
},
81+
}=self
7682

7783
self.user.subscribedCommunities.entries=R.insert(0,community,entries)
7884
self.user.subscribedCommunities.totalCount+=1
@@ -81,7 +87,11 @@ const AccountStore = t
8187
},
8288

8389
removeSubscribedCommunity(community){
84-
const{user:{subscribedCommunities:{ entries}}}=self
90+
const{
91+
user:{
92+
subscribedCommunities:{ entries},
93+
},
94+
}=self
8595

8696
constindex=R.findIndex(R.propEq('id',community.id),entries)
8797
self.user.subscribedCommunities.entries=R.remove(index,1,entries)

0 commit comments

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