@instructure/canvas-rce 5.6.17 → 5.6.18

package/lib/translated/zh/modules/rce/plugins/shared/fileTypeUtils.js

@@ -15,7 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
-import { parse } from 'url';
+import { format, parse } from 'url';
 import { absoluteToRelativeUrl } from '../../../common/fileUrl';
 import { IconAudioLine, IconDocumentLine, IconMsExcelLine, IconMsPptLine, IconMsWordLine, IconPdfLine, IconVideoLine } from '@instructure/ui-icons';
 import RCEGlobals from '../../RCEGlobals';
@@ -94,13 +94,21 @@ export function mediaPlayerURLFromFile(file, canvasOrigin) {
   const type = content_type.replace(/\/.*$/, '');
 
   if ((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.media_links_use_attachment_id && isAudioOrVideo(content_type) && file.id) {
-    if (!file.url && !file.href) {
-      return `/media_attachments_iframe/${file.id}?type=${type}&embedded=true`;
+    const url = parse(`/media_attachments_iframe/${file.id}`, true);
+    url.query.type = type;
+    url.query.embedded = true;
+
+    if (file.uuid && file.contextType == 'User') {
+      url.query.verifier = file.uuid;
+    } else if (file.url || file.href) {
+      const parsed_url = parse(file.url || file.href, true);
+
+      if (parsed_url.query.verifier) {
+        url.query.verifier = parsed_url.query.verifier;
+      }
     }
 
-    const parsed_url = parse(file.url || file.href, true);
-    const verifier = parsed_url.query.verifier ? `&verifier=${parsed_url.query.verifier}` : '';
-    return `/media_attachments_iframe/${file.id}?type=${type}${verifier}&embedded=true`;
+    return format(url);
   }
 
   if (file.embedded_iframe_url) {

package/lib/translated/zh/modules/sidebar/actions/upload.js

@@ -272,7 +272,9 @@ export function mediaUploadComplete(error, uploadData) {
         media_id: mediaObject.media_object.media_id,
         type: uploadedFile.type,
         title: uploadedFile.title || uploadedFile.name,
-        id: mediaObject.media_object.attachment_id
+        id: mediaObject.media_object.attachment_id,
+        uuid: mediaObject.media_object.uuid,
+        contextType: mediaObject.media_object.context_type
       };
       dispatch(removePlaceholdersFor(uploadedFile.name));
       embedUploadResult(embedData, 'media');

package/lib/translated/zh-Hans/modules/rce/plugins/shared/__tests__/fileTypeUtils.test.js

@@ -138,11 +138,22 @@ describe('fileTypeUtils', () => {
       it('uses attachment route if id is present', () => {
         const file = {
           id: '123',
-          type: 'video/mov'
+          type: 'video/mov',
+          uuid: 'abc'
         };
         const url = mediaPlayerURLFromFile(file);
         expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true');
       });
+      it('uses adds the uuid if the context is User', () => {
+        const file = {
+          id: '123',
+          type: 'video/mov',
+          contextType: 'User',
+          uuid: 'abc'
+        };
+        const url = mediaPlayerURLFromFile(file);
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=abc');
+      });
       it('uses the file verifier if present', () => {
         const file = {
           id: '123',
@@ -150,7 +161,7 @@ describe('fileTypeUtils', () => {
           url: 'host?verifier=something'
         };
         const url = mediaPlayerURLFromFile(file);
-        expect(url).toBe('/media_attachments_iframe/123?type=video&verifier=something&embedded=true');
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=something');
       });
       it('uses media_object route if no attachmentId exists', () => {
         const file = {

package/lib/translated/zh-Hans/modules/rce/plugins/shared/fileTypeUtils.js

@@ -15,7 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
-import { parse } from 'url';
+import { format, parse } from 'url';
 import { absoluteToRelativeUrl } from '../../../common/fileUrl';
 import { IconAudioLine, IconDocumentLine, IconMsExcelLine, IconMsPptLine, IconMsWordLine, IconPdfLine, IconVideoLine } from '@instructure/ui-icons';
 import RCEGlobals from '../../RCEGlobals';
@@ -94,13 +94,21 @@ export function mediaPlayerURLFromFile(file, canvasOrigin) {
   const type = content_type.replace(/\/.*$/, '');
 
   if ((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.media_links_use_attachment_id && isAudioOrVideo(content_type) && file.id) {
-    if (!file.url && !file.href) {
-      return `/media_attachments_iframe/${file.id}?type=${type}&embedded=true`;
+    const url = parse(`/media_attachments_iframe/${file.id}`, true);
+    url.query.type = type;
+    url.query.embedded = true;
+
+    if (file.uuid && file.contextType == 'User') {
+      url.query.verifier = file.uuid;
+    } else if (file.url || file.href) {
+      const parsed_url = parse(file.url || file.href, true);
+
+      if (parsed_url.query.verifier) {
+        url.query.verifier = parsed_url.query.verifier;
+      }
     }
 
-    const parsed_url = parse(file.url || file.href, true);
-    const verifier = parsed_url.query.verifier ? `&verifier=${parsed_url.query.verifier}` : '';
-    return `/media_attachments_iframe/${file.id}?type=${type}${verifier}&embedded=true`;
+    return format(url);
   }
 
   if (file.embedded_iframe_url) {

package/lib/translated/zh-Hans/modules/sidebar/actions/upload.js

@@ -272,7 +272,9 @@ export function mediaUploadComplete(error, uploadData) {
         media_id: mediaObject.media_object.media_id,
         type: uploadedFile.type,
         title: uploadedFile.title || uploadedFile.name,
-        id: mediaObject.media_object.attachment_id
+        id: mediaObject.media_object.attachment_id,
+        uuid: mediaObject.media_object.uuid,
+        contextType: mediaObject.media_object.context_type
       };
       dispatch(removePlaceholdersFor(uploadedFile.name));
       embedUploadResult(embedData, 'media');

package/lib/translated/zh-Hant/modules/rce/plugins/shared/__tests__/fileTypeUtils.test.js

@@ -138,11 +138,22 @@ describe('fileTypeUtils', () => {
       it('uses attachment route if id is present', () => {
         const file = {
           id: '123',
-          type: 'video/mov'
+          type: 'video/mov',
+          uuid: 'abc'
         };
         const url = mediaPlayerURLFromFile(file);
         expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true');
       });
+      it('uses adds the uuid if the context is User', () => {
+        const file = {
+          id: '123',
+          type: 'video/mov',
+          contextType: 'User',
+          uuid: 'abc'
+        };
+        const url = mediaPlayerURLFromFile(file);
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=abc');
+      });
       it('uses the file verifier if present', () => {
         const file = {
           id: '123',
@@ -150,7 +161,7 @@ describe('fileTypeUtils', () => {
           url: 'host?verifier=something'
         };
         const url = mediaPlayerURLFromFile(file);
-        expect(url).toBe('/media_attachments_iframe/123?type=video&verifier=something&embedded=true');
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=something');
       });
       it('uses media_object route if no attachmentId exists', () => {
         const file = {

package/lib/translated/zh-Hant/modules/rce/plugins/shared/fileTypeUtils.js

@@ -15,7 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
-import { parse } from 'url';
+import { format, parse } from 'url';
 import { absoluteToRelativeUrl } from '../../../common/fileUrl';
 import { IconAudioLine, IconDocumentLine, IconMsExcelLine, IconMsPptLine, IconMsWordLine, IconPdfLine, IconVideoLine } from '@instructure/ui-icons';
 import RCEGlobals from '../../RCEGlobals';
@@ -94,13 +94,21 @@ export function mediaPlayerURLFromFile(file, canvasOrigin) {
   const type = content_type.replace(/\/.*$/, '');
 
   if ((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.media_links_use_attachment_id && isAudioOrVideo(content_type) && file.id) {
-    if (!file.url && !file.href) {
-      return `/media_attachments_iframe/${file.id}?type=${type}&embedded=true`;
+    const url = parse(`/media_attachments_iframe/${file.id}`, true);
+    url.query.type = type;
+    url.query.embedded = true;
+
+    if (file.uuid && file.contextType == 'User') {
+      url.query.verifier = file.uuid;
+    } else if (file.url || file.href) {
+      const parsed_url = parse(file.url || file.href, true);
+
+      if (parsed_url.query.verifier) {
+        url.query.verifier = parsed_url.query.verifier;
+      }
     }
 
-    const parsed_url = parse(file.url || file.href, true);
-    const verifier = parsed_url.query.verifier ? `&verifier=${parsed_url.query.verifier}` : '';
-    return `/media_attachments_iframe/${file.id}?type=${type}${verifier}&embedded=true`;
+    return format(url);
   }
 
   if (file.embedded_iframe_url) {

package/lib/translated/zh-Hant/modules/sidebar/actions/upload.js

@@ -272,7 +272,9 @@ export function mediaUploadComplete(error, uploadData) {
         media_id: mediaObject.media_object.media_id,
         type: uploadedFile.type,
         title: uploadedFile.title || uploadedFile.name,
-        id: mediaObject.media_object.attachment_id
+        id: mediaObject.media_object.attachment_id,
+        uuid: mediaObject.media_object.uuid,
+        contextType: mediaObject.media_object.context_type
       };
       dispatch(removePlaceholdersFor(uploadedFile.name));
       embedUploadResult(embedData, 'media');

package/lib/translated/zh_HK/modules/rce/plugins/shared/__tests__/fileTypeUtils.test.js

@@ -138,11 +138,22 @@ describe('fileTypeUtils', () => {
       it('uses attachment route if id is present', () => {
         const file = {
           id: '123',
-          type: 'video/mov'
+          type: 'video/mov',
+          uuid: 'abc'
         };
         const url = mediaPlayerURLFromFile(file);
         expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true');
       });
+      it('uses adds the uuid if the context is User', () => {
+        const file = {
+          id: '123',
+          type: 'video/mov',
+          contextType: 'User',
+          uuid: 'abc'
+        };
+        const url = mediaPlayerURLFromFile(file);
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=abc');
+      });
       it('uses the file verifier if present', () => {
         const file = {
           id: '123',
@@ -150,7 +161,7 @@ describe('fileTypeUtils', () => {
           url: 'host?verifier=something'
         };
         const url = mediaPlayerURLFromFile(file);
-        expect(url).toBe('/media_attachments_iframe/123?type=video&verifier=something&embedded=true');
+        expect(url).toBe('/media_attachments_iframe/123?type=video&embedded=true&verifier=something');
       });
       it('uses media_object route if no attachmentId exists', () => {
         const file = {

package/lib/translated/zh_HK/modules/rce/plugins/shared/fileTypeUtils.js

@@ -15,7 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
-import { parse } from 'url';
+import { format, parse } from 'url';
 import { absoluteToRelativeUrl } from '../../../common/fileUrl';
 import { IconAudioLine, IconDocumentLine, IconMsExcelLine, IconMsPptLine, IconMsWordLine, IconPdfLine, IconVideoLine } from '@instructure/ui-icons';
 import RCEGlobals from '../../RCEGlobals';
@@ -94,13 +94,21 @@ export function mediaPlayerURLFromFile(file, canvasOrigin) {
   const type = content_type.replace(/\/.*$/, '');
 
   if ((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.media_links_use_attachment_id && isAudioOrVideo(content_type) && file.id) {
-    if (!file.url && !file.href) {
-      return `/media_attachments_iframe/${file.id}?type=${type}&embedded=true`;
+    const url = parse(`/media_attachments_iframe/${file.id}`, true);
+    url.query.type = type;
+    url.query.embedded = true;
+
+    if (file.uuid && file.contextType == 'User') {
+      url.query.verifier = file.uuid;
+    } else if (file.url || file.href) {
+      const parsed_url = parse(file.url || file.href, true);
+
+      if (parsed_url.query.verifier) {
+        url.query.verifier = parsed_url.query.verifier;
+      }
     }
 
-    const parsed_url = parse(file.url || file.href, true);
-    const verifier = parsed_url.query.verifier ? `&verifier=${parsed_url.query.verifier}` : '';
-    return `/media_attachments_iframe/${file.id}?type=${type}${verifier}&embedded=true`;
+    return format(url);
   }
 
   if (file.embedded_iframe_url) {

package/lib/translated/zh_HK/modules/sidebar/actions/upload.js

@@ -272,7 +272,9 @@ export function mediaUploadComplete(error, uploadData) {
         media_id: mediaObject.media_object.media_id,
         type: uploadedFile.type,
         title: uploadedFile.title || uploadedFile.name,
-        id: mediaObject.media_object.attachment_id
+        id: mediaObject.media_object.attachment_id,
+        uuid: mediaObject.media_object.uuid,
+        contextType: mediaObject.media_object.context_type
       };
       dispatch(removePlaceholdersFor(uploadedFile.name));
       embedUploadResult(embedData, 'media');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/canvas-rce",
-  "version": "5.6.17",
+  "version": "5.6.18",
   "description": "A component wrapping Canvas's usage of Tinymce",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -47,7 +47,8 @@
     "fmt:fix": "prettier --write '**/*.js*' '**/*.ts*'",
     "clean": "rm -rf lib && yarn clean:es && rm -rf coverage && yarn demo:clean",
     "clean:es": "rm -rf es",
-    "generate-svgs": "yarn build:cjs && scripts/generateSvgs.js && prettier --write src/rce/plugins/instructure_equation/MathIcon/svgs.js"
+    "generate-svgs": "yarn build:cjs && scripts/generateSvgs.js && prettier --write src/rce/plugins/instructure_equation/MathIcon/svgs.js",
+    "publishToNpm": "scripts/publishToNpm.sh"
   },
   "keywords": [
     "canvas",

package/scripts/publishToNpm.sh

@@ -0,0 +1,77 @@
+#!/bin/bash
+
+# This script will remind you to update the change log and
+# to bump the version number of the package
+
+# It will then check that you're logged into AWS (which
+# is required to send the Slack notification)
+
+# After those valiations are complete, it will prompt you
+# to log into npm and it will then publish the package
+
+# If the publish succeeds, it will send a Slack notification
+
+# You can disable various steps of the script for dry runs
+# by setting the following when running the script:
+#   SKIP_NPM_LOGIN=1
+#   SKIP_NPM_PUBLISH=1
+#   SKIP_ALERT=1
+
+function prompt {
+    read -p "$1 (Y/N): " confirm &&
+    if [[ ! "$confirm" =~ ^[Yy]+([eE][sS])?$ ]]; then
+        echo -e "\n⚠️  $2 ⚠️\n"
+        exit 1
+    fi
+}
+
+prompt "Did you update CHANGELOG.md?" "Update CHANGELOG.md before publishing to NPM."
+
+prompt "Did you bump the version number in package.json?" "Bump the version number in package.json before publishing to NPM."
+
+if [ -z "$SKIP_ALERT" ]; then
+    # runs the get-user command and throws away output
+    # checks for nonzero exit code to determine if the
+    # user is logged in or not
+    aws iam get-user > /dev/null 2>&1
+    if [[ ! $? -eq 0 ]]; then
+        echo -e "\n⚠️  Please log into AWS and try again. ⚠️\n"
+        exit 1
+    fi
+else
+    echo "Would have checked if you were logged into AWS"
+fi
+
+if [ -z "$SKIP_NPM_LOGIN" ]; then
+    echo -e "\nLogging into NPM...\n"
+    npm login
+else
+    echo "Would have logged into NPM"
+fi
+
+if [ -z "$SKIP_NPM_PUBLISH" ]; then
+    echo -e "\nPublishing to NPM...\n"
+    npm publish
+else
+    echo "Would have published to NPM"
+fi
+
+if [[ ! $? -eq 0 ]]; then
+    echo -e "\n🚨  Publish failed. Please try again. 🚨\n"
+    exit 1
+fi
+
+PACKAGE_VERSION=$(cat package.json | grep "version" | awk '{print $2}' | sed 's/[",]//g')
+CHANGELOG_LINK="<https://gerrit.instructure.com/plugins/gitiles/canvas-lms/+/refs/heads/master/packages/canvas-rce/CHANGELOG.md | here>"
+SLACK_MESSAGE="canvas-rce version $PACKAGE_VERSION has been published to NPM \n\nSee the full list of changes $CHANGELOG_LINK."
+
+if [ -z "$SKIP_ALERT" ]; then
+    (
+      aws --region us-east-1 sqs send-message \
+        --queue-url https://sqs.us-east-1.amazonaws.com/636161780776/slack-lambda \
+        --message-body "{\"channel\":\"#ask-learning-foundations\",\"username\":\"RCE Publish\",\"text\":\"$SLACK_MESSAGE\"}"
+    ) || echo "Failed to send Slack message."
+else
+    echo "Would have sent a Slack message:"
+    echo -e $SLACK_MESSAGE
+fi

package/canvas/README.md

@@ -1,84 +0,0 @@
-# Canvas Rich Content Editor
-
-The Canvas LMS Rich Content Editor extracted in it's own npm package for use
-across multiple services. In the canvas ecosystem, this npm module is used
-in pair with a running `canvas-rce-api` microservice.
-
-Some features require a running instance of the `canvas-rce-api`,
-but you do not need that instance in order to
-do development on `canvas-rce`. (see [docs/development.md](docs/development.md))
-
-The first customer of the `canvas-rce` is the `canvas-lms` LMS so documentation
-and references throughout documentation might reflect and assume the use of
-`canvas-lms`.
-
-## Install and setup
-
-As a published npm module, you can add canvas-rce to your node project by doing
-the following:
-
-```bash
-npm install canvas-rce --save
-```
-
-For guidance on how `canvas-rce` is used within canvas, please reference
-the [canvas-lms use of canvas-rce](https://github.com/instructure/canvas-lms/tree/stable/ui/shared/rce)
-to get an idea on how to incorporate it into your project. Pay
-special attention to the `RichContentEditor.js` and `serviceRCELoader.js`.
-
-Outside of canvas, the `CanvasRce` React component is your entry point.
-_Work is ongoing to make the props to `CanvasRce` more rational.
-Please be patient._
-
-## Tests
-
-While canvas consumes the es modules build of the rce,
-Jest tests are run against the commonjs build, so make sure you've built the
-commonjs assets before running tests:
-
-```bash
-yarn build:canvas
-yarn test:jest
-```
-
-There are still legacy mocha tests run with `yarn test:mocha`. `yarn test` runs them all.
-
-### test debugging hints
-
-```
-yarn test:jest:debug path/to/__test__/file.test.js
-```
-
-will break and wait for you to attach a debugger (e.g. `chrome://inspect/#devices`).
-
-Similarly, for mocha tests
-
-```
-yarn test:mocha:debug path/to/test/file.test.js
-```
-
-Both those commands may include a `--watch` argument to keep the process alive
-while you iterate.
-
-## Polyfills
-
-This project makes use of modern JavaScript APIs like Promise, Object.assign,
-Array.prototype.includes, etc. which are present in modern
-browsers but may not be present in old browsers like IE 11. In order to not
-send unnecessarily large and duplicated code bundles to the browser, consumers
-are expected to have already globally polyfilled those APIs.
-Canvas only supports modern browsers and the rce has not been tested
-in older browsers like IE. If you need suggestions for how to include
-polyfills in your
-own app, you can just put this in your html above the script that includes
-canvas-rce:
-
-```
-<script src="https://cdn.polyfill.io/v2/polyfill.min.js?rum=0"></script>
-```
-
-(See: https://polyfill.io/v2/docs/ for more info)
-
-## Development
-
-See [DEVELOPMENT.md](./DEVELOPMENT.md)