diff --git a/.prettierrc b/.prettierrc
index f7177c0..ff9d8ef 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,6 +1,10 @@
{
+ "plugins": ["@trivago/prettier-plugin-sort-imports"],
"tabWidth": 2,
"useTabs": false,
"trailingComma": "es5",
- "proseWrap": "always"
+ "proseWrap": "always",
+ "importOrder": ["^@", "^[./]"],
+ "importOrderSeparation": true,
+ "importOrderSortSpecifiers": true
}
diff --git a/functions/src/index.ts b/functions/src/index.ts
index 2e78135..095d546 100644
--- a/functions/src/index.ts
+++ b/functions/src/index.ts
@@ -1,5 +1,8 @@
-import * as functions from "firebase-functions";
import * as admin from "firebase-admin";
+import * as functions from "firebase-functions";
+import Stripe from "stripe";
+
+import { GameMode, findSet, generateSeed, modes, replayEvents } from "./game";
if (process.env.FUNCTIONS_EMULATOR) {
// We don't pass any configs, so admin SDK queries firebase API to get them.
@@ -14,15 +17,12 @@ if (process.env.FUNCTIONS_EMULATOR) {
admin.initializeApp();
}
-import Stripe from "stripe";
const stripe = !functions.config().stripe
? null
: new Stripe(functions.config().stripe.secret, {
apiVersion: "2020-08-27",
});
-import { generateSeed, replayEvents, findSet, GameMode, modes } from "./game";
-
const MAX_GAME_ID_LENGTH = 64;
const MAX_UNFINISHED_GAMES_PER_HOUR = 4;
diff --git a/package-lock.json b/package-lock.json
index 915165f..b1418af 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -30,6 +30,7 @@
},
"devDependencies": {
"@google-cloud/pubsub": "^2.19.0",
+ "@trivago/prettier-plugin-sort-imports": "^5.2.2",
"cross-env": "^7.0.3",
"prettier": "^3.4.2"
},
@@ -162,13 +163,13 @@
}
},
"node_modules/@babel/generator": {
- "version": "7.26.2",
- "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.2.tgz",
- "integrity": "sha512-zevQbhbau95nkoxSq3f/DC/SC+EEOUZd3DYqfSkMhY2/wfSeaHV1Ew4vk8e+x8lja31IbyuUa2uQ3JONqKbysw==",
+ "version": "7.26.5",
+ "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.5.tgz",
+ "integrity": "sha512-2caSP6fN9I7HOe6nqhtft7V4g7/V/gfDsC3Ag4W7kEzzvRGKqiv0pu0HogPiZ3KaVSoNDhUws6IJjDjpfmYIXw==",
"license": "MIT",
"dependencies": {
- "@babel/parser": "^7.26.2",
- "@babel/types": "^7.26.0",
+ "@babel/parser": "^7.26.5",
+ "@babel/types": "^7.26.5",
"@jridgewell/gen-mapping": "^0.3.5",
"@jridgewell/trace-mapping": "^0.3.25",
"jsesc": "^3.0.2"
@@ -493,12 +494,12 @@
}
},
"node_modules/@babel/parser": {
- "version": "7.26.2",
- "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.2.tgz",
- "integrity": "sha512-DWMCZH9WA4Maitz2q21SRKHo9QXZxkDsbNZoVD62gusNtNBBqDg9i7uOhASfTfIGNzW+O+r7+jAlM8dwphcJKQ==",
+ "version": "7.26.7",
+ "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.7.tgz",
+ "integrity": "sha512-kEvgGGgEjRUutvdVvZhbn/BxVt+5VSpwXz1j3WYXQbXDo8KzFOPNG2GQbdAiNq8g6wn1yKk7C/qrke03a84V+w==",
"license": "MIT",
"dependencies": {
- "@babel/types": "^7.26.0"
+ "@babel/types": "^7.26.7"
},
"bin": {
"parser": "bin/babel-parser.js"
@@ -2089,16 +2090,16 @@
}
},
"node_modules/@babel/traverse": {
- "version": "7.25.9",
- "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.25.9.tgz",
- "integrity": "sha512-ZCuvfwOwlz/bawvAuvcj8rrithP2/N55Tzz342AkTvq4qaWbGfmCk/tKhNaV2cthijKrPAA8SRJV5WWe7IBMJw==",
+ "version": "7.26.7",
+ "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.7.tgz",
+ "integrity": "sha512-1x1sgeyRLC3r5fQOM0/xtQKsYjyxmFjaOrLJNtZ81inNjyJHGIolTULPiSc/2qe1/qfpFLisLQYFnnZl7QoedA==",
"license": "MIT",
"dependencies": {
- "@babel/code-frame": "^7.25.9",
- "@babel/generator": "^7.25.9",
- "@babel/parser": "^7.25.9",
+ "@babel/code-frame": "^7.26.2",
+ "@babel/generator": "^7.26.5",
+ "@babel/parser": "^7.26.7",
"@babel/template": "^7.25.9",
- "@babel/types": "^7.25.9",
+ "@babel/types": "^7.26.7",
"debug": "^4.3.1",
"globals": "^11.1.0"
},
@@ -2107,9 +2108,9 @@
}
},
"node_modules/@babel/types": {
- "version": "7.26.0",
- "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.0.tgz",
- "integrity": "sha512-Z/yiTPj+lDVnF7lWeKCIJzaIkI0vYO87dMpZ4bg4TDrFe4XXLFWL1TbXU27gBP3QccxV9mZICCrnjnYlJjXHOA==",
+ "version": "7.26.7",
+ "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.7.tgz",
+ "integrity": "sha512-t8kDRGrKXyp6+tjUh7hw2RLyclsW4TRoRvRHtSyAX9Bb5ldlFh+90YAYY6awRXrlB4G5G2izNeGySpATlFzmOg==",
"license": "MIT",
"dependencies": {
"@babel/helper-string-parser": "^7.25.9",
@@ -4569,6 +4570,41 @@
"node": ">= 6"
}
},
+ "node_modules/@trivago/prettier-plugin-sort-imports": {
+ "version": "5.2.2",
+ "resolved": "https://registry.npmjs.org/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-5.2.2.tgz",
+ "integrity": "sha512-fYDQA9e6yTNmA13TLVSA+WMQRc5Bn/c0EUBditUHNfMMxN7M82c38b1kEggVE3pLpZ0FwkwJkUEKMiOi52JXFA==",
+ "dev": true,
+ "license": "Apache-2.0",
+ "dependencies": {
+ "@babel/generator": "^7.26.5",
+ "@babel/parser": "^7.26.7",
+ "@babel/traverse": "^7.26.7",
+ "@babel/types": "^7.26.7",
+ "javascript-natural-sort": "^0.7.1",
+ "lodash": "^4.17.21"
+ },
+ "engines": {
+ "node": ">18.12"
+ },
+ "peerDependencies": {
+ "@vue/compiler-sfc": "3.x",
+ "prettier": "2.x - 3.x",
+ "prettier-plugin-svelte": "3.x",
+ "svelte": "4.x || 5.x"
+ },
+ "peerDependenciesMeta": {
+ "@vue/compiler-sfc": {
+ "optional": true
+ },
+ "prettier-plugin-svelte": {
+ "optional": true
+ },
+ "svelte": {
+ "optional": true
+ }
+ }
+ },
"node_modules/@trysound/sax": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -11439,6 +11475,13 @@
"node": ">=10"
}
},
+ "node_modules/javascript-natural-sort": {
+ "version": "0.7.1",
+ "resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz",
+ "integrity": "sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==",
+ "dev": true,
+ "license": "MIT"
+ },
"node_modules/jest": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/jest/-/jest-27.5.1.tgz",
diff --git a/package.json b/package.json
index 40d42c9..2a0b44e 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
},
"devDependencies": {
"@google-cloud/pubsub": "^2.19.0",
+ "@trivago/prettier-plugin-sort-imports": "^5.2.2",
"cross-env": "^7.0.3",
"prettier": "^3.4.2"
},
diff --git a/scripts/src/index.js b/scripts/src/index.js
index 3d88e62..5c8d48b 100644
--- a/scripts/src/index.js
+++ b/scripts/src/index.js
@@ -1,10 +1,10 @@
import admin from "firebase-admin";
import inquirer from "inquirer";
+import { calcStats } from "./calcStats";
+import { fixGames } from "./fixGames";
import { listAdmins, listPatrons } from "./listUsers";
import { sanitizeNames } from "./sanitizeNames";
-import { fixGames } from "./fixGames";
-import { calcStats } from "./calcStats";
// Add scripts as functions to this array
const scripts = [listAdmins, listPatrons, sanitizeNames, fixGames, calcStats];
diff --git a/src/App.js b/src/App.js
index 8e80a19..1fc0230 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,29 +1,29 @@
-import { useState, useEffect, useMemo } from "react";
-import firebase from "./firebase";
-import "./styles.css";
+import { useEffect, useMemo, useState } from "react";
+import { BrowserRouter, Route, Switch } from "react-router-dom";
-import { BrowserRouter, Switch, Route } from "react-router-dom";
import CssBaseline from "@material-ui/core/CssBaseline";
import { ThemeProvider } from "@material-ui/core/styles";
-import { generateColor, generateName, standardLayouts } from "./util";
-import { UserContext, SettingsContext } from "./context";
-import useStorage from "./hooks/useStorage";
import ConnectionsTracker from "./components/ConnectionsTracker";
-import WelcomeDialog from "./components/WelcomeDialog";
import Navbar from "./components/Navbar";
-import RoomPage from "./pages/RoomPage";
-import GamePage from "./pages/GamePage";
-import LobbyPage from "./pages/LobbyPage";
-import LoadingPage from "./pages/LoadingPage";
-import NotFoundPage from "./pages/NotFoundPage";
-import BannedPage from "./pages/BannedPage";
-import HelpPage from "./pages/HelpPage";
+import WelcomeDialog from "./components/WelcomeDialog";
+import { SettingsContext, UserContext } from "./context";
+import firebase from "./firebase";
+import useStorage from "./hooks/useStorage";
import AboutPage from "./pages/AboutPage";
+import BannedPage from "./pages/BannedPage";
import ConductPage from "./pages/ConductPage";
+import GamePage from "./pages/GamePage";
+import HelpPage from "./pages/HelpPage";
import LegalPage from "./pages/LegalPage";
+import LoadingPage from "./pages/LoadingPage";
+import LobbyPage from "./pages/LobbyPage";
+import NotFoundPage from "./pages/NotFoundPage";
import ProfilePage from "./pages/ProfilePage";
-import { lightTheme, darkTheme, withCardColors } from "./themes";
+import RoomPage from "./pages/RoomPage";
+import "./styles.css";
+import { darkTheme, lightTheme, withCardColors } from "./themes";
+import { generateColor, generateName, standardLayouts } from "./util";
function makeThemes(customColors) {
let parsed;
diff --git a/src/components/AccountOptionsDialog.js b/src/components/AccountOptionsDialog.js
index f1a87c3..99174af 100644
--- a/src/components/AccountOptionsDialog.js
+++ b/src/components/AccountOptionsDialog.js
@@ -1,4 +1,4 @@
-import { useState, useContext } from "react";
+import { useContext, useState } from "react";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
@@ -6,9 +6,9 @@ import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogContentText from "@material-ui/core/DialogContentText";
import DialogTitle from "@material-ui/core/DialogTitle";
+import red from "@material-ui/core/colors/red";
import PersonAddIcon from "@material-ui/icons/PersonAdd";
import VpnKeyIcon from "@material-ui/icons/VpnKey";
-import red from "@material-ui/core/colors/red";
import { UserContext } from "../context";
import firebase, { authProvider } from "../firebase";
diff --git a/src/components/BoardLayoutDialog.js b/src/components/BoardLayoutDialog.js
index e616b59..c002953 100644
--- a/src/components/BoardLayoutDialog.js
+++ b/src/components/BoardLayoutDialog.js
@@ -2,18 +2,18 @@ import { useContext, useMemo } from "react";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
-import Select from "@material-ui/core/Select";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
-import InputLabel from "@material-ui/core/InputLabel";
import FormControl from "@material-ui/core/FormControl";
+import InputLabel from "@material-ui/core/InputLabel";
import MenuItem from "@material-ui/core/MenuItem";
+import Select from "@material-ui/core/Select";
import { makeStyles } from "@material-ui/core/styles";
-import Game from "./Game";
-import { generateDeck } from "../game";
import { SettingsContext } from "../context";
+import { generateDeck } from "../game";
+import Game from "./Game";
const useStyles = makeStyles((theme) => ({
gameBoard: {
diff --git a/src/components/Chat.js b/src/components/Chat.js
index 1ff9035..7f12147 100644
--- a/src/components/Chat.js
+++ b/src/components/Chat.js
@@ -1,28 +1,28 @@
-import { useEffect, useRef, useState, useMemo, useContext, memo } from "react";
+import clsx from "clsx";
+import { memo, useContext, useEffect, useMemo, useRef, useState } from "react";
-import Typography from "@material-ui/core/Typography";
-import Tooltip from "@material-ui/core/Tooltip";
-import MoreVertIcon from "@material-ui/icons/MoreVert";
-import MenuItem from "@material-ui/core/MenuItem";
import Menu from "@material-ui/core/Menu";
+import MenuItem from "@material-ui/core/MenuItem";
+import Tooltip from "@material-ui/core/Tooltip";
+import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
-import clsx from "clsx";
+import MoreVertIcon from "@material-ui/icons/MoreVert";
-import User from "./User";
-import InternalLink from "./InternalLink";
-import SimpleInput from "./SimpleInput";
-import Subheading from "./Subheading";
-import Scrollbox from "./Scrollbox";
-import ChatCards from "./ChatCards";
-import ElapsedTime from "./ElapsedTime";
+import { UserContext } from "../context";
import firebase from "../firebase";
-import { censorText } from "../util";
-import autoscroll from "../utils/autoscroll";
import useFirebaseQuery from "../hooks/useFirebaseQuery";
import useStats from "../hooks/useStats";
import useStorage from "../hooks/useStorage";
-import { UserContext } from "../context";
+import { censorText } from "../util";
+import autoscroll from "../utils/autoscroll";
import emoji from "../utils/emoji";
+import ChatCards from "./ChatCards";
+import ElapsedTime from "./ElapsedTime";
+import InternalLink from "./InternalLink";
+import Scrollbox from "./Scrollbox";
+import SimpleInput from "./SimpleInput";
+import Subheading from "./Subheading";
+import User from "./User";
const useStyles = makeStyles((theme) => ({
chatPanel: {
diff --git a/src/components/ChatCards.js b/src/components/ChatCards.js
index 178917d..8bdc211 100644
--- a/src/components/ChatCards.js
+++ b/src/components/ChatCards.js
@@ -4,10 +4,10 @@ import Tooltip from "@material-ui/core/Tooltip";
import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
-import SetCard from "./SetCard";
-import User from "./User";
import { cardsFromEvent, checkSetUltra, conjugateCard, modes } from "../game";
import { formatTime } from "../util";
+import SetCard from "./SetCard";
+import User from "./User";
const useStyles = makeStyles((theme) => ({
logEntry: {
diff --git a/src/components/ColorChoiceDialog.js b/src/components/ColorChoiceDialog.js
index 3d764c5..1f6e8bf 100644
--- a/src/components/ColorChoiceDialog.js
+++ b/src/components/ColorChoiceDialog.js
@@ -1,16 +1,16 @@
import { useState } from "react";
+import { ChromePicker } from "react-color";
-import { ThemeProvider, makeStyles, withTheme } from "@material-ui/core/styles";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
-import Grid from "@material-ui/core/Grid";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
-import { ChromePicker } from "react-color";
+import Grid from "@material-ui/core/Grid";
+import { ThemeProvider, makeStyles, withTheme } from "@material-ui/core/styles";
-import ResponsiveSetCard from "./ResponsiveSetCard";
import { darkTheme, lightTheme, withCardColors } from "../themes";
+import ResponsiveSetCard from "./ResponsiveSetCard";
const useStyles = makeStyles({
colorPickerColumn: {
diff --git a/src/components/ConnectionsTracker.js b/src/components/ConnectionsTracker.js
index e0b289b..a324caf 100644
--- a/src/components/ConnectionsTracker.js
+++ b/src/components/ConnectionsTracker.js
@@ -1,8 +1,8 @@
-import { useState, useEffect, useContext } from "react";
+import { useContext, useEffect, useState } from "react";
import { useLocation } from "react-router-dom";
-import firebase from "../firebase";
import { UserContext } from "../context";
+import firebase from "../firebase";
function ConnectionsTracker() {
const user = useContext(UserContext);
diff --git a/src/components/DonateDialog.js b/src/components/DonateDialog.js
index 70c1b0a..ae7172b 100644
--- a/src/components/DonateDialog.js
+++ b/src/components/DonateDialog.js
@@ -1,3 +1,5 @@
+import { useHistory } from "react-router-dom";
+
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
@@ -6,11 +8,10 @@ import DialogTitle from "@material-ui/core/DialogTitle";
import Link from "@material-ui/core/Link";
import Typography from "@material-ui/core/Typography";
import WhatshotIcon from "@material-ui/icons/Whatshot";
-import { useHistory } from "react-router-dom";
-import useStorage from "../hooks/useStorage";
-import useMoment from "../hooks/useMoment";
import firebase from "../firebase";
+import useMoment from "../hooks/useMoment";
+import useStorage from "../hooks/useStorage";
function DonateDialog({ active }) {
const history = useHistory();
diff --git a/src/components/Game.js b/src/components/Game.js
index 96fa17f..cab552b 100644
--- a/src/components/Game.js
+++ b/src/components/Game.js
@@ -6,9 +6,9 @@ import Typography from "@material-ui/core/Typography";
import { animated, useTransition } from "@react-spring/web";
import ResponsiveSetCard from "../components/ResponsiveSetCard";
+import { SettingsContext } from "../context";
import useDimensions from "../hooks/useDimensions";
import useKeydown, { getModifierState } from "../hooks/useKeydown";
-import { SettingsContext } from "../context";
const gamePadding = 8;
diff --git a/src/components/GameInfoRow.js b/src/components/GameInfoRow.js
index 568ba7b..f57b0b9 100644
--- a/src/components/GameInfoRow.js
+++ b/src/components/GameInfoRow.js
@@ -1,18 +1,18 @@
-import ExitToAppIcon from "@material-ui/icons/ExitToApp";
-import SnoozeIcon from "@material-ui/icons/Snooze";
-import VisibilityIcon from "@material-ui/icons/Visibility";
-import DoneIcon from "@material-ui/icons/Done";
import TableCell from "@material-ui/core/TableCell";
import TableRow from "@material-ui/core/TableRow";
import Tooltip from "@material-ui/core/Tooltip";
import { useTheme } from "@material-ui/core/styles";
-
-import ElapsedTime from "./ElapsedTime";
-import User from "./User";
-import useFirebaseRef from "../hooks/useFirebaseRef";
import { makeStyles } from "@material-ui/core/styles";
+import DoneIcon from "@material-ui/icons/Done";
+import ExitToAppIcon from "@material-ui/icons/ExitToApp";
+import SnoozeIcon from "@material-ui/icons/Snooze";
+import VisibilityIcon from "@material-ui/icons/Visibility";
+
import { modes } from "../game";
+import useFirebaseRef from "../hooks/useFirebaseRef";
import { colors } from "../util";
+import ElapsedTime from "./ElapsedTime";
+import User from "./User";
const useStyles = makeStyles({
host: {
diff --git a/src/components/GameSettings.js b/src/components/GameSettings.js
index c1997ea..7507281 100644
--- a/src/components/GameSettings.js
+++ b/src/components/GameSettings.js
@@ -1,14 +1,14 @@
-import { makeStyles } from "@material-ui/core/styles";
import FormControlLabel from "@material-ui/core/FormControlLabel";
import MenuItem from "@material-ui/core/MenuItem";
import Select from "@material-ui/core/Select";
import Switch from "@material-ui/core/Switch";
import Tooltip from "@material-ui/core/Tooltip";
import Typography from "@material-ui/core/Typography";
+import { makeStyles } from "@material-ui/core/styles";
import firebase from "../firebase";
-import useStorage from "../hooks/useStorage";
import { modes } from "../game";
+import useStorage from "../hooks/useStorage";
const useStyles = makeStyles(() => ({
settings: { display: "flex", justifyContent: "space-evenly" },
diff --git a/src/components/GameSidebar.js b/src/components/GameSidebar.js
index 282bceb..b902552 100644
--- a/src/components/GameSidebar.js
+++ b/src/components/GameSidebar.js
@@ -1,4 +1,5 @@
-import AlarmIcon from "@material-ui/icons/Alarm";
+import { Link as RouterLink, useLocation } from "react-router-dom";
+
import Divider from "@material-ui/core/Divider";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
@@ -8,16 +9,16 @@ import Paper from "@material-ui/core/Paper";
import Tooltip from "@material-ui/core/Tooltip";
import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
+import AlarmIcon from "@material-ui/icons/Alarm";
import FitnessCenterIcon from "@material-ui/icons/FitnessCenter";
-import SportsEsportsIcon from "@material-ui/icons/SportsEsports";
import SnoozeIcon from "@material-ui/icons/Snooze";
-import { useLocation, Link as RouterLink } from "react-router-dom";
+import SportsEsportsIcon from "@material-ui/icons/SportsEsports";
-import User from "./User";
-import Subheading from "./Subheading";
-import useMoment from "../hooks/useMoment";
import { modes } from "../game";
-import { formatTime, capitalizeFirst } from "../util";
+import useMoment from "../hooks/useMoment";
+import { capitalizeFirst, formatTime } from "../util";
+import Subheading from "./Subheading";
+import User from "./User";
const useStyles = makeStyles((theme) => ({
sidebar: {
diff --git a/src/components/InternalLink.js b/src/components/InternalLink.js
index 6546c12..3c6e2de 100644
--- a/src/components/InternalLink.js
+++ b/src/components/InternalLink.js
@@ -1,7 +1,7 @@
import { forwardRef } from "react";
+import { Link as RouterLink } from "react-router-dom";
import Link from "@material-ui/core/Link";
-import { Link as RouterLink } from "react-router-dom";
function InternalLink(props, ref) {
return ;
diff --git a/src/components/KeyboardLayoutDialog.js b/src/components/KeyboardLayoutDialog.js
index 90caa6d..68d7184 100644
--- a/src/components/KeyboardLayoutDialog.js
+++ b/src/components/KeyboardLayoutDialog.js
@@ -1,22 +1,22 @@
+import clsx from "clsx";
import { useContext, useMemo } from "react";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
-import Select from "@material-ui/core/Select";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
-import InputLabel from "@material-ui/core/InputLabel";
import FormControl from "@material-ui/core/FormControl";
+import InputLabel from "@material-ui/core/InputLabel";
import MenuItem from "@material-ui/core/MenuItem";
+import Select from "@material-ui/core/Select";
import TextField from "@material-ui/core/TextField";
import { makeStyles } from "@material-ui/core/styles";
-import clsx from "clsx";
-import Game from "./Game";
+import { SettingsContext } from "../context";
import { generateDeck } from "../game";
import { standardLayouts } from "../util";
-import { SettingsContext } from "../context";
+import Game from "./Game";
const useStyles = makeStyles((theme) => ({
gameBoard: {
diff --git a/src/components/Navbar.js b/src/components/Navbar.js
index 4f910af..228f0b3 100644
--- a/src/components/Navbar.js
+++ b/src/components/Navbar.js
@@ -1,28 +1,28 @@
-import { useState, useContext } from "react";
+import { useContext, useState } from "react";
import AppBar from "@material-ui/core/AppBar";
-import Menu from "@material-ui/core/Menu";
-import MenuItem from "@material-ui/core/MenuItem";
import Divider from "@material-ui/core/Divider";
+import IconButton from "@material-ui/core/IconButton";
import Link from "@material-ui/core/Link";
+import Menu from "@material-ui/core/Menu";
+import MenuItem from "@material-ui/core/MenuItem";
import Toolbar from "@material-ui/core/Toolbar";
import Tooltip from "@material-ui/core/Tooltip";
import Typography from "@material-ui/core/Typography";
-import IconButton from "@material-ui/core/IconButton";
import SettingsIcon from "@material-ui/icons/Settings";
-import firebase from "../firebase";
-import { UserContext, SettingsContext } from "../context";
+import snakeImage from "../assets/cny_snake.png";
import { version } from "../config";
-import User from "./User";
+import { SettingsContext, UserContext } from "../context";
+import firebase from "../firebase";
+import AccountOptionsDialog from "./AccountOptionsDialog";
+import BoardLayoutDialog from "./BoardLayoutDialog";
+import ColorChoiceDialog from "./ColorChoiceDialog";
import InternalLink from "./InternalLink";
+import KeyboardLayoutDialog from "./KeyboardLayoutDialog";
import PromptDialog from "./PromptDialog";
+import User from "./User";
import UserColorDialog from "./UserColorDialog";
-import ColorChoiceDialog from "./ColorChoiceDialog";
-import BoardLayoutDialog from "./BoardLayoutDialog";
-import KeyboardLayoutDialog from "./KeyboardLayoutDialog";
-import AccountOptionsDialog from "./AccountOptionsDialog";
-import snakeImage from "../assets/cny_snake.png";
function Navbar({
themeType,
diff --git a/src/components/ProfileGamesTable.js b/src/components/ProfileGamesTable.js
index ef3fe77..bb0ede7 100644
--- a/src/components/ProfileGamesTable.js
+++ b/src/components/ProfileGamesTable.js
@@ -5,19 +5,19 @@ import TableCell from "@material-ui/core/TableCell";
import TableContainer from "@material-ui/core/TableContainer";
import TableHead from "@material-ui/core/TableHead";
import TableRow from "@material-ui/core/TableRow";
-import { makeStyles } from "@material-ui/core/styles";
import Typography from "@material-ui/core/Typography";
-import FitnessCenterIcon from "@material-ui/icons/FitnessCenter";
-import StarIcon from "@material-ui/icons/Star";
import amber from "@material-ui/core/colors/amber";
import grey from "@material-ui/core/colors/grey";
+import { makeStyles } from "@material-ui/core/styles";
import { useTheme } from "@material-ui/core/styles";
+import FitnessCenterIcon from "@material-ui/icons/FitnessCenter";
+import StarIcon from "@material-ui/icons/Star";
+import { modes } from "../game";
+import { colors, formatTime } from "../util";
import ElapsedTime from "./ElapsedTime";
-import User from "./User";
import Loading from "./Loading";
-import { modes } from "../game";
-import { formatTime, colors } from "../util";
+import User from "./User";
const useStyles = makeStyles((theme) => ({
gamesTable: {
diff --git a/src/components/ProfileName.js b/src/components/ProfileName.js
index 12f6d3c..6e3931e 100644
--- a/src/components/ProfileName.js
+++ b/src/components/ProfileName.js
@@ -1,17 +1,17 @@
-import { useState, memo, useContext } from "react";
+import { memo, useContext, useState } from "react";
+import Menu from "@material-ui/core/Menu";
+import MenuItem from "@material-ui/core/MenuItem";
import Typography from "@material-ui/core/Typography";
import { useTheme } from "@material-ui/core/styles";
-import MoreVertIcon from "@material-ui/icons/MoreVert";
-import MenuItem from "@material-ui/core/MenuItem";
-import Menu from "@material-ui/core/Menu";
import { makeStyles } from "@material-ui/core/styles";
+import MoreVertIcon from "@material-ui/icons/MoreVert";
+import { UserContext } from "../context";
import firebase from "../firebase";
+import { generateColor, generateName } from "../util";
import ElapsedTime from "./ElapsedTime";
import User from "./User";
-import { UserContext } from "../context";
-import { generateColor, generateName } from "../util";
const useStyles = makeStyles((theme) => ({
vertIcon: {
diff --git a/src/components/PromptDialog.js b/src/components/PromptDialog.js
index dbf6d3f..b344c66 100644
--- a/src/components/PromptDialog.js
+++ b/src/components/PromptDialog.js
@@ -1,15 +1,15 @@
-import { useState, useContext } from "react";
+import { useContext, useState } from "react";
import Button from "@material-ui/core/Button";
-import TextField from "@material-ui/core/TextField";
import Dialog from "@material-ui/core/Dialog";
import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogContentText from "@material-ui/core/DialogContentText";
import DialogTitle from "@material-ui/core/DialogTitle";
+import TextField from "@material-ui/core/TextField";
-import { censorText } from "../util";
import { UserContext } from "../context";
+import { censorText } from "../util";
function PromptDialog(props) {
const { open, onClose, title, message, label, maxLength } = props;
diff --git a/src/components/ResponsiveSetCard.js b/src/components/ResponsiveSetCard.js
index 5cd876f..e8f5207 100644
--- a/src/components/ResponsiveSetCard.js
+++ b/src/components/ResponsiveSetCard.js
@@ -1,7 +1,8 @@
+import clsx from "clsx";
import { memo } from "react";
import { makeStyles, useTheme } from "@material-ui/core/styles";
-import clsx from "clsx";
+
import { cardTraits } from "../game";
const useStyles = makeStyles((theme) => ({
diff --git a/src/components/RoomUserList.js b/src/components/RoomUserList.js
index 62e2997..418731d 100644
--- a/src/components/RoomUserList.js
+++ b/src/components/RoomUserList.js
@@ -1,16 +1,16 @@
import { useContext } from "react";
+import { Link as RouterLink } from "react-router-dom";
import List from "@material-ui/core/List";
import ListItem from "@material-ui/core/ListItem";
import ListItemIcon from "@material-ui/core/ListItemIcon";
import ListItemText from "@material-ui/core/ListItemText";
+import Tooltip from "@material-ui/core/Tooltip";
+import Typography from "@material-ui/core/Typography";
import PersonIcon from "@material-ui/icons/Person";
import SnoozeIcon from "@material-ui/icons/Snooze";
import StarsIcon from "@material-ui/icons/Stars";
-import Tooltip from "@material-ui/core/Tooltip";
-import Typography from "@material-ui/core/Typography";
-import { useTransition, animated } from "@react-spring/web";
-import { Link as RouterLink } from "react-router-dom";
+import { animated, useTransition } from "@react-spring/web";
import User from "../components/User";
import { UserContext } from "../context";
diff --git a/src/components/SetCard.js b/src/components/SetCard.js
index 0e9c581..ec444d4 100644
--- a/src/components/SetCard.js
+++ b/src/components/SetCard.js
@@ -1,7 +1,8 @@
+import clsx from "clsx";
import { memo } from "react";
import { makeStyles, useTheme } from "@material-ui/core/styles";
-import clsx from "clsx";
+
import { cardTraits } from "../game";
const useStyles = makeStyles((theme) => ({
diff --git a/src/components/SnackContent.js b/src/components/SnackContent.js
index 51c278e..a302bf3 100644
--- a/src/components/SnackContent.js
+++ b/src/components/SnackContent.js
@@ -1,13 +1,14 @@
import clsx from "clsx";
+
+import IconButton from "@material-ui/core/IconButton";
+import SnackbarContent from "@material-ui/core/SnackbarContent";
+import { amber, green } from "@material-ui/core/colors";
+import { makeStyles } from "@material-ui/core/styles";
import CheckCircleIcon from "@material-ui/icons/CheckCircle";
+import CloseIcon from "@material-ui/icons/Close";
import ErrorIcon from "@material-ui/icons/Error";
import InfoIcon from "@material-ui/icons/Info";
-import CloseIcon from "@material-ui/icons/Close";
-import { amber, green } from "@material-ui/core/colors";
-import IconButton from "@material-ui/core/IconButton";
-import SnackbarContent from "@material-ui/core/SnackbarContent";
import WarningIcon from "@material-ui/icons/Warning";
-import { makeStyles } from "@material-ui/core/styles";
const variantIcon = {
success: CheckCircleIcon,
diff --git a/src/components/User.js b/src/components/User.js
index e965f44..cecf7d9 100644
--- a/src/components/User.js
+++ b/src/components/User.js
@@ -1,4 +1,4 @@
-import { useTheme, makeStyles } from "@material-ui/core/styles";
+import { makeStyles, useTheme } from "@material-ui/core/styles";
import Security from "@material-ui/icons/Security";
import WhatshotIcon from "@material-ui/icons/Whatshot";
diff --git a/src/components/UserColorDialog.js b/src/components/UserColorDialog.js
index fbf1c84..f369fba 100644
--- a/src/components/UserColorDialog.js
+++ b/src/components/UserColorDialog.js
@@ -1,3 +1,4 @@
+import clsx from "clsx";
import { useContext } from "react";
import Button from "@material-ui/core/Button";
@@ -6,11 +7,10 @@ import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
import { makeStyles } from "@material-ui/core/styles";
-import clsx from "clsx";
import { UserContext } from "../context";
-import { colors } from "../util";
import firebase from "../firebase";
+import { colors } from "../util";
const useStyles = makeStyles({
colorBox: {
diff --git a/src/components/UserStatistics.js b/src/components/UserStatistics.js
index 46e2b90..731fa46 100644
--- a/src/components/UserStatistics.js
+++ b/src/components/UserStatistics.js
@@ -1,9 +1,10 @@
+import { ArcElement, Chart as ChartJS } from "chart.js";
import { memo } from "react";
+import { Pie } from "react-chartjs-2";
+
import Grid from "@material-ui/core/Grid";
import Typography from "@material-ui/core/Typography";
import { makeStyles, useTheme } from "@material-ui/core/styles";
-import { Pie } from "react-chartjs-2";
-import { Chart as ChartJS, ArcElement } from "chart.js";
import { formatTime } from "../util";
diff --git a/src/components/WelcomeDialog.js b/src/components/WelcomeDialog.js
index 9d3c066..65cb8d3 100644
--- a/src/components/WelcomeDialog.js
+++ b/src/components/WelcomeDialog.js
@@ -6,8 +6,8 @@ import DialogTitle from "@material-ui/core/DialogTitle";
import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
-import InternalLink from "./InternalLink";
import useStorage from "../hooks/useStorage";
+import InternalLink from "./InternalLink";
const useStyles = makeStyles({
emoji: {
diff --git a/src/firebase.js b/src/firebase.js
index b2f96bf..db716f5 100644
--- a/src/firebase.js
+++ b/src/firebase.js
@@ -1,7 +1,7 @@
+import "firebase/compat/analytics";
import firebase from "firebase/compat/app";
-import "firebase/compat/database";
import "firebase/compat/auth";
-import "firebase/compat/analytics";
+import "firebase/compat/database";
import "firebase/compat/functions";
import config, { isDev } from "./config";
diff --git a/src/hooks/useDimensions.js b/src/hooks/useDimensions.js
index d83b896..7ec973a 100644
--- a/src/hooks/useDimensions.js
+++ b/src/hooks/useDimensions.js
@@ -1,4 +1,4 @@
-import { useState, useRef, useLayoutEffect } from "react";
+import { useLayoutEffect, useRef, useState } from "react";
function useDimensions() {
const ref = useRef();
diff --git a/src/hooks/useFirebaseQuery.js b/src/hooks/useFirebaseQuery.js
index 432ac35..a17630b 100644
--- a/src/hooks/useFirebaseQuery.js
+++ b/src/hooks/useFirebaseQuery.js
@@ -1,4 +1,4 @@
-import { useEffect, useState, useRef } from "react";
+import { useEffect, useRef, useState } from "react";
function useFirebaseQuery(query) {
const [value, setValue] = useState({});
diff --git a/src/hooks/useMoment.js b/src/hooks/useMoment.js
index 904d639..88ed038 100644
--- a/src/hooks/useMoment.js
+++ b/src/hooks/useMoment.js
@@ -1,5 +1,6 @@
-import { useEffect, useState } from "react";
import moment from "moment";
+import { useEffect, useState } from "react";
+
import useFirebaseRef from "./useFirebaseRef";
function useMoment(delay = 1000) {
diff --git a/src/hooks/useStats.js b/src/hooks/useStats.js
index 1cf4b2b..8ee96c8 100644
--- a/src/hooks/useStats.js
+++ b/src/hooks/useStats.js
@@ -1,8 +1,8 @@
-import { useMemo } from "react";
import cloneDeep from "clone-deep";
+import { useMemo } from "react";
-import useFirebaseRef from "./useFirebaseRef";
import { BASE_RATING, modes } from "../game";
+import useFirebaseRef from "./useFirebaseRef";
/** Listen to statistics for a given user, with filled in default values. */
function useStats(userId) {
diff --git a/src/index.js b/src/index.js
index 3779fc0..d617dd8 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,6 @@
-import App from "./App";
import ReactDOM from "react-dom";
+import App from "./App";
+
const rootElement = document.getElementById("root");
ReactDOM.render(, rootElement);
diff --git a/src/pages/AboutPage.js b/src/pages/AboutPage.js
index 5781a7a..5ababcc 100644
--- a/src/pages/AboutPage.js
+++ b/src/pages/AboutPage.js
@@ -1,7 +1,7 @@
-import Typography from "@material-ui/core/Typography";
-import Link from "@material-ui/core/Link";
import Container from "@material-ui/core/Container";
+import Link from "@material-ui/core/Link";
import Paper from "@material-ui/core/Paper";
+import Typography from "@material-ui/core/Typography";
import InternalLink from "../components/InternalLink";
diff --git a/src/pages/BannedPage.js b/src/pages/BannedPage.js
index ac5dd3e..de98665 100644
--- a/src/pages/BannedPage.js
+++ b/src/pages/BannedPage.js
@@ -1,6 +1,6 @@
-import Typography from "@material-ui/core/Typography";
import Container from "@material-ui/core/Container";
import Link from "@material-ui/core/Link";
+import Typography from "@material-ui/core/Typography";
function BannedPage({ time }) {
const date = new Date(time);
diff --git a/src/pages/ConductPage.js b/src/pages/ConductPage.js
index 126c8cb..ddf39bc 100644
--- a/src/pages/ConductPage.js
+++ b/src/pages/ConductPage.js
@@ -1,7 +1,7 @@
-import Typography from "@material-ui/core/Typography";
-import Link from "@material-ui/core/Link";
import Container from "@material-ui/core/Container";
+import Link from "@material-ui/core/Link";
import Paper from "@material-ui/core/Paper";
+import Typography from "@material-ui/core/Typography";
import InternalLink from "../components/InternalLink";
diff --git a/src/pages/DonatePage.js b/src/pages/DonatePage.js
index 7965f40..38c9c36 100644
--- a/src/pages/DonatePage.js
+++ b/src/pages/DonatePage.js
@@ -8,9 +8,9 @@ import WhatshotIcon from "@material-ui/icons/Whatshot";
import InternalLink from "../components/InternalLink";
import User from "../components/User";
+import { UserContext } from "../context";
import firebase, { customerPortal } from "../firebase";
import useFirebaseRef from "../hooks/useFirebaseRef";
-import { UserContext } from "../context";
import { patronCheckout } from "../stripe";
function DonatePage() {
diff --git a/src/pages/GamePage.js b/src/pages/GamePage.js
index 945177e..9427d74 100644
--- a/src/pages/GamePage.js
+++ b/src/pages/GamePage.js
@@ -1,29 +1,27 @@
-import { useState, useEffect, useMemo, useContext, useRef } from "react";
+import { useContext, useEffect, useMemo, useRef, useState } from "react";
+import { Redirect } from "react-router-dom";
+import useSound from "use-sound";
-import { makeStyles } from "@material-ui/core/styles";
-import Grid from "@material-ui/core/Grid";
-import Typography from "@material-ui/core/Typography";
+import Box from "@material-ui/core/Box";
+import Button from "@material-ui/core/Button";
import Container from "@material-ui/core/Container";
+import Grid from "@material-ui/core/Grid";
import Paper from "@material-ui/core/Paper";
-import Button from "@material-ui/core/Button";
-import Box from "@material-ui/core/Box";
import Snackbar from "@material-ui/core/Snackbar";
import Tooltip from "@material-ui/core/Tooltip";
-import { Redirect } from "react-router-dom";
-import useSound from "use-sound";
+import Typography from "@material-ui/core/Typography";
+import { makeStyles } from "@material-ui/core/styles";
-import SnackContent from "../components/SnackContent";
-import firebase, { createGame, finishGame } from "../firebase";
-import useFirebaseRef from "../hooks/useFirebaseRef";
-import useKeydown, { getModifierState } from "../hooks/useKeydown";
+import failSfx from "../assets/failedSetSound.mp3";
+import foundSfx from "../assets/successfulSetSound.mp3";
+import Chat from "../components/Chat";
import Game from "../components/Game";
-import User from "../components/User";
-import Loading from "../components/Loading";
-import NotFoundPage from "./NotFoundPage";
-import LoadingPage from "./LoadingPage";
import GameSidebar from "../components/GameSidebar";
-import Chat from "../components/Chat";
+import Loading from "../components/Loading";
+import SnackContent from "../components/SnackContent";
+import User from "../components/User";
import { SettingsContext, UserContext } from "../context";
+import firebase, { createGame, finishGame } from "../firebase";
import {
addCard,
cardsFromEvent,
@@ -34,8 +32,10 @@ import {
modes,
removeCard,
} from "../game";
-import foundSfx from "../assets/successfulSetSound.mp3";
-import failSfx from "../assets/failedSetSound.mp3";
+import useFirebaseRef from "../hooks/useFirebaseRef";
+import useKeydown, { getModifierState } from "../hooks/useKeydown";
+import LoadingPage from "./LoadingPage";
+import NotFoundPage from "./NotFoundPage";
const useStyles = makeStyles((theme) => ({
sideColumn: {
diff --git a/src/pages/HelpPage.js b/src/pages/HelpPage.js
index 0d5e465..7a2e767 100644
--- a/src/pages/HelpPage.js
+++ b/src/pages/HelpPage.js
@@ -1,9 +1,9 @@
import { useContext } from "react";
-import Typography from "@material-ui/core/Typography";
-import Link from "@material-ui/core/Link";
import Container from "@material-ui/core/Container";
+import Link from "@material-ui/core/Link";
import Paper from "@material-ui/core/Paper";
+import Typography from "@material-ui/core/Typography";
import InternalLink from "../components/InternalLink";
import SetCard from "../components/SetCard";
diff --git a/src/pages/LoadingPage.js b/src/pages/LoadingPage.js
index d8aa010..18c3140 100644
--- a/src/pages/LoadingPage.js
+++ b/src/pages/LoadingPage.js
@@ -1,5 +1,5 @@
-import { makeStyles } from "@material-ui/core/styles";
import Container from "@material-ui/core/Container";
+import { makeStyles } from "@material-ui/core/styles";
import Loading from "../components/Loading";
diff --git a/src/pages/LobbyPage.js b/src/pages/LobbyPage.js
index 883feb9..3b92bf4 100644
--- a/src/pages/LobbyPage.js
+++ b/src/pages/LobbyPage.js
@@ -1,16 +1,13 @@
-import { useState, useMemo, useContext } from "react";
-
import generate from "project-name-generator";
+import { useContext, useMemo, useState } from "react";
import { Redirect } from "react-router-dom";
-import { makeStyles } from "@material-ui/core/styles";
-import Paper from "@material-ui/core/Paper";
+
+import Box from "@material-ui/core/Box";
+import Button from "@material-ui/core/Button";
import Container from "@material-ui/core/Container";
-import Typography from "@material-ui/core/Typography";
import Grid from "@material-ui/core/Grid";
-import Button from "@material-ui/core/Button";
-import Box from "@material-ui/core/Box";
import Link from "@material-ui/core/Link";
-import Tabs from "@material-ui/core/Tabs";
+import Paper from "@material-ui/core/Paper";
import Tab from "@material-ui/core/Tab";
import Table from "@material-ui/core/Table";
import TableBody from "@material-ui/core/TableBody";
@@ -18,17 +15,20 @@ import TableCell from "@material-ui/core/TableCell";
import TableContainer from "@material-ui/core/TableContainer";
import TableHead from "@material-ui/core/TableHead";
import TableRow from "@material-ui/core/TableRow";
+import Tabs from "@material-ui/core/Tabs";
import Tooltip from "@material-ui/core/Tooltip";
+import Typography from "@material-ui/core/Typography";
+import { makeStyles } from "@material-ui/core/styles";
+import Chat from "../components/Chat";
+import GameInfoRow from "../components/GameInfoRow";
+import InternalLink from "../components/InternalLink";
+import { UserContext } from "../context";
import firebase, { createGame } from "../firebase";
import useFirebaseQuery from "../hooks/useFirebaseQuery";
import useFirebaseRef from "../hooks/useFirebaseRef";
import useKeydown, { getModifierState } from "../hooks/useKeydown";
import useStorage from "../hooks/useStorage";
-import InternalLink from "../components/InternalLink";
-import GameInfoRow from "../components/GameInfoRow";
-import Chat from "../components/Chat";
-import { UserContext } from "../context";
const useStyles = makeStyles((theme) => ({
mainGrid: {
diff --git a/src/pages/NotFoundPage.js b/src/pages/NotFoundPage.js
index 26859d1..b0b6709 100644
--- a/src/pages/NotFoundPage.js
+++ b/src/pages/NotFoundPage.js
@@ -1,7 +1,8 @@
-import Typography from "@material-ui/core/Typography";
import Container from "@material-ui/core/Container";
-import InternalLink from "../components/InternalLink";
+import Typography from "@material-ui/core/Typography";
+
import cowImage from "../assets/cow_404.png";
+import InternalLink from "../components/InternalLink";
function NotFoundPage() {
return (
diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js
index ffbf69c..901539a 100644
--- a/src/pages/ProfilePage.js
+++ b/src/pages/ProfilePage.js
@@ -1,25 +1,25 @@
-import { useState, useMemo, useEffect } from "react";
+import { useEffect, useMemo, useState } from "react";
import { Redirect } from "react-router-dom";
import Container from "@material-ui/core/Container";
import Divider from "@material-ui/core/Divider";
import Grid from "@material-ui/core/Grid";
-import { makeStyles } from "@material-ui/core/styles";
+import MenuItem from "@material-ui/core/MenuItem";
import Paper from "@material-ui/core/Paper";
-import Typography from "@material-ui/core/Typography";
import Select from "@material-ui/core/Select";
-import MenuItem from "@material-ui/core/MenuItem";
+import Typography from "@material-ui/core/Typography";
+import { makeStyles } from "@material-ui/core/styles";
import EqualizerIcon from "@material-ui/icons/Equalizer";
-import ProfileName from "../components/ProfileName";
-import UserStatistics from "../components/UserStatistics";
+import Loading from "../components/Loading";
import ProfileGamesTable from "../components/ProfileGamesTable";
+import ProfileName from "../components/ProfileName";
import Subheading from "../components/Subheading";
-import Loading from "../components/Loading";
+import UserStatistics from "../components/UserStatistics";
import firebase from "../firebase";
+import { computeState, modes } from "../game";
import useFirebaseRefs from "../hooks/useFirebaseRefs";
import useStats from "../hooks/useStats";
-import { computeState, modes } from "../game";
import LoadingPage from "./LoadingPage";
const datasetVariants = {
diff --git a/src/pages/RoomPage.js b/src/pages/RoomPage.js
index 85181fe..60353b3 100644
--- a/src/pages/RoomPage.js
+++ b/src/pages/RoomPage.js
@@ -1,30 +1,30 @@
-import { useState, useEffect, useContext } from "react";
+import { useContext, useEffect, useState } from "react";
+import { Redirect, useHistory } from "react-router-dom";
-import { makeStyles } from "@material-ui/core/styles";
-import Container from "@material-ui/core/Container";
-import Typography from "@material-ui/core/Typography";
+import Box from "@material-ui/core/Box";
import Button from "@material-ui/core/Button";
+import Container from "@material-ui/core/Container";
+import Grid from "@material-ui/core/Grid";
import IconButton from "@material-ui/core/IconButton";
-import Tooltip from "@material-ui/core/Tooltip";
import Paper from "@material-ui/core/Paper";
-import Grid from "@material-ui/core/Grid";
-import Box from "@material-ui/core/Box";
-import LinkIcon from "@material-ui/icons/Link";
+import Tooltip from "@material-ui/core/Tooltip";
+import Typography from "@material-ui/core/Typography";
+import { makeStyles } from "@material-ui/core/styles";
import DoneIcon from "@material-ui/icons/Done";
-import { Redirect, useHistory } from "react-router-dom";
+import LinkIcon from "@material-ui/icons/Link";
-import useFirebaseRef from "../hooks/useFirebaseRef";
-import useKeydown, { getModifierState } from "../hooks/useKeydown";
-import LoadingPage from "./LoadingPage";
-import NotFoundPage from "./NotFoundPage";
-import SimpleInput from "../components/SimpleInput";
+import Chat from "../components/Chat";
+import GameSettings from "../components/GameSettings";
import RoomUserList from "../components/RoomUserList";
+import SimpleInput from "../components/SimpleInput";
import Subheading from "../components/Subheading";
-import Chat from "../components/Chat";
-import firebase from "../firebase";
import { UserContext } from "../context";
-import GameSettings from "../components/GameSettings";
+import firebase from "../firebase";
+import useFirebaseRef from "../hooks/useFirebaseRef";
+import useKeydown, { getModifierState } from "../hooks/useKeydown";
import { capitalizeFirst } from "../util";
+import LoadingPage from "./LoadingPage";
+import NotFoundPage from "./NotFoundPage";
const useStyles = makeStyles((theme) => ({
subpanel: {
diff --git a/src/themes.js b/src/themes.js
index 6bd5641..a665552 100644
--- a/src/themes.js
+++ b/src/themes.js
@@ -1,10 +1,11 @@
-import { createTheme } from "@material-ui/core/styles";
import { grey } from "@material-ui/core/colors";
import { indigo } from "@material-ui/core/colors";
import { red } from "@material-ui/core/colors";
+import { createTheme } from "@material-ui/core/styles";
+
+import snakeImage from "./assets/cny_big_snake.png";
import lanternsImage from "./assets/cny_lanterns.png";
import lionImage from "./assets/cny_lion.png";
-import snakeImage from "./assets/cny_big_snake.png";
export const darkTheme = createTheme({
palette: {
diff --git a/src/util.js b/src/util.js
index 86e7436..6b2ef5a 100644
--- a/src/util.js
+++ b/src/util.js
@@ -1,28 +1,30 @@
-import animals from "./utils/animals.json";
import moment from "moment";
import {
- pattern,
RegExpMatcher,
TextCensor,
englishDataset,
englishRecommendedTransformers,
fixedPhraseCensorStrategy,
+ pattern,
} from "obscenity";
-import red from "@material-ui/core/colors/red";
-import pink from "@material-ui/core/colors/pink";
-import purple from "@material-ui/core/colors/purple";
-import deepPurple from "@material-ui/core/colors/deepPurple";
-import indigo from "@material-ui/core/colors/indigo";
+
+import amber from "@material-ui/core/colors/amber";
import blue from "@material-ui/core/colors/blue";
-import lightBlue from "@material-ui/core/colors/lightBlue";
import cyan from "@material-ui/core/colors/cyan";
-import teal from "@material-ui/core/colors/teal";
+import deepOrange from "@material-ui/core/colors/deepOrange";
+import deepPurple from "@material-ui/core/colors/deepPurple";
import green from "@material-ui/core/colors/green";
+import indigo from "@material-ui/core/colors/indigo";
+import lightBlue from "@material-ui/core/colors/lightBlue";
import lightGreen from "@material-ui/core/colors/lightGreen";
import lime from "@material-ui/core/colors/lime";
-import amber from "@material-ui/core/colors/amber";
import orange from "@material-ui/core/colors/orange";
-import deepOrange from "@material-ui/core/colors/deepOrange";
+import pink from "@material-ui/core/colors/pink";
+import purple from "@material-ui/core/colors/purple";
+import red from "@material-ui/core/colors/red";
+import teal from "@material-ui/core/colors/teal";
+
+import animals from "./utils/animals.json";
const fixedDataset = englishDataset
.removePhrasesIf((phrase) => phrase.metadata.originalWord === "dick")