Merge pull request #4100 from devo1ution/organize-imports

add organize imports to pre-commit

Author: bqi343

.pre-commit-config.yaml

@@ -10,6 +10,9 @@ repos:
     rev: v4.0.0-alpha.4
     hooks:
       - id: prettier
+        additional_dependencies:
+          - prettier@^2.7.1
+          - prettier-plugin-organize-imports
   - repo: local
     hooks:
       - id: black-with-tabs

content/ordering.ts

@@ -306,8 +306,7 @@ SECTIONS.forEach(section => {
   });
 });
 
-export { moduleIDToSectionMap };
-export { moduleIDToURLMap };
+export { moduleIDToSectionMap, moduleIDToURLMap };
 
 const moduleIDToURLMap: { [key: string]: string } = {};
 

docs/Front End Documentation.md

@@ -54,16 +54,16 @@ compile xdm into `src/gatsby/xdm.js` with Webpack:
 import path from 'path';
 
 export default {
-  mode: 'production',
-  entry: './index.js',
-  output: {
-    path: path.resolve('D:\\Code\\xdm', 'dist'),
-    filename: 'bundle.js',
-    library: {
-      name: 'xdm',
-      type: 'commonjs',
-    },
-  },
+	mode: 'production',
+	entry: './index.js',
+	output: {
+		path: path.resolve('D:\\Code\\xdm', 'dist'),
+		filename: 'bundle.js',
+		library: {
+			name: 'xdm',
+			type: 'commonjs',
+		},
+	},
 };
 ```
 

gatsby-node.ts

@@ -2,15 +2,15 @@ import { execSync } from 'child_process';
 import fs from 'fs';
 import path from 'path';
 import * as freshOrdering from './content/ordering';
+import div_to_probs from './src/components/markdown/ProblemsList/DivisionList/div_to_probs.json';
 import { createXdmNode } from './src/gatsby/create-xdm-node';
 import {
+  ProblemMetadata,
+  ShortProblemInfo,
   checkInvalidUsacoMetadata,
   getProblemInfo,
   getProblemURL,
-  ShortProblemInfo,
-  ProblemMetadata,
 } from './src/models/problem';
-import div_to_probs from './src/components/markdown/ProblemsList/DivisionList/div_to_probs.json';
 // Questionable hack to get full commit history so that timestamps work
 try {
   execSync(

src/assets/firepad.css

@@ -176,15 +176,11 @@ a.firepad-btn:hover {
 }
 
 a.firepad-btn:active {
-  -webkit-box-shadow:
-    inset 0 2px 4px rgba(0, 0, 0, 0.15),
+  -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),
     0 1px 2px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow:
-    inset 0 2px 4px rgba(0, 0, 0, 0.15),
-    0 1px 2px rgba(0, 0, 0, 0.05);
-  box-shadow:
-    inset 0 2px 4px rgba(0, 0, 0, 0.15),
+  -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),
     0 1px 2px rgba(0, 0, 0, 0.05);
+  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 }
 
 .firepad-btn-group > .firepad-btn {

src/atoms/atomWithStorage.ts

@@ -1,5 +1,5 @@
-import { atom, PrimitiveAtom } from 'jotai';
 import type { SetStateAction } from 'jotai';
+import { atom, PrimitiveAtom } from 'jotai';
 
 type Storage<Value> = {
   getItem: (key: string) => Value;

src/components/Confetti/Confetti.js

@@ -1,7 +1,7 @@
-import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
-import { random, sample, range, getDiameter } from './Confetti.helpers';
+import { getDiameter, random, range, sample } from './Confetti.helpers';
 import { createCircle, createTriangle, createZigZag } from './confetti-shapes';
 
 import Canvas from './Canvas';

src/components/Confetti/Particles.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { defaultShapes } from './confetti-shapes.js';
 import { getDiameter, random, range, sample } from './Confetti.helpers';
+import { defaultShapes } from './confetti-shapes.js';
 import type { Particle, Shape } from './types';
 
 type State = {

src/components/ContactUsSlideover/ContactUsSlideover.tsx

@@ -2,8 +2,8 @@ import * as React from 'react';
 import { useContext, useEffect, useState } from 'react';
 import { SECTION_LABELS } from '../../../content/ordering';
 import MarkdownLayoutContext from '../../context/MarkdownLayoutContext';
-import { useUserLangSetting } from '../../context/UserDataContext/properties/simpleProperties';
 import { useFirebaseUser } from '../../context/UserDataContext/UserDataContext';
+import { useUserLangSetting } from '../../context/UserDataContext/properties/simpleProperties';
 import useContactFormAction from '../../hooks/useContactFormAction';
 import useStickyState from '../../hooks/useStickyState';
 import { ModuleInfo } from '../../models/module';
@@ -295,8 +295,8 @@ export default function ContactUsSlideover({
                   ? email === ''
                     ? 'This field is required.'
                     : !validateEmail(email)
-                      ? 'Please enter a valid email address.'
-                      : null
+                    ? 'Please enter a valid email address.'
+                    : null
                   : null
               }
             />

src/components/Editor/EditorOutput.tsx

@@ -8,8 +8,8 @@ import { EditorContext } from '../../context/EditorContext';
 import { MarkdownProblemListsProvider } from '../../context/MarkdownProblemListsContext';
 import { ProblemSuggestionModalProvider } from '../../context/ProblemSuggestionModalContext';
 import {
-  ProblemMetadata,
   PROBLEM_DIFFICULTY_OPTIONS,
+  ProblemMetadata,
 } from '../../models/problem';
 import QuizGeneratorModal from '../QuizGeneratorModal';
 

src/components/Editor/MainEditorInterface.tsx

@@ -123,16 +123,16 @@ export const MainEditorInterface = ({ className }): JSX.Element => {
           activeFile === null
             ? 'NONE'
             : tab === 'content'
-              ? activeFile.path
-              : activeFile.path.replace(/\.mdx$/, '.problems.json')
+            ? activeFile.path
+            : activeFile.path.replace(/\.mdx$/, '.problems.json')
         }
         language={tab === 'content' ? 'custom-mdx' : 'json'}
         value={
           activeFile === null
             ? 'Open a file to begin'
             : tab === 'content'
-              ? markdown
-              : problems
+            ? markdown
+            : problems
         }
         onChange={(v, e) =>
           tab === 'content' ? setMarkdown(v) : setProblems(v)

src/components/Groups/EditGroupPage/EditGroupPage.tsx

@@ -4,9 +4,9 @@ import toast from 'react-hot-toast';
 import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import { useGroupActions } from '../../../hooks/groups/useGroupActions';
 import { GroupData } from '../../../models/groups/groups';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 
 export default function EditGroupPage(props) {

src/components/Groups/EditPostPage/EditPostPage.tsx

@@ -9,9 +9,9 @@ import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import { usePost } from '../../../hooks/groups/usePost';
 import { usePostActions } from '../../../hooks/groups/usePostActions';
 import { PostData } from '../../../models/groups/posts';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 import MarkdownEditor from '../MarkdownEditor';
 

src/components/Groups/EditProblemPage/EditProblemPage.tsx

@@ -1,12 +1,12 @@
 import { CheckIcon, XIcon } from '@heroicons/react/solid';
 import { RouteComponentProps } from '@reach/router';
 import {
+  Timestamp,
   collection,
   getDocs,
   getFirestore,
   limit,
   query,
-  Timestamp,
 } from 'firebase/firestore';
 import 'flatpickr/dist/themes/material_blue.css';
 import { Link, navigate } from 'gatsby';
@@ -22,14 +22,14 @@ import { useFirebaseApp } from '../../../hooks/useFirebase';
 import { GroupProblemData } from '../../../models/groups/problem';
 import {
   AlgoliaProblemInfo,
-  getProblemURL,
   ProblemInfo,
+  getProblemURL,
 } from '../../../models/problem';
 import ButtonGroup from '../../ButtonGroup';
-import Layout from '../../layout';
 import ProblemAutocompleteModal from '../../ProblemAutocompleteModal/ProblemAutocompleteModal';
-import SEO from '../../seo';
 import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
+import Layout from '../../layout';
+import SEO from '../../seo';
 import Breadcrumbs from '../Breadcrumbs';
 import MarkdownEditor from '../MarkdownEditor';
 import EditProblemHintSection from './EditProblemHintSection';
@@ -114,12 +114,12 @@ export default function EditProblemPage(props: Props) {
               getProblemURL(problemInfo),
             ]}/solution)`
           : problem.solution?.kind == 'link'
-            ? `See [${problem.solution.url}](${problem.solution.url})`
-            : problem.solution?.kind == 'label'
-              ? problem.solution.label
-              : problem.solution?.kind === 'sketch'
-                ? problem.solution.sketch
-                : '',
+          ? `See [${problem.solution.url}](${problem.solution.url})`
+          : problem.solution?.kind == 'label'
+          ? problem.solution.label
+          : problem.solution?.kind === 'sketch'
+          ? problem.solution.sketch
+          : '',
 
       source: problem.source,
       difficulty: problem.difficulty,

src/components/Groups/Feedback.tsx

@@ -62,7 +62,7 @@ export default function Feedback({ videoId }): JSX.Element {
             ([emoji, key, name]: [
               string,
               'very_bad' | 'bad' | 'good' | 'great',
-              string,
+              string
             ]) => (
               <button
                 key={key}

src/components/Groups/GroupLeaderboardPage/GroupLeaderboardPage.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import useLeaderboardData from '../../../hooks/groups/useLeaderboardData';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 import { LeaderboardTable } from '../LeaderboardTable/LeaderboardTable';
 

src/components/Groups/GroupPage/FeedItem.tsx

@@ -8,9 +8,9 @@ import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import { usePostActions } from '../../../hooks/groups/usePostActions';
 import { GroupData } from '../../../models/groups/groups';
 import {
+  PostData,
   getPostTimestampString,
   getTotalPointsOfPost,
-  PostData,
 } from '../../../models/groups/posts';
 import Tooltip from '../../Tooltip/Tooltip';
 import PostExportModal from './PostExportModal';
@@ -46,8 +46,8 @@ const AssignmentIcon = ({ pointsEarned, totalPoints }) => {
           (fullySolved
             ? 'bg-green-600'
             : inProgress
-              ? 'bg-orange-600'
-              : 'bg-light-blue-700') +
+            ? 'bg-orange-600'
+            : 'bg-light-blue-700') +
           ' rounded-full p-2 inline-flex items-center justify-center'
         }
       >

src/components/Groups/GroupPage/GroupPage.tsx

@@ -1,9 +1,9 @@
 import { Link } from 'gatsby';
 import * as React from 'react';
 import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Feed from './Feed';
 import GroupPageHeader from './GroupPageHeader';
 import LeaderboardSidebar from './LeaderboardSidebar';

src/components/Groups/GroupPage/PostExportModal.tsx

@@ -1,8 +1,8 @@
 import { Dialog, Transition } from '@headlessui/react';
 import {
+  CollectionReference,
   arrayUnion,
   collection,
-  CollectionReference,
   doc,
   getDocs,
   getFirestore,

src/components/Groups/GroupSelectPage/GroupSelectPage.tsx

@@ -7,9 +7,9 @@ import {
 import { useUserPermissions } from '../../../context/UserDataContext/UserPermissionsContext';
 import { useGroupActions } from '../../../hooks/groups/useGroupActions';
 import { useUserGroups } from '../../../hooks/groups/useUserGroups';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import AdminViewAllGroups from './AdminViewAllGroups';
 import { GroupCard } from './GroupCard';
 

src/components/Groups/JoinGroupPage.tsx

@@ -9,9 +9,9 @@ import {
 } from '../../context/UserDataContext/UserDataContext';
 import { useUserGroups } from '../../hooks/groups/useUserGroups';
 import { useFirebaseApp } from '../../hooks/useFirebase';
+import TopNavigationBar from '../TopNavigationBar/TopNavigationBar';
 import Layout from '../layout';
 import SEO from '../seo';
-import TopNavigationBar from '../TopNavigationBar/TopNavigationBar';
 
 const getQuery = name => {
   const url = window.location.href;

src/components/Groups/JoinLinksPage/EditJoinLinkModal.tsx

@@ -4,8 +4,8 @@ import 'flatpickr/dist/themes/material_blue.css';
 import * as React from 'react';
 import Flatpickr from 'react-flatpickr';
 import { JoinGroupLink } from '../../../models/groups/groups';
-import Switch from '../../elements/Switch';
 import Tooltip from '../../Tooltip/Tooltip';
+import Switch from '../../elements/Switch';
 
 export default function EditJoinLinkModal({
   isOpen,

src/components/Groups/JoinLinksPage/JoinLinksPage.tsx

@@ -4,9 +4,9 @@ import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import { useGroupActions } from '../../../hooks/groups/useGroupActions';
 import useGroupJoinLinks from '../../../hooks/groups/useGroupJoinLinks';
 import { JoinGroupLink } from '../../../models/groups/groups';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 import EditJoinLinkModal from './EditJoinLinkModal';
 

src/components/Groups/MembersPage/MembersPage.tsx

@@ -3,9 +3,9 @@ import * as React from 'react';
 import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import useLeaderboardData from '../../../hooks/groups/useLeaderboardData';
 import getMemberInfoForGroup from '../../../hooks/groups/useMemberInfoForGroup';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import MemberDetail from './MemberDetail';
 
 export default function MembersPage(): JSX.Element {

src/components/Groups/OnlineJudgeSubmission/OnlineJudgeSubmission.tsx

@@ -16,11 +16,11 @@ const OnlineJudgeSubmission = ({
           (submission.verdict === 'CE'
             ? 'Compilation Error'
             : submission.verdict === 'IE'
-              ? 'Internal Error: ' +
-                submission.message +
-                ' ' +
-                submission.debugData
-              : 'Done')}
+            ? 'Internal Error: ' +
+              submission.message +
+              ' ' +
+              submission.debugData
+            : 'Done')}
       </div>
       {submission.verdict !== 'IE' && (
         <>

src/components/Groups/PostLeaderboardPage/PostLeaderboardPage.tsx

@@ -8,9 +8,9 @@ import useLeaderboardData from '../../../hooks/groups/useLeaderboardData';
 import { usePost } from '../../../hooks/groups/usePost';
 import { useFirebaseApp } from '../../../hooks/useFirebase';
 import { FirebaseSubmission } from '../../../models/groups/problem';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 import { LeaderboardTable } from '../LeaderboardTable/LeaderboardTable';
 import { useProblemSubmissionPopupAction } from '../ProblemSubmissionPopup';

src/components/Groups/PostPage/PostPage.tsx

@@ -2,9 +2,9 @@ import { RouteComponentProps } from '@reach/router';
 import * as React from 'react';
 import { useActiveGroup } from '../../../hooks/groups/useActiveGroup';
 import { usePost } from '../../../hooks/groups/usePost';
+import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Layout from '../../layout';
 import SEO from '../../seo';
-import TopNavigationBar from '../../TopNavigationBar/TopNavigationBar';
 import Breadcrumbs from '../Breadcrumbs';
 import PostBody from './PostBody';
 import PostHeader from './PostHeader';