aboutsummaryrefslogtreecommitdiff
path: root/vnext
diff options
context:
space:
mode:
Diffstat (limited to 'vnext')
-rw-r--r--vnext/src/api/index.js16
-rw-r--r--vnext/src/components/LoginButton.js16
-rw-r--r--vnext/src/components/__tests__/LoginButton.test.js16
-rw-r--r--vnext/src/components/__tests__/__snapshots__/LoginButton.test.js.snap178
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>,
+]
+`;