Merge PR #65 add/staff-links

* Commits:
  Remove explanatory paragraph
  Add new Studio/insights links to InstructorToolbar
  Add courseId to InstructorToolbar props
  Create new config values for Insights/Studio URLs
  Fix missing definition of unitId in InstructorToolbar.props
  Set NODE_ENV in the test environment
  Fix mismatched test BASE_URL
  Cleanup PORT config

.env

@@ -4,6 +4,7 @@ BASE_URL=null
 CREDENTIALS_BASE_URL=null
 CSRF_TOKEN_API_PATH=null
 ECOMMERCE_BASE_URL=null
+INSIGHTS_BASE_URL=
 LANGUAGE_PREFERENCE_COOKIE_NAME=null
 LMS_BASE_URL=null
 LOGIN_URL=null
@@ -13,4 +14,5 @@ ORDER_HISTORY_URL=null
 REFRESH_ACCESS_TOKEN_ENDPOINT=null
 SEGMENT_KEY=null
 SITE_NAME=null
+STUDIO_BASE_URL=
 USER_INFO_COOKIE_NAME=null

.env.development

@@ -1,5 +1,4 @@
 NODE_ENV='development'
-PORT=2000
 ACCESS_TOKEN_COOKIE_NAME='edx-jwt-cookie-header-payload'
 BASE_URL='localhost:2000'
 CREDENTIALS_BASE_URL='http://localhost:18150'
@@ -11,7 +10,9 @@ LOGIN_URL='http://localhost:18000/login'
 LOGOUT_URL='http://localhost:18000/logout'
 MARKETING_SITE_BASE_URL='http://localhost:18000'
 ORDER_HISTORY_URL='localhost:1996/orders'
+PORT=2000
 REFRESH_ACCESS_TOKEN_ENDPOINT='http://localhost:18000/login_refresh'
 SEGMENT_KEY=null
 SITE_NAME='edX'
+STUDIO_BASE_URL='http://localhost:18010'
 USER_INFO_COOKIE_NAME='edx-user-info'

.env.test

@@ -1,5 +1,6 @@
+NODE_ENV='test'
 ACCESS_TOKEN_COOKIE_NAME='edx-jwt-cookie-header-payload'
-BASE_URL='localhost:1995'
+BASE_URL='localhost:2000'
 CREDENTIALS_BASE_URL='http://localhost:18150'
 CSRF_TOKEN_API_PATH='/csrf/api/v1/token'
 ECOMMERCE_BASE_URL='http://localhost:18130'
@@ -9,7 +10,9 @@ LOGIN_URL='http://localhost:18000/login'
 LOGOUT_URL='http://localhost:18000/logout'
 MARKETING_SITE_BASE_URL='http://localhost:18000'
 ORDER_HISTORY_URL='localhost:1996/orders'
+PORT=2000
 REFRESH_ACCESS_TOKEN_ENDPOINT='http://localhost:18000/login_refresh'
 SEGMENT_KEY=null
 SITE_NAME='edX'
+STUDIO_BASE_URL='http://localhost:18010'
 USER_INFO_COOKIE_NAME='edx-user-info'

src/courseware/course/Course.jsx

