@instructure/canvas-rce 5.12.1 → 5.12.2

package/lib/canvasFileBrowser/FileBrowser.js

@@ -1,457 +0,0 @@
-// Copyright (C) 2017 - present Instructure, Inc.
-//
-// This file is part of Canvas.
-//
-// Canvas is free software: you can redistribute it and/or modify it under
-// the terms of the GNU Affero General Public License as published by the Free
-// Software Foundation, version 3 of the License.
-//
-// Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
-// WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
-// A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
-// details.
-//
-// 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 React from 'react';
-import formatMessage from '../format-message';
-import _ from 'lodash';
-import minimatch from 'minimatch';
-import { TreeBrowser } from '@instructure/ui-tree-browser';
-import { Text } from '@instructure/ui-text';
-import { Spinner } from '@instructure/ui-spinner';
-import { IconOpenFolderSolid, IconFolderSolid, IconImageLine } from '@instructure/ui-icons';
-import PropTypes from 'prop-types';
-import { getIconFromType, isImage } from '../rce/plugins/shared/fileTypeUtils';
-import { showFlashError } from '../common/FlashAlert';
-import natcompare from '../common/natcompare';
-export const PENDING_MEDIA_ENTRY_ID = 'maybe';
-
-class FileBrowser extends React.Component {
-  constructor(_props2) {
-    var _this;
-
-    super(_props2);
-    _this = this;
-    this.fetchSubFolders = _.memoize(id => {
-      this.source.fetchBookmarkedData(this.source.fetchSubFolders.bind(this.source), {
-        folderId: id,
-        perPage: 50
-      }, result => {
-        this.populateCollectionsList(result.folders);
-      }, error => {
-        this.props.onLoading(false);
-        /* eslint-disable no-console */
-
-        console.error('Error fetching data from API');
-        console.error(error);
-      });
-    });
-
-    this.populateCollectionsList = function (folderList) {
-      let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-      _this.setState((state, props) => {
-        const newCollections = _.cloneDeep(state.collections);
-
-        folderList.forEach(folder => {
-          const collection = _this.formatFolderInfo(folder, { ...opts,
-            searchString: props.searchString
-          });
-
-          newCollections[collection.id] = collection;
-          const parentId = folder.parentId || 0;
-          const collectionCollections = newCollections[parentId].collections;
-
-          if (!collectionCollections.includes(collection.id)) {
-            collectionCollections.push(collection.id);
-            newCollections[parentId].collections = _this.orderedIdsFromList(newCollections, collectionCollections);
-          }
-        });
-        return {
-          collections: newCollections
-        };
-      });
-    };
-
-    this.populateItemsList = fileList => {
-      this.setState((state, _props) => {
-        const newItems = _.cloneDeep(state.items);
-
-        const newCollections = _.cloneDeep(state.collections);
-
-        fileList.forEach(file => {
-          if (this.contentTypeIsAllowed(file.type)) {
-            const item = this.formatFileInfo(file);
-            newItems[item.id] = item;
-            const folder_id = file.folderId;
-            const collectionItems = newCollections[folder_id].items;
-
-            if (!collectionItems.includes(item.id)) {
-              collectionItems.push(item.id);
-              newCollections[folder_id].items = this.orderedIdsFromList(newItems, collectionItems);
-            }
-          }
-        });
-        return {
-          items: newItems,
-          collections: newCollections
-        };
-      });
-    };
-
-    this.onFolderToggle = folder => {
-      const folderId = folder.id;
-      this.setState((state, _props) => {
-        const collection = state.collections[folderId];
-        let newFolders = [];
-        let newCollections = state.collections;
-        const {
-          openFolders
-        } = state;
-
-        if (!collection.locked && openFolders.includes(folderId)) {
-          newFolders = newFolders.concat(openFolders.filter(id => id !== folderId));
-        } else if (!collection.locked) {
-          newFolders = newFolders.concat(openFolders);
-          newFolders.push(folderId);
-          newCollections = _.cloneDeep(state.collections);
-          newCollections[folderId] = collection;
-        }
-
-        return {
-          openFolders: newFolders,
-          uploadFolder: folderId,
-          collections: newCollections
-        };
-      }, () => {
-        if (this.state.openFolders.includes(folderId)) {
-          const collection = this.state.collections[folderId];
-
-          if (!collection.locked) {
-            this.getFolderData(folderId);
-          }
-        }
-      });
-    };
-
-    this.onFileClick = file => {
-      const selectedItem = this.state.items[file.id];
-      if (selectedItem.isDisabled) return;
-      this.props.selectFile(selectedItem);
-    };
-
-    this.setFailureMessage = message => {
-      showFlashError(message)();
-    };
-
-    this.state = {
-      collections: {
-        0: {
-          id: 0,
-          collections: []
-        }
-      },
-      items: {},
-      openFolders: [],
-      loadingCount: 0
-    };
-    this.source = _props2.source;
-    this.updatePropsWithThumbnailOrIcon = this.updatePropsWithThumbnailOrIcon.bind(this);
-  }
-
-  componentDidMount() {
-    this.getRootFolders();
-  }
-
-  componentDidUpdate() {
-    this.state.openFolders.forEach(fid => {
-      if (this.props.searchString !== this.state.collections[fid].searchString) {
-        this.getFolderData(fid);
-      }
-    });
-  }
-
-  getContextName(contextType) {
-    if (contextType === 'course') {
-      return formatMessage('Course files');
-    } else {
-      return formatMessage('Group files');
-    }
-  }
-
-  getRootFolders() {
-    if (this.props.useContextAssets) {
-      this.getContextFolders();
-    }
-
-    this.getUserFolders();
-  }
-
-  getUserFolders() {
-    this.getRootFolderData('user', 'self', {
-      name: formatMessage('My files')
-    });
-  }
-
-  getContextFolders() {
-    const {
-      type,
-      id
-    } = this.props.context;
-
-    if (type && id) {
-      this.getRootFolderData(type, id, {
-        name: this.getContextName(type)
-      });
-    }
-  }
-
-  increaseLoadingCount() {
-    let {
-      loadingCount
-    } = this.state;
-    loadingCount += 1;
-    this.setState({
-      loadingCount
-    });
-  }
-
-  decreaseLoadingCount() {
-    let {
-      loadingCount
-    } = this.state;
-    loadingCount -= 1;
-    this.setState({
-      loadingCount
-    });
-  }
-
-  getRootFolderData(context, contextId) {
-    let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-    this.increaseLoadingCount();
-    this.source.fetchRootFolder({
-      contextType: context,
-      contextId
-    }).then(result => {
-      this.populateRootFolder(result.folders[0], opts);
-    }).catch(error => {
-      this.decreaseLoadingCount();
-
-      if (error.response && error.response.status !== 401) {
-        this.setFailureMessage(formatMessage('Something went wrong'));
-      }
-    });
-  }
-
-  populateRootFolder(data) {
-    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    this.decreaseLoadingCount();
-    this.populateCollectionsList([data], opts);
-    this.getFolderData(data.id);
-  } // Memoized function to fetch all subfolders
-  // of the given folder ID, handing pagination
-
-
-  fetchFiles(id) {
-    var _this$state$collectio, _this$state$collectio2;
-
-    this.source.fetchBookmarkedData(this.source.fetchFilesForFolder.bind(this.source), {
-      searchString: this.props.searchString,
-      perPage: 50,
-      filesUrl: (_this$state$collectio = this.state.collections[id]) === null || _this$state$collectio === void 0 ? void 0 : (_this$state$collectio2 = _this$state$collectio.api) === null || _this$state$collectio2 === void 0 ? void 0 : _this$state$collectio2.filesUrl
-    }, result => {
-      this.populateItemsList(result.files);
-    }, error => {
-      this.props.onLoading(false);
-      console.error(error);
-    });
-  }
-
-  getFolderData(id) {
-    if (!this.state.collections[id].locked) {
-      this.setState((state, _props) => {
-        const collections = { ...state.collections
-        };
-        const collection = { ...collections[id]
-        };
-        collection.items = [];
-        collection.searchString = this.props.searchString;
-        collections[id] = collection;
-        return {
-          collections
-        };
-      }, () => {
-        this.fetchSubFolders(id);
-        this.fetchFiles(id);
-      });
-    }
-  }
-
-  contentTypeIsAllowed(contentType) {
-    for (const pattern of this.props.contentTypes) {
-      if (minimatch(contentType, pattern)) {
-        return true;
-      }
-    }
-
-    return false;
-  }
-
-  formatFolderInfo(apiFolder) {
-    var _apiFolder$contextTyp;
-
-    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    const descriptor = apiFolder.lockedForUser ? formatMessage('Locked') : null;
-    const folder = {
-      api: apiFolder,
-      id: apiFolder.id,
-      collections: [],
-      items: [],
-      name: apiFolder.name,
-      context: `/${(_apiFolder$contextTyp = apiFolder.contextType) === null || _apiFolder$contextTyp === void 0 ? void 0 : _apiFolder$contextTyp.toLowerCase()}s/${apiFolder.contextId}`,
-      canUpload: apiFolder.canUpload,
-      locked: apiFolder.lockedForUser,
-      descriptor,
-      ...opts
-    };
-    const existingCollections = this.state.collections[apiFolder.id];
-    Object.assign(folder, existingCollections && {
-      collections: existingCollections.collections,
-      items: existingCollections.items
-    });
-    return folder;
-  }
-
-  updatePropsWithThumbnailOrIcon(props) {
-    const {
-      id
-    } = props;
-    const file = this.state.items[id].api;
-    let thumbnail, itemIcon;
-
-    if (isImage(file.type)) {
-      if (file.thumbnailUrl) {
-        thumbnail = file.thumbnailUrl;
-      } else {
-        itemIcon = IconImageLine;
-      }
-    } else {
-      itemIcon = getIconFromType(file.type);
-    }
-
-    const containerRef = node => {
-      if (node && !node.title && props.name) node.title = props.name;
-    };
-
-    return { ...props,
-      thumbnail,
-      itemIcon,
-      containerRef
-    };
-  }
-
-  formatFileInfo(apiFile) {
-    let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    const {
-      collections
-    } = this.state;
-    const context = collections[apiFile.folderId].context;
-    const isMediaPending = apiFile.mediaEntryId === PENDING_MEDIA_ENTRY_ID;
-    const file = {
-      api: apiFile,
-      id: apiFile.id,
-      name: apiFile.name,
-      isDisabled: isMediaPending,
-      src: `${context}/files/${apiFile.id}/preview${context.includes('user') ? `?verifier=${apiFile.uuid}` : ''}`,
-      alt: apiFile.name,
-      ...opts
-    };
-
-    if (apiFile.iframeUrl) {
-      // it's a media_object
-      file.src = apiFile.iframeUrl;
-    }
-
-    if (isMediaPending) {
-      file.descriptor = formatMessage('Media file is processing. Please try again later.');
-    }
-
-    return file;
-  }
-
-  orderedIdsFromList(list, ids) {
-    try {
-      const sortedIds = ids.sort((a, b) => natcompare.strings(list[a].name, list[b].name));
-      return sortedIds;
-    } catch (error) {
-      console.error(error);
-      return ids;
-    }
-  }
-
-  findFolderForFile(file) {
-    const {
-      collections
-    } = this.state;
-    const folderKey = Object.keys(collections).find(key => {
-      const items = collections[key].items;
-      return items && items.includes(file.id);
-    });
-    return collections[folderKey];
-  }
-
-  renderLoading() {
-    if (this.state.loadingCount > 0) {
-      return /*#__PURE__*/React.createElement(Spinner, {
-        renderTitle: formatMessage('Loading folders'),
-        size: "small"
-      });
-    } else {
-      return null;
-    }
-  }
-
-  render() {
-    const element = /*#__PURE__*/React.createElement("div", {
-      className: "file-browser__container"
-    }, /*#__PURE__*/React.createElement(Text, null, formatMessage('Available folders')), /*#__PURE__*/React.createElement("div", {
-      className: "file-browser__tree"
-    }, /*#__PURE__*/React.createElement(TreeBrowser, {
-      collections: this.state.collections,
-      items: this.state.items,
-      size: "medium",
-      onCollectionToggle: this.onFolderToggle,
-      onItemClick: this.onFileClick,
-      treeLabel: formatMessage('Folder tree'),
-      rootId: 0,
-      showRootCollection: false,
-      expanded: this.state.openFolders,
-      collectionIconExpanded: IconOpenFolderSolid,
-      collectionIcon: IconFolderSolid,
-      selectionType: "single",
-      getItemProps: this.updatePropsWithThumbnailOrIcon
-    }), this.renderLoading()));
-    return element;
-  }
-
-}
-
-FileBrowser.propTypes = {
-  allowUpload: PropTypes.bool,
-  selectFile: PropTypes.func.isRequired,
-  contentTypes: PropTypes.arrayOf(PropTypes.string),
-  useContextAssets: PropTypes.bool,
-  searchString: PropTypes.string,
-  onLoading: PropTypes.func.isRequired,
-  context: PropTypes.shape({
-    type: PropTypes.string.isRequired,
-    id: PropTypes.string.isRequired
-  }).isRequired
-};
-FileBrowser.defaultProps = {
-  allowUpload: true,
-  contentTypes: ['*/*'],
-  useContextAssets: true
-};
-export default FileBrowser;

