diff options
| -rw-r--r-- | vnext/src/api/index.js | 16 | ||||
| -rw-r--r-- | vnext/src/components/LoginButton.js | 16 | ||||
| -rw-r--r-- | vnext/src/components/__tests__/LoginButton.test.js | 16 | ||||
| -rw-r--r-- | vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap | 178 |
4 files changed, 217 insertions, 9 deletions
diff --git a/vnext/src/api/index.js b/vnext/src/api/index.js index b190bc48..591f874a 100644 --- a/vnext/src/api/index.js +++ b/vnext/src/api/index.js @@ -1,7 +1,9 @@ import axios from 'axios'; +const apiBaseUrl = 'https://api.juick.com'; + const client = axios.create({ - baseURL: 'https://api.juick.com/' + baseURL: apiBaseUrl }); client.interceptors.request.use(config => { if (localStorage.visitor) { @@ -61,4 +63,16 @@ export function comment(mid, rid, body, attach) { form.append('body', body); form.append('attach', attach); return client.post('/comment', form) +} + +function socialLink(network) { + return `${apiBaseUrl}/_${network}login?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`; +} + +export function facebookLink() { + return socialLink('fb'); +} + +export function vkLink() { + return socialLink('vk'); }
\ No newline at end of file diff --git a/vnext/src/components/LoginButton.js b/vnext/src/components/LoginButton.js index e59dabdf..05f5df97 100644 --- a/vnext/src/components/LoginButton.js +++ b/vnext/src/components/LoginButton.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import Icon from './Icon'; import Modal from './Modal'; -import { me } from '../api'; +import { me, facebookLink, vkLink } from '../api'; export default class LoginButton extends React.Component { constructor(props) { @@ -51,13 +51,13 @@ export default class LoginButton extends React.Component { <div className="dialoglogin"> <p>Please, introduce yourself:</p> <div style={socialButtonsStyle}> - <a href={`https://api.juick.com/_fblogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} style={facebookButtonStyle}> - <Icon name="ei-sc-facebook" size="s" noFill={true} />Log in - </a> - <a href={`https://api.juick.com/_vklogin?state=${window.location.protocol}//${window.location.host}${window.location.pathname}`} style={vkButtonStyle}> - <Icon name="ei-sc-vk" size="s" noFill={true} /> - Log in - </a> + <a href={facebookLink()} style={facebookButtonStyle}> + <Icon name="ei-sc-facebook" size="s" noFill={true} />Log in + </a> + <a href={vkLink()} style={vkButtonStyle}> + <Icon name="ei-sc-vk" size="s" noFill={true} /> + Log in + </a> </div> <p>Already registered?</p> <form onSubmit={this.login}> diff --git a/vnext/src/components/__tests__/LoginButton.test.js b/vnext/src/components/__tests__/LoginButton.test.js new file mode 100644 index 00000000..0b672365 --- /dev/null +++ b/vnext/src/components/__tests__/LoginButton.test.js @@ -0,0 +1,16 @@ +import React from 'react'; + +import LoginButton from '../LoginButton'; +import renderer from 'react-test-renderer'; + +test('Login button and form are renders correctly', () => { + const button = renderer.create( + <LoginButton title="Log in" onAuth={() => {}} /> + ); + let link = button.toJSON(); + expect(link).toMatchSnapshot(); + + button.root.instance.toggleModal(); + let modal = button.toJSON(); + expect(modal).toMatchSnapshot(); +});
\ No newline at end of file diff --git a/vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap b/vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap new file mode 100644 index 00000000..cc01126f --- /dev/null +++ b/vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap @@ -0,0 +1,178 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Login button and form are renders correctly 1`] = ` +<a + onClick={[Function]} +> + <div + className="icon icon--ei-user icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-user-icon />", + } + } + /> + </div> + Log in +</a> +`; + +exports[`Login button and form are renders correctly 2`] = ` +Array [ + <a + onClick={[Function]} + > + <div + className="icon icon--ei-user icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-user-icon />", + } + } + /> + </div> + Log in + </a>, + <div + id="dialogt" + style={ + Object { + "backgroundColor": "rgba(0,0,0,0.3)", + "bottom": 0, + "left": 0, + "padding": 50, + "position": "fixed", + "right": 0, + "top": 0, + } + } + > + <div + id="dialogw" + > + <div + id="dialog_header" + > + <div + id="dialogc" + onClick={[Function]} + > + <div + className="icon icon--ei-close icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-close-icon />", + } + } + /> + </div> + </div> + </div> + <div + className="dialoglogin" + > + <p> + Please, introduce yourself: + </p> + <div + style={ + Object { + "display": "flex", + "justifyContent": "space-evenly", + "padding": "4px", + } + } + > + <a + href="https://api.juick.com/_fblogin?state=about://blank" + style={ + Object { + "background": "#3b5998", + "color": "#fff", + "padding": "2px 14px", + } + } + > + <div + className="icon icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-sc-facebook-icon />", + } + } + /> + </div> + Log in + </a> + <a + href="https://api.juick.com/_vklogin?state=about://blank" + style={ + Object { + "background": "#4c75a3", + "color": "#fff", + "padding": "2px 14px", + } + } + > + <div + className="icon icon--s" + > + <svg + className="icon__cnt" + dangerouslySetInnerHTML={ + Object { + "__html": "<use xlink:href=#ei-sc-vk-icon />", + } + } + /> + </div> + Log in + </a> + </div> + <p> + Already registered? + </p> + <form + onSubmit={[Function]} + > + <input + className="signinput" + name="username" + onChange={[Function]} + placeholder="Username..." + type="text" + value="" + /> + <br /> + <input + className="signinput" + name="password" + onChange={[Function]} + placeholder="Password..." + type="password" + value="" + /> + <br /> + <input + className="signsubmit" + type="submit" + value="OK" + /> + </form> + </div> + </div> + </div>, +] +`; |