diff --git a/.prettierrc.js b/.prettierrc.js
new file mode 100644
index 00000000..c735fffa
--- /dev/null
+++ b/.prettierrc.js
@@ -0,0 +1,5 @@
+module.exports = {
+  plugins: [require('./merged-prettier-plugin.js')],
+  singleQuote: true,
+  trailingComma: 'es5',
+};
diff --git a/merged-prettier-plugin.js b/merged-prettier-plugin.js
new file mode 100644
index 00000000..6908488f
--- /dev/null
+++ b/merged-prettier-plugin.js
@@ -0,0 +1,21 @@
+/* eslint-disable */
+const tailwind = require('prettier-plugin-tailwindcss');
+const organizeImports = require('prettier-plugin-organize-imports');
+
+const combinedFormatter = {
+  ...tailwind,
+  parsers: {
+    ...tailwind.parsers,
+    ...Object.keys(organizeImports.parsers).reduce((acc, key) => {
+      acc[key] = {
+        ...tailwind.parsers[key],
+        preprocess(code, options) {
+          return organizeImports.parsers[key].preprocess(code, options);
+        },
+      };
+      return acc;
+    }, {}),
+  },
+};
+
+module.exports = combinedFormatter;
diff --git a/package.json b/package.json
index 36da5383..8b244b69 100644
--- a/package.json
+++ b/package.json
@@ -180,10 +180,6 @@
       "@commitlint/config-conventional"
     ]
   },
