From c1c95874f41bd2b435c39d3dea263c77eaa601eb Mon Sep 17 00:00:00 2001
From: Ananthakumar <ananthakumartpmstar@gmail.com>
Date: Tue, 5 Nov 2019 23:21:38 +0000
Subject: [PATCH] fix(backend-test-repo): show notice when test repo is in use
 (#2678)

---
 .../src/components/App/App.js                 |  1 +
 .../src/components/App/Header.js              |  3 +++
 .../src/components/UI/SettingsDropdown.js     | 19 ++++++++++++++++++-
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/netlify-cms-core/src/components/App/App.js b/packages/netlify-cms-core/src/components/App/App.js
index 3ff09bf5..a27b0a16 100644
--- a/packages/netlify-cms-core/src/components/App/App.js
+++ b/packages/netlify-cms-core/src/components/App/App.js
@@ -169,6 +169,7 @@ class App extends React.Component {
           openMediaLibrary={openMediaLibrary}
           hasWorkflow={hasWorkflow}
           displayUrl={config.get('display_url')}
+          isTestRepo={config.getIn(['backend', 'name']) === 'test-repo'}
           showMediaButton={showMediaButton}
         />
         <AppMainContainer>
diff --git a/packages/netlify-cms-core/src/components/App/Header.js b/packages/netlify-cms-core/src/components/App/Header.js
index ddb63d0d..27134f7d 100644
--- a/packages/netlify-cms-core/src/components/App/Header.js
+++ b/packages/netlify-cms-core/src/components/App/Header.js
@@ -118,6 +118,7 @@ class Header extends React.Component {
     openMediaLibrary: PropTypes.func.isRequired,
     hasWorkflow: PropTypes.bool.isRequired,
     displayUrl: PropTypes.string,
+    isTestRepo: PropTypes.bool,
     t: PropTypes.func.isRequired,
   };
 
@@ -136,6 +137,7 @@ class Header extends React.Component {
       openMediaLibrary,
       hasWorkflow,
       displayUrl,
+      isTestRepo,
       t,
       showMediaButton,
     } = this.props;
@@ -198,6 +200,7 @@ class Header extends React.Component {
             )}
             <SettingsDropdown
               displayUrl={displayUrl}
+              isTestRepo={isTestRepo}
               imageUrl={user.get('avatar_url')}
               onLogoutClick={onLogoutClick}
             />
diff --git a/packages/netlify-cms-core/src/components/UI/SettingsDropdown.js b/packages/netlify-cms-core/src/components/UI/SettingsDropdown.js
index f14df219..a3562c69 100644
--- a/packages/netlify-cms-core/src/components/UI/SettingsDropdown.js
+++ b/packages/netlify-cms-core/src/components/UI/SettingsDropdown.js
@@ -39,6 +39,13 @@ const AppHeaderSiteLink = styled.a`
   padding: 10px 16px;
 `;
 
+const AppHeaderTestRepoIndicator = styled.a`
+  font-size: 14px;
+  font-weight: 400;
+  color: #7b8290;
+  padding: 10px 16px;
+`;
+
 const Avatar = ({ imageUrl }) =>
   imageUrl ? <AvatarImage src={imageUrl} /> : <AvatarPlaceholderIcon type="user" size="large" />;
 
@@ -46,8 +53,17 @@ Avatar.propTypes = {
   imageUrl: PropTypes.string,
 };
 
-const SettingsDropdown = ({ displayUrl, imageUrl, onLogoutClick, t }) => (
+const SettingsDropdown = ({ displayUrl, isTestRepo, imageUrl, onLogoutClick, t }) => (
   <React.Fragment>
+    {isTestRepo && (
+      <AppHeaderTestRepoIndicator
+        href="https://www.netlifycms.org/docs/authentication-backends#test-repo-backend"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        Test Backend ↗
+      </AppHeaderTestRepoIndicator>
+    )}
     {displayUrl ? (
       <AppHeaderSiteLink href={displayUrl} target="_blank">
         {stripProtocol(displayUrl)}
@@ -70,6 +86,7 @@ const SettingsDropdown = ({ displayUrl, imageUrl, onLogoutClick, t }) => (
 
 SettingsDropdown.propTypes = {
   displayUrl: PropTypes.string,
+  isTestRepo: PropTypes.bool,
   imageUrl: PropTypes.string,
   onLogoutClick: PropTypes.func.isRequired,
   t: PropTypes.func.isRequired,