diff --git a/package.json b/package.json
index f1a0721a..bf70f4f4 100644
--- a/package.json
+++ b/package.json
@@ -94,7 +94,7 @@
     "husky": "^7.0.4",
     "lint-staged": "^12.1.6",
     "next-transpile-modules": "^9.0.0",
-    "prettier": "^1.18.2"
+    "prettier": "^2.7.1"
   },
   "lint-staged": {
     "./**/*.{js,jsx,ts,tsx}": [
diff --git a/src/components/boris/Superpower/index.tsx b/src/components/boris/Superpower/index.tsx
index c29834e1..1ee45c4e 100644
--- a/src/components/boris/Superpower/index.tsx
+++ b/src/components/boris/Superpower/index.tsx
@@ -1,8 +1,8 @@
-import React, { FC } from "react";
+import React, { FC } from 'react';
 
-import { observer } from "mobx-react-lite";
+import { observer } from 'mobx-react-lite';
 
-import { useAuth } from "~/hooks/auth/useAuth";
+import { useAuth } from '~/hooks/auth/useAuth';
 
 interface IProps {}
 
diff --git a/src/components/containers/Zone/index.tsx b/src/components/containers/Zone/index.tsx
index 2e6825eb..86c13f71 100644
--- a/src/components/containers/Zone/index.tsx
+++ b/src/components/containers/Zone/index.tsx
@@ -1,20 +1,20 @@
-import React, { FC } from "react";
+import React, { FC } from 'react';
 
-import classNames from "classnames";
+import classNames from 'classnames';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface ZoneProps {
   title?: string;
   className?: string;
-  color?: "danger" | "normal";
+  color?: 'danger' | 'normal';
 }
 
 const Zone: FC<ZoneProps> = ({
   title,
   className,
   children,
-  color = "normal",
+  color = 'normal',
 }) => (
   <div
     className={classNames(className, styles.pad, styles[color], {
diff --git a/src/components/editors/EditorButtons/index.tsx b/src/components/editors/EditorButtons/index.tsx
index 2e793d8c..56b04a40 100644
--- a/src/components/editors/EditorButtons/index.tsx
+++ b/src/components/editors/EditorButtons/index.tsx
@@ -1,20 +1,20 @@
-import React, { FC } from "react";
+import React, { FC } from 'react';
 
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Padder } from "~/components/containers/Padder";
-import { EditorActionsPanel } from "~/components/editors/EditorActionsPanel";
-import { Button } from "~/components/input/Button";
-import { InputText } from "~/components/input/InputText";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { useNodeFormContext } from "~/hooks/node/useNodeFormFormik";
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Padder } from '~/components/containers/Padder';
+import { EditorActionsPanel } from '~/components/editors/EditorActionsPanel';
+import { Button } from '~/components/input/Button';
+import { InputText } from '~/components/input/InputText';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { useNodeFormContext } from '~/hooks/node/useNodeFormFormik';
 
 const EditorButtons: FC = () => {
   const { values, handleChange, isSubmitting } = useNodeFormContext();
   const { isTablet } = useWindowSize();
 
   return (
-    <Padder style={{ position: "relative" }}>
+    <Padder style={{ position: 'relative' }}>
       <EditorActionsPanel />
 
       <Group horizontal>
@@ -22,7 +22,7 @@ const EditorButtons: FC = () => {
           <InputText
             title="Название"
             value={values.title}
-            handler={handleChange("title")}
+            handler={handleChange('title')}
             autoFocus={!isTablet}
             maxLength={256}
             disabled={isSubmitting}
@@ -30,9 +30,9 @@ const EditorButtons: FC = () => {
         </Filler>
 
         <Button
-          title={isTablet ? undefined : "Сохранить"}
+          title={isTablet ? undefined : 'Сохранить'}
           iconRight="check"
-          color={values.is_promoted ? "primary" : "lab"}
+          color={values.is_promoted ? 'primary' : 'lab'}
           disabled={isSubmitting}
           type="submit"
         />
diff --git a/src/components/editors/ImageGrid/index.tsx b/src/components/editors/ImageGrid/index.tsx
index f550a59c..9768d3a9 100644
--- a/src/components/editors/ImageGrid/index.tsx
+++ b/src/components/editors/ImageGrid/index.tsx
@@ -1,9 +1,9 @@
-import React, { FC, useCallback } from "react";
+import React, { FC, useCallback } from 'react';
 
-import { SortableImageGrid } from "~/components/sortable";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { UploadStatus } from "~/store/uploader/UploaderStore";
-import { IFile } from "~/types";
+import { SortableImageGrid } from '~/components/sortable';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { UploadStatus } from '~/store/uploader/UploaderStore';
+import { IFile } from '~/types';
 
 interface IProps {
   files: IFile[];
@@ -22,7 +22,7 @@ const ImageGrid: FC<IProps> = ({ files, setFiles, locked }) => {
   );
 
   const onDrop = useCallback(
-    (id: IFile["id"]) => {
+    (id: IFile['id']) => {
       setFiles(files.filter(file => file && file.id !== id));
     },
     [setFiles, files],
diff --git a/src/components/flow/FlowCell/index.tsx b/src/components/flow/FlowCell/index.tsx
index b699566c..db3c3f9c 100644
--- a/src/components/flow/FlowCell/index.tsx
+++ b/src/components/flow/FlowCell/index.tsx
@@ -1,22 +1,22 @@
-import React, { FC, useMemo } from "react";
+import React, { FC, useMemo } from 'react';
 
-import classNames from "classnames";
+import classNames from 'classnames';
 
-import { Anchor } from "~/components/common/Anchor";
-import { MenuDots } from "~/components/common/MenuDots";
-import { CellShade } from "~/components/flow/CellShade";
-import { FlowCellImage } from "~/components/flow/FlowCellImage";
-import { FlowCellMenu } from "~/components/flow/FlowCellMenu";
-import { FlowCellText } from "~/components/flow/FlowCellText";
-import { useClickOutsideFocus } from "~/hooks/dom/useClickOutsideFocus";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { useFlowCellControls } from "~/hooks/flow/useFlowCellControls";
-import { FlowDisplay, INode } from "~/types";
+import { Anchor } from '~/components/common/Anchor';
+import { MenuDots } from '~/components/common/MenuDots';
+import { CellShade } from '~/components/flow/CellShade';
+import { FlowCellImage } from '~/components/flow/FlowCellImage';
+import { FlowCellMenu } from '~/components/flow/FlowCellMenu';
+import { FlowCellText } from '~/components/flow/FlowCellText';
+import { useClickOutsideFocus } from '~/hooks/dom/useClickOutsideFocus';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { useFlowCellControls } from '~/hooks/flow/useFlowCellControls';
+import { FlowDisplay, INode } from '~/types';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface Props {
-  id: INode["id"];
+  id: INode['id'];
   to: string;
   title: string;
   image?: string;
@@ -25,7 +25,7 @@ interface Props {
   text?: string;
   flow: FlowDisplay;
   canEdit?: boolean;
-  onChangeCellView: (id: INode["id"], flow: FlowDisplay) => void;
+  onChangeCellView: (id: INode['id'], flow: FlowDisplay) => void;
 }
 
 const FlowCell: FC<Props> = ({
@@ -42,7 +42,7 @@ const FlowCell: FC<Props> = ({
   const { isTablet } = useWindowSize();
 
   const withText =
-    ((!!flow.display && flow.display !== "single") || !image) &&
+    ((!!flow.display && flow.display !== 'single') || !image) &&
     flow.show_description &&
     !!text;
   const {
@@ -68,11 +68,11 @@ const FlowCell: FC<Props> = ({
   }, [withText, isTablet]);
 
   const shadeAngle = useMemo(() => {
-    if (flow.display === "vertical") {
+    if (flow.display === 'vertical') {
       return 9;
     }
 
-    if (flow.display === "horizontal") {
+    if (flow.display === 'horizontal') {
       return 15;
     }
 
@@ -81,7 +81,7 @@ const FlowCell: FC<Props> = ({
 
   return (
     <div
-      className={classNames(styles.cell, styles[flow.display || "single"])}
+      className={classNames(styles.cell, styles[flow.display || 'single'])}
       ref={ref as any}
     >
       {canEdit && !isMenuActive && (
diff --git a/src/components/flow/FlowSwiperHero/index.tsx b/src/components/flow/FlowSwiperHero/index.tsx
index 8e6d5ba6..dfc67e6f 100644
--- a/src/components/flow/FlowSwiperHero/index.tsx
+++ b/src/components/flow/FlowSwiperHero/index.tsx
@@ -1,19 +1,19 @@
-import React, { FC, useCallback, useMemo, useState } from "react";
+import React, { FC, useCallback, useMemo, useState } from 'react';
 
-import classNames from "classnames";
-import SwiperCore, { Autoplay, EffectFade, Lazy, Navigation } from "swiper";
-import { Swiper, SwiperSlide } from "swiper/react";
-import SwiperClass from "swiper/types/swiper-class";
+import classNames from 'classnames';
+import SwiperCore, { Autoplay, EffectFade, Lazy, Navigation } from 'swiper';
+import { Swiper, SwiperSlide } from 'swiper/react';
+import SwiperClass from 'swiper/types/swiper-class';
 
-import { Icon } from "~/components/input/Icon";
-import { LoaderCircle } from "~/components/input/LoaderCircle";
-import { ImagePresets, URLS } from "~/constants/urls";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { useNavigation } from "~/hooks/navigation/useNavigation";
-import { IFlowNode } from "~/types";
-import { getURLFromString } from "~/utils/dom";
+import { Icon } from '~/components/input/Icon';
+import { LoaderCircle } from '~/components/input/LoaderCircle';
+import { ImagePresets, URLS } from '~/constants/urls';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { useNavigation } from '~/hooks/navigation/useNavigation';
+import { IFlowNode } from '~/types';
+import { getURLFromString } from '~/utils/dom';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 SwiperCore.use([EffectFade, Lazy, Autoplay, Navigation]);
 
@@ -138,7 +138,7 @@ export const FlowSwiperHero: FC<Props> = ({ heroes }) => {
               <img
                 src={getURLFromString(node.thumbnail!, preset)}
                 alt=""
-                className={classNames(styles.preview, "swiper-lazy")}
+                className={classNames(styles.preview, 'swiper-lazy')}
               />
             </SwiperSlide>
           ))}
diff --git a/src/components/node/NodeEditMenu/index.tsx b/src/components/node/NodeEditMenu/index.tsx
index 5340dbff..c7edb676 100644
--- a/src/components/node/NodeEditMenu/index.tsx
+++ b/src/components/node/NodeEditMenu/index.tsx
@@ -1,12 +1,12 @@
-import React, { VFC } from "react";
+import React, { VFC } from 'react';
 
-import Tippy from "@tippyjs/react";
+import Tippy from '@tippyjs/react';
 
-import { Icon } from "~/components/input/Icon";
-import { MenuButton, MenuItemWithIcon, SeparatedMenu } from "~/components/menu";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
+import { Icon } from '~/components/input/Icon';
+import { MenuButton, MenuItemWithIcon, SeparatedMenu } from '~/components/menu';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface NodeEditMenuProps {
   className?: string;
@@ -40,10 +40,10 @@ const NodeEditMenu: VFC<NodeEditMenuProps> = ({
       >
         {canStar && (
           <MenuItemWithIcon
-            icon={isHeroic ? "star_full" : "star"}
+            icon={isHeroic ? 'star_full' : 'star'}
             onClick={onStar}
           >
-            {isHeroic ? "Убрать с главной" : "На главную"}
+            {isHeroic ? 'Убрать с главной' : 'На главную'}
           </MenuItemWithIcon>
         )}
 
@@ -52,10 +52,10 @@ const NodeEditMenu: VFC<NodeEditMenuProps> = ({
         </MenuItemWithIcon>
 
         <MenuItemWithIcon
-          icon={isLocked ? "locked" : "unlocked"}
+          icon={isLocked ? 'locked' : 'unlocked'}
           onClick={onLock}
         >
-          {isLocked ? "Восстановить" : "Удалить"}
+          {isLocked ? 'Восстановить' : 'Удалить'}
         </MenuItemWithIcon>
       </MenuButton>
     );
@@ -64,9 +64,9 @@ const NodeEditMenu: VFC<NodeEditMenuProps> = ({
   return (
     <SeparatedMenu>
       {canStar && (
-        <Tippy content={isHeroic ? "Убрать с главной" : "На главную"}>
+        <Tippy content={isHeroic ? 'Убрать с главной' : 'На главную'}>
           <button className={className} onClick={onStar}>
-            <Icon icon={isHeroic ? "star_full" : "star"} size={24} />
+            <Icon icon={isHeroic ? 'star_full' : 'star'} size={24} />
           </button>
         </Tippy>
       )}
@@ -77,9 +77,9 @@ const NodeEditMenu: VFC<NodeEditMenuProps> = ({
         </button>
       </Tippy>
 
-      <Tippy content={isLocked ? "Восстановить" : "Удалить"}>
+      <Tippy content={isLocked ? 'Восстановить' : 'Удалить'}>
         <button className={className} onClick={onLock}>
-          <Icon icon={isLocked ? "locked" : "unlocked"} size={24} />
+          <Icon icon={isLocked ? 'locked' : 'unlocked'} size={24} />
         </button>
       </Tippy>
     </SeparatedMenu>
diff --git a/src/components/notes/NoteCreationForm/index.tsx b/src/components/notes/NoteCreationForm/index.tsx
index 3cf9a10d..e07935b6 100644
--- a/src/components/notes/NoteCreationForm/index.tsx
+++ b/src/components/notes/NoteCreationForm/index.tsx
@@ -1,19 +1,18 @@
-import React, { FC, useCallback, useState } from "react";
+import { FC, useCallback } from 'react';
 
-import { FormikConfig, useFormik } from "formik";
-import { object, string, Asserts } from "yup";
+import { FormikConfig, useFormik } from 'formik';
+import { Asserts, object, string } from 'yup';
 
-import { Card } from "~/components/containers/Card";
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Button } from "~/components/input/Button";
-import { Textarea } from "~/components/input/Textarea";
-import { useRandomPhrase } from "~/constants/phrases";
-import { Note } from "~/types/notes";
-import { getErrorMessage } from "~/utils/errors/getErrorMessage";
-import { showErrorToast } from "~/utils/errors/showToast";
+import { Card } from '~/components/containers/Card';
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Button } from '~/components/input/Button';
+import { Textarea } from '~/components/input/Textarea';
+import { useRandomPhrase } from '~/constants/phrases';
+import { getErrorMessage } from '~/utils/errors/getErrorMessage';
+import { showErrorToast } from '~/utils/errors/showToast';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface NoteCreationFormProps {
   text?: string;
@@ -22,19 +21,19 @@ interface NoteCreationFormProps {
 }
 
 const validationSchema = object({
-  text: string().required("Напишите что-нибудь"),
+  text: string().required('Напишите что-нибудь'),
 });
 
 type Values = Asserts<typeof validationSchema>;
 
 const NoteCreationForm: FC<NoteCreationFormProps> = ({
-  text = "",
+  text = '',
   onSubmit,
   onCancel,
 }) => {
-  const placeholder = useRandomPhrase("SIMPLE");
+  const placeholder = useRandomPhrase('SIMPLE');
 
-  const submit = useCallback<FormikConfig<Values>["onSubmit"]>(
+  const submit = useCallback<FormikConfig<Values>['onSubmit']>(
     async (values, { resetForm, setSubmitting, setErrors }) => {
       try {
         await onSubmit(values.text, () => resetForm());
@@ -72,10 +71,10 @@ const NoteCreationForm: FC<NoteCreationFormProps> = ({
       <Card className={styles.card}>
         <div className={styles.row}>
           <Textarea
-            handler={handleChange("text")}
+            handler={handleChange('text')}
             value={values.text}
             error={touched.text ? errors.text : undefined}
-            onBlur={handleBlur("text")}
+            onBlur={handleBlur('text')}
             placeholder={placeholder}
             autoFocus
           />
diff --git a/src/components/profile/ProfileSettings/index.tsx b/src/components/profile/ProfileSettings/index.tsx
index 5d1666e2..d3eae72a 100644
--- a/src/components/profile/ProfileSettings/index.tsx
+++ b/src/components/profile/ProfileSettings/index.tsx
@@ -1,14 +1,14 @@
-import { FC } from "react";
+import { FC } from 'react';
 
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Padder } from "~/components/containers/Padder";
-import { Button } from "~/components/input/Button";
-import { UserSettingsView } from "~/containers/settings/UserSettingsView";
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Padder } from '~/components/containers/Padder';
+import { Button } from '~/components/input/Button';
+import { UserSettingsView } from '~/containers/settings/UserSettingsView';
 import {
   SettingsProvider,
   useSettings,
-} from "~/utils/providers/SettingsProvider";
+} from '~/utils/providers/SettingsProvider';
 
 const Form = ({ children }) => {
   const { handleSubmit } = useSettings();
diff --git a/src/components/profile/ProfileSidebarNotes/index.tsx b/src/components/profile/ProfileSidebarNotes/index.tsx
index 10c4eba9..fac39ae9 100644
--- a/src/components/profile/ProfileSidebarNotes/index.tsx
+++ b/src/components/profile/ProfileSidebarNotes/index.tsx
@@ -1,8 +1,8 @@
-import { VFC } from "react";
+import { VFC } from 'react';
 
-import { useStackContext } from "~/components/sidebar/SidebarStack";
-import { SidebarStackCard } from "~/components/sidebar/SidebarStackCard";
-import { SettingsNotes } from "~/containers/settings/SettingsNotes";
+import { useStackContext } from '~/components/sidebar/SidebarStack';
+import { SidebarStackCard } from '~/components/sidebar/SidebarStackCard';
+import { SettingsNotes } from '~/containers/settings/SettingsNotes';
 
 interface ProfileSidebarNotesProps {}
 
diff --git a/src/components/profile/ProfileSidebarSettings/index.tsx b/src/components/profile/ProfileSidebarSettings/index.tsx
index 8437cbfc..6fcf7db2 100644
--- a/src/components/profile/ProfileSidebarSettings/index.tsx
+++ b/src/components/profile/ProfileSidebarSettings/index.tsx
@@ -1,17 +1,17 @@
-import React, { FC } from "react";
+import React, { FC } from 'react';
 
-import { Filler } from "~/components/containers/Filler";
-import { Button } from "~/components/input/Button";
-import { ProfileSettings } from "~/components/profile/ProfileSettings";
-import { useStackContext } from "~/components/sidebar/SidebarStack";
-import { SidebarStackCard } from "~/components/sidebar/SidebarStackCard";
-import { UserSettingsView } from "~/containers/settings/UserSettingsView";
+import { Filler } from '~/components/containers/Filler';
+import { Button } from '~/components/input/Button';
+import { ProfileSettings } from '~/components/profile/ProfileSettings';
+import { useStackContext } from '~/components/sidebar/SidebarStack';
+import { SidebarStackCard } from '~/components/sidebar/SidebarStackCard';
+import { UserSettingsView } from '~/containers/settings/UserSettingsView';
 import {
   SettingsProvider,
   useSettings,
-} from "~/utils/providers/SettingsProvider";
+} from '~/utils/providers/SettingsProvider';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface IProps {}
 
diff --git a/src/components/sidebar/SidebarStack/index.tsx b/src/components/sidebar/SidebarStack/index.tsx
index d4129a08..0f8e64ab 100644
--- a/src/components/sidebar/SidebarStack/index.tsx
+++ b/src/components/sidebar/SidebarStack/index.tsx
@@ -7,11 +7,11 @@ import React, {
   useEffect,
   useMemo,
   useState,
-} from "react";
+} from 'react';
 
-import { isNil } from "~/utils/ramda";
+import { isNil } from '~/utils/ramda';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface SidebarStackProps extends PropsWithChildren<{}> {
   tab?: number;
diff --git a/src/containers/auth/SuperPowersToggle/index.tsx b/src/containers/auth/SuperPowersToggle/index.tsx
index 29204a3a..9db3826d 100644
--- a/src/containers/auth/SuperPowersToggle/index.tsx
+++ b/src/containers/auth/SuperPowersToggle/index.tsx
@@ -1,10 +1,10 @@
-import { FC } from "react";
+import { FC } from 'react';
 
-import { observer } from "mobx-react-lite";
+import { observer } from 'mobx-react-lite';
 
-import { BorisSuperpowers } from "~/components/boris/BorisSuperpowers";
-import { useAuth } from "~/hooks/auth/useAuth";
-import { useSuperPowers } from "~/hooks/auth/useSuperPowers";
+import { BorisSuperpowers } from '~/components/boris/BorisSuperpowers';
+import { useAuth } from '~/hooks/auth/useAuth';
+import { useSuperPowers } from '~/hooks/auth/useSuperPowers';
 
 interface SuperPowersToggleProps {}
 
diff --git a/src/containers/boris/BorisSidebar/index.tsx b/src/containers/boris/BorisSidebar/index.tsx
index 7a613418..ab1b1d0f 100644
--- a/src/containers/boris/BorisSidebar/index.tsx
+++ b/src/containers/boris/BorisSidebar/index.tsx
@@ -1,11 +1,11 @@
-import { FC } from "react";
+import { FC } from 'react';
 
-import { BorisContacts } from "~/components/boris/BorisContacts";
-import { BorisStats } from "~/components/boris/BorisStats";
-import { Group } from "~/components/containers/Group";
-import { SuperPowersToggle } from "~/containers/auth/SuperPowersToggle";
-import styles from "~/layouts/BorisLayout/styles.module.scss";
-import { BorisUsageStats } from "~/types/boris";
+import { BorisContacts } from '~/components/boris/BorisContacts';
+import { BorisStats } from '~/components/boris/BorisStats';
+import { Group } from '~/components/containers/Group';
+import { SuperPowersToggle } from '~/containers/auth/SuperPowersToggle';
+import styles from '~/layouts/BorisLayout/styles.module.scss';
+import { BorisUsageStats } from '~/types/boris';
 
 interface Props {
   isUser: boolean;
diff --git a/src/containers/dialogs/LoginDialog/index.tsx b/src/containers/dialogs/LoginDialog/index.tsx
index c62a0abd..3a01902b 100644
--- a/src/containers/dialogs/LoginDialog/index.tsx
+++ b/src/containers/dialogs/LoginDialog/index.tsx
@@ -1,22 +1,22 @@
-import React, { FC, useCallback } from "react";
+import React, { FC, useCallback } from 'react';
 
-import { LoginDialogButtons } from "~/components/auth/login/LoginDialogButtons";
-import { LoginScene } from "~/components/auth/login/LoginScene";
-import { Group } from "~/components/containers/Group";
-import { Padder } from "~/components/containers/Padder";
-import { BetterScrollDialog } from "~/components/dialogs/BetterScrollDialog";
-import { DialogTitle } from "~/components/dialogs/DialogTitle";
-import { Button } from "~/components/input/Button";
-import { InputText } from "~/components/input/InputText";
-import { Dialog } from "~/constants/modal";
-import { useCloseOnEscape } from "~/hooks";
-import { useAuth } from "~/hooks/auth/useAuth";
-import { useLoginForm } from "~/hooks/auth/useLoginForm";
-import { useOAuth } from "~/hooks/auth/useOAuth";
-import { useShowModal } from "~/hooks/modal/useShowModal";
-import { DialogComponentProps } from "~/types/modal";
+import { LoginDialogButtons } from '~/components/auth/login/LoginDialogButtons';
+import { LoginScene } from '~/components/auth/login/LoginScene';
+import { Group } from '~/components/containers/Group';
+import { Padder } from '~/components/containers/Padder';
+import { BetterScrollDialog } from '~/components/dialogs/BetterScrollDialog';
+import { DialogTitle } from '~/components/dialogs/DialogTitle';
+import { Button } from '~/components/input/Button';
+import { InputText } from '~/components/input/InputText';
+import { Dialog } from '~/constants/modal';
+import { useCloseOnEscape } from '~/hooks';
+import { useAuth } from '~/hooks/auth/useAuth';
+import { useLoginForm } from '~/hooks/auth/useLoginForm';
+import { useOAuth } from '~/hooks/auth/useOAuth';
+import { useShowModal } from '~/hooks/modal/useShowModal';
+import { DialogComponentProps } from '~/types/modal';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 type LoginDialogProps = DialogComponentProps & {};
 
@@ -55,7 +55,7 @@ const LoginDialog: FC<LoginDialogProps> = ({ onRequestClose }) => {
 
                 <InputText
                   title="Логин"
-                  handler={handleChange("username")}
+                  handler={handleChange('username')}
                   value={values.username}
                   error={errors.username}
                   autoFocus
@@ -63,7 +63,7 @@ const LoginDialog: FC<LoginDialogProps> = ({ onRequestClose }) => {
 
                 <InputText
                   title="Пароль"
-                  handler={handleChange("password")}
+                  handler={handleChange('password')}
                   value={values.password}
                   error={errors.password}
                   type="password"
diff --git a/src/containers/dialogs/PhotoSwipe/index.tsx b/src/containers/dialogs/PhotoSwipe/index.tsx
index 11647798..f64395b0 100644
--- a/src/containers/dialogs/PhotoSwipe/index.tsx
+++ b/src/containers/dialogs/PhotoSwipe/index.tsx
@@ -1,18 +1,18 @@
-import React, { useEffect, useRef, VFC } from "react";
+import React, { useEffect, useRef, VFC } from 'react';
 
-import classNames from "classnames";
-import { observer } from "mobx-react-lite";
-import PhotoSwipeUI_Default from "photoswipe/dist/photoswipe-ui-default.js";
-import PhotoSwipeJs from "photoswipe/dist/photoswipe.js";
+import classNames from 'classnames';
+import { observer } from 'mobx-react-lite';
+import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default.js';
+import PhotoSwipeJs from 'photoswipe/dist/photoswipe.js';
 
-import { ImagePresets } from "~/constants/urls";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { useModal } from "~/hooks/modal/useModal";
-import { IFile } from "~/types";
-import { DialogComponentProps } from "~/types/modal";
-import { getURL } from "~/utils/dom";
+import { ImagePresets } from '~/constants/urls';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { useModal } from '~/hooks/modal/useModal';
+import { IFile } from '~/types';
+import { DialogComponentProps } from '~/types/modal';
+import { getURL } from '~/utils/dom';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 export interface PhotoSwipeProps extends DialogComponentProps {
   items: IFile[];
@@ -61,8 +61,8 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
       });
 
       ps.init();
-      ps.listen("destroy", hideModal);
-      ps.listen("close", hideModal);
+      ps.listen('destroy', hideModal);
+      ps.listen('close', hideModal);
     });
   }, [hideModal, items, index, isTablet]);
 
@@ -74,8 +74,8 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
       aria-hidden="true"
       ref={ref}
     >
-      <div className={classNames("pswp__bg", styles.bg)} />
-      <div className={classNames("pswp__scroll-wrap", styles.wrap)}>
+      <div className={classNames('pswp__bg', styles.bg)} />
+      <div className={classNames('pswp__scroll-wrap', styles.wrap)}>
         <div className="pswp__container">
           <div className="pswp__item" />
           <div className="pswp__item" />
@@ -83,7 +83,7 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
         </div>
 
         <div className="pswp__ui pswp__ui--hidden">
-          <div className={classNames("pswp__top-bar", styles.bar)}>
+          <div className={classNames('pswp__top-bar', styles.bar)}>
             <div className="pswp__counter" />
             <button
               className="pswp__button pswp__button--close"
diff --git a/src/containers/profile/ProfileSidebarMenu/index.tsx b/src/containers/profile/ProfileSidebarMenu/index.tsx
index 5fbfa34b..148461b2 100644
--- a/src/containers/profile/ProfileSidebarMenu/index.tsx
+++ b/src/containers/profile/ProfileSidebarMenu/index.tsx
@@ -1,23 +1,23 @@
-import React, { useCallback, VFC } from "react";
+import React, { useCallback, VFC } from 'react';
 
-import classNames from "classnames";
+import classNames from 'classnames';
 
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Button } from "~/components/input/Button";
-import { Icon } from "~/components/input/Icon";
-import { MenuButton, MenuItemWithIcon } from "~/components/menu";
-import { VerticalMenu } from "~/components/menu/VerticalMenu";
-import { useStackContext } from "~/components/sidebar/SidebarStack";
-import { ProfileSidebarHead } from "~/containers/profile/ProfileSidebarHead";
-import { ProfileStats } from "~/containers/profile/ProfileStats";
-import { useAuth } from "~/hooks/auth/useAuth";
-import markdown from "~/styles/common/markdown.module.scss";
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Button } from '~/components/input/Button';
+import { Icon } from '~/components/input/Icon';
+import { MenuButton, MenuItemWithIcon } from '~/components/menu';
+import { VerticalMenu } from '~/components/menu/VerticalMenu';
+import { useStackContext } from '~/components/sidebar/SidebarStack';
+import { ProfileSidebarHead } from '~/containers/profile/ProfileSidebarHead';
+import { ProfileStats } from '~/containers/profile/ProfileStats';
+import { useAuth } from '~/hooks/auth/useAuth';
+import markdown from '~/styles/common/markdown.module.scss';
 
-import { ProfileSidebarLogoutButton } from "../ProfileSidebarLogoutButton";
-import { ProfileToggles } from "../ProfileToggles";
+import { ProfileSidebarLogoutButton } from '../ProfileSidebarLogoutButton';
+import { ProfileToggles } from '../ProfileToggles';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface ProfileSidebarMenuProps {
   onClose: () => void;
diff --git a/src/containers/profile/ProfileToggles/index.tsx b/src/containers/profile/ProfileToggles/index.tsx
index 5645999b..135d52ea 100644
--- a/src/containers/profile/ProfileToggles/index.tsx
+++ b/src/containers/profile/ProfileToggles/index.tsx
@@ -1,8 +1,8 @@
-import React, { FC } from "react";
+import React, { FC } from 'react';
 
-import { Group } from "~/components/containers/Group";
-import { Zone } from "~/components/containers/Zone";
-import { SuperPowersToggle } from "~/containers/auth/SuperPowersToggle";
+import { Group } from '~/components/containers/Group';
+import { Zone } from '~/components/containers/Zone';
+import { SuperPowersToggle } from '~/containers/auth/SuperPowersToggle';
 
 interface ProfileTogglesProps {}
 
diff --git a/src/containers/settings/SettingsNotes/index.tsx b/src/containers/settings/SettingsNotes/index.tsx
index 8e3c7ef2..bb2322d5 100644
--- a/src/containers/settings/SettingsNotes/index.tsx
+++ b/src/containers/settings/SettingsNotes/index.tsx
@@ -1,14 +1,14 @@
-import { FC, useCallback, useState, VFC } from "react";
+import { FC, useCallback, useState, VFC } from 'react';
 
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Button } from "~/components/input/Button";
-import { NoteCard } from "~/components/notes/NoteCard";
-import { NoteCreationForm } from "~/components/notes/NoteCreationForm";
-import { useConfirmation } from "~/hooks/dom/useConfirmation";
-import { NoteProvider, useNotesContext } from "~/utils/providers/NoteProvider";
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Button } from '~/components/input/Button';
+import { NoteCard } from '~/components/notes/NoteCard';
+import { NoteCreationForm } from '~/components/notes/NoteCreationForm';
+import { useConfirmation } from '~/hooks/dom/useConfirmation';
+import { NoteProvider, useNotesContext } from '~/utils/providers/NoteProvider';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface SettingsNotesProps {}
 
@@ -18,7 +18,7 @@ const List = () => {
 
   const onRemove = useCallback(
     async (id: number) => {
-      confirm("Удалить? Это удалит заметку навсегда", () => remove(id));
+      confirm('Удалить? Это удалит заметку навсегда', () => remove(id));
     },
     [remove],
   );
diff --git a/src/containers/settings/UserSettingsView/index.tsx b/src/containers/settings/UserSettingsView/index.tsx
index a0d4907d..f1cffc85 100644
--- a/src/containers/settings/UserSettingsView/index.tsx
+++ b/src/containers/settings/UserSettingsView/index.tsx
@@ -1,18 +1,18 @@
-import { FC } from "react";
+import { FC } from 'react';
 
-import { Superpower } from "~/components/boris/Superpower";
-import { Filler } from "~/components/containers/Filler";
-import { Group } from "~/components/containers/Group";
-import { Zone } from "~/components/containers/Zone";
-import { InputText } from "~/components/input/InputText";
-import { Textarea } from "~/components/input/Textarea";
-import { ERROR_LITERAL } from "~/constants/errors";
-import { ProfileAccounts } from "~/containers/profile/ProfileAccounts";
-import { useWindowSize } from "~/hooks/dom/useWindowSize";
-import { useSettings } from "~/utils/providers/SettingsProvider";
-import { has } from "~/utils/ramda";
+import { Superpower } from '~/components/boris/Superpower';
+import { Filler } from '~/components/containers/Filler';
+import { Group } from '~/components/containers/Group';
+import { Zone } from '~/components/containers/Zone';
+import { InputText } from '~/components/input/InputText';
+import { Textarea } from '~/components/input/Textarea';
+import { ERROR_LITERAL } from '~/constants/errors';
+import { ProfileAccounts } from '~/containers/profile/ProfileAccounts';
+import { useWindowSize } from '~/hooks/dom/useWindowSize';
+import { useSettings } from '~/utils/providers/SettingsProvider';
+import { has } from '~/utils/ramda';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
 interface UserSettingsViewProps {}
 
@@ -39,14 +39,14 @@ const UserSettingsView: FC<UserSettingsViewProps> = () => {
           <Group>
             <InputText
               value={values.fullname}
-              handler={handleChange("fullname")}
+              handler={handleChange('fullname')}
               title="Полное имя"
               error={getError(errors.fullname)}
             />
 
             <Textarea
               value={values.description}
-              handler={handleChange("description")}
+              handler={handleChange('description')}
               title="Описание"
             />
 
@@ -77,21 +77,21 @@ const UserSettingsView: FC<UserSettingsViewProps> = () => {
         <Group>
           <InputText
             value={values.username}
-            handler={handleChange("username")}
+            handler={handleChange('username')}
             title="Логин"
             error={getError(errors.username)}
           />
 
           <InputText
             value={values.email}
-            handler={handleChange("email")}
+            handler={handleChange('email')}
             title="E-mail"
             error={getError(errors.email)}
           />
 
           <InputText
             value={values.newPassword}
-            handler={handleChange("newPassword")}
+            handler={handleChange('newPassword')}
             title="Новый пароль"
             type="password"
             error={getError(errors.newPassword)}
@@ -99,7 +99,7 @@ const UserSettingsView: FC<UserSettingsViewProps> = () => {
 
           <InputText
             value={values.password}
-            handler={handleChange("password")}
+            handler={handleChange('password')}
             title="Старый пароль"
             type="password"
             error={getError(errors.password)}
diff --git a/src/containers/sidebars/ProfileSidebar/index.tsx b/src/containers/sidebars/ProfileSidebar/index.tsx
index 437fdb9b..11d3f70e 100644
--- a/src/containers/sidebars/ProfileSidebar/index.tsx
+++ b/src/containers/sidebars/ProfileSidebar/index.tsx
@@ -1,20 +1,20 @@
-import React, { useCallback, useEffect, useMemo, VFC } from "react";
+import React, { useCallback, useEffect, useMemo, VFC } from 'react';
 
-import { isNil } from "ramda";
+import { isNil } from 'ramda';
 
-import { CoverBackdrop } from "~/components/containers/CoverBackdrop";
-import { ProfileSidebarNotes } from "~/components/profile/ProfileSidebarNotes";
-import { ProfileSidebarSettings } from "~/components/profile/ProfileSidebarSettings";
-import { SidebarStack } from "~/components/sidebar/SidebarStack";
-import { SidebarStackCard } from "~/components/sidebar/SidebarStackCard";
-import { SidebarName } from "~/constants/sidebar";
-import { ProfileSidebarMenu } from "~/containers/profile/ProfileSidebarMenu";
-import { SidebarWrapper } from "~/containers/sidebars/SidebarWrapper";
-import { useAuth } from "~/hooks/auth/useAuth";
-import type { SidebarComponentProps } from "~/types/sidebar";
-import { useUser } from "~/hooks/auth/useUser";
+import { CoverBackdrop } from '~/components/containers/CoverBackdrop';
+import { ProfileSidebarNotes } from '~/components/profile/ProfileSidebarNotes';
+import { ProfileSidebarSettings } from '~/components/profile/ProfileSidebarSettings';
+import { SidebarStack } from '~/components/sidebar/SidebarStack';
+import { SidebarStackCard } from '~/components/sidebar/SidebarStackCard';
+import { SidebarName } from '~/constants/sidebar';
+import { ProfileSidebarMenu } from '~/containers/profile/ProfileSidebarMenu';
+import { SidebarWrapper } from '~/containers/sidebars/SidebarWrapper';
+import { useAuth } from '~/hooks/auth/useAuth';
+import { useUser } from '~/hooks/auth/useUser';
+import type { SidebarComponentProps } from '~/types/sidebar';
 
-const tabs = ["profile", "bookmarks"] as const;
+const tabs = ['profile', 'bookmarks'] as const;
 type TabName = typeof tabs[number];
 
 interface ProfileSidebarProps
@@ -28,7 +28,9 @@ const ProfileSidebar: VFC<ProfileSidebarProps> = ({
   openSidebar,
 }) => {
   const { isUser } = useAuth();
-  const { user: { cover }} = useUser();
+  const {
+    user: { cover },
+  } = useUser();
 
   const tab = useMemo(
     () => (page ? Math.max(tabs.indexOf(page), 0) : undefined),
@@ -55,7 +57,10 @@ const ProfileSidebar: VFC<ProfileSidebarProps> = ({
   }
 
   return (
-    <SidebarWrapper onClose={onRequestClose} backdrop={cover && <CoverBackdrop cover={cover} />}>
+    <SidebarWrapper
+      onClose={onRequestClose}
+      backdrop={cover && <CoverBackdrop cover={cover} />}
+    >
       <SidebarStack tab={tab} onTabChange={onTabChange}>
         <SidebarStackCard
           headerFeature="close"
diff --git a/src/containers/tags/TagInput/index.tsx b/src/containers/tags/TagInput/index.tsx
index 668e6064..69fd59fc 100644
--- a/src/containers/tags/TagInput/index.tsx
+++ b/src/containers/tags/TagInput/index.tsx
@@ -6,19 +6,19 @@ import React, {
   useMemo,
   useRef,
   useState,
-} from "react";
+} from 'react';
 
-import { TagAutocomplete } from "~/components/tags/TagAutocomplete";
-import { TagWrapper } from "~/components/tags/TagWrapper";
-import { useTagAutocomplete } from "~/hooks/tag/useTagAutocomplete";
+import { TagAutocomplete } from '~/components/tags/TagAutocomplete';
+import { TagWrapper } from '~/components/tags/TagWrapper';
+import { useTagAutocomplete } from '~/hooks/tag/useTagAutocomplete';
 
-import styles from "./styles.module.scss";
+import styles from './styles.module.scss';
 
-const placeholder = "Добавить";
+const placeholder = 'Добавить';
 
 const prepareInput = (input: string): string[] => {
   return input
-    .split(",")
+    .split(',')
     .map((title: string) =>
       title
         .trim()
@@ -37,7 +37,7 @@ interface IProps {
 
 const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
   const [focused, setFocused] = useState(false);
-  const [input, setInput] = useState("");
+  const [input, setInput] = useState('');
   const ref = useRef<HTMLInputElement>(null);
   const wrapper = useRef<HTMLDivElement>(null);
   const options = useTagAutocomplete(input, exclude);
@@ -45,7 +45,7 @@ const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
   const onInput = useCallback(
     ({ target: { value } }: ChangeEvent<HTMLInputElement>) => {
       if (!value.trim()) {
-        setInput(value || "");
+        setInput(value || '');
         return;
       }
 
@@ -55,32 +55,32 @@ const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
         onAppend(items.slice(0, items.length - 1));
       }
 
-      setInput(items[items.length - 1] || "");
+      setInput(items[items.length - 1] || '');
     },
     [onAppend],
   );
 
   const onKeyDown = useCallback(
     ({ key }) => {
-      if (key === "Escape" && ref.current) {
-        setInput("");
+      if (key === 'Escape' && ref.current) {
+        setInput('');
         ref.current.blur();
         return;
       }
 
-      if (key === "Backspace" && input === "") {
-        setInput(onClearTag() || "");
+      if (key === 'Backspace' && input === '') {
+        setInput(onClearTag() || '');
         return;
       }
 
-      if (key === "," || key === "Comma") {
+      if (key === ',' || key === 'Comma') {
         const created = prepareInput(input);
 
         if (created.length) {
           onAppend(created);
         }
 
-        setInput("");
+        setInput('');
       }
     },
     [input, setInput, onClearTag, onAppend],
@@ -101,7 +101,7 @@ const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
       setFocused(false);
 
       if (input.trim()) {
-        setInput("");
+        setInput('');
       }
 
       onSubmit([]);
@@ -111,7 +111,7 @@ const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
 
   const onAutocompleteSelect = useCallback(
     (val: string) => {
-      setInput("");
+      setInput('');
 
       if (!val.trim()) {
         return;
@@ -122,15 +122,15 @@ const TagInput: FC<IProps> = ({ exclude, onAppend, onClearTag, onSubmit }) => {
     [onAppend, setInput],
   );
 
-  const feature = useMemo(() => (input?.substr(0, 1) === "/" ? "green" : ""), [
+  const feature = useMemo(() => (input?.substr(0, 1) === '/' ? 'green' : ''), [
     input,
   ]);
 
   useEffect(() => {
     if (!focused) return;
 
-    document.addEventListener("click", onBlur);
-    return () => document.removeEventListener("click", onBlur);
+    document.addEventListener('click', onBlur);
+    return () => document.removeEventListener('click', onBlur);
   }, [onBlur, focused]);
 
   return (
diff --git a/src/pages/boris.tsx b/src/pages/boris.tsx
index c25d8483..81b4aaf6 100644
--- a/src/pages/boris.tsx
+++ b/src/pages/boris.tsx
@@ -1,16 +1,16 @@
-import React, { VFC } from "react";
+import React, { VFC } from 'react';
 
-import { observer } from "mobx-react-lite";
+import { observer } from 'mobx-react-lite';
 
-import { PageTitle } from "~/components/common/PageTitle";
-import { useBoris } from "~/hooks/boris/useBoris";
-import { useNodeComments } from "~/hooks/comments/useNodeComments";
-import { useImageModal } from "~/hooks/navigation/useImageModal";
-import { useLoadNode } from "~/hooks/node/useLoadNode";
-import { BorisLayout } from "~/layouts/BorisLayout";
-import { CommentContextProvider } from "~/utils/context/CommentContextProvider";
-import { NodeContextProvider } from "~/utils/context/NodeContextProvider";
-import { getPageTitle } from "~/utils/ssr/getPageTitle";
+import { PageTitle } from '~/components/common/PageTitle';
+import { useBoris } from '~/hooks/boris/useBoris';
+import { useNodeComments } from '~/hooks/comments/useNodeComments';
+import { useImageModal } from '~/hooks/navigation/useImageModal';
+import { useLoadNode } from '~/hooks/node/useLoadNode';
+import { BorisLayout } from '~/layouts/BorisLayout';
+import { CommentContextProvider } from '~/utils/context/CommentContextProvider';
+import { NodeContextProvider } from '~/utils/context/NodeContextProvider';
+import { getPageTitle } from '~/utils/ssr/getPageTitle';
 
 const BorisPage: VFC = observer(() => {
   const { node, isLoading, update } = useLoadNode(696);
@@ -39,7 +39,7 @@ const BorisPage: VFC = observer(() => {
         onLoadMoreComments={onLoadMoreComments}
         onDeleteComment={onDeleteComment}
       >
-        <PageTitle title={getPageTitle("Борис")} />
+        <PageTitle title={getPageTitle('Борис')} />
 
         <BorisLayout
           title={title}
diff --git a/src/utils/providers/NoteProvider.tsx b/src/utils/providers/NoteProvider.tsx
index a755c0ca..d730713b 100644
--- a/src/utils/providers/NoteProvider.tsx
+++ b/src/utils/providers/NoteProvider.tsx
@@ -1,6 +1,6 @@
-import { createContext, FC, useContext } from "react";
+import { createContext, FC, useContext } from 'react';
 
-import { useNotes } from "~/hooks/notes/useNotes";
+import { useNotes } from '~/hooks/notes/useNotes';
 
 const NoteContext = createContext<ReturnType<typeof useNotes>>({
   notes: [],
@@ -13,7 +13,7 @@ const NoteContext = createContext<ReturnType<typeof useNotes>>({
 });
 
 export const NoteProvider: FC = ({ children }) => {
-  const notes = useNotes("");
+  const notes = useNotes('');
 
   return <NoteContext.Provider value={notes}>{children}</NoteContext.Provider>;
 };
diff --git a/src/utils/providers/SidebarProvider.tsx b/src/utils/providers/SidebarProvider.tsx
index 58d229a8..3f2ec736 100644
--- a/src/utils/providers/SidebarProvider.tsx
+++ b/src/utils/providers/SidebarProvider.tsx
@@ -6,15 +6,15 @@ import {
   useCallback,
   useContext,
   useMemo,
-} from "react";
+} from 'react';
 
-import { useRouter } from "next/router";
-import { has, omit } from "ramda";
+import { useRouter } from 'next/router';
+import { has, omit } from 'ramda';
 
-import { ModalWrapper } from "~/components/dialogs/ModalWrapper";
-import { SidebarName } from "~/constants/sidebar";
-import { sidebarComponents } from "~/constants/sidebar/components";
-import { SidebarComponent, SidebarProps } from "~/types/sidebar";
+import { ModalWrapper } from '~/components/dialogs/ModalWrapper';
+import { SidebarName } from '~/constants/sidebar';
+import { sidebarComponents } from '~/constants/sidebar/components';
+import { SidebarComponent, SidebarProps } from '~/types/sidebar';
 
 type ContextValue = typeof SidebarContext extends Context<infer U> ? U : never;
 
@@ -36,12 +36,12 @@ export const SidebarProvider = <T extends SidebarComponent>({
 
   const open = useCallback(
     <T extends SidebarComponent>(name: T, props: SidebarProps<T>) => {
-      const [path] = router.asPath.split("?");
+      const [path] = router.asPath.split('?');
       const query = Object.entries(props as {})
         .filter(([, val]) => val)
         .map(([name, val]) => `${name}=${val}`)
-        .join("&");
-      const url = path + "?sidebar=" + name + (query && `&${query}`);
+        .join('&');
+      const url = path + '?sidebar=' + name + (query && `&${query}`);
 
       // don't store history inside the same sidebar
       if (router.query?.sidebar === name) {
@@ -62,7 +62,7 @@ export const SidebarProvider = <T extends SidebarComponent>({
   );
 
   const close = useCallback(() => {
-    const [path] = router.asPath.split("?");
+    const [path] = router.asPath.split('?');
 
     void router.replace(path, path, {
       shallow: true,
@@ -87,7 +87,7 @@ export const SidebarProvider = <T extends SidebarComponent>({
           {createElement(sidebarComponents[current], {
             onRequestClose: close,
             openSidebar: open,
-            ...omit(["sidebar"], router.query),
+            ...omit(['sidebar'], router.query),
           } as any)}
         </ModalWrapper>
       )}
diff --git a/yarn.lock b/yarn.lock
index a04fbef4..9181deff 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2260,10 +2260,10 @@ prelude-ls@^1.2.1:
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
-prettier@^1.18.2:
-  version "1.19.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.19.1.tgz#f7d7f5ff8a9cd872a7be4ca142095956a60797cb"
-  integrity sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==
+prettier@^2.7.1:
+  version "2.7.1"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.7.1.tgz#e235806850d057f97bb08368a4f7d899f7760c64"
+  integrity sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==
 
 pretty-format@^26.6.2:
   version "26.6.2"