package/lib/canvasFileBrowser/en-US.js

@@ -1,234 +0,0 @@
-/*
- * Copyright (C) 2020 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * 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/>.
- */
-Date.CultureInfo = {
-  /* Culture Name */
-  name: 'en-US',
-  englishName: 'English (United States)',
-  nativeName: 'English (United States)',
-
-  /* Day Name Strings */
-  dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
-  abbreviatedDayNames: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-  shortestDayNames: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
-  firstLetterDayNames: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
-
-  /* Month Name Strings */
-  monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-  abbreviatedMonthNames: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
-
-  /* AM/PM Designators */
-  amDesignator: 'AM',
-  pmDesignator: 'PM',
-  firstDayOfWeek: 0,
-  twoDigitYearMax: 2029,
-
-  /**
-     * The dateElementOrder is based on the order of the 
-     * format specifiers in the formatPatterns.DatePattern. 
-     *
-     * Example:
-     <pre>
-     shortDatePattern    dateElementOrder
-     ------------------  ---------------- 
-     "M/d/yyyy"          "mdy"
-     "dd/MM/yyyy"        "dmy"
-     "yyyy-MM-dd"        "ymd"
-     </pre>
-     *
-     * The correct dateElementOrder is required by the parser to
-     * determine the expected order of the date elements in the
-     * string being parsed.
-     */
-  dateElementOrder: 'mdy',
-
-  /* Standard date and time format patterns */
-  formatPatterns: {
-    shortDate: 'M/d/yyyy',
-    longDate: 'dddd, MMMM dd, yyyy',
-    shortTime: 'h:mm tt',
-    longTime: 'h:mm:ss tt',
-    fullDateTime: 'dddd, MMMM dd, yyyy h:mm:ss tt',
-    sortableDateTime: 'yyyy-MM-ddTHH:mm:ss',
-    universalSortableDateTime: 'yyyy-MM-dd HH:mm:ssZ',
-    rfc1123: 'ddd, dd MMM yyyy HH:mm:ss GMT',
-    monthDay: 'MMMM dd',
-    yearMonth: 'MMMM, yyyy'
-  },
-
-  /**
-   * NOTE: If a string format is not parsing correctly, but
-   * you would expect it parse, the problem likely lies below.
-   *
-   * The following regex patterns control most of the string matching
-   * within the parser.
-   *
-   * The Month name and Day name patterns were automatically generated
-   * and in general should be (mostly) correct.
-   *
-   * Beyond the month and day name patterns are natural language strings.
-   * Example: "next", "today", "months"
-   *
-   * These natural language string may NOT be correct for this culture.
-   * If they are not correct, please translate and edit this file
-   * providing the correct regular expression pattern.
-   *
-   * If you modify this file, please post your revised CultureInfo file
-   * to the Datejs Forum located at http://www.datejs.com/forums/.
-   *
-   * Please mark the subject of the post with [CultureInfo]. Example:
-   *    Subject: [CultureInfo] Translated "da-DK" Danish(Denmark)
-   *
-   * We will add the modified patterns to the master source files.
-   *
-   * As well, please review the list of "Future Strings" section below.
-   */
-  regexPatterns: {
-    jan: /^jan(uary)?/i,
-    feb: /^feb(ruary)?/i,
-    mar: /^mar(ch)?/i,
-    apr: /^apr(il)?/i,
-    may: /^may/i,
-    jun: /^jun(e)?/i,
-    jul: /^jul(y)?/i,
-    aug: /^aug(ust)?/i,
-    sep: /^sep(t(ember)?)?/i,
-    oct: /^oct(ober)?/i,
-    nov: /^nov(ember)?/i,
-    dec: /^dec(ember)?/i,
-    sun: /^su(n(day)?)?/i,
-    mon: /^mo(n(day)?)?/i,
-    tue: /^tu(e(s(day)?)?)?/i,
-    wed: /^we(d(nesday)?)?/i,
-    thu: /^th(u(r(s(day)?)?)?)?/i,
-    fri: /^fr(i(day)?)?/i,
-    sat: /^sa(t(urday)?)?/i,
-    future: /^next/i,
-    past: /^last|past|prev(ious)?/i,
-    add: /^(\+|aft(er)?|from|hence)/i,
-    subtract: /^(\-|bef(ore)?|ago)/i,
-    yesterday: /^yes(terday)?/i,
-    today: /^t(od(ay)?)?/i,
-    tomorrow: /^tom(orrow)?/i,
-    now: /^n(ow)?/i,
-    millisecond: /^ms|milli(second)?s?/i,
-    second: /^sec(ond)?s?/i,
-    minute: /^mn|min(ute)?s?/i,
-    hour: /^h(our)?s?/i,
-    week: /^w(eek)?s?/i,
-    month: /^m(onth)?s?/i,
-    day: /^d(ay)?s?/i,
-    year: /^y(ear)?s?/i,
-    shortMeridian: /^(a|p)/i,
-    longMeridian: /^(a\.?m?\.?|p\.?m?\.?)/i,
-    timezone: /^((e(s|d)t|c(s|d)t|m(s|d)t|p(s|d)t)|((gmt)?\s*(\+|\-)\s*\d\d\d\d?)|gmt|utc)/i,
-    ordinalSuffix: /^\s*(st|nd|rd|th)/i,
-    timeContext: /^\s*(\:|a(?!u|p)|p)/i
-  },
-  timezones: [{
-    name: 'UTC',
-    offset: '-000'
-  }, {
-    name: 'GMT',
-    offset: '-000'
-  }, {
-    name: 'EST',
-    offset: '-0500'
-  }, {
-    name: 'EDT',
-    offset: '-0400'
-  }, {
-    name: 'CST',
-    offset: '-0600'
-  }, {
-    name: 'CDT',
-    offset: '-0500'
-  }, {
-    name: 'MST',
-    offset: '-0700'
-  }, {
-    name: 'MDT',
-    offset: '-0600'
-  }, {
-    name: 'PST',
-    offset: '-0800'
-  }, {
-    name: 'PDT',
-    offset: '-0700'
-  }]
-};
-/** ******************
- ** Future Strings **
- ********************
- *
- * The following list of strings may not be currently being used, but
- * may be incorporated into the Datejs library later.
- *
- * We would appreciate any help translating the strings below.
- *
- * If you modify this file, please post your revised CultureInfo file
- * to the Datejs Forum located at http://www.datejs.com/forums/.
- *
- * Please mark the subject of the post with [CultureInfo]. Example:
- *    Subject: [CultureInfo] Translated "da-DK" Danish(Denmark)b
- *
- * English Name        Translated
- * ------------------  -----------------
- * about               about
- * ago                 ago
- * date                date
- * time                time
- * calendar            calendar
- * show                show
- * hourly              hourly
- * daily               daily
- * weekly              weekly
- * bi-weekly           bi-weekly
- * fortnight           fortnight
- * monthly             monthly
- * bi-monthly          bi-monthly
- * quarter             quarter
- * quarterly           quarterly
- * yearly              yearly
- * annual              annual
- * annually            annually
- * annum               annum
- * again               again
- * between             between
- * after               after
- * from now            from now
- * repeat              repeat
- * times               times
- * per                 per
- * min (abbrev minute) min
- * morning             morning
- * noon                noon
- * night               night
- * midnight            midnight
- * mid-night           mid-night
- * evening             evening
- * final               final
- * future              future
- * spring              spring
- * summer              summer
- * fall                fall
- * winter              winter
- * end of              end of
- * end                 end
- * long                long
- * short               short
- */