Add all remaining templates folders to import/order (#58462)

* Add all remaining templates folders to import/order * Fixes * fixes * Fix * Revert "fixes" This reverts commit 04e47f2. * Fixes * Fix rubric * Comments * comments * Comments
code-dot-org · May 13, 2024 · 5d7b3ee · 5d7b3ee
1 parent 1c0bff5
commit 5d7b3ee
Show file tree

Hide file tree

Showing 262 changed files with 1,216 additions and 775 deletions.
diff --git a/apps/.eslintrc.js b/apps/.eslintrc.js
@@ -219,14 +219,6 @@ module.exports = {
         'src/storage/**',
         // This one had some problems, see https://github.com/code-dot-org/code-dot-org/pull/58284
         'src/templates/curriculumCatalog/**',
-        'src/templates/policy_compliance/**',
-        'src/templates/progress/**',
-        'src/templates/projects/**',
-        'src/templates/referenceGuides/**',
-        'src/templates/rubrics/**',
-        'src/templates/sessions/**',
-        'src/templates/verificationPages/**',
-        'src/templates/*',
         'src/third-party/*',
         'src/types/*',
         'src/userHeaderEventLogger/*',

diff --git a/apps/src/templates/AccessibleDialog.jsx b/apps/src/templates/AccessibleDialog.jsx
@@ -1,9 +1,11 @@
+import classnames from 'classnames';
+import FocusTrap from 'focus-trap-react';
 import PropTypes from 'prop-types';
 import React from 'react';
-import FocusTrap from 'focus-trap-react';
+
 import CloseOnEscape from '@cdo/apps/templates/CloseOnEscape';
+
 import defaultStyle from './accessible-dialogue.module.scss';
-import classnames from 'classnames';
 
 function AccessibleDialog({
   styles,

diff --git a/apps/src/templates/AgeDialog.jsx b/apps/src/templates/AgeDialog.jsx
@@ -1,16 +1,17 @@
+import PropTypes from 'prop-types';
+import queryString from 'query-string';
 import React, {Component} from 'react';
 import {connect} from 'react-redux';
+
+import fontConstants from '@cdo/apps/fontConstants';
+import {EVENTS} from '@cdo/apps/lib/util/AnalyticsConstants';
+import analyticsReporter from '@cdo/apps/lib/util/AnalyticsReporter';
+import AgeDropdown from '@cdo/apps/templates/AgeDropdown';
 import BaseDialog from '@cdo/apps/templates/BaseDialog';
-import color from '@cdo/apps/util/color';
 import Button from '@cdo/apps/templates/Button';
-import AgeDropdown from '@cdo/apps/templates/AgeDropdown';
 import {SignInState, setOver21} from '@cdo/apps/templates/currentUserRedux';
-import analyticsReporter from '@cdo/apps/lib/util/AnalyticsReporter';
-import {EVENTS} from '@cdo/apps/lib/util/AnalyticsConstants';
+import color from '@cdo/apps/util/color';
 import i18n from '@cdo/locale';
-import PropTypes from 'prop-types';
-import queryString from 'query-string';
-import fontConstants from '@cdo/apps/fontConstants';
 
 /*
  * SignInOrAgeDialog uses 'anon_over13' as its session storage key.

diff --git a/apps/src/templates/AgeDialog.story.jsx b/apps/src/templates/AgeDialog.story.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+
 import {UnconnectedAgeDialog as AgeDialog} from './AgeDialog';
 
 export default {

diff --git a/apps/src/templates/AppView.jsx b/apps/src/templates/AppView.jsx
@@ -1,14 +1,17 @@
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import classNames from 'classnames';
 import {connect} from 'react-redux';
+
+import ModalFunctionEditor from '@cdo/apps/blockly/components/ModalFunctionEditor';
+
+import VisualizationResizeBar from '../lib/ui/VisualizationResizeBar';
 import {isResponsiveFromState} from '../templates/ProtectedVisualizationDiv';
-import StudioAppWrapper from './StudioAppWrapper';
-import InstructionsWithWorkspace from './instructions/InstructionsWithWorkspace';
+
 import CodeWorkspace from './CodeWorkspace';
+import InstructionsWithWorkspace from './instructions/InstructionsWithWorkspace';
 import Overlay from './Overlay';
-import VisualizationResizeBar from '../lib/ui/VisualizationResizeBar';
-import ModalFunctionEditor from '@cdo/apps/blockly/components/ModalFunctionEditor';
+import StudioAppWrapper from './StudioAppWrapper';
 
 /**
  * Top-level React wrapper for our standard blockly apps.

diff --git a/apps/src/templates/ArrowButtons.jsx b/apps/src/templates/ArrowButtons.jsx
@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 import {connect} from 'react-redux';
 
 /**

diff --git a/apps/src/templates/AssignButton.jsx b/apps/src/templates/AssignButton.jsx
@@ -1,14 +1,16 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 import {connect} from 'react-redux';
-import Button from './Button';
-import i18n from '@cdo/locale';
-import {assignToSection} from '@cdo/apps/templates/teacherDashboard/teacherSectionsRedux';
-import ConfirmHiddenAssignment from '@cdo/apps/templates/courseOverview/ConfirmHiddenAssignment';
+
 import {
   isScriptHiddenForSection,
   updateHiddenScript,
 } from '@cdo/apps/code-studio/hiddenLessonRedux';
+import ConfirmHiddenAssignment from '@cdo/apps/templates/courseOverview/ConfirmHiddenAssignment';
+import {assignToSection} from '@cdo/apps/templates/teacherDashboard/teacherSectionsRedux';
+import i18n from '@cdo/locale';
+
+import Button from './Button';
 
 class AssignButton extends React.Component {
   static propTypes = {

diff --git a/apps/src/templates/AssignButton.story.jsx b/apps/src/templates/AssignButton.story.jsx
@@ -1,8 +1,10 @@
-import React from 'react';
 import {action} from '@storybook/addon-actions';
-import {UnconnectedAssignButton as AssignButton} from './AssignButton';
+import React from 'react';
+
 import {fakeTeacherSectionsForDropdown} from '@cdo/apps/templates/teacherDashboard/sectionAssignmentTestHelper';
 
+import {UnconnectedAssignButton as AssignButton} from './AssignButton';
+
 export default {
   component: AssignButton,
 };

diff --git a/apps/src/templates/Assigned.jsx b/apps/src/templates/Assigned.jsx
@@ -1,8 +1,9 @@
 import React, {Component} from 'react';
+
+import fontConstants from '@cdo/apps/fontConstants';
 import FontAwesome from '@cdo/apps/templates/FontAwesome';
 import color from '@cdo/apps/util/color';
 import i18n from '@cdo/locale';
-import fontConstants from '@cdo/apps/fontConstants';
 
 export default class Assigned extends Component {
   render() {

diff --git a/apps/src/templates/BackToFrontConfetti.jsx b/apps/src/templates/BackToFrontConfetti.jsx
@@ -7,9 +7,9 @@
  * Confetti component directly.
  */
 
-import Confetti from 'react-dom-confetti';
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
+import Confetti from 'react-dom-confetti';
 
 const defaultStyle = {
   position: 'relative',

diff --git a/apps/src/templates/BaseDialog.jsx b/apps/src/templates/BaseDialog.jsx
@@ -1,9 +1,12 @@
 import PropTypes from 'prop-types';
 import React from 'react';
+
+import i18n from '@cdo/locale';
+
 import {BASE_DIALOG_WIDTH} from '../constants';
-import Button from './Button';
 import color from '../util/color';
-import i18n from '@cdo/locale';
+
+import Button from './Button';
 
 /**
  * BaseDialog

diff --git a/apps/src/templates/BaseDialog.story.jsx b/apps/src/templates/BaseDialog.story.jsx
@@ -1,7 +1,9 @@
 import React from 'react';
-import BaseDialog from './BaseDialog';
+
 import ExampleDialogButton from '../util/ExampleDialogButton';
 
+import BaseDialog from './BaseDialog';
+
 const EXAMPLE_DIALOG_BODY = (
   <div style={{border: '1px solid black'}}>
     The contents of the dialog go inside this box! woo

diff --git a/apps/src/templates/BelowVisualization.jsx b/apps/src/templates/BelowVisualization.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+
 import ProtectedStatefulDiv from './ProtectedStatefulDiv';
 
 /**

diff --git a/apps/src/templates/Button.jsx b/apps/src/templates/Button.jsx
@@ -3,11 +3,13 @@
  * This particular button is designed to operate in contexts where we have a solid
  * background. When we're a button on top of an image, we may want something different.
  */
+import classNames from 'classnames';
 import _ from 'lodash';
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
+
 import FontAwesome from '@cdo/apps/templates/FontAwesome';
-import classNames from 'classnames';
+
 import moduleStyles from './button.module.scss';
 
 // Note: Keep these constants in sync with button.module.scss.

diff --git a/apps/src/templates/Button.story.jsx b/apps/src/templates/Button.story.jsx
@@ -1,6 +1,7 @@
+import {action} from '@storybook/addon-actions';
 import React from 'react';
+
 import Button from './Button';
-import {action} from '@storybook/addon-actions';
 
 export default {
   component: Button,

diff --git a/apps/src/templates/ChallengeDialog.jsx b/apps/src/templates/ChallengeDialog.jsx
@@ -1,15 +1,18 @@
-import BackToFrontConfetti from './BackToFrontConfetti';
-import BaseDialog from './BaseDialog';
-import LegacyButton from './LegacyButton';
-import PuzzleRatingButtons from './PuzzleRatingButtons';
 import PropTypes from 'prop-types';
 import Radium from 'radium'; // eslint-disable-line no-restricted-imports
 import React from 'react';
+
 import assetUrl from '@cdo/apps/code-studio/assetUrl';
-import color from '../util/color';
 import {getStore} from '@cdo/apps/redux';
 import i18n from '@cdo/locale';
 
+import color from '../util/color';
+
+import BackToFrontConfetti from './BackToFrontConfetti';
+import BaseDialog from './BaseDialog';
+import LegacyButton from './LegacyButton';
+import PuzzleRatingButtons from './PuzzleRatingButtons';
+
 class ChallengeDialog extends React.Component {
   static propTypes = {
     avatar: PropTypes.string,

diff --git a/apps/src/templates/ChallengeDialog.story.jsx b/apps/src/templates/ChallengeDialog.story.jsx
@@ -1,13 +1,15 @@
-import ChallengeDialog from './ChallengeDialog';
-import CodeWritten from './feedback/CodeWritten';
-import GeneratedCode from './feedback/GeneratedCode';
 import React from 'react';
+
+import BirdsWinAvatar from '@cdo/static/skins/birds/win_avatar.png';
 import HarvesterStaticAvatar from '@cdo/static/skins/harvester/static_avatar.png';
 import HarvesterWinAvatar from '@cdo/static/skins/harvester/win_avatar.png';
-import BirdsWinAvatar from '@cdo/static/skins/birds/win_avatar.png';
 import StudioWinAvatar from '@cdo/static/skins/studio/win_avatar.png';
 import SpriteLabAvatar from '@cdo/static/spritelab/avatar.png';
 
+import ChallengeDialog from './ChallengeDialog';
+import CodeWritten from './feedback/CodeWritten';
+import GeneratedCode from './feedback/GeneratedCode';
+
 export default {
   component: ChallengeDialog,
 };

diff --git a/apps/src/templates/CheckboxDropdown.jsx b/apps/src/templates/CheckboxDropdown.jsx
@@ -1,15 +1,15 @@
-import React, {useCallback} from 'react';
-import PropTypes from 'prop-types';
 import classnames from 'classnames';
+import PropTypes from 'prop-types';
+import React, {useCallback} from 'react';
 
+import Checkbox from '@cdo/apps/componentLibrary/checkbox';
 import Typography from '@cdo/apps/componentLibrary/typography';
 import Button from '@cdo/apps/templates/Button';
-import FontAwesome from './FontAwesome';
-
 import i18n from '@cdo/locale';
 
+import FontAwesome from './FontAwesome';
+
 import style from './checkbox-dropdown.module.scss';
-import Checkbox from '@cdo/apps/componentLibrary/checkbox';
 
 const CheckboxDropdown = ({
   name,

diff --git a/apps/src/templates/CloseOnEscape.jsx b/apps/src/templates/CloseOnEscape.jsx
@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 /**
  * Utility wrapper component that calls a close function when the Escape key is pressed

diff --git a/apps/src/templates/CodeWorkspace.jsx b/apps/src/templates/CodeWorkspace.jsx
@@ -1,25 +1,28 @@
+import classNames from 'classnames';
 import $ from 'jquery';
-import React from 'react';
 import PropTypes from 'prop-types';
 import Radium from 'radium'; // eslint-disable-line no-restricted-imports
+import React from 'react';
 import {connect} from 'react-redux';
-import ProtectedStatefulDiv from './ProtectedStatefulDiv';
+
+import WorkspaceAlert from '@cdo/apps/code-studio/components/WorkspaceAlert';
 import JsDebugger from '@cdo/apps/lib/tools/jsdebugger/JsDebugger';
-import PaneHeader, {PaneSection, PaneButton} from './PaneHeader';
+import styleConstants from '@cdo/apps/styleConstants';
+import * as utils from '@cdo/apps/utils';
 import i18n from '@cdo/locale';
+
+import {closeWorkspaceAlert} from '../code-studio/projectRedux';
+import {queryParams} from '../code-studio/utils';
 import commonStyles from '../commonStyles';
-import color from '../util/color';
-import * as utils from '@cdo/apps/utils';
-import {shouldUseRunModeIndicators} from '../redux/selectors';
 import SettingsCog from '../lib/ui/SettingsCog';
-import ShowCodeToggle from './ShowCodeToggle';
+import {shouldUseRunModeIndicators} from '../redux/selectors';
 import {singleton as studioApp} from '../StudioApp';
+import color from '../util/color';
+
+import PaneHeader, {PaneSection, PaneButton} from './PaneHeader';
 import ProjectTemplateWorkspaceIcon from './ProjectTemplateWorkspaceIcon';
-import {queryParams} from '../code-studio/utils';
-import WorkspaceAlert from '@cdo/apps/code-studio/components/WorkspaceAlert';
-import {closeWorkspaceAlert} from '../code-studio/projectRedux';
-import styleConstants from '@cdo/apps/styleConstants';
-import classNames from 'classnames';
+import ProtectedStatefulDiv from './ProtectedStatefulDiv';
+import ShowCodeToggle from './ShowCodeToggle';
 
 class CodeWorkspace extends React.Component {
   static propTypes = {

diff --git a/apps/src/templates/CodeWorkspaceContainer.jsx b/apps/src/templates/CodeWorkspaceContainer.jsx
@@ -3,13 +3,14 @@
  * us to position it vertically. Causes resize events to fire when receiving new props
  */
 import $ from 'jquery';
-import React from 'react';
-import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import Radium from 'radium'; // eslint-disable-line no-restricted-imports
+import React from 'react';
+import ReactDOM from 'react-dom';
 import {connect} from 'react-redux';
-import * as utils from '../utils';
+
 import commonStyles from '../commonStyles';
+import * as utils from '../utils';
 
 class CodeWorkspaceContainer extends React.Component {
   static propTypes = {

diff --git a/apps/src/templates/CollapserIcon.jsx b/apps/src/templates/CollapserIcon.jsx
@@ -1,6 +1,7 @@
-import React from 'react';
-import PropTypes from 'prop-types';
 import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import React from 'react';
+
 import moduleStyles from './collapser-icon.module.scss';
 
 const styles = {

diff --git a/apps/src/templates/CollapserIcon.story.jsx b/apps/src/templates/CollapserIcon.story.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+
 import CollapserIcon from './CollapserIcon';
 
 const styles = {

diff --git a/apps/src/templates/CollapsibleSection.tsx b/apps/src/templates/CollapsibleSection.tsx
@@ -1,11 +1,13 @@
-import FontAwesomeV6Icon from '@cdo/apps/componentLibrary/fontAwesomeV6Icon/FontAwesomeV6Icon';
-import Typography from '@cdo/apps/componentLibrary/typography/Typography';
 import React, {useState, useCallback} from 'react';
-import moduleStyles from './collapsible-section.module.scss';
+
+import FontAwesomeV6Icon from '@cdo/apps/componentLibrary/fontAwesomeV6Icon/FontAwesomeV6Icon';
 import {
   SemanticTag as TypographyElementSemanticTag,
   VisualAppearance as TypographyElementVisualAppearance,
 } from '@cdo/apps/componentLibrary/typography/types';
+import Typography from '@cdo/apps/componentLibrary/typography/Typography';
+
+import moduleStyles from './collapsible-section.module.scss';
 
 interface CollapsibleSectionProps {
   title: string;

diff --git a/apps/src/templates/CompletionButton.jsx b/apps/src/templates/CompletionButton.jsx
@@ -1,7 +1,9 @@
-import msg from '@cdo/locale';
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import {connect} from 'react-redux';
+
+import msg from '@cdo/locale';
+
 import ProtectedStatefulDiv from '../templates/ProtectedStatefulDiv';
 
 /**

diff --git a/apps/src/templates/ContainedLevel.jsx b/apps/src/templates/ContainedLevel.jsx
@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import ReactDOM from 'react-dom';
+
 import ProtectedStatefulDiv from './ProtectedStatefulDiv';
 
 class ContainedLevel extends Component {

diff --git a/apps/src/templates/ContainedLevelAnswer.jsx b/apps/src/templates/ContainedLevelAnswer.jsx
@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React, {Component} from 'react';
 import ReactDOM from 'react-dom';
+
 import ProtectedStatefulDiv from './ProtectedStatefulDiv';
 
 class ContainedLevelAnswer extends Component {