@ndla/ui 3.3.11 → 3.3.15

package/src/NDLAFilm/MovieGrid.jsx

@@ -1,75 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import BEMHelper from 'react-bem-helper';
-import { css } from '@emotion/core';
-import { withTranslation } from 'react-i18next';
-import FilmContentCard from './FilmContentCard';
-
-const movieListClasses = new BEMHelper({
-  name: 'film-movielist',
-  prefix: 'c-',
-});
-
-const MovieGrid = ({
-  resourceTypeName,
-  fetchingMoviesByType,
-  moviesByType,
-  resourceTypes,
-  loadingPlaceholderHeight,
-  autoSizedProps,
-  resizeThumbnailImages,
-  t,
-}) => (
-  <section>
-    <h1
-      {...movieListClasses('heading')}
-      css={css`
-        margin-left: ${autoSizedProps.margin}px;
-      `}>
-      {resourceTypeName && resourceTypeName.name}
-      <small>
-        {fetchingMoviesByType
-          ? t('ndlaFilm.loadingMovies')
-          : `${moviesByType.length} ${t('ndlaFilm.movieMatchInCategory')}`}
-      </small>
-    </h1>
-    <div
-      {...movieListClasses('movie-listing')}
-      css={css`
-        margin-left: ${autoSizedProps.margin}px;
-      `}>
-      {fetchingMoviesByType && (
-        <div
-          css={css`
-            height: ${loadingPlaceholderHeight};
-          `}
-        />
-      )}
-      {!fetchingMoviesByType &&
-        moviesByType.map((movie) => (
-          <FilmContentCard
-            hideTags
-            movie={movie}
-            columnWidth={autoSizedProps.columnWidth}
-            distanceBetweenItems={autoSizedProps.distanceBetweenItems}
-            resourceTypes={resourceTypes}
-            resizeThumbnailImages={resizeThumbnailImages}
-          />
-        ))}
-    </div>
-  </section>
-);
-
-MovieGrid.propTypes = {
-  autoSizedProps: PropTypes.shape({}),
-  resourceTypeName: PropTypes.shape({
-    name: PropTypes.string,
-  }),
-  fetchingMoviesByType: PropTypes.bool,
-  moviesByType: PropTypes.array,
-  classes: PropTypes.func,
-  resourceTypes: PropTypes.array,
-  loadingPlaceholderHeight: PropTypes.string,
-};
-
-export default withTranslation()(MovieGrid);

package/src/NDLAFilm/VisualElement.jsx

@@ -1,48 +0,0 @@
-/**
- * Copyright (c) 2019-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Image } from '@ndla/ui';
-import styled from '@emotion/styled';
-
-const StylediFrame = styled.iframe`
-  height: 100%;
-  width: 100%;
-  border: 0;
-  margin: 0;
-  padding: 0;
-`;
-
-const VisualElement = ({ visualElement }) => {
-  switch (visualElement.type) {
-    case 'image':
-      return <Image src={visualElement.url} alt={visualElement.alt} />;
-    case 'brightcove':
-      return (
-        <StylediFrame
-          allowfullscreen="true"
-          webkitallowfullscreen="true"
-          mozallowfullscreen="true"
-          src={visualElement.url}
-        />
-      );
-    default:
-      return null;
-  }
-};
-
-VisualElement.propTypes = {
-  visualElement: PropTypes.shape({
-    url: PropTypes.string,
-    alt: PropTypes.string,
-    type: PropTypes.string,
-  }).isRequired,
-};
-
-export default VisualElement;

package/src/NDLAFilm/interfaces.ts

@@ -1,10 +0,0 @@
-export interface NDLAMovie {
-  id: string;
-  metaDescription: string;
-  title: string;
-  metaImage: {
-    url: string;
-    alt: string;
-  };
-  path: string;
-}

package/src/NDLAFilm/shapes.ts

@@ -1,17 +0,0 @@
-import PropTypes from 'prop-types';
-
-export const movieShape = PropTypes.shape({
-  id: PropTypes.string.isRequired,
-  metaDescription: PropTypes.string.isRequired,
-  title: PropTypes.string.isRequired,
-  metaImage: PropTypes.shape({
-    url: PropTypes.string.isRequired,
-    alt: PropTypes.string.isRequired,
-  }),
-  path: PropTypes.string.isRequired,
-});
-
-export const topicShape = PropTypes.shape({
-  id: PropTypes.string,
-  name: PropTypes.string,
-});

package/src/TopicIntroductionList/TopicIntroductionShortcuts.jsx

@@ -1,92 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import BEMHelper from 'react-bem-helper';
-import { Forward } from '@ndla/icons/common';
-
-import ShortcutItem from './TopicShortcutItem';
-
-import { ShortcutShape } from '../shapes';
-
-const classes = new BEMHelper({
-  name: 'topic-shortcuts',
-  prefix: 'c-',
-});
-
-class TopicIntroductionShortcuts extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      open: props.alwaysExpanded,
-      returned: false,
-      showButtonText: true,
-    };
-    this.handleOnToggle = this.handleOnToggle.bind(this);
-  }
-
-  handleOnToggle(open) {
-    this.setState({
-      open,
-      showButtonText: !open,
-      returned: !open,
-    });
-  }
-
-  render() {
-    const { shortcuts, messages, id, alwaysExpanded } = this.props;
-    const { open, returned, showButtonText } = this.state;
-
-    let onMouseEnter = null;
-    let onMouseLeave = null;
-
-    let buttonView = null;
-
-    if (!alwaysExpanded) {
-      onMouseEnter = () => this.handleOnToggle(true);
-      onMouseLeave = () => this.handleOnToggle(false);
-
-      buttonView = (
-        <button
-          type="button"
-          aria-expanded={this.state.open}
-          aria-label={messages.toggleButtonText}
-          aria-controls={id}
-          {...classes('button', returned ? 're-enter' : '')}
-          onClick={() => {
-            this.handleOnToggle(!open);
-          }}>
-          <Forward />
-          {showButtonText && <span {...classes('label')}>{messages.toggleButtonText}</span>}
-        </button>
-      );
-    }
-    return (
-      <div onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} {...classes()}>
-        {buttonView}
-        {open && (
-          <ul className={classes('list', open ? 'visible' : '').className}>
-            {shortcuts.map((shortcut) => (
-              <li {...classes('item')} key={shortcut.id}>
-                <ShortcutItem shortcut={shortcut} />
-              </li>
-            ))}
-          </ul>
-        )}
-      </div>
-    );
-  }
-}
-
-TopicIntroductionShortcuts.propTypes = {
-  id: PropTypes.string.isRequired,
-  alwaysExpanded: PropTypes.bool,
-  messages: PropTypes.shape({
-    toggleButtonText: PropTypes.string.isRequired,
-  }),
-  shortcuts: PropTypes.arrayOf(ShortcutShape).isRequired,
-};
-
-TopicIntroductionShortcuts.defaultProps = {
-  alwaysExpanded: false,
-};
-
-export default TopicIntroductionShortcuts;