Добавили заметки в сайдбар (#126)

* added notes sidebar

* added note dropping and editing

* added sidebar navigation

* handling sidebarchanges over time

* using router back for closing sidebar

* fixed tripping inside single sidebar

* added superpowers toggle to sidebar

* user button opens sidebar now

* added profile cover for profile sidebar

* removed profile sidebar completely

* ran prettier over project

* added note not found error literal

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"

src/containers/dialogs/PhotoSwipe/index.tsx

@@ -22,7 +22,7 @@ export interface PhotoSwipeProps extends DialogComponentProps {
 const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
   let ref = useRef<HTMLDivElement>(null);
   const { hideModal } = useModal();
-  const { isMobile } = useWindowSize();
+  const { isTablet } = useWindowSize();
 
   useEffect(() => {
     new Promise(async resolve => {
@@ -34,7 +34,10 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
 
               img.onload = () => {
                 resolveImage({
-                  src: getURL(image, isMobile ? ImagePresets[900] : ImagePresets[1600]),
+                  src: getURL(
+                    image,
+                    isTablet ? ImagePresets[900] : ImagePresets[1600],
+                  ),
                   h: img.naturalHeight,
                   w: img.naturalWidth,
                 });
@@ -45,8 +48,8 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
               };
 
               img.src = getURL(image, ImagePresets[1600]);
-            })
-        )
+            }),
+        ),
       );
 
       resolve(images);
@@ -61,10 +64,16 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
       ps.listen('destroy', hideModal);
       ps.listen('close', hideModal);
     });
-  }, [hideModal, items, index, isMobile]);
+  }, [hideModal, items, index, isTablet]);
 
   return (
-    <div className="pswp" tabIndex={-1} role="dialog" aria-hidden="true" ref={ref}>
+    <div
+      className="pswp"
+      tabIndex={-1}
+      role="dialog"
+      aria-hidden="true"
+      ref={ref}
+    >
       <div className={classNames('pswp__bg', styles.bg)} />
       <div className={classNames('pswp__scroll-wrap', styles.wrap)}>
         <div className="pswp__container">
@@ -76,7 +85,10 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
         <div className="pswp__ui pswp__ui--hidden">
           <div className={classNames('pswp__top-bar', styles.bar)}>
             <div className="pswp__counter" />
-            <button className="pswp__button pswp__button--close" title="Close (Esc)" />
+            <button
+              className="pswp__button pswp__button--close"
+              title="Close (Esc)"
+            />
 
             <div className="pswp__preloader">
               <div className="pswp__preloader__icn">
@@ -96,7 +108,10 @@ const PhotoSwipe: VFC<PhotoSwipeProps> = observer(({ index, items }) => {
             title="Previous (arrow left)"
           />
 
-          <button className="pswp__button pswp__button--arrow--right" title="Next (arrow right)" />
+          <button
+            className="pswp__button pswp__button--arrow--right"
+            title="Next (arrow right)"
+          />
 
           <div className="pswp__caption">
             <div className="pswp__caption__center" />

src/containers/dialogs/ProfileDialog/index.tsx

@@ -1,47 +0,0 @@
-import React, { FC } from 'react';
-
-import { CoverBackdrop } from '~/components/containers/CoverBackdrop';
-import { Tabs } from '~/components/dialogs/Tabs';
-import { ProfileDescription } from '~/components/profile/ProfileDescription';
-import { ProfileSettings } from '~/components/profile/ProfileSettings';
-import { ProfileAccounts } from '~/containers/profile/ProfileAccounts';
-import { ProfileInfo } from '~/containers/profile/ProfileInfo';
-import { ProfileMessages } from '~/containers/profile/ProfileMessages';
-import { useUser } from '~/hooks/auth/useUser';
-import { useGetProfile } from '~/hooks/profile/useGetProfile';
-import { DialogComponentProps } from '~/types/modal';
-import { ProfileProvider } from '~/utils/providers/ProfileProvider';
-
-import { BetterScrollDialog } from '../../../components/dialogs/BetterScrollDialog';
-
-export interface ProfileDialogProps extends DialogComponentProps {
-  username: string;
-}
-
-const ProfileDialog: FC<ProfileDialogProps> = ({ username, onRequestClose }) => {
-  const { isLoading, profile } = useGetProfile(username);
-  const {
-    user: { id },
-  } = useUser();
-
-  return (
-    <ProfileProvider username={username}>
-      <Tabs>
-        <BetterScrollDialog
-          header={<ProfileInfo isOwn={profile.id === id} isLoading={isLoading} />}
-          backdrop={<CoverBackdrop cover={profile.cover} />}
-          onClose={onRequestClose}
-        >
-          <Tabs.Content>
-            <ProfileDescription />
-            <ProfileMessages />
-            <ProfileSettings />
-            <ProfileAccounts />
-          </Tabs.Content>
-        </BetterScrollDialog>
-      </Tabs>
-    </ProfileProvider>
-  );
-};
-
-export { ProfileDialog };

src/containers/dialogs/ProfileDialog/styles.module.scss

@@ -1,5 +0,0 @@
-@import "src/styles/variables";
-
-.messages {
-  padding: $gap;
-}