migrate git gateway backend

packages/netlify-cms-backend-git-gateway/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "netlify-cms-backend-git-gateway",
+  "description": "Git Gateway backend for Netlify CMS",
+  "version": "2.0.0-alpha.0",
+  "license": "MIT",
+  "main": "dist/netlify-cms-backend-git-gateway.js",
+  "keywords": [
+    "netlify",
+    "netlify-cms",
+    "backend",
+    "git-gateway",
+    "gateway"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "watch": "webpack -w",
+    "build": "webpack"
+  },
+  "dependencies": {
+    "gotrue-js": "^0.9.22",
+    "jwt-decode": "^2.2.0"
+  },
+  "devDependencies": {
+    "webpack": "^4.16.1",
+    "webpack-cli": "^3.1.0"
+  },
+  "peerDependencies": {
+    "immutable": "^3.7.6",
+    "lodash": "^4.17.10",
+    "netlify-cms-backend-github": "2.0.0-alpha.0",
+    "netlify-cms-backend-gitlab": "2.0.0-alpha.0",
+    "netlify-cms-lib-auth": "2.0.0-alpha.0",
+    "netlify-cms-lib-util": "2.0.0-alpha.0",
+    "netlify-cms-ui-default": "2.0.0-alpha.0",
+    "prop-types": "^15.6.2",
+    "react": "^16.4.1",
+    "react-emotion": "^9.2.6"
+  }
+}

packages/netlify-cms-backend-git-gateway/src/AuthenticationPage.js

@@ -1,10 +1,59 @@
 import PropTypes from 'prop-types';
-import React from "react";
+import React from 'react';
+import styled from 'react-emotion';
 import { partial } from 'lodash';
-import { Icon } from 'netlify-cms-ui-default';
+import {
+  Icon,
+  AuthenticationPage,
+  buttons,
+  shadows,
+  colors,
+  colorsRaw,
+  lengths
+} from 'netlify-cms-ui-default';
+
+const LoginButton = styled.button`
+  ${buttons.button};
+  ${shadows.dropDeep};
+  ${buttons.default};
+  ${buttons.gray};
+
+  padding: 0 30px;
+  display: block;
+  margin-top: 20px;
+  margin-left: auto;
+`
+
+const AuthForm = styled.form`
+  width: 350px;
+  margin-top: -80px;
+`
+
+const AuthInput = styled.input`
+  background-color: ${colorsRaw.white};
+  border-radius: ${lengths.borderRadius};
+
+  font-size: 14px;
+  padding: 10px 10px;
+  margin-bottom: 15px;
+  margin-top: 6px;
+  width: 100%;
+  position: relative;
+  z-index: 1;
+
+  &:focus {
+    outline: none;
+    box-shadow: inset 0 0 0 2px ${colors.active};
+  }
+`
+
+const ErrorMessage = styled.p`
+  color: ${colors.errorText};
+`
 
 let component = null;
 
