@edx/frontend-plugin-advertisements 1.16.1 → 1.17.0

package/README.rst

@@ -35,13 +35,83 @@ documented in the repository README.
 
 .. _Learning MFE: https://github.com/openedx/frontend-app-learning
 
-Development
------------
+Local Development
+-----------------
+
 This plugin is intended for use with the `Learning MFE`_, specifically with several plugin slots defined in the MFE.
 In order to install a local checkout of this plugin into the `Learning MFE`_ instead of from npm, follow the
 documentation for `local module development`_ in the `Learning MFE`_. Additionally, if you would like for these
 components to appear in the correct plugin slots, you will need a local ``env.config.js`` file in your copy of
-``frontend-app-learning``.
+``frontend-app-learning`` which includes the following lines::
+
+
+  import { UpgradeNotification, LockPaywall } from '@edx/frontend-plugin-advertisements';
+  import { PLUGIN_OPERATIONS, DIRECT_PLUGIN } from '@openedx/frontend-plugin-framework';
+
+  // Insert any other imports here
+
+  // Load environment variables from .env file
+  const config = {
+    pluginSlots: {
+
+      // Insert any other plugins here
+
+      notification_widget_plugin: {
+        plugins: [
+          {
+            op: PLUGIN_OPERATIONS.Insert,
+            widget: {
+              id: 'notification_widget_plugin',
+              type: DIRECT_PLUGIN,
+              RenderWidget: UpgradeNotification,
+            },
+          },
+        ],
+      },
+      notification_tray_plugin: {
+        plugins: [
+          {
+            op: PLUGIN_OPERATIONS.Insert,
+            widget: {
+              id: 'notification_tray_plugin',
+              type: DIRECT_PLUGIN,
+              RenderWidget: UpgradeNotification,
+            },
+          },
+        ],
+      },
+      outline_tab_notifications_plugin: {
+        keepDefault: false,
+        plugins: [
+          {
+            op: PLUGIN_OPERATIONS.Insert,
+            widget: {
+              id: 'outline_tab_notifications_plugin',
+              type: DIRECT_PLUGIN,
+              RenderWidget: UpgradeNotification,
+            },
+          },
+        ],
+      },
+      fbe_message_plugin: { // plugin slot id
+        keepDefault: false,
+        plugins: [
+          {
+            op: PLUGIN_OPERATIONS.Insert,
+            widget: {
+              id: 'fbe_message_plugin',
+              type: DIRECT_PLUGIN,
+              priority: 10,
+              RenderWidget: LockPaywall,
+            },
+          },
+        ],
+      },
+    },
+    OPTIMIZELY_FULL_STACK_SDK_KEY: 'vtr_upgrade',
+  };
+
+  export default config;
 
 If you are planning to run the `Learning MFE`_ in `devstack`_, be sure to clone this repository into a ``src``
 subdirectory of your `devstack`_ workspace directory so that the code is properly mounted into the `Learning MFE`_
@@ -67,12 +137,47 @@ up by the `Learning MFE`_ via the hot module reloading process.::
 .. _Mounting frontend packages from src directory: https://github.com/openedx/devstack/blob/master/docs/decisions/0005-frontend-package-mounts.rst
 
 Development with Optimizely
-~~~~~~~~~~~~~~~~~~~~~~~~~~~
+---------------------------
 This repository uses the Optimizely SDK to implement frontend experiments. In order to simplify local development,
-this repository contains a mock Optimizely implementation. Please see the `instructions`_ for further details.
+this repository contains a mock Optimizely implementation.
+
+In order for the mock Optimizely to work, you must map the ``mocks/optimizely/index.jsx`` module to the npm package name
+by creating a ``module.config.js`` file and adding the following line to ``localModules``::
+
+  {moduleName: '@optimizely/react-sdk', dir: '../src/frontend-plugin-advertisements/src/mocks/optimizely', dist: '.' }
+
+If you want a more thorough guide on this, lease see these `instructions`_ for further details.
 
 .. _instructions: https://github.com/edx/frontend-plugin-advertisements/tree/main/src/mocks/optimizely/README.rst
 
+How To View Experiments Locally
+-------------------------------
+Make sure your devstack is up and running, and sign into the LMS using your audit account (username: ``audit@example.com``,
+password: ``edx``). Navigate to the demo course: http://localhost:2000/course/course-v1:edX+DemoX+Demo_Course/home which
+already has a paywall for the verified track enabled. To select your experiment treatment, go to ``mocks/optimizely/index.jsx``.
+In the ``useDecision`` definition, switch ``enabled`` to "true" and ``variationKey`` to your desired variationKey.
+
+The variationKeys can be found within ``data/optimizely.js`` and should look like this::
+
+  const OPTIMIZELY_VTR_EXPERIMENT_VARIATION_KEYS = {
+    WHY_NOT_SURVEY: 'why_not_survey',
+    CERTIFICATE_PREVIEW: 'certificate_preview',
+    PARTNER_BRANDING: 'partner_branding',
+    CONTROL: 'control',
+    OFF: 'off',
+  };
+
+For example, say we want to view the certificate preview. We'd go to mocks/optimizely/index.jsx and do this::
+
+  const useDecision = (experimentKey) => (
+    // To mock optimizely for local smoke testing, set the value of "enabled" to "true" and
+    // replace "replace_me" with the desired value from OPTIMIZELY_VTR_EXPERIMENT_VARIATION_KEYS
+    // which can be found in src/data/optimizely.js
+    [{ enabled: true, variationKey: 'certificate_preview' }]
+  );
+
+The experimental feature should then appear in the Demo Course.
+
 License
 =======
 
@@ -90,4 +195,4 @@ Contact `edx/masters-devs-cosmonauts` if you need help with this repository.
 Reporting Security Issues
 =========================
 
-Please do not report security issues in public.  Email security@edx.org instead.
+Please do not report security issues in public.  Email security@edx.org instead.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edx/frontend-plugin-advertisements",
-  "version": "1.16.1",
+  "version": "1.17.0",
   "description": "Frontend plugin for edX in course advertisements",
   "main": "dist/index.js",
   "repository": {