diff --git a/config.json b/config.json
index 25c75fd6e..298ae2b8c 100644
--- a/config.json
+++ b/config.json
@@ -1,6 +1,7 @@
{
"app_id": "history-analyst-dad",
"app_key": "be606bcfa3db4377bf488900281aa1cc",
+ "development": true,
"wpcc_client_id": "0",
"wpcc_redirect_url": "https://simplenote.com"
}
diff --git a/lib/app.jsx b/lib/app.jsx
index 636d27727..5fc614423 100644
--- a/lib/app.jsx
+++ b/lib/app.jsx
@@ -13,6 +13,7 @@ import NoteInfo from './note-info';
import NavigationBar from './navigation-bar';
import AppLayout from './app-layout';
import Auth from './auth';
+import DevBadge from './components/dev-badge';
import DialogRenderer from './dialog-renderer';
import { activityHooks, nudgeUnsynced } from './utils/sync';
import analytics from './analytics';
@@ -115,6 +116,7 @@ export const App = connect(mapStateToProps, mapDispatchToProps)(
settings: PropTypes.object.isRequired,
client: PropTypes.object.isRequired,
+ isDevConfig: PropTypes.bool.isRequired,
isSmallScreen: PropTypes.bool.isRequired,
noteBucket: PropTypes.object.isRequired,
preferencesBucket: PropTypes.object.isRequired,
@@ -378,6 +380,7 @@ export const App = connect(mapStateToProps, mapDispatchToProps)(
appState: state,
authIsPending,
isAuthorized,
+ isDevConfig,
noteBucket,
settings,
tagBucket,
@@ -401,6 +404,7 @@ export const App = connect(mapStateToProps, mapDispatchToProps)(
return (
+ {isDevConfig &&
}
{isAuthorized ? (
{state.showNavigation && (
diff --git a/lib/boot.js b/lib/boot.js
index 1f70def7a..7e8fa3b15 100644
--- a/lib/boot.js
+++ b/lib/boot.js
@@ -25,6 +25,7 @@ import '../scss/style.scss';
import { content as welcomeMessage } from './welcome-message';
import appState from './flux/app-state';
+import isDevConfig from './utils/is-dev-config';
const { newNote } = appState.actionCreators;
const config = getConfig();
@@ -111,6 +112,7 @@ let props = {
noteBucket: client.bucket('note'),
preferencesBucket: client.bucket('preferences'),
tagBucket: client.bucket('tag'),
+ isDevConfig: isDevConfig(config),
onAuthenticate: (username, password) => {
if (!(username && password)) {
return;
diff --git a/lib/components/dev-badge/index.jsx b/lib/components/dev-badge/index.jsx
new file mode 100644
index 000000000..98da4e8f8
--- /dev/null
+++ b/lib/components/dev-badge/index.jsx
@@ -0,0 +1,7 @@
+import React from 'react';
+
+const DevBadge = () => {
+ return
DEV
;
+};
+
+export default DevBadge;
diff --git a/lib/components/dev-badge/style.scss b/lib/components/dev-badge/style.scss
new file mode 100644
index 000000000..319032013
--- /dev/null
+++ b/lib/components/dev-badge/style.scss
@@ -0,0 +1,12 @@
+.dev-badge {
+ position: absolute;
+ opacity: .8;
+ z-index: 1;
+ right: 12px;
+ bottom: 12px;
+ padding: 2px 4px;
+ background: $gray-lightest;
+ color: $gray-darkest;
+ font-size: .75rem;
+ line-height: 1;
+}
diff --git a/lib/utils/is-dev-config/index.js b/lib/utils/is-dev-config/index.js
new file mode 100644
index 000000000..cbfddcca1
--- /dev/null
+++ b/lib/utils/is-dev-config/index.js
@@ -0,0 +1,12 @@
+const isDevConfig = config => {
+ const isDev = Boolean(config.development);
+ const whichDB = isDev ? 'Development' : 'Production';
+ const shouldWarn =
+ process.env.NODE_ENV === 'production' && config.development;
+ const consoleMode = shouldWarn ? 'warn' : 'info';
+ console[consoleMode](`Simperium config: ${whichDB}`); // eslint-disable-line no-console
+
+ return isDev;
+};
+
+export default isDevConfig;
diff --git a/lib/utils/is-dev-config/test.js b/lib/utils/is-dev-config/test.js
new file mode 100644
index 000000000..02765b7ce
--- /dev/null
+++ b/lib/utils/is-dev-config/test.js
@@ -0,0 +1,30 @@
+import isDevConfig from './';
+
+describe('isDevConfig', () => {
+ const unmockedConsole = global.console;
+
+ beforeEach(() => {
+ global.console = {
+ info: jest.fn(),
+ warn: jest.fn(),
+ };
+ });
+
+ afterEach(() => {
+ global.process.env.NODE_ENV = 'test';
+ global.console = unmockedConsole;
+ });
+
+ it('should return a boolean of whether config is dev or not', () => {
+ expect(isDevConfig({ development: true })).toBe(true);
+ expect(isDevConfig({})).toBe(false);
+ });
+
+ it('should console.warn when NODE_ENV is production and Simperium is not', () => {
+ global.process.env.NODE_ENV = 'production';
+ global.console.warn = jest.fn();
+ const config = { development: true };
+ isDevConfig(config);
+ expect(global.console.warn).toHaveBeenCalled();
+ });
+});
diff --git a/scss/_components.scss b/scss/_components.scss
index d65d1b096..1cb161f77 100644
--- a/scss/_components.scss
+++ b/scss/_components.scss
@@ -1,5 +1,6 @@
@import 'app-layout/style';
@import 'auth/style';
+@import 'components/dev-badge/style';
@import 'components/panel-title/style';
@import 'components/progress-bar/style';
@import 'components/spinner/style';