fix(earth-admin): prefix environment variables with ADMIN namespace

packages/earth-admin/.env.sample

@@ -1,15 +1,15 @@
 NODE_ENV='production' # required
 
-GATSBY_APP_NAME='marapp' # required
-GATSBY_APP_PUBLIC_ORG=''
-GATSBY_APP_BASE_URL='/admin/' # required
-GATSBY_APP_MAP_URL='/' # required
-GATSBY_API_URL='' # required
-GATSBY_APP_MAPBOX_TOKEN='' # required
+GATSBY_APP_ADMIN_NAME='marapp' # required
+GATSBY_APP_ADMIN_PUBLIC_ORG=''
+GATSBY_APP_ADMIN_BASE_URL='/admin/' # required
+GATSBY_APP_ADMIN_MAP_URL='/' # required
+GATSBY_APP_ADMIN_API_URL='' # required
+GATSBY_APP_ADMIN_MAPBOX_TOKEN='' # required
 
-GATSBY_APP_AUTH0_DOMAIN='' # required
-GATSBY_APP_AUTH0_CLIENT_ID='' # required
-GATSBY_APP_AUTH0_AUDIENCE='' # required
-GATSBY_APP_AUTH0_NAMESPACE='https://marapp.org' # required
+GATSBY_APP_ADMIN_AUTH0_DOMAIN='' # required
+GATSBY_APP_ADMIN_AUTH0_CLIENT_ID='' # required
+GATSBY_APP_ADMIN_AUTH0_AUDIENCE='' # required
+GATSBY_APP_ADMIN_AUTH0_NAMESPACE='https://marapp.org' # required
 
 GATSBY_TELEMETRY_DISABLED=1

packages/earth-admin/README.md

@@ -21,16 +21,16 @@ The following environment variables are required by the application.
 | **Key** | **Description** |
 | ------------- |:----------------|
 | `NODE_ENV` | Node.js environment (e.g. `development`, `production`) |
-| `GATSBY_APP_NAME` | The name of the app (e.g. `marapp`) |
-| `GATSBY_APP_PUBLIC_ORG` | The name of the public organization (e.g. `MARAPP`) |
+| `GATSBY_APP_ADMIN_NAME` | The name of the app (e.g. `marapp`) |
+| `GATSBY_APP_ADMIN_PUBLIC_ORG` | The name of the public organization (e.g. `MARAPP`) |
+| `GATSBY_APP_ADMIN_BASE_URL` | https://reach.tech/router/api/Router - `basepath` |
+| `GATSBY_APP_ADMIN_API_URL` | https://www.gatsbyjs.org/docs/environment-variables/#client-side-javascript - API URL |
+| `GATSBY_APP_ADMIN_MAPBOX_TOKEN` | https://docs.mapbox.com/help/glossary/access-token - Mapbox access token |
+| `GATSBY_APP_ADMIN_AUTH0_DOMAIN` | https://auth0.com/docs/custom-domains - Auth0 domain |
+| `GATSBY_APP_ADMIN_AUTH0_CLIENT_ID`| https://auth0.com/docs/flows/concepts/client-credentials - Auth0 Client ID |
+| `GATSBY_APP_ADMIN_AUTH0_AUDIENCE` | https://auth0.com/docs/tokens/guides/get-access-tokens - Auth0 audience |
+| `GATSBY_APP_ADMIN_AUTH0_NAMESPACE` | https://auth0.com/docs/tokens/guides/create-namespaced-custom-claims - Auth0 namespace |
 | `GATSBY_TELEMETRY_DISABLED` |  https://www.gatsbyjs.org/docs/telemetry/ |