+console.log(window.netlifyIdentity);
 if (window.netlifyIdentity) {
   window.netlifyIdentity.on('login', (user) => {
     component && component.handleIdentityLogin(user);
@@ -14,7 +63,7 @@ if (window.netlifyIdentity) {
   });
 }
 
-export default class AuthenticationPage extends React.Component {
+export default class GitGatewayAuthenticationPage extends React.Component {
   constructor(props) {
     super(props);
     component = this;
@@ -91,45 +140,40 @@ export default class AuthenticationPage extends React.Component {
     const { error, inProgress } = this.props;
 
     if (window.netlifyIdentity) {
-      return <section className="nc-gitGatewayAuthenticationPage-root">
-        <Icon className="nc-githubAuthenticationPage-logo" size="500px" type="netlify-cms"/>
-        <button className="nc-githubAuthenticationPage-button" onClick={this.handleIdentity}>
-          Login with Netlify Identity
-        </button>
-      </section>
+      return (
+        <AuthenticationPage
+          onLogin={this.handleIdentity}
+          renderButtonContent={() => 'Login with Netlify Identity'}
+        />
+      );
     }
 
+    console.log('returning');
+
     return (
-      <section className="nc-gitGatewayAuthenticationPage-root">
-        <Icon className="nc-githubAuthenticationPage-logo" size="500px" type="netlify-cms"/>
-        <form className="nc-gitGatewayAuthenticationPage-form" onSubmit={this.handleLogin}>
-          {!error && <p>
-            <span className="nc-gitGatewayAuthenticationPage-errorMsg">{error}</span>
-          </p>}
-          {!errors.server && <p>
-            <span className="nc-gitGatewayAuthenticationPage-errorMsg">{errors.server}</span>
-          </p>}
-          <div className="nc-gitGatewayAuthenticationPage-errorMsg">{ errors.email || null }</div>
-          <input
+      <AuthenticationPage renderPageContent={() => (
+        <AuthForm onSubmit={this.handleLogin}>
+          {!error ? null : <ErrorMessage>{error}</ErrorMessage>}
+          {!errors.server ? null : <ErrorMessage>{errors.server}</ErrorMessage>}
+          <ErrorMessage>{errors.email || null}</ErrorMessage>
+          <AuthInput
             type="text"
             name="email"
             placeholder="Email"
             value={this.state.email}
             onChange={partial(this.handleChange, 'email')}
           />
-          <div className="nc-gitGatewayAuthenticationPage-errorMsg">{ errors.password || null }</div>
-          <input
+          <ErrorMessage>{errors.password || null}</ErrorMessage>
+          <AuthInput
             type="password"
             name="password"
             placeholder="Password"
             value={this.state.password}
             onChange={partial(this.handleChange, 'password')}
           />
-          <button className="nc-gitGatewayAuthenticationPage-button" disabled={inProgress}>
-            {inProgress ? "Logging in..." : "Login"}
-          </button>
-        </form>
-      </section>
+          <LoginButton disabled={inProgress}>{inProgress ? 'Logging in...' : 'Login'}</LoginButton>
+        </AuthForm>
+      )}/>
     );
   }
 }

packages/netlify-cms-backend-git-gateway/src/implementation.js

@@ -1,6 +1,6 @@
 import GoTrue from "gotrue-js";
 import jwtDecode from 'jwt-decode';
-import {List} from 'immutable';
+import { List } from 'immutable';
 import { get, pick, intersection } from "lodash";
 import { unsentRequest } from "netlify-cms-lib-util";
 import { GitHubBackend } from "netlify-cms-backend-github";

packages/netlify-cms-backend-git-gateway/src/index.js

@@ -0,0 +1,3 @@
+export GitGatewayBackend from './implementation';
+export AuthenticationPage from './AuthenticationPage';
+

packages/netlify-cms-backend-git-gateway/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('../../webpack.config.js');

packages/netlify-cms-core/example/config.yml

@@ -1,11 +1,9 @@
 backend:
-  name: gitlab
-  repo: erquhart/blank
+  name: test-repo
 
 display_url: https://example.com
 media_folder: "assets/uploads"
 
-
 collections: # A list of collections the CMS should be able to edit
   - name: "posts" # Used in routes, ie.: /admin/collections/:slug/edit
     label: "Posts" # Used in the UI

packages/netlify-cms-core/example/index.html

@@ -4,7 +4,7 @@
   <meta charset="utf-8" />
 
   <title>Netlify CMS Development Test</title>
-
+  <script type="text/javascript" src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
   <script>
   window.repoFiles = {
     _posts: {

packages/netlify-cms-core/src/backend.js

@@ -3,6 +3,7 @@ import { fromJS, Map } from 'immutable';
 import fuzzy from 'fuzzy';
 import { GitHubBackend } from "netlify-cms-backend-github";
 import { GitLabBackend } from "netlify-cms-backend-gitlab";
+import { GitGatewayBackend } from "netlify-cms-backend-git-gateway";
 import { TestBackend } from "netlify-cms-backend-test";
 import { resolveFormat } from "Formats/formats";
 import { selectIntegration } from 'Reducers/integrations';
@@ -19,7 +20,6 @@ import {
 import { createEntry } from "ValueObjects/Entry";
 import { sanitizeSlug } from "Lib/urlHelper";
 import BitBucketBackend from "./bitbucket/implementation";
-import GitGatewayBackend from "./git-gateway/implementation";
 import { registerBackend, getBackend } from 'Lib/registry';
 import { Cursor, CURSOR_COMPATIBILITY_SYMBOL } from 'netlify-cms-lib-util';
 import { EDITORIAL_WORKFLOW, status } from 'Constants/publishModes';

packages/netlify-cms-core/src/backends/git-gateway/API.js

@@ -1,106 +0,0 @@
-import { API as GithubAPI } from "netlify-cms-backend-github";
-import { APIError } from "netlify-cms-lib-util";
-
-export default class API extends GithubAPI {
-  constructor(config) {
-    super(config);
-    this.api_root = config.api_root;
-    this.tokenPromise = config.tokenPromise;
-    this.commitAuthor = config.commitAuthor;
-    this.repoURL = "";
-  }
-
-  hasWriteAccess() {
-    return this.getBranch()
-      .then(() => true)
-      .catch(error => {
-        if (error.status === 401) {
-          if (error.message === "Bad credentials") {
-            throw new APIError("Git Gateway Error: Please ask your site administrator to reissue the Git Gateway token.", error.status, 'Git Gateway');
-          } else {
-            return false;
-          }
-        } else if (error.status === 404 && (error.message === undefined || error.message === "Unable to locate site configuration")) {
-          throw new APIError(`Git Gateway Error: Please make sure Git Gateway is enabled on your site.`, error.status, 'Git Gateway');
-        } else {
-          console.error("Problem fetching repo data from Git Gateway");
-          throw error;
-        }
-      });
-  }
-
-  getRequestHeaders(headers = {}) {
-    return this.tokenPromise()
-    .then((jwtToken) => {
-      const baseHeader = {
-        "Authorization": `Bearer ${ jwtToken }`,
-        "Content-Type": "application/json",
-        ...headers,
-      };
-
-      return baseHeader;
-    });
-  }
-
-
-  urlFor(path, options) {
-    const cacheBuster = new Date().getTime();
-    const params = [`ts=${ cacheBuster }`];
-    if (options.params) {
-      for (const key in options.params) {
-        params.push(`${ key }=${ encodeURIComponent(options.params[key]) }`);
-      }
-    }
-    if (params.length) {
-      path += `?${ params.join("&") }`;
-    }
-    return this.api_root + path;
-  }
-
-  user() {
-    return Promise.resolve(this.commitAuthor);
-  }
-
-  request(path, options = {}) {
-    const url = this.urlFor(path, options);
-    let responseStatus;
-    return this.getRequestHeaders(options.headers || {})
-    .then(headers => fetch(url, { ...options, headers }))
-    .then((response) => {
-      responseStatus = response.status;
-      const contentType = response.headers.get("Content-Type");
-      if (contentType && contentType.match(/json/)) {
-        return this.parseJsonResponse(response);
-      }
-      const text = response.text();
-      if (!response.ok) {
-        return Promise.reject(text);
-      }
-      return text;
-    })
-    .catch(error => {
-      throw new APIError((error.message || error.msg), responseStatus, 'Git Gateway');
-    });
-  }
-
-  commit(message, changeTree) {
-    const commitParams = {
-      message,
-      tree: changeTree.sha,
-      parents: changeTree.parentSha ? [changeTree.parentSha] : [],
-    };
-
-    if (this.commitAuthor) {
-      commitParams.author = {
-        ...this.commitAuthor,
-        date: new Date().toISOString(),
-      };
-    }
-
-    return this.request("/git/commits", {
-      method: "POST",
-      body: JSON.stringify(commitParams),
-    });
-  }
-
-}

packages/netlify-cms-core/src/backends/git-gateway/AuthenticationPage.css

@@ -1,45 +0,0 @@
-.nc-gitGatewayAuthenticationPage-root {
-  display: flex;
-  flex-flow: column nowrap;
-  align-items: center;
-  justify-content: center;
-  height: 100vh;
-}
-
-.nc-gitGatewayAuthenticationPage-form {
-  width: 350px;
-  margin-top: -80px;
-  & input {
-    background-color: #fff;
-    border-radius: var(--borderRadius);
-
-    font-size: 14px;
-    padding: 10px 10px;
-    margin-bottom: 15px;
-    margin-top: 6px;
-    width: 100%;
-    position: relative;
-    z-index: 1;
-
-    &:focus {
-      outline: none;
-      box-shadow: inset 0 0 0 2px var(--colorBlue);
-    }
-  }
-}
-
-.nc-gitGatewayAuthenticationPage-button {
-  @apply(--button);
-  @apply(--dropShadowDeep);
-  @apply(--buttonDefault);
-  @apply(--buttonGray);
-
-  padding: 0 30px;
-  display: block;
-  margin-top: 20px;
-  margin-left: auto;
-}
-
-.nc-gitGatewayAuthenticationPage-errorMsg {
-  color: var(--colorErrorText);
-}

packages/netlify-cms-ui-default/src/AuthenticationPage.js

@@ -30,14 +30,26 @@ const LoginButton = styled.button`
   position: relative;
 `
 
-const AuthenticationPage = ({ onLogin, loginDisabled, loginErrorMessage, renderButtonContent }) => (
+const AuthenticationPage = ({
+  onLogin,
+  loginDisabled,
+  loginErrorMessage,
+  renderButtonContent,
+  renderPageContent,
+}) => {
+  console.log(renderPageContent);
+  return (
     <StyledAuthenticationPage>
       <PageLogoIcon size="300px" type="netlify-cms"/>
       {loginErrorMessage ? <p>{loginErrorMessage}</p> : null}
+      {!renderPageContent ? null : renderPageContent()}
+      {!renderButtonContent ? null :
         <LoginButton disabled={loginDisabled} onClick={onLogin}>
           {renderButtonContent()}
         </LoginButton>
+      }
     </StyledAuthenticationPage>
-);
+  );
+};
 
 export default AuthenticationPage;

yarn.lock

@@ -3512,7 +3512,7 @@ got@^6.7.1:
     unzip-response "^2.0.1"
     url-parse-lax "^1.0.0"
 
-gotrue-js@^0.9.15:
+gotrue-js@^0.9.15, gotrue-js@^0.9.22:
   version "0.9.22"
   resolved "https://registry.yarnpkg.com/gotrue-js/-/gotrue-js-0.9.22.tgz#2f013c59caba5a17b47ad856cd140842190f93c5"
   dependencies:
@@ -4823,7 +4823,7 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.10.0"
 
-jwt-decode@^2.1.0:
+jwt-decode@^2.1.0, jwt-decode@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/jwt-decode/-/jwt-decode-2.2.0.tgz#7d86bd56679f58ce6a84704a657dd392bba81a79"