From 524afd8b44635329252bd3684a2d639d3cfdccdf Mon Sep 17 00:00:00 2001 From: Tom Moor Date: Sun, 22 Oct 2017 20:29:27 -0700 Subject: [PATCH] SignIn / SignOut working --- frontend/menus/AccountMenu.js | 2 +- frontend/scenes/SlackAuth/SlackAuth.js | 8 +++++-- frontend/stores/AuthStore.js | 2 +- frontend/utils/routeHelpers.js | 25 ++++++++++++++++++++++ server/pages/About.js | 12 +++-------- server/pages/Home.js | 29 +++++++++++++------------- server/pages/Pricing.js | 14 ++++--------- server/pages/components/Hero.js | 10 +++++++++ server/static/index.html | 4 ++-- 9 files changed, 66 insertions(+), 40 deletions(-) create mode 100644 server/pages/components/Hero.js diff --git a/frontend/menus/AccountMenu.js b/frontend/menus/AccountMenu.js index 77ca6cb2d..4a701da9b 100644 --- a/frontend/menus/AccountMenu.js +++ b/frontend/menus/AccountMenu.js @@ -24,7 +24,7 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu'; handleLogout = () => { this.props.auth.logout(); - this.props.history.push('/'); + window.location.href = BASE_URL; }; render() { diff --git a/frontend/scenes/SlackAuth/SlackAuth.js b/frontend/scenes/SlackAuth/SlackAuth.js index 2846b75ad..87a0ff7f1 100644 --- a/frontend/scenes/SlackAuth/SlackAuth.js +++ b/frontend/scenes/SlackAuth/SlackAuth.js @@ -5,6 +5,7 @@ import queryString from 'query-string'; import { observable } from 'mobx'; import { observer, inject } from 'mobx-react'; import { client } from 'utils/ApiClient'; +import { slackAuth } from 'utils/routeHelpers'; import AuthStore from 'stores/AuthStore'; @@ -33,7 +34,7 @@ type Props = { } else { this.redirectTo = '/auth/error'; } - } else { + } else if (code) { if (this.props.location.pathname === '/auth/slack/commands') { // User adding webhook integrations try { @@ -43,7 +44,7 @@ type Props = { this.redirectTo = '/auth/error'; } } else { - // Regular Slack authentication + // Slack authentication const redirectTo = sessionStorage.getItem('redirectTo'); sessionStorage.removeItem('redirectTo'); @@ -52,6 +53,9 @@ type Props = { ? (this.redirectTo = redirectTo || '/dashboard') : (this.redirectTo = '/auth/error'); } + } else { + // Sign In + window.location.href = slackAuth(this.props.auth.getOauthState()); } } diff --git a/frontend/stores/AuthStore.js b/frontend/stores/AuthStore.js index 99c8305bd..d165de33c 100644 --- a/frontend/stores/AuthStore.js +++ b/frontend/stores/AuthStore.js @@ -34,7 +34,7 @@ class AuthStore { @action logout = () => { this.user = null; this.token = null; - Cookie.remove('loggedId', { path: '/' }); + Cookie.remove('loggedIn', { path: '/' }); }; @action getOauthState = () => { diff --git a/frontend/utils/routeHelpers.js b/frontend/utils/routeHelpers.js index 4db4200f7..b1e5f16ab 100644 --- a/frontend/utils/routeHelpers.js +++ b/frontend/utils/routeHelpers.js @@ -22,6 +22,31 @@ export function documentUrl(doc: Document): string { return doc.url; } +export function slackAuth( + state: string, + scopes: string[] = [ + 'identity.email', + 'identity.basic', + 'identity.avatar', + 'identity.team', + ], + redirectUri: string = `${BASE_URL}/auth/slack` +): string { + const baseUrl = 'https://slack.com/oauth/authorize'; + const params = { + client_id: SLACK_KEY, + scope: scopes ? scopes.join(' ') : '', + redirect_uri: redirectUri, + state, + }; + + const urlParams = Object.keys(params) + .map(key => `${key}=${encodeURIComponent(params[key])}`) + .join('&'); + + return `${baseUrl}?${urlParams}`; +} + export function documentNewUrl(doc: Document): string { const newUrl = `${doc.collection.url}/new`; if (doc.parentDocumentId) { diff --git a/server/pages/About.js b/server/pages/About.js index 5d7c43d24..281ff9197 100644 --- a/server/pages/About.js +++ b/server/pages/About.js @@ -1,14 +1,8 @@ // @flow import React from 'react'; -import styled from 'styled-components'; import Grid from 'styled-components-grid'; import { Helmet } from 'react-helmet'; - -const Header = styled.div` - width: 100%; - padding: 3em; - text-align: center; -`; +import Hero from './components/Hero'; export default function About() { return ( @@ -16,12 +10,12 @@ export default function About() { About -
+

About Atlas

Just a proof of concept for multiple pages.

-
+ ); } diff --git a/server/pages/Home.js b/server/pages/Home.js index 4eb54c01c..149e4139e 100644 --- a/server/pages/Home.js +++ b/server/pages/Home.js @@ -2,25 +2,24 @@ import React from 'react'; import styled from 'styled-components'; import Grid from 'styled-components-grid'; +import Hero from './components/Hero'; const Unit = Grid.Unit; -const Header = styled.div` - width: 100%; +const Feature = styled(Unit)` padding: 3em; - text-align: center; `; export default function Home() { return ( -
+

Your team’s knowledge base

Documentation, meeting notes, playbooks, onboarding, work logs, brainstorming, decisions, & more…

- Sign In -
+ Sign In +

Blazing Fast

@@ -39,30 +38,30 @@ export default function Home() { -

Markdown Support

+

Beautiful Editor

Documents are stored in Markdown and you can export them at any time. Markdown shortcuts are also built right into the editor so you can easily format using markdown syntax or our GUI.

- +

Powerful Search

Built-in search makes that one document easy to find in a large knowledgebase.

- - + +

API & Integrations

- Atlas is built on it’s own API, treat Atlas as a CMS or automatically great documents from outside events. + Atlas is built on it’s own API, treat Atlas as a CMS or automatically create documents from outside events.

- - + +

Open Source

- Want to contribute or host Atlas yourself? All of the code is on GitHub. + Want to contribute or host Atlas yourself? All of the code is available on GitHub.

- + ); } diff --git a/server/pages/Pricing.js b/server/pages/Pricing.js index 15e861c00..d8d76ec66 100644 --- a/server/pages/Pricing.js +++ b/server/pages/Pricing.js @@ -1,14 +1,8 @@ // @flow import React from 'react'; -import styled from 'styled-components'; import Grid from 'styled-components-grid'; import { Helmet } from 'react-helmet'; - -const Header = styled.div` - width: 100%; - padding: 3em; - text-align: center; -`; +import Hero from './components/Hero'; export default function Pricing() { return ( @@ -16,12 +10,12 @@ export default function Pricing() { Pricing -
+

Pricing

- Just a proof of concept for multiple pages. + Explore Atlas with a 14 day trial, free forever for teams smaller than 5.

-
+ ); } diff --git a/server/pages/components/Hero.js b/server/pages/components/Hero.js new file mode 100644 index 000000000..2da5efdbf --- /dev/null +++ b/server/pages/components/Hero.js @@ -0,0 +1,10 @@ +// @flow +import styled from 'styled-components'; + +const Hero = styled.div` + width: 100%; + padding: 4em 3em; + text-align: center; +`; + +export default Hero; diff --git a/server/static/index.html b/server/static/index.html index 3613c5c07..612e83c83 100644 --- a/server/static/index.html +++ b/server/static/index.html @@ -25,7 +25,7 @@
+ - - \ No newline at end of file +