-| `GATSBY_APP_BASE_URL` | https://reach.tech/router/api/Router - `basepath` |
-| `GATSBY_API_URL` | https://www.gatsbyjs.org/docs/environment-variables/#client-side-javascript - API URL |
-| `GATSBY_APP_MAPBOX_TOKEN` | https://docs.mapbox.com/help/glossary/access-token - Mapbox access token |
-| `GATSBY_APP_AUTH0_DOMAIN` | https://auth0.com/docs/custom-domains - Auth0 domain |
-| `GATSBY_APP_AUTH0_CLIENT_ID`| https://auth0.com/docs/flows/concepts/client-credentials - Auth0 Client ID |
-| `GATSBY_APP_AUTH0_AUDIENCE` | https://auth0.com/docs/tokens/guides/get-access-tokens - Auth0 audience |
-| `GATSBY_APP_AUTH0_NAMESPACE` | https://auth0.com/docs/tokens/guides/create-namespaced-custom-claims - Auth0 namespace |
 
 The required environment variables are also described in [.env.sample](.env.sample).
 

packages/earth-admin/gatsby-config.js

@@ -24,7 +24,7 @@ const GATSBY_ACTIVE_ENV = process.env.GATSBY_ACTIVE_ENV || '.env';
 require('dotenv').config({ path: GATSBY_ACTIVE_ENV });
 
 module.exports = {
-  pathPrefix: process.env.GATSBY_APP_BASE_URL,
+  pathPrefix: process.env.GATSBY_APP_ADMIN_BASE_URL,
   siteMetadata: {
     siteName: 'Admin',
   },

packages/earth-admin/src/auth/auth0.tsx

@@ -34,14 +34,14 @@ import {
   mapAuthzScopes,
 } from '@marapp/earth-shared';
 
-import { GATSBY_APP_AUTH0_NAMESPACE } from '@app/config';
+import { ADMIN_AUTH0_NAMESPACE } from '@app/config';
 import { routeToPage } from '@app/utils';
 import { Auth0Context } from '@app/utils/contexts';
 
 // Auth0 will enforce namespacing when performing OIDC-conformant
 // login flows, meaning that any custom claims without HTTP/HTTPS
 // namespaces will be silently excluded from tokens.
-const NAMESPACE = GATSBY_APP_AUTH0_NAMESPACE;
+const NAMESPACE = ADMIN_AUTH0_NAMESPACE;
 
 export const useAuth0: any = () => useContext(Auth0Context);
 

packages/earth-admin/src/auth/config.ts

@@ -20,17 +20,17 @@
 import urljoin from 'url-join';
 
 import {
-  GATSBY_APP_AUTH0_AUDIENCE,
-  GATSBY_APP_AUTH0_CLIENT_ID,
-  GATSBY_APP_AUTH0_DOMAIN,
-  GATSBY_APP_BASE_URL,
+  ADMIN_AUTH0_AUDIENCE,
+  ADMIN_AUTH0_CLIENT_ID,
+  ADMIN_AUTH0_DOMAIN,
+  ADMIN_BASE_URL,
 } from '@app/config';
 
 const auth0 = {
-  domain: GATSBY_APP_AUTH0_DOMAIN,
-  clientId: GATSBY_APP_AUTH0_CLIENT_ID,
-  redirectUri: urljoin(window.location.origin, GATSBY_APP_BASE_URL),
-  audience: GATSBY_APP_AUTH0_AUDIENCE,
+  domain: ADMIN_AUTH0_DOMAIN,
+  clientId: ADMIN_AUTH0_CLIENT_ID,
+  redirectUri: urljoin(window.location.origin, ADMIN_BASE_URL),
+  audience: ADMIN_AUTH0_AUDIENCE,
 };
 
 export default { auth0 };

packages/earth-admin/src/components/map/map/Map.tsx

@@ -24,7 +24,7 @@ import { Map } from '@marapp/earth-shared';
 import MapControls from '@app/components/map/controls';
 import RecenterControl from '@app/components/map/controls/recenter';
 import ZoomControl from '@app/components/map/controls/zoom';
-import { GATSBY_APP_MAPBOX_TOKEN } from '@app/config';
+import { ADMIN_MAPBOX_TOKEN } from '@app/config';
 import { MapComponentContext } from '@app/utils/contexts';
 
 import { LayerManagerComponent } from '../layer-manager';
@@ -71,7 +71,7 @@ export default function MapComponent(props: { height?: string }) {
   return (
     <div className="marapp-qa-mapwrapper c-map-wrapper -open" style={{ height }}>
       <Map
-        mapboxApiAccessToken={GATSBY_APP_MAPBOX_TOKEN}
+        mapboxApiAccessToken={ADMIN_MAPBOX_TOKEN}
         bounds={bounds}
         mapStyle={MAP_DEFAULT.mapStyle}
         viewport={viewport}

packages/earth-admin/src/config/index.ts

@@ -17,28 +17,26 @@
   specific language governing permissions and limitations under the License.
 */
 
-const GATSBY_API_URL: string = process.env.GATSBY_API_URL;
-const BASE_URL: string = process.env.GATSBY_APP_BASE_URL || '/';
-const GATSBY_APP_AUTH0_DOMAIN: string = process.env.GATSBY_APP_AUTH0_DOMAIN;
-const GATSBY_APP_AUTH0_CLIENT_ID: string = process.env.GATSBY_APP_AUTH0_CLIENT_ID;
-const GATSBY_APP_BASE_URL: string = process.env.GATSBY_APP_BASE_URL;
-const GATSBY_APP_AUTH0_AUDIENCE: string = process.env.GATSBY_APP_AUTH0_AUDIENCE;
-const GATSBY_APP_MAPBOX_TOKEN: string = process.env.GATSBY_APP_MAPBOX_TOKEN;
-const GATSBY_APP_AUTH0_NAMESPACE: string = process.env.GATSBY_APP_AUTH0_NAMESPACE;
-const MAP_PATH: string = process.env.GATSBY_APP_MAP_URL;
-const GATSBY_APP_NAME: string = process.env.GATSBY_APP_NAME;
-const PUBLIC_ORG: string = process.env.GATSBY_APP_PUBLIC_ORG;
+const ADMIN_API_URL: string = process.env.GATSBY_APP_ADMIN_API_URL;
+const ADMIN_BASE_URL: string = process.env.GATSBY_APP_ADMIN_BASE_URL || '/';
+const ADMIN_AUTH0_DOMAIN: string = process.env.GATSBY_APP_ADMIN_AUTH0_DOMAIN;
+const ADMIN_AUTH0_CLIENT_ID: string = process.env.GATSBY_APP_ADMIN_AUTH0_CLIENT_ID;
+const ADMIN_AUTH0_AUDIENCE: string = process.env.GATSBY_APP_ADMIN_AUTH0_AUDIENCE;
+const ADMIN_MAPBOX_TOKEN: string = process.env.GATSBY_APP_ADMIN_MAPBOX_TOKEN;
+const ADMIN_AUTH0_NAMESPACE: string = process.env.GATSBY_APP_ADMIN_AUTH0_NAMESPACE;
+const ADMIN_MAP_PATH: string = process.env.GATSBY_APP_ADMIN_MAP_URL;
+const ADMIN_NAME: string = process.env.GATSBY_APP_ADMIN_NAME;
+const ADMIN_PUBLIC_ORG: string = process.env.GATSBY_APP_ADMIN_PUBLIC_ORG;
 
 export {
-  GATSBY_API_URL,
-  BASE_URL,
-  GATSBY_APP_AUTH0_AUDIENCE,
-  GATSBY_APP_AUTH0_CLIENT_ID,
-  GATSBY_APP_AUTH0_DOMAIN,
-  GATSBY_APP_BASE_URL,
-  GATSBY_APP_MAPBOX_TOKEN,
-  GATSBY_APP_AUTH0_NAMESPACE,
-  MAP_PATH,
-  GATSBY_APP_NAME,
-  PUBLIC_ORG,
+  ADMIN_API_URL,
+  ADMIN_BASE_URL,
+  ADMIN_AUTH0_AUDIENCE,
+  ADMIN_AUTH0_CLIENT_ID,
+  ADMIN_AUTH0_DOMAIN,
+  ADMIN_MAPBOX_TOKEN,
+  ADMIN_AUTH0_NAMESPACE,
+  ADMIN_MAP_PATH,
+  ADMIN_NAME,
+  ADMIN_PUBLIC_ORG,
 };

packages/earth-admin/src/layouts/Content.tsx

@@ -24,7 +24,7 @@ import { useTranslation } from 'react-i18next';
 import { Card, favicon, Spinner, UserMenu } from '@marapp/earth-shared';
 
 import { LinkWithOrg } from '@app/components/link-with-org';
-import { MAP_PATH } from '@app/config';
+import { ADMIN_MAP_PATH } from '@app/config';
 import { Auth0Context } from '@app/utils/contexts';
 
 import '../styles/app.scss';
@@ -69,7 +69,7 @@ export default function ContentLayout(props: ILayoutProps) {
         <UserMenu
           isAuthenticated={isAuthenticated}
           userName={userData.name}
-          profileLink={<a href={`${MAP_PATH}profile`}>Profile</a>}
+          profileLink={<a href={`${ADMIN_MAP_PATH}profile`}>Profile</a>}
           onLogin={login}
           onLogout={logout}
           onSignUp={() => login({ initialScreen: 'signUp' })}

packages/earth-admin/src/layouts/Sidebar.tsx

@@ -26,7 +26,7 @@ import { AppContextSwitcher, Spinner } from '@marapp/earth-shared';
 
 import { SidebarSelect } from '@app/components/sidebar-select';
 import { IAdminPage } from '@app/components/sidebar-select/model';
-import { MAP_PATH } from '@app/config';
+import { ADMIN_MAP_PATH } from '@app/config';
 import { Auth0Context } from '@app/utils/contexts';
 
 import { APP_LOGO, APP_NAME } from '../theme';
@@ -40,7 +40,7 @@ interface IProps {
   page?: IAdminPage[];
 }
 
-const EARTH_MAP_URL = urljoin(MAP_PATH, 'earth');
+const EARTH_MAP_URL = urljoin(ADMIN_MAP_PATH, 'earth');
 
 const SidebarLayout = (props: IProps) => {
   const { groups, selectedGroup } = useContext(Auth0Context);

packages/earth-admin/src/pages-client/404.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 import { NotFoundComponent } from '@marapp/earth-shared';
 
-import { GATSBY_APP_NAME } from '@app/config';
+import { ADMIN_NAME } from '@app/config';
 
 import { APP_ABOUT } from '../theme';
 
@@ -13,11 +13,7 @@ const NotFoundPage = () => {
   };
 
   return (
-    <NotFoundComponent
-      returnToHome={returnToHome}
-      aboutLink={APP_ABOUT}
-      appName={GATSBY_APP_NAME}
-    />
+    <NotFoundComponent returnToHome={returnToHome} aboutLink={APP_ABOUT} appName={ADMIN_NAME} />
   );
 };
 

packages/earth-admin/src/pages-client/organization.tsx

@@ -25,7 +25,7 @@ import { useTranslation } from 'react-i18next';
 import { isSuperAdmin, isValidGroup, Spinner } from '@marapp/earth-shared';
 
 import { useAuth0 } from '@app/auth/auth0';
-import { BASE_URL } from '@app/config';
+import { ADMIN_BASE_URL } from '@app/config';
 
 import './styles.scss';
 
@@ -60,8 +60,8 @@ const Organization = (props: IProps) => {
     return <OrgSwitcherPage groups={groups} t={t} />;
   }
 
-  if (org === '*' && !location.pathname.startsWith(`${BASE_URL}*/organizations`)) {
-    window.location.assign(`${BASE_URL}*/organizations`);
+  if (org === '*' && !location.pathname.startsWith(`${ADMIN_BASE_URL}*/organizations`)) {
+    window.location.assign(`${ADMIN_BASE_URL}*/organizations`);
 
     return null;
   }

packages/earth-admin/src/pages-client/places/details.tsx

@@ -47,7 +47,7 @@ import { MapComponent } from '@app/components/map';
 import { DeleteConfirmation } from '@app/components/modals/delete-confirmation';
 import { Metrics } from '@app/components/places';
 import { Toggle } from '@app/components/toggle';
-import { PUBLIC_ORG } from '@app/config';
+import { ADMIN_PUBLIC_ORG } from '@app/config';
 import { ContentLayout } from '@app/layouts';
 import { generateCacheKey } from '@app/services';
 import MetricService from '@app/services/metrics';
@@ -274,7 +274,7 @@ export function PlaceDetail(props: IProps) {
                     onChange={onSubmit}
                     ref={register({})}
                   />
-                  {PUBLIC_ORG === selectedGroup && published && (
+                  {ADMIN_PUBLIC_ORG === selectedGroup && published && (
                     <Toggle
                       name="publicResource"
                       label="Public"

packages/earth-admin/src/pages/index.tsx

@@ -24,7 +24,7 @@ import { useTranslation } from 'react-i18next';
 
 import { useAuth0 } from '@app/auth/auth0';
 import { ProtectedRoute } from '@app/components/protected-route';
-import { GATSBY_APP_BASE_URL } from '@app/config';
+import { ADMIN_BASE_URL } from '@app/config';
 import NotFound from '@app/pages-client/404';
 import DashboardsPage from '@app/pages-client/dashboards/routes';
 import Homepage from '@app/pages-client/homepage';
@@ -41,7 +41,7 @@ import WidgetsPage from '@app/pages-client/widgets/routes';
  */
 export default function IndexPage() {
   return (
-    <Router basepath={GATSBY_APP_BASE_URL}>
+    <Router basepath={ADMIN_BASE_URL}>
       <ProtectedRoute exact={true} path="/" component={RedirectToOrgHomepage} />
       <ProtectedRoute exact={true} path="/:org" component={Organization}>
         <Homepage exact={true} path="/" />

packages/earth-admin/src/services/base/APIBase.ts

@@ -21,7 +21,7 @@ import axios, { AxiosRequestConfig, AxiosResponse } from 'axios';
 import { merge } from 'lodash/fp';
 import { Deserializer } from 'ts-jsonapi';
 
-import { GATSBY_API_URL } from '@app/config';
+import { ADMIN_API_URL } from '@app/config';
 import { encodeQueryToURL } from '@app/utils';
 
 export interface RequestQuery {
@@ -58,7 +58,7 @@ export const BaseAPIService = {
     const params = merge(defaults, config);
 
     const options: AxiosRequestConfig = {
-      baseURL: GATSBY_API_URL,
+      baseURL: ADMIN_API_URL,
       url: encodeQueryToURL(path, params.query),
       method: params.method,
       data: params.data,

packages/earth-admin/src/utils/index.ts

@@ -24,15 +24,15 @@ import queryStringEncode from 'query-string-encode';
 import { RefObject } from 'react';
 
 import { ADMIN_PAGES } from '@app/components/sidebar-select/model';
-import { BASE_URL } from '@app/config';
+import { ADMIN_BASE_URL } from '@app/config';
 
 /**
  * Wrapper over navigate that takes into account baseURL.
  */
 export const routeToPage = (targetPath: string, stripBase: boolean = false) => {
   let path = targetPath;
   if (stripBase && path !== '/') {
-    path = path.replace(BASE_URL, '');
+    path = path.replace(ADMIN_BASE_URL, '');
   }
   navigate(path);
 };