@@ -72,6 +72,7 @@ function Course({
         />
         {isStaff && (
           <InstructorToolbar
+            courseId={courseId}
             unitId={unitId}
           />
         )}

src/courseware/course/InstructorToolbar.jsx

@@ -1,37 +1,68 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
-import { Collapsible } from '@edx/paragon';
+
+import { getConfig } from '@edx/frontend-platform';
+
+function getInsightsUrl(courseId) {
+  const urlBase = getConfig().INSIGHTS_BASE_URL;
+  let urlFull;
+  if (urlBase) {
+    urlFull = `${urlBase}/courses`;
+    // This shouldn't actually be missing, at present,
+    // but we're providing a reasonable fallback,
+    // in case of either error or extension.
+    if (courseId) {
+      urlFull += `/${courseId}`;
+    }
+  }
+  return urlFull;
+}
+
+function getStudioUrl(courseId, unitId) {
+  const urlBase = getConfig().STUDIO_BASE_URL;
+  let urlFull;
+  if (urlBase) {
+    if (unitId) {
+      urlFull = `${urlBase}/container/${unitId}`;
+    } else if (courseId) {
+      urlFull = `{$urlBase}/course/${courseId}`;
+    }
+  }
+  return urlFull;
+}
 
 function InstructorToolbar(props) {
-  if (!props.activeUnitLmsWebUrl) {
-    return null;
-  }
-
+  const {
+    courseId,
+    unitId,
+  } = props;
+  const urlInsights = getInsightsUrl(courseId);
+  const urlLms = props.activeUnitLmsWebUrl;
+  const urlStudio = getStudioUrl(courseId, unitId);
   return (
     <div className="bg-primary text-light">
       <div className="container-fluid py-3 d-md-flex justify-content-end align-items-center">
         <div className="flex-grow-1">
-          <Collapsible.Advanced className="mr-5 mb-md-0">
-              You are currently previewing the new learning sequence experience.
-            <Collapsible.Trigger className="d-inline-block ml-2" style={{ cursor: 'pointer' }}>
-              <Collapsible.Visible whenClosed>
-                <span style={{ borderBottom: 'solid 1px white' }}>More info</span> &rarr;
-              </Collapsible.Visible>
-            </Collapsible.Trigger>
-            <Collapsible.Body>
-                This preview is to allow for early content testing, especially for custom content blocks, with the goal of ensuring it renders as expected in the next experience. You can learn more through the following <a className="text-white" style={{ textDecoration: 'underline' }} href="https://partners.edx.org/announcements/author-preview-learning-sequence-experience-update" target="blank" rel="noopener">Partner Portal post</a>.  Please report any issues or provide <a className="text-white" style={{ textDecoration: 'underline' }} target="blank" rel="noopener" href="https://forms.gle/R6jMYJNTCj1vgC1D6">feedback using the linked form</a>.
-              <Collapsible.Trigger className="d-inline-block ml-2" style={{ cursor: 'pointer' }}>
-                <Collapsible.Visible whenOpen>
-                  <span style={{ borderBottom: 'solid 1px white' }}>Close</span> &times;
-                </Collapsible.Visible>
-              </Collapsible.Trigger>
-            </Collapsible.Body>
-          </Collapsible.Advanced>
-        </div>
-        <div className="flex-shrink-0">
-          <a className="btn d-block btn-outline-light" href={props.activeUnitLmsWebUrl}>View unit in the existing experience</a>
+          &nbsp;
         </div>
+        {urlLms && (
+          <div className="flex-shrink-0">
+            <a className="btn d-block btn-outline-light" href={urlLms}>View in the existing experience</a>
+          </div>
+        )}
+        &nbsp;
+        {urlStudio && (
+          <div className="flex-shrink-0">
+            <a className="btn d-block btn-outline-light" href={urlStudio}>View in Studio</a>
+          </div>
+        )}
+        &nbsp;
+        {urlInsights && (
+          <div className="flex-shrink-0">
+            <a className="btn d-block btn-outline-light" href={urlInsights}>View in Insights</a>
+          </div>
+        )}
       </div>
     </div>
   );
@@ -39,10 +70,14 @@ function InstructorToolbar(props) {
 
 InstructorToolbar.propTypes = {
   activeUnitLmsWebUrl: PropTypes.string,
+  courseId: PropTypes.string,
+  unitId: PropTypes.string,
 };
 
 InstructorToolbar.defaultProps = {
   activeUnitLmsWebUrl: undefined,
+  courseId: undefined,
+  unitId: undefined,
 };
 
 const mapStateToProps = (state, props) => {

src/index.jsx

@@ -3,6 +3,7 @@ import 'regenerator-runtime/runtime';
 
 import {
   APP_INIT_ERROR, APP_READY, subscribe, initialize,
+  mergeConfig,
 } from '@edx/frontend-platform';
 import { AppProvider, ErrorPage } from '@edx/frontend-platform/react';
 import React from 'react';
@@ -51,6 +52,14 @@ subscribe(APP_INIT_ERROR, (error) => {
 });
 
 initialize({
+  handlers: {
+    config: () => {
+      mergeConfig({
+        INSIGHTS_BASE_URL: process.env.INSIGHTS_BASE_URL || null,
+        STUDIO_BASE_URL: process.env.STUDIO_BASE_URL || null,
+      }, 'LearnerAppConfig');
+    },
+  },
   // TODO: Remove this once the course blocks api supports unauthenticated
   // access and we are prepared to support public courses in this app.
   requireAuthenticatedUser: true,