New login screen #1331
New login screen #1331
Conversation
| @@ -126,7 +126,6 @@ Backend is driven by [Koa](http://koajs.com/) (API, web server), [Sequelize](htt | |||
| - `server/commands` - Domain logic, currently being refactored from /models | |||
| - `server/emails` - React rendered email templates | |||
| - `server/models` - Database models | |||
| - `server/pages` - Server-side rendered public pages | |||
There was a problem hiding this comment.
No more server-rendered marketing pages 👏
| @@ -1,36 +0,0 @@ | |||
| // @flow | |||
There was a problem hiding this comment.
🔥 Found during cleanup, not used.
| @@ -35,7 +36,7 @@ const Authenticated = observer(({ auth, children }: Props) => { | |||
| } | |||
|
|
|||
| auth.logout(true); | |||
| return null; | |||
| return <Redirect to="/" />; | |||
There was a problem hiding this comment.
🍖 Previously we relied on auth.logout() to reload the page, at which point the server would see there is no accessToken cookie and render the homepage. Now, we can just send the user to the login screen directly as it's rendered by the same React app.
| @@ -1,7 +1,7 @@ | |||
| // @flow | |||
| import styled from "styled-components"; | |||
| import breakpoint from "styled-components-breakpoint"; | |||
| import Flex from "shared/components/Flex"; | |||
| import Flex from "components/Flex"; | |||
There was a problem hiding this comment.
There are no more shared React components, so moved everything across to the main components directory.
| // @flow | ||
| import styled from "styled-components"; | ||
|
|
||
| const Notice = styled.p` |
There was a problem hiding this comment.
This is actually moved from shared and just updated a little.
| return output; | ||
| } | ||
|
|
||
| router.post("auth.config", async ctx => { |
There was a problem hiding this comment.
🍖 New unauthorized API endpoint returns signin options, depending on subdomain / root / self hosted.
| @@ -122,12 +43,17 @@ router.get("/opensearch.xml", ctx => { | |||
| ctx.body = opensearchResponse(); | |||
| }); | |||
|
|
|||
| // catch all for react app | |||
| // catch all for application | |||
There was a problem hiding this comment.
🍖 so much simpler now we don't have to detect cookies or render static pages.
| if ( | ||
| !parsed || | ||
| !parsed.subdomain || | ||
| parsed.subdomain === "app" || |
There was a problem hiding this comment.
🍖 Do not consider app. to be a team subdomain, it will be used for the root login and www. will be used for marketing site. This should not affect self hosted installations as they do not have multiple subdomains.
| 'process.env': { | ||
| DEPLOYMENT: JSON.stringify(process.env.DEPLOYMENT), |
There was a problem hiding this comment.
🍖 This was a mistake, it should have been here before
| URL: JSON.stringify(process.env.URL), | ||
| TEAM_LOGO: JSON.stringify(process.env.TEAM_LOGO), |
There was a problem hiding this comment.
🍖 This is new, TEAM_LOGO value was not previously accessed by the client
Removes the final pieces of marketing page content from this repo (If you're interested, they'll be served from a separate server/repo here: https://github.com/outline/website). In doing so we'll rebuild the login screen to actually look like… well, a login screen.
This means a big code size reduction, reduce complexity of the server, reduced complexity of the signin flow, and a clearer separation of concerns between marketing/app. It was also an opportunity to fix the issue with email signin not being available in self-hosted installations.
TODO
Screenshots
Subdomain signin (with guest signin enabled)
Root signin (dark mode)
Self hosted
closes #1316
closes #1203
closes #1121
closes #1106
related #862