scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-12-03 20:31:43 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

refactor: ensure any given file is all CJS or all ESM

Browse source
This commit is contained in:
Christopher Willis-Ford 2024-03-20 15:12:54 -07:00
parent 90d05c7554
commit 9c8ef43dc4
29 changed files with 119 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
.babelrc
View file

@ -10,11 +10,7 @@
[ [
"@babel/preset-env", "@babel/preset-env",
{ {
"bugfixes": true, "bugfixes": true
// This papers over the fact that our current code is inconsistent
// For example, we sometimes use `import` with a file that exports with `module.exports`
"modules": "commonjs"
} }
], ],
"@babel/preset-react" "@babel/preset-react"

7
src/components/dropdown-banner/email-confirmation/banner.jsx
View file

@ -1,7 +1,8 @@
/* eslint-disable react/jsx-no-bind */ /* eslint-disable react/jsx-no-bind */
import React, {useState} from 'react'; const React = require('react');
import PropTypes from 'prop-types'; const {useState} = React;
import DropdownBanner from '../banner.jsx'; const PropTypes = require('prop-types');
const DropdownBanner = require('../banner.jsx');
const FormattedMessage = require('react-intl').FormattedMessage; const FormattedMessage = require('react-intl').FormattedMessage;
const EmailConfirmationModal = require('../../../components/modal/email-confirmation/modal.jsx'); const EmailConfirmationModal = require('../../../components/modal/email-confirmation/modal.jsx');

2
src/components/errorboundary/errorboundary.jsx
View file

@ -2,7 +2,7 @@ const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
const CrashMessageComponent = require('../crashmessage/crashmessage.jsx'); const CrashMessageComponent = require('../crashmessage/crashmessage.jsx');
import log from '../../lib/log.js'; const log = require('../../lib/log.js');
class ErrorBoundary extends React.Component { class ErrorBoundary extends React.Component {
constructor (props) { constructor (props) {

2
src/components/formik-forms/formik-checkbox.jsx
View file

@ -1,7 +1,7 @@
const classNames = require('classnames'); const classNames = require('classnames');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
import {Field} from 'formik'; const {Field} = require('formik');
require('./formik-checkbox.scss'); require('./formik-checkbox.scss');
require('./formik-forms.scss'); require('./formik-forms.scss');

2
src/components/formik-forms/formik-input.jsx
View file

@ -1,7 +1,7 @@
const classNames = require('classnames'); const classNames = require('classnames');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
import {Field} from 'formik'; const {Field} = require('formik');
const ValidationMessage = require('../forms/validation-message.jsx'); const ValidationMessage = require('../forms/validation-message.jsx');

2
src/components/formik-forms/formik-radio-button.jsx
View file

@ -1,7 +1,7 @@
const classNames = require('classnames'); const classNames = require('classnames');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
import {Field} from 'formik'; const {Field} = require('formik');
const FormikInput = require('./formik-input.jsx'); const FormikInput = require('./formik-input.jsx');

2
src/components/formik-forms/formik-select.jsx
View file

@ -1,6 +1,6 @@
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
import {Field} from 'formik'; const {Field} = require('formik');
const ValidationMessage = require('../forms/validation-message.jsx'); const ValidationMessage = require('../forms/validation-message.jsx');

2
src/components/join-flow/birthdate-step.jsx
View file

@ -2,7 +2,7 @@ const bindAll = require('lodash.bindall');
const classNames = require('classnames'); const classNames = require('classnames');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');
const FormattedMessage = require('react-intl').FormattedMessage; const FormattedMessage = require('react-intl').FormattedMessage;

2
src/components/join-flow/country-step.jsx
View file

@ -2,7 +2,7 @@ const bindAll = require('lodash.bindall');
const classNames = require('classnames'); const classNames = require('classnames');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');
const countryData = require('../../lib/country-data'); const countryData = require('../../lib/country-data');

2
src/components/join-flow/email-step.jsx
View file

@ -2,7 +2,7 @@ const bindAll = require('lodash.bindall');
const classNames = require('classnames'); const classNames = require('classnames');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');
const FormattedMessage = require('react-intl').FormattedMessage; const FormattedMessage = require('react-intl').FormattedMessage;

2
src/components/join-flow/gender-step.jsx
View file

@ -2,7 +2,7 @@ const bindAll = require('lodash.bindall');
const classNames = require('classnames'); const classNames = require('classnames');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');
const FormattedMessage = require('react-intl').FormattedMessage; const FormattedMessage = require('react-intl').FormattedMessage;

2
src/components/join-flow/username-step.jsx
View file

@ -2,7 +2,7 @@ const bindAll = require('lodash.bindall');
const classNames = require('classnames'); const classNames = require('classnames');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');
const intlShape = require('../../lib/intl-shape'); const intlShape = require('../../lib/intl-shape');

2
src/components/join-flow/welcome-step.jsx
View file

@ -1,7 +1,7 @@
const bindAll = require('lodash.bindall'); const bindAll = require('lodash.bindall');
const React = require('react'); const React = require('react');
const PropTypes = require('prop-types'); const PropTypes = require('prop-types');
import {Formik} from 'formik'; const {Formik} = require('formik');
const FormattedMessage = require('react-intl').FormattedMessage; const FormattedMessage = require('react-intl').FormattedMessage;
const {injectIntl} = require('react-intl'); const {injectIntl} = require('react-intl');

9
src/components/modal/email-confirmation/modal.jsx
View file

@ -1,9 +1,10 @@
import React, {useState} from 'react'; const React = require('react');
const {useState} = React;
const connect = require('react-redux').connect; const connect = require('react-redux').connect;
import PropTypes from 'prop-types'; const PropTypes = require('prop-types');
import {FormattedMessage} from 'react-intl'; const {FormattedMessage} = require('react-intl');
import Modal from '../base/modal.jsx'; const Modal = require('../base/modal.jsx');
require('./modal.scss'); require('./modal.scss');
const EmailConfirmationModal = ({ const EmailConfirmationModal = ({

2
src/components/modal/mute/feedback-form.jsx
View file

@ -2,7 +2,7 @@ const PropTypes = require('prop-types');
const React = require('react'); const React = require('react');
const classNames = require('classnames'); const classNames = require('classnames');
import {Formik} from 'formik'; const {Formik} = require('formik');
const FormikInput = require('../../../components/formik-forms/formik-input.jsx'); const FormikInput = require('../../../components/formik-forms/formik-input.jsx');
const bindAll = require('lodash.bindall'); const bindAll = require('lodash.bindall');

2
src/components/world-map/world-map.jsx
View file

@ -6,7 +6,7 @@ Plotly.register([
]); ]);
// create plotly bundle that only has choropleth plots // create plotly bundle that only has choropleth plots
import createPlotlyComponent from 'react-plotly.js/factory'; const createPlotlyComponent = require('react-plotly.js/factory').default;
const Plot = createPlotlyComponent(Plotly); const Plot = createPlotlyComponent(Plotly);
const React = require('react'); const React = require('react');

2
src/init.js
View file

@ -1,5 +1,5 @@
import 'regenerator-runtime/runtime'; // Needed for async/await import 'regenerator-runtime/runtime'; // Needed for async/await
const jar = require('./lib/jar'); import jar from './lib/jar';
/** /**
* ----------------------------------------------------------------------------- * -----------------------------------------------------------------------------

2
src/lib/render.jsx
View file

@ -8,7 +8,7 @@ const {getLocale, scratchLocaleToIntlLocale} = require('./locales.js');
const permissionsActions = require('../redux/permissions.js'); const permissionsActions = require('../redux/permissions.js');
const sessionActions = require('../redux/session.js'); const sessionActions = require('../redux/session.js');
const configureStore = require('./configure-store.js'); const configureStore = require('./configure-store.js');
import intlPolyfill from '../lib/intl-polyfill'; const intlPolyfill = require('../lib/intl-polyfill.js').default;
require('../main.scss'); require('../main.scss');

51
src/views/annual-report/2020/annual-report.jsx
View file

@ -1,34 +1,33 @@
const bindAll = require('lodash.bindall'); import bindAll from 'lodash.bindall';
const classNames = require('classnames'); import classNames from 'classnames';
const React = require('react'); import React from 'react';
const MediaQuery = require('react-responsive').default; import MediaQuery from 'react-responsive';
const FormattedMessage = require('react-intl').FormattedMessage; import {FormattedMessage, injectIntl} from 'react-intl';
const injectIntl = require('react-intl').injectIntl;
const intlShape = require('../../../lib/intl-shape'); import intlShape from '../../../lib/intl-shape';
const render = require('../../../lib/render.jsx'); import render from '../../../lib/render.jsx';
const frameless = require('../../../lib/frameless'); import frameless from '../../../lib/frameless';
const Avatar = require('../../../components/avatar/avatar.jsx'); import Avatar from '../../../components/avatar/avatar.jsx';
const Page = require('../../../components/page/www/page.jsx'); import Page from '../../../components/page/www/page.jsx';
const Grid = require('../../../components/grid/grid.jsx'); import Grid from '../../../components/grid/grid.jsx';
const Button = require('../../../components/forms/button.jsx'); import Button from '../../../components/forms/button.jsx';
const FlexRow = require('../../../components/flex-row/flex-row.jsx'); import FlexRow from '../../../components/flex-row/flex-row.jsx';
const Comment = require('../../../components/comment/comment.jsx'); import Comment from '../../../components/comment/comment.jsx';
const CountryBlurb = require('./country-blurb/country-blurb.jsx'); import CountryBlurb from './country-blurb/country-blurb.jsx';
const TextAndMediaSnippet = require('../../../components/text-and-media-snippet/text-and-media-snippet.jsx'); import TextAndMediaSnippet from '../../../components/text-and-media-snippet/text-and-media-snippet.jsx';
const TimelineCard = require('../../../components/timeline-card/timeline-card.jsx'); import TimelineCard from '../../../components/timeline-card/timeline-card.jsx';
const WorldMap = require('../../../components/world-map/world-map.jsx'); import WorldMap from '../../../components/world-map/world-map.jsx';
const CountryUsage = require('./country-usage.json'); import CountryUsage from './country-usage.json';
const IndiaProjects = require('./india-projects.json'); import IndiaProjects from './india-projects.json';
const PeopleGrid = require('../../../components/people-grid/people-grid.jsx'); import PeopleGrid from '../../../components/people-grid/people-grid.jsx';
const People = require('./people.json'); import People from './people.json';
const VideoPreview = require('../../../components/video-preview/video-preview.jsx'); import VideoPreview from '../../../components/video-preview/video-preview.jsx';
const Supporters = require('./supporters.json'); import Supporters from './supporters.json';
import {TwitterTweetEmbed} from 'react-twitter-embed'; import {TwitterTweetEmbed} from 'react-twitter-embed';
require('./annual-report.scss'); import './annual-report.scss';
// Founder’s Message / Mission / Reach / Themes / Director’s Message / Supporters / Team / Donate // Founder’s Message / Mission / Reach / Themes / Director’s Message / Supporters / Team / Donate

45
src/views/annual-report/2021/annual-report.jsx
View file

@ -1,31 +1,30 @@
const bindAll = require('lodash.bindall'); import bindAll from 'lodash.bindall';
const classNames = require('classnames'); import classNames from 'classnames';
const React = require('react'); import React from 'react';
const MediaQuery = require('react-responsive').default; import MediaQuery from 'react-responsive';
const FormattedMessage = require('react-intl').FormattedMessage; import {FormattedMessage, injectIntl} from 'react-intl';
const injectIntl = require('react-intl').injectIntl;
const intlShape = require('../../../lib/intl-shape'); import intlShape from '../../../lib/intl-shape';
const render = require('../../../lib/render.jsx'); import render from '../../../lib/render.jsx';
const frameless = require('../../../lib/frameless'); import frameless from '../../../lib/frameless';
const Avatar = require('../../../components/avatar/avatar.jsx'); import Avatar from '../../../components/avatar/avatar.jsx';
const Page = require('../../../components/page/www/page.jsx'); import Page from '../../../components/page/www/page.jsx';
const Button = require('../../../components/forms/button.jsx'); import Button from '../../../components/forms/button.jsx';
const FlexRow = require('../../../components/flex-row/flex-row.jsx'); import FlexRow from '../../../components/flex-row/flex-row.jsx';
const TextAndMediaSnippet = require('../../../components/text-and-media-snippet/text-and-media-snippet.jsx'); import TextAndMediaSnippet from '../../../components/text-and-media-snippet/text-and-media-snippet.jsx';
const TimelineCard = require('../../../components/timeline-card/timeline-card.jsx'); import TimelineCard from '../../../components/timeline-card/timeline-card.jsx';
const PeopleGrid = require('../../../components/people-grid/people-grid.jsx'); import PeopleGrid from '../../../components/people-grid/people-grid.jsx';
const People = require('./people.json'); import People from './people.json';
const Tag = require('../../../components/tag/tag.jsx'); import Tag from '../../../components/tag/tag.jsx';
const VideoPreview = require('../../../components/video-preview/video-preview.jsx'); import VideoPreview from '../../../components/video-preview/video-preview.jsx';
const VideoPreviewYouTube = require('./video-preview-youtube/video-preview-youtube.jsx'); import VideoPreviewYouTube from './video-preview-youtube/video-preview-youtube.jsx';
const Supporters = require('./supporters.json'); import Supporters from './supporters.json';
import {TwitterTweetEmbed} from 'react-twitter-embed'; import {TwitterTweetEmbed} from 'react-twitter-embed';
const Organizations = require('./orgs.json'); import Organizations from './orgs.json';
require('./annual-report.scss'); import './annual-report.scss';
// Director’s Message / Mission / Reach / Themes / Founder's Message / Supporters / Team / Donate // Director’s Message / Mission / Reach / Themes / Founder's Message / Supporters / Team / Donate

2
src/views/become-a-scratcher/become-a-scratcher.jsx
View file

@ -15,7 +15,7 @@ import Modal from '../../components/modal/base/modal.jsx';
import NotAvailable from '../../components/not-available/not-available.jsx'; import NotAvailable from '../../components/not-available/not-available.jsx';
import WarningBanner from '../../components/title-banner/warning-banner.jsx'; import WarningBanner from '../../components/title-banner/warning-banner.jsx';
require('./become-a-scratcher.scss'); import './become-a-scratcher.scss';
const communityGuidelines = [ const communityGuidelines = [
{ {

2
src/views/download/scratch-link/download.jsx
View file

@ -2,7 +2,7 @@ import React, {useState} from 'react';
import {FormattedMessage, injectIntl} from 'react-intl'; import {FormattedMessage, injectIntl} from 'react-intl';
import Page from '../../../components/page/www/page.jsx'; import Page from '../../../components/page/www/page.jsx';
const intlShape = require('../../../lib/intl-shape'); import intlShape from '../../../lib/intl-shape';
import render from '../../../lib/render.jsx'; import render from '../../../lib/render.jsx';
import FlexRow from '../../../components/flex-row/flex-row.jsx'; import FlexRow from '../../../components/flex-row/flex-row.jsx';

2
src/views/preview/project-view.jsx
View file

@ -27,7 +27,7 @@ const NotAvailable = require('../../components/not-available/not-available.jsx')
const Meta = require('./meta.jsx'); const Meta = require('./meta.jsx');
const sessionActions = require('../../redux/session.js'); const sessionActions = require('../../redux/session.js');
import {selectProjectCommentsGloballyEnabled, selectIsTotallyNormal} from '../../redux/session'; const {selectProjectCommentsGloballyEnabled, selectIsTotallyNormal} = require('../../redux/session');
const navigationActions = require('../../redux/navigation.js'); const navigationActions = require('../../redux/navigation.js');
const previewActions = require('../../redux/preview.js'); const previewActions = require('../../redux/preview.js');
const projectCommentActions = require('../../redux/project-comment-actions.js'); const projectCommentActions = require('../../redux/project-comment-actions.js');

4
src/views/preview/subactions.jsx
View file

@ -12,8 +12,8 @@ const {connect} = require('react-redux');
const {useState} = require('react'); const {useState} = require('react');
const projectShape = require('./projectshape.jsx').projectShape; const projectShape = require('./projectshape.jsx').projectShape;
import {selectIsMuted} from '../../redux/session.js'; const {selectIsMuted} = require('../../redux/session.js');
import StudioMuteEditMessage from '../studio/studio-mute-edit-message.jsx'; const StudioMuteEditMessage = require('../studio/studio-mute-edit-message.jsx').default;
require('./subactions.scss'); require('./subactions.scss');

37
src/views/search/search.jsx
View file

@ -1,29 +1,28 @@
const bindAll = require('lodash.bindall'); import bindAll from 'lodash.bindall';
const connect = require('react-redux').connect; import {connect} from 'react-redux';
const FormattedMessage = require('react-intl').FormattedMessage; import {FormattedMessage, injectIntl} from 'react-intl';
const injectIntl = require('react-intl').injectIntl; import PropTypes from 'prop-types';
const PropTypes = require('prop-types'); import React from 'react';
const React = require('react');
const api = require('../../lib/api'); import api from '../../lib/api';
const intlShape = require('../../lib/intl-shape'); import intlShape from '../../lib/intl-shape';
const {getLocale} = require('../../lib/locales.js'); import {getLocale} from '../../lib/locales.js';
const Button = require('../../components/forms/button.jsx'); import Button from '../../components/forms/button.jsx';
const Form = require('../../components/forms/form.jsx'); import Form from '../../components/forms/form.jsx';
const Grid = require('../../components/grid/grid.jsx'); import Grid from '../../components/grid/grid.jsx';
const navigationActions = require('../../redux/navigation.js'); import navigationActions from '../../redux/navigation.js';
const Select = require('../../components/forms/select.jsx'); import Select from '../../components/forms/select.jsx';
const TitleBanner = require('../../components/title-banner/title-banner.jsx'); import TitleBanner from '../../components/title-banner/title-banner.jsx';
const Tabs = require('../../components/tabs/tabs.jsx'); import Tabs from '../../components/tabs/tabs.jsx';
import {selectIsTotallyNormal} from '../../redux/session'; import {selectIsTotallyNormal} from '../../redux/session';
const Page = require('../../components/page/www/page.jsx'); import Page from '../../components/page/www/page.jsx';
const render = require('../../lib/render.jsx'); import render from '../../lib/render.jsx';
const ACCEPTABLE_MODES = ['trending', 'popular']; const ACCEPTABLE_MODES = ['trending', 'popular'];
require('./search.scss'); import './search.scss';
class Search extends React.Component { class Search extends React.Component {
constructor (props) { constructor (props) {

30
src/views/studentregistration/studentregistration.jsx
View file

@ -1,21 +1,21 @@
const bindAll = require('lodash.bindall'); import bindAll from 'lodash.bindall';
const defaults = require('lodash.defaultsdeep'); import defaultsDeep from 'lodash.defaultsdeep';
const PropTypes = require('prop-types'); import PropTypes from 'prop-types';
const React = require('react'); import React from 'react';
const injectIntl = require('react-intl').injectIntl; import {injectIntl} from 'react-intl';
const api = require('../../lib/api'); import api from '../../lib/api';
const intlShape = require('../../lib/intl-shape'); import intlShape from '../../lib/intl-shape';
const route = require('../../lib/route'); import route from '../../lib/route';
const Deck = require('../../components/deck/deck.jsx'); import Deck from '../../components/deck/deck.jsx';
const Progression = require('../../components/progression/progression.jsx'); import Progression from '../../components/progression/progression.jsx';
const Steps = require('../../components/registration/steps.jsx'); import Steps from '../../components/registration/steps.jsx';
import StudentRegistrationMeta from './student-registration-meta.jsx'; import StudentRegistrationMeta from './student-registration-meta.jsx';
const render = require('../../lib/render.jsx'); import render from '../../lib/render.jsx';
require('./studentregistration.scss'); import './studentregistration.scss';
class StudentRegistration extends React.Component { class StudentRegistration extends React.Component {
constructor (props) { constructor (props) {
@ -59,7 +59,7 @@ class StudentRegistration extends React.Component {
this.setState({ this.setState({
waiting: true waiting: true
}); });
formData = defaults({}, formData || {}, this.state.formData); formData = defaultsDeep({}, formData || {}, this.state.formData);
api({ api({
host: '', host: '',
uri: '/classes/register_new_student/', uri: '/classes/register_new_student/',
@ -97,7 +97,7 @@ class StudentRegistration extends React.Component {
formData = formData || {}; formData = formData || {};
this.setState({ this.setState({
step: this.state.step + 1, step: this.state.step + 1,
formData: defaults({}, formData, this.state.formData) formData: defaultsDeep({}, formData, this.state.formData)
}); });
} }
handleGoToClass () { handleGoToClass () {

3
src/views/studio/modals/transfer-host-confirmation.jsx
View file

@ -1,8 +1,7 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import {connect} from 'react-redux'; import {connect} from 'react-redux';
import {FormattedMessage} from 'react-intl'; import {FormattedMessage, injectIntl} from 'react-intl';
const {injectIntl} = require('react-intl');
import intlShape from '../../../lib/intl-shape.js'; import intlShape from '../../../lib/intl-shape.js';
import ModalInnerContent from '../../../components/modal/base/modal-inner-content.jsx'; import ModalInnerContent from '../../../components/modal/base/modal-inner-content.jsx';

8
src/views/studio/studio-redux.js
View file

@ -6,10 +6,10 @@ import {
userProjects userProjects
} from './lib/redux-modules'; } from './lib/redux-modules';
const {getInitialState, studioReducer} = require('../../redux/studio'); import {getInitialState, studioReducer} from '../../redux/studio';
const {studioReportReducer} = require('../../redux/studio-report'); import {studioReportReducer} from '../../redux/studio-report';
const {commentsReducer} = require('../../redux/comments'); import {commentsReducer} from '../../redux/comments';
const {studioMutationsReducer} = require('../../redux/studio-mutations'); import {studioMutationsReducer} from '../../redux/studio-mutations';
const reducers = { const reducers = {

8
src/views/terms/terms.jsx
View file

@ -1,9 +1,9 @@
const React = require('react'); import React from 'react';
const Page = require('../../components/page/www/page.jsx'); import Page from '../../components/page/www/page.jsx';
const render = require('../../lib/render.jsx'); import render from '../../lib/render.jsx';
const InformationPage = require('../../components/informationpage/informationpage.jsx'); import InformationPage from '../../components/informationpage/informationpage.jsx';
const Terms = () => ( const Terms = () => (
<InformationPage title={'Scratch Terms of Use'}> <InformationPage title={'Scratch Terms of Use'}>