Отрефакторил бэк, исправил ошибки (#138)

* fixed paths to match refactored backend

* fixed some paths according to new backend

* fixed auth urls for new endpoints

* fixed urls

* fixed error handling

* fixes

* fixed error handling on user form

* fixed error handling on oauth

* using fallback: true on node pages

* type button for comment attach buttons

* fixed return types of social delete

* changed the way we upload user avatars

src/utils/errors/getErrorMessage.ts

@@ -6,6 +6,10 @@ export const getErrorMessage = (error: unknown): string | undefined => {
     return undefined;
   }
 
+  if (path(['response', 'data', 'message'], error)) {
+    return path(['response', 'data', 'message'], error) as string;
+  }
+
   if (typeof error === 'string' && has(error, ERROR_LITERAL)) {
     return ERROR_LITERAL[error];
   }

src/utils/errors/getValidationErrors.ts

@@ -1,6 +1,8 @@
 import { hasPath, path } from '~/utils/ramda';
 
-export const getValidationErrors = (error: unknown): Record<string, string> | undefined => {
+export const getValidationErrors = (
+  error: unknown,
+): Record<string, string> | undefined => {
   if (hasPath(['response', 'data', 'errors'], error)) {
     return path(['response', 'data', 'errors'], error);
   }

src/utils/providers/AuthProvider.tsx

@@ -4,7 +4,7 @@ import { observer } from 'mobx-react-lite';
 
 import { EMPTY_USER } from '~/constants/auth';
 import { useAuth } from '~/hooks/auth/useAuth';
-import { useMessageEventReactions } from '~/hooks/auth/useMessageEventReactions';
+import { useOauthEventListeners } from '~/hooks/auth/useOauthEventListeners';
 import { useRestorePasswordRedirect } from '~/hooks/auth/useRestorePasswordRedirect';
 import { useSessionCookie } from '~/hooks/auth/useSessionCookie';
 
@@ -14,7 +14,7 @@ const AuthContext = createContext<AuthProviderContextType>({
   user: EMPTY_USER,
   isUser: false,
   isTester: false,
-  setIsTester: isTester => isTester,
+  setIsTester: (isTester) => isTester,
   logout: () => {},
   login: async () => EMPTY_USER,
   setToken: () => {},
@@ -23,7 +23,7 @@ const AuthContext = createContext<AuthProviderContextType>({
 export const AuthProvider: FC = observer(({ children }) => {
   const value = useAuth();
 
-  useMessageEventReactions();
+  useOauthEventListeners();
   useRestorePasswordRedirect();
   useSessionCookie();
 

src/utils/providers/SettingsProvider.tsx

@@ -1,6 +1,11 @@
 import { FC, PropsWithChildren, useCallback, useRef } from 'react';
 
-import { FormikConfig, useFormik, FormikProvider, useFormikContext } from 'formik';
+import {
+  FormikConfig,
+  useFormik,
+  FormikProvider,
+  useFormikContext,
+} from 'formik';
 import { Asserts, object, string } from 'yup';
 
 import { ERRORS } from '~/constants/errors';
@@ -13,15 +18,11 @@ import { showErrorToast } from '~/utils/errors/showToast';
 import { showToastSuccess } from '~/utils/toast';
 
 const validationSchema = object({
-  username: string()
-    .default('')
-    .required(ERRORS.REQUIRED),
+  username: string().default('').required(ERRORS.REQUIRED),
   fullname: string().default(''),
   newPassword: string().optional(),
   description: string().default(''),
-  email: string()
-    .default('')
-    .email(ERRORS.NOT_AN_EMAIL),
+  email: string().default('').email(ERRORS.NOT_AN_EMAIL),
   password: string().optional(),
 });
 
@@ -29,7 +30,7 @@ export type ProfileFormData = Asserts<typeof validationSchema>;
 
 export const useSettingsForm = (
   values: ProfileFormData,
-  submitter: (data: ProfileFormData) => Promise<IUser>
+  submitter: (data: ProfileFormData) => Promise<IUser>,
 ) => {
   const initialValues = useRef(values).current;
 
@@ -39,7 +40,9 @@ export const useSettingsForm = (
         const fields = {
           ...values,
           password: values.password?.length ? values.password : undefined,
-          new_password: values.newPassword?.length ? values.newPassword : undefined,
+          new_password: values.newPassword?.length
+            ? values.newPassword
+            : undefined,
         };
 
         const result = await submitter(fields);
@@ -51,11 +54,12 @@ export const useSettingsForm = (
 
         const validationErrors = getValidationErrors(error);
         if (validationErrors) {
+          console.log(validationErrors);
           setErrors(validationErrors);
         }
       }
     },
-    [submitter]
+    [submitter],
   );
 
   return useFormik({
@@ -70,11 +74,11 @@ export const SettingsProvider: FC<PropsWithChildren<{}>> = ({ children }) => {
   const { save } = usePatchUser();
 
   const formik = useSettingsForm(
-    { ...user, password: '', newPassword: '' }, 
-    save
+    { ...user, password: '', newPassword: '' },
+    save,
   );
 
-  return <FormikProvider value={formik}>{children}</FormikProvider>
-}
+  return <FormikProvider value={formik}>{children}</FormikProvider>;
+};
 
 export const useSettings = () => useFormikContext<ProfileFormData>();

src/utils/providers/SidebarProvider.tsx

@@ -9,12 +9,12 @@ import {
 } from 'react';
 
 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 { has, omit } from '~/utils/ramda';
 
 type ContextValue = typeof SidebarContext extends Context<infer U> ? U : never;
 

src/utils/providers/ThemeProvider.tsx

@@ -7,9 +7,8 @@ import React, {
   useState,
 } from 'react';
 
-import { keys } from 'ramda';
-
 import { Theme } from '~/constants/themes';
+import { keys } from '~/utils/ramda';
 
 interface ProvidersProps {}
 

src/utils/providers/ToastProvider.tsx

@@ -1,12 +1,13 @@
-import React from 'react';
+import { CSSProperties } from 'react';
 
 import { Toaster } from 'react-hot-toast';
 
-const containerStyle = {
+const containerStyle: CSSProperties = {
   top: 10,
   left: 10,
   bottom: 10,
   right: 10,
+  textAlign: 'center',
 };
 
 export const ToastProvider = () => <Toaster containerStyle={containerStyle} />;