-  "prettier": {
-    "singleQuote": true,
-    "trailingComma": "es5"
-  },
   "release": {
     "plugins": [
       "@semantic-release/commit-analyzer",
diff --git a/server/api/animelist.ts b/server/api/animelist.ts
index 064d3c27..ac912b01 100644
--- a/server/api/animelist.ts
+++ b/server/api/animelist.ts
@@ -1,7 +1,7 @@
 import axios from 'axios';
-import xml2js from 'xml2js';
 import fs, { promises as fsp } from 'fs';
 import path from 'path';
+import xml2js from 'xml2js';
 import logger from '../logger';
 
 const UPDATE_INTERVAL_MSEC = 24 * 3600 * 1000; // how often to download new mapping in milliseconds
diff --git a/server/entity/Media.ts b/server/entity/Media.ts
index d2e4b487..114253ac 100644
--- a/server/entity/Media.ts
+++ b/server/entity/Media.ts
@@ -12,9 +12,9 @@ import {
 import RadarrAPI from '../api/servarr/radarr';
 import SonarrAPI from '../api/servarr/sonarr';
 import { MediaStatus, MediaType } from '../constants/media';
+import { getRepository } from '../datasource';
 import type { DownloadingItem } from '../lib/downloadtracker';
 import downloadTracker from '../lib/downloadtracker';
-import { getRepository } from '../datasource';
 import { getSettings } from '../lib/settings';
 import logger from '../logger';
 import Issue from './Issue';
diff --git a/server/entity/Season.ts b/server/entity/Season.ts
index 77f9c760..f56f07d5 100644
--- a/server/entity/Season.ts
+++ b/server/entity/Season.ts
@@ -1,9 +1,9 @@
 import {
-  Entity,
-  PrimaryGeneratedColumn,
   Column,
-  ManyToOne,
   CreateDateColumn,
+  Entity,
+  ManyToOne,
+  PrimaryGeneratedColumn,
   UpdateDateColumn,
 } from 'typeorm';
 import { MediaStatus } from '../constants/media';
diff --git a/server/entity/SeasonRequest.ts b/server/entity/SeasonRequest.ts
index f499406c..40ae04f0 100644
--- a/server/entity/SeasonRequest.ts
+++ b/server/entity/SeasonRequest.ts
@@ -1,10 +1,10 @@
 import {
-  Entity,
-  PrimaryGeneratedColumn,
   Column,
   CreateDateColumn,
-  UpdateDateColumn,
+  Entity,
   ManyToOne,
+  PrimaryGeneratedColumn,
+  UpdateDateColumn,
 } from 'typeorm';
 import { MediaRequestStatus } from '../constants/media';
 import { MediaRequest } from './MediaRequest';
diff --git a/server/entity/Session.ts b/server/entity/Session.ts
index a0b10db0..ddf851a6 100644
--- a/server/entity/Session.ts
+++ b/server/entity/Session.ts
@@ -1,5 +1,5 @@
 import type { ISession } from 'connect-typeorm';
-import { Index, Column, PrimaryColumn, Entity } from 'typeorm';
+import { Column, Entity, Index, PrimaryColumn } from 'typeorm';
 
 @Entity()
 export class Session implements ISession {
diff --git a/server/interfaces/api/requestInterfaces.ts b/server/interfaces/api/requestInterfaces.ts
index f4b0ab8c..22aa5c3f 100644
--- a/server/interfaces/api/requestInterfaces.ts
+++ b/server/interfaces/api/requestInterfaces.ts
@@ -1,6 +1,6 @@
-import type { PaginatedResponse } from './common';
-import type { MediaRequest } from '../../entity/MediaRequest';
 import type { MediaType } from '../../constants/media';
+import type { MediaRequest } from '../../entity/MediaRequest';
+import type { PaginatedResponse } from './common';
 
 export interface RequestResultsResponse extends PaginatedResponse {
   results: MediaRequest[];
diff --git a/server/lib/watchlistsync.ts b/server/lib/watchlistsync.ts
index 2f042c78..8fa4decf 100644
--- a/server/lib/watchlistsync.ts
+++ b/server/lib/watchlistsync.ts
@@ -1,9 +1,7 @@
 import PlexTvAPI from '../api/plextv';
-import { User } from '../entity/User';
+import { MediaStatus, MediaType } from '../constants/media';
+import { getRepository } from '../datasource';
 import Media from '../entity/Media';
-import logger from '../logger';
-import { MediaType } from '../constants/media';
-import { MediaStatus } from '../constants/media';
 import {
   DuplicateMediaRequestError,
   MediaRequest,
@@ -11,8 +9,9 @@ import {
   QuotaRestrictedError,
   RequestPermissionError,
 } from '../entity/MediaRequest';
+import { User } from '../entity/User';
+import logger from '../logger';
 import { Permission } from './permissions';
-import { getRepository } from '../datasource';
 
 class WatchlistSync {
   public async syncWatchlist() {
diff --git a/server/scripts/prepareTestDb.ts b/server/scripts/prepareTestDb.ts
index 41cfc46a..ef77e942 100644
--- a/server/scripts/prepareTestDb.ts
+++ b/server/scripts/prepareTestDb.ts
@@ -1,8 +1,8 @@
 import { copyFileSync } from 'fs';
-import { UserType } from '../constants/user';
-import { User } from '../entity/User';
 import path from 'path';
+import { UserType } from '../constants/user';
 import dataSource, { getRepository } from '../datasource';
+import { User } from '../entity/User';
 
 const prepareDb = async () => {
   // Copy over test settings.json
diff --git a/src/components/Common/Button/index.tsx b/src/components/Common/Button/index.tsx
index efe89495..59196d16 100644
--- a/src/components/Common/Button/index.tsx
+++ b/src/components/Common/Button/index.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
 import type { ForwardedRef } from 'react';
+import React from 'react';
 
 export type ButtonType =
   | 'default'
diff --git a/src/components/Common/PageTitle/index.tsx b/src/components/Common/PageTitle/index.tsx
index ecaf74f7..831fa929 100644
--- a/src/components/Common/PageTitle/index.tsx
+++ b/src/components/Common/PageTitle/index.tsx
@@ -1,5 +1,5 @@
-import useSettings from '../../../hooks/useSettings';
 import Head from 'next/head';
+import useSettings from '../../../hooks/useSettings';
 
 interface PageTitleProps {
   title: string | (string | undefined)[];
diff --git a/src/components/Common/Tooltip/index.tsx b/src/components/Common/Tooltip/index.tsx
index 57b4b7b3..3eeffd4b 100644
--- a/src/components/Common/Tooltip/index.tsx
+++ b/src/components/Common/Tooltip/index.tsx
@@ -1,5 +1,5 @@
-import { usePopperTooltip } from 'react-popper-tooltip';
 import type { Config } from 'react-popper-tooltip';
+import { usePopperTooltip } from 'react-popper-tooltip';
 
 type TooltipProps = {
   content: React.ReactNode;
diff --git a/src/components/Discover/DiscoverMovieGenre/index.tsx b/src/components/Discover/DiscoverMovieGenre/index.tsx
index 7adb34ba..f498c55f 100644
--- a/src/components/Discover/DiscoverMovieGenre/index.tsx
+++ b/src/components/Discover/DiscoverMovieGenre/index.tsx
@@ -1,12 +1,12 @@
-import type { MovieResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { MovieResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   genreMovies: '{genre} Movies',
diff --git a/src/components/Discover/DiscoverMovieLanguage/index.tsx b/src/components/Discover/DiscoverMovieLanguage/index.tsx
index 71ae6403..effd23ab 100644
--- a/src/components/Discover/DiscoverMovieLanguage/index.tsx
+++ b/src/components/Discover/DiscoverMovieLanguage/index.tsx
@@ -1,12 +1,12 @@
-import type { MovieResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { MovieResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   languageMovies: '{language} Movies',
diff --git a/src/components/Discover/DiscoverMovies.tsx b/src/components/Discover/DiscoverMovies.tsx
index 470a18f5..56e7ac35 100644
--- a/src/components/Discover/DiscoverMovies.tsx
+++ b/src/components/Discover/DiscoverMovies.tsx
@@ -1,10 +1,10 @@
-import type { MovieResult } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
 import { defineMessages, useIntl } from 'react-intl';
-import Header from '../Common/Header';
-import PageTitle from '../Common/PageTitle';
+import type { MovieResult } from '../../../server/models/Search';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
+import Header from '../Common/Header';
+import ListView from '../Common/ListView';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   discovermovies: 'Popular Movies',
diff --git a/src/components/Discover/DiscoverNetwork/index.tsx b/src/components/Discover/DiscoverNetwork/index.tsx
index 3861d3b6..af8087a6 100644
--- a/src/components/Discover/DiscoverNetwork/index.tsx
+++ b/src/components/Discover/DiscoverNetwork/index.tsx
@@ -1,13 +1,13 @@
-import type { TvResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { TvNetwork } from '../../../../server/models/common';
+import type { TvResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
-import type { TvNetwork } from '../../../../server/models/common';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   networkSeries: '{network} Series',
diff --git a/src/components/Discover/DiscoverStudio/index.tsx b/src/components/Discover/DiscoverStudio/index.tsx
index a3cd2600..6f2d5446 100644
--- a/src/components/Discover/DiscoverStudio/index.tsx
+++ b/src/components/Discover/DiscoverStudio/index.tsx
@@ -1,13 +1,13 @@
-import type { MovieResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { ProductionCompany } from '../../../../server/models/common';
+import type { MovieResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
-import type { ProductionCompany } from '../../../../server/models/common';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   studioMovies: '{studio} Movies',
diff --git a/src/components/Discover/DiscoverTv.tsx b/src/components/Discover/DiscoverTv.tsx
index ff64c8fd..099e55b2 100644
--- a/src/components/Discover/DiscoverTv.tsx
+++ b/src/components/Discover/DiscoverTv.tsx
@@ -1,10 +1,10 @@
-import type { TvResult } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
 import { defineMessages, useIntl } from 'react-intl';
-import Header from '../Common/Header';
-import PageTitle from '../Common/PageTitle';
+import type { TvResult } from '../../../server/models/Search';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
+import Header from '../Common/Header';
+import ListView from '../Common/ListView';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   discovertv: 'Popular Series',
diff --git a/src/components/Discover/DiscoverTvGenre/index.tsx b/src/components/Discover/DiscoverTvGenre/index.tsx
index fd73d995..8018a118 100644
--- a/src/components/Discover/DiscoverTvGenre/index.tsx
+++ b/src/components/Discover/DiscoverTvGenre/index.tsx
@@ -1,12 +1,12 @@
-import type { TvResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { TvResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   genreSeries: '{genre} Series',
diff --git a/src/components/Discover/DiscoverTvLanguage/index.tsx b/src/components/Discover/DiscoverTvLanguage/index.tsx
index 2f1cce70..fdff7c75 100644
--- a/src/components/Discover/DiscoverTvLanguage/index.tsx
+++ b/src/components/Discover/DiscoverTvLanguage/index.tsx
@@ -1,12 +1,12 @@
-import type { TvResult } from '../../../../server/models/Search';
-import ListView from '../../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
 import { useRouter } from 'next/router';
-import globalMessages from '../../../i18n/globalMessages';
+import { defineMessages, useIntl } from 'react-intl';
+import type { TvResult } from '../../../../server/models/Search';
 import useDiscover from '../../../hooks/useDiscover';
+import globalMessages from '../../../i18n/globalMessages';
 import Error from '../../../pages/_error';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   languageSeries: '{language} Series',
diff --git a/src/components/Discover/DiscoverTvUpcoming.tsx b/src/components/Discover/DiscoverTvUpcoming.tsx
index db880b0f..ddfc5d1f 100644
--- a/src/components/Discover/DiscoverTvUpcoming.tsx
+++ b/src/components/Discover/DiscoverTvUpcoming.tsx
@@ -1,10 +1,10 @@
-import type { TvResult } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
 import { defineMessages, useIntl } from 'react-intl';
-import Header from '../Common/Header';
-import PageTitle from '../Common/PageTitle';
+import type { TvResult } from '../../../server/models/Search';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
+import Header from '../Common/Header';
+import ListView from '../Common/ListView';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   upcomingtv: 'Upcoming Series',
diff --git a/src/components/Discover/DiscoverWatchlist/index.tsx b/src/components/Discover/DiscoverWatchlist/index.tsx
index d5d57953..3d181d3a 100644
--- a/src/components/Discover/DiscoverWatchlist/index.tsx
+++ b/src/components/Discover/DiscoverWatchlist/index.tsx
@@ -1,10 +1,10 @@
-import ListView from '../../Common/ListView';
 import { defineMessages, useIntl } from 'react-intl';
-import Header from '../../Common/Header';
-import PageTitle from '../../Common/PageTitle';
+import type { WatchlistItem } from '../../../../server/interfaces/api/discoverInterfaces';
 import useDiscover from '../../../hooks/useDiscover';
 import Error from '../../../pages/_error';
-import type { WatchlistItem } from '../../../../server/interfaces/api/discoverInterfaces';
+import Header from '../../Common/Header';
+import ListView from '../../Common/ListView';
+import PageTitle from '../../Common/PageTitle';
 
 const messages = defineMessages({
   discoverwatchlist: 'Your Plex Watchlist',
diff --git a/src/components/Discover/MovieGenreSlider/index.tsx b/src/components/Discover/MovieGenreSlider/index.tsx
index 4623efb0..d17b2d37 100644
--- a/src/components/Discover/MovieGenreSlider/index.tsx
+++ b/src/components/Discover/MovieGenreSlider/index.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
 import { ArrowCircleRightIcon } from '@heroicons/react/outline';
 import Link from 'next/link';
+import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
diff --git a/src/components/Discover/Trending.tsx b/src/components/Discover/Trending.tsx
index 64b696f8..98f0ed0c 100644
--- a/src/components/Discover/Trending.tsx
+++ b/src/components/Discover/Trending.tsx
@@ -1,14 +1,14 @@
+import { defineMessages, useIntl } from 'react-intl';
 import type {
   MovieResult,
-  TvResult,
   PersonResult,
+  TvResult,
 } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
-import Header from '../Common/Header';
-import PageTitle from '../Common/PageTitle';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
+import Header from '../Common/Header';
+import ListView from '../Common/ListView';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   trending: 'Trending',
diff --git a/src/components/Discover/TvGenreSlider/index.tsx b/src/components/Discover/TvGenreSlider/index.tsx
index a0e93ab3..8398e4c3 100644
--- a/src/components/Discover/TvGenreSlider/index.tsx
+++ b/src/components/Discover/TvGenreSlider/index.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
 import { ArrowCircleRightIcon } from '@heroicons/react/outline';
 import Link from 'next/link';
+import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import useSWR from 'swr';
 import type { GenreSliderItem } from '../../../../server/interfaces/api/discoverInterfaces';
diff --git a/src/components/Discover/Upcoming.tsx b/src/components/Discover/Upcoming.tsx
index 5586cee4..55256a40 100644
--- a/src/components/Discover/Upcoming.tsx
+++ b/src/components/Discover/Upcoming.tsx
@@ -1,10 +1,10 @@
-import type { MovieResult } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
 import { defineMessages, useIntl } from 'react-intl';
-import Header from '../Common/Header';
-import PageTitle from '../Common/PageTitle';
+import type { MovieResult } from '../../../server/models/Search';
 import useDiscover from '../../hooks/useDiscover';
 import Error from '../../pages/_error';
+import Header from '../Common/Header';
+import ListView from '../Common/ListView';
+import PageTitle from '../Common/PageTitle';
 
 const messages = defineMessages({
   upcomingmovies: 'Upcoming Movies',
diff --git a/src/components/JSONEditor/index.tsx b/src/components/JSONEditor/index.tsx
index 4278f93e..22abc312 100644
--- a/src/components/JSONEditor/index.tsx
+++ b/src/components/JSONEditor/index.tsx
@@ -1,7 +1,7 @@
-import type { HTMLAttributes } from 'react';
-import AceEditor from 'react-ace';
 import 'ace-builds/src-noconflict/mode-json';
 import 'ace-builds/src-noconflict/theme-dracula';
+import type { HTMLAttributes } from 'react';
+import AceEditor from 'react-ace';
 
 interface JSONEditorProps extends HTMLAttributes<HTMLDivElement> {
   name: string;
diff --git a/src/components/LoadingBar/index.tsx b/src/components/LoadingBar/index.tsx
index 712ba4db..1e488c67 100644
--- a/src/components/LoadingBar/index.tsx
+++ b/src/components/LoadingBar/index.tsx
@@ -1,7 +1,7 @@
 import { NProgress } from '@tanem/react-nprogress';
+import { useRouter } from 'next/router';
 import React, { useEffect, useState } from 'react';
 import ReactDOM from 'react-dom';
-import { useRouter } from 'next/router';
 
 interface BarProps {
   progress: number;
diff --git a/src/components/Search/index.tsx b/src/components/Search/index.tsx
index a85c75df..3fba18a4 100644
--- a/src/components/Search/index.tsx
+++ b/src/components/Search/index.tsx
@@ -1,15 +1,15 @@
 import { useRouter } from 'next/router';
+import { defineMessages, useIntl } from 'react-intl';
 import type {
-  TvResult,
   MovieResult,
   PersonResult,
+  TvResult,
 } from '../../../server/models/Search';
-import ListView from '../Common/ListView';
-import { defineMessages, useIntl } from 'react-intl';
+import useDiscover from '../../hooks/useDiscover';
+import Error from '../../pages/_error';
 import Header from '../Common/Header';
+import ListView from '../Common/ListView';
 import PageTitle from '../Common/PageTitle';
-import Error from '../../pages/_error';
-import useDiscover from '../../hooks/useDiscover';
 
 const messages = defineMessages({
   search: 'Search',
diff --git a/src/components/TitleCard/ErrorCard.tsx b/src/components/TitleCard/ErrorCard.tsx
index aa5f37f2..dfdedc43 100644
--- a/src/components/TitleCard/ErrorCard.tsx
+++ b/src/components/TitleCard/ErrorCard.tsx
@@ -1,9 +1,9 @@
-import { defineMessages, useIntl } from 'react-intl';
-import globalMessages from '../../i18n/globalMessages';
-import Button from '../Common/Button';
 import { CheckIcon, TrashIcon } from '@heroicons/react/solid';
 import axios from 'axios';
+import { defineMessages, useIntl } from 'react-intl';
 import { mutate } from 'swr';
+import globalMessages from '../../i18n/globalMessages';
+import Button from '../Common/Button';
 
 interface ErrorCardProps {
   id: number;
diff --git a/src/components/TitleCard/index.tsx b/src/components/TitleCard/index.tsx
index 8437707a..73950c9c 100644
--- a/src/components/TitleCard/index.tsx
+++ b/src/components/TitleCard/index.tsx
@@ -14,8 +14,8 @@ import Button from '../Common/Button';
 import CachedImage from '../Common/CachedImage';
 import RequestModal from '../RequestModal';
 import Transition from '../Transition';
-import Placeholder from './Placeholder';
 import ErrorCard from './ErrorCard';
+import Placeholder from './Placeholder';
 
 interface TitleCardProps {
   id: number;
diff --git a/src/components/Transition/index.tsx b/src/components/Transition/index.tsx
index 960bcb7e..54af1ed8 100644
--- a/src/components/Transition/index.tsx
+++ b/src/components/Transition/index.tsx
@@ -1,5 +1,5 @@
+import React, { useContext, useEffect, useRef } from 'react';
 import { CSSTransition as ReactCSSTransition } from 'react-transition-group';
-import React, { useRef, useEffect, useContext } from 'react';
 
 interface CSSTransitionProps {
   show?: boolean;
diff --git a/src/hooks/useDebouncedState.ts b/src/hooks/useDebouncedState.ts
index b4ab47c5..144fd42f 100644
--- a/src/hooks/useDebouncedState.ts
+++ b/src/hooks/useDebouncedState.ts
@@ -1,5 +1,5 @@
 import type { Dispatch, SetStateAction } from 'react';
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 /**
  * A hook to help with debouncing state
diff --git a/src/hooks/useInteraction.ts b/src/hooks/useInteraction.ts
index 61d4f99f..59ee28a2 100644
--- a/src/hooks/useInteraction.ts
+++ b/src/hooks/useInteraction.ts
@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 export const INTERACTION_TYPE = {
   MOUSE: 'mouse',
diff --git a/src/hooks/useVerticalScroll.ts b/src/hooks/useVerticalScroll.ts
index 55417621..5e6514a1 100644
--- a/src/hooks/useVerticalScroll.ts
+++ b/src/hooks/useVerticalScroll.ts
@@ -1,6 +1,6 @@
-import type { MutableRefObject } from 'react';
-import { useState, useEffect, useRef } from 'react';
 import { debounce } from 'lodash';
+import type { MutableRefObject } from 'react';
+import { useEffect, useRef, useState } from 'react';
 
 const IS_SCROLLING_CHECK_THROTTLE = 200;
 const BUFFER_HEIGHT = 200;
diff --git a/src/utils/polyfillIntl.ts b/src/utils/polyfillIntl.ts
index 0a9b79e3..fcaaa854 100644
--- a/src/utils/polyfillIntl.ts
+++ b/src/utils/polyfillIntl.ts
@@ -1,6 +1,6 @@
-import { shouldPolyfill as shouldPolyfillPluralrules } from '@formatjs/intl-pluralrules/should-polyfill';
-import { shouldPolyfill as shouldPolyfillLocale } from '@formatjs/intl-locale/should-polyfill';
 import { shouldPolyfill as shouldPolyfillDisplayNames } from '@formatjs/intl-displaynames/should-polyfill';
+import { shouldPolyfill as shouldPolyfillLocale } from '@formatjs/intl-locale/should-polyfill';
+import { shouldPolyfill as shouldPolyfillPluralrules } from '@formatjs/intl-pluralrules/should-polyfill';
 
 const polyfillLocale = async () => {
   if (shouldPolyfillLocale()) {