Color
{embedLevel === 1 ? (
@@ -137,8 +141,7 @@ function EmbeddedMapThemeConfig({
Font
- Optional. If no font selected, OAR website font will be
- used.
+ If no font is selected, the OAR font will be used.
{errors?.font && (
diff --git a/src/app/src/components/EmbeddedMapUnauthorized.jsx b/src/app/src/components/EmbeddedMapUnauthorized.jsx
new file mode 100644
index 000000000..fabf4eecd
--- /dev/null
+++ b/src/app/src/components/EmbeddedMapUnauthorized.jsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import Typography from '@material-ui/core/Typography';
+import { EmbeddedMapInfoLink } from '../util/constants';
+import AppGrid from './AppGrid';
+
+const styles = {
+ container: {
+ marginBottom: '200px',
+ },
+};
+
+function EmbeddedMapUnauthorized() {
+ return (
+
+
+ Looking to display your supplier data on your website?
+
+
+ The Open Apparel registry offers an easy-to-use embedded map
+ option for your website.
+
+
+ To activate this paid-for feature, check out the{' '}
+ OAR Embedded Map page on our
+ website for packages and pricing options.
+
+
+ Once you have activated it, your OAR Embedded Map Settings will
+ appear on this tab.
+
+
+ );
+}
+
+export default EmbeddedMapUnauthorized;
diff --git a/src/app/src/util/constants.js b/src/app/src/util/constants.js
index 615c78d0a..826a2e368 100644
--- a/src/app/src/util/constants.js
+++ b/src/app/src/util/constants.js
@@ -520,3 +520,5 @@ export const PPE_FIELD_NAMES = Object.freeze([
export const OARFont = 'ff-tisa-sans-web-pro,sans-serif';
export const OARColor = '#0427a4';
+
+export const EmbeddedMapInfoLink = 'https://info.openapparel.org/embedded-map';
diff --git a/src/app/src/util/embeddedMap.js b/src/app/src/util/embeddedMap.js
index c2d976dcc..432ec349a 100644
--- a/src/app/src/util/embeddedMap.js
+++ b/src/app/src/util/embeddedMap.js
@@ -53,7 +53,7 @@ const filterAndFormatNonstandardFields = ({
.map(field => ({
columnName: field,
displayName: field,
- visible: true,
+ visible: false,
}));
export const combineEmbedAndNonstandardFields = (