showing needs_register dialog

src/containers/dialogs/LoginDialog/index.tsx

@@ -16,7 +16,7 @@ import * as MODAL_ACTIONS from '~/redux/modal/actions';
 import { ISocialProvider } from '~/redux/auth/types';
 import pick from 'ramda/es/pick';
 import { LoginDialogButtons } from '~/containers/dialogs/LoginDialogButtons';
-import { IOAuthEvent } from '~/redux/types';
+import { IOAuthEvent, OAUTH_EVENT_TYPES } from '~/redux/types';
 
 const mapStateToProps = state => ({
   ...pick(['error', 'is_registering'], selectAuthLogin(state)),
@@ -69,9 +69,16 @@ const LoginDialogUnconnected: FC<IProps> = ({
     []
   );
 
-  const onMessage = useCallback((event: IOAuthEvent) => authGotOauthEvent(event), [
-    authGotOauthEvent,
-  ]);
+  const onMessage = useCallback(
+    (event: MessageEvent) => {
+      if (!event?.data?.type || !Object.values(OAUTH_EVENT_TYPES).includes(event.data.type)) {
+        return;
+      }
+
+      authGotOauthEvent(event.data);
+    },
+    [authGotOauthEvent]
+  );
 
   useEffect(() => {
     if (error) userSetLoginError(null);

src/redux/auth/api.ts

@@ -140,7 +140,7 @@ export const apiLoginWithSocial = ({
   password?: string;
 }): Promise<IResultWithStatus<{
   token: string;
-  needs_login: boolean;
+  needs_register: boolean;
 }>> =>
   api
     .post(API.USER.LOGIN_WITH_SOCIAL, { token, username, password })

src/redux/auth/sagas.ts

@@ -50,7 +50,7 @@ import {
   selectAuthUser,
   selectToken,
 } from './selectors';
-import { IMessageNotification, IResultWithStatus, Unwrap } from '../types';
+import { IMessageNotification, IResultWithStatus, OAUTH_EVENT_TYPES, Unwrap } from '../types';
 import { IAuthState, IUser } from './types';
 import { REHYDRATE, RehydrateAction } from 'redux-persist';
 import { selectModal } from '~/redux/modal/selectors';
@@ -459,6 +459,11 @@ function* loginWithSocial({ token }: ReturnType<typeof authLoginWithSocial>) {
       error,
     }: Unwrap<ReturnType<typeof apiLoginWithSocial>> = yield call(apiLoginWithSocial, { token });
 
+    if (data?.needs_register) {
+      yield put(modalShowDialog(DIALOGS.LOGIN_SOCIAL_REGISTER));
+      return;
+    }
+
     if (error) {
       throw new Error(error);
     }
@@ -475,13 +480,15 @@ function* loginWithSocial({ token }: ReturnType<typeof authLoginWithSocial>) {
 }
 
 function* gotOauthEvent({ event }: ReturnType<typeof authGotOauthEvent>) {
-  if (!event?.data?.type) return;
+  if (!event?.type) return;
+
+  switch (event.type) {
+    case OAUTH_EVENT_TYPES.OAUTH_PROCESSED:
+      return yield put(authLoginWithSocial(event?.payload?.token));
+
+    case OAUTH_EVENT_TYPES.OAUTH_ERROR:
+      return yield put(userSetLoginError(event?.payload?.error));
 
-  switch (event?.data?.type) {
-    case 'oauth_processed':
-      return put(authLoginWithSocial(event?.data?.payload?.token));
-    case 'oauth_error':
-      return put(userSetLoginError(event?.data?.payload?.error));
     default:
       return;
   }

src/redux/modal/constants.ts

@@ -6,7 +6,7 @@ export const DIALOGS = {
   EDITOR_VIDEO: 'EDITOR_VIDEO',
   EDITOR_AUDIO: 'EDITOR_AUDIO',
   LOGIN: 'LOGIN',
-  LOGIN_SOCIAL_REGISTER: 'LOGIN_REGISTER',
+  LOGIN_SOCIAL_REGISTER: 'LOGIN_SOCIAL_REGISTER',
   LOADING: 'LOADING',
   PROFILE: 'PROFILE',
   RESTORE_REQUEST: 'RESTORE_REQUEST',

src/redux/types.ts

@@ -207,13 +207,16 @@ export interface IEmbed {
   };
 }
 
-export type IOAuthEvent = MessageEvent & {
-  data: {
-    type: 'oauth_processed' | 'oauth_error';
-    payload: {
-      token: string;
-      error: string;
-      needs_register: boolean;
-    };
+export const OAUTH_EVENT_TYPES = {
+  OAUTH_PROCESSED: 'oauth_processed',
+  OAUTH_ERROR: 'oauth_error',
+};
+
+export type IOAuthEvent = {
+  type: typeof OAUTH_EVENT_TYPES[keyof typeof OAUTH_EVENT_TYPES];
+  payload: {
+    token: string;
+    error: string;
+    needs_register: boolean;
   };
 };

src/utils/api/index.ts

@@ -2,7 +2,7 @@ import axios, { AxiosRequestConfig } from 'axios';
 import { push } from 'connected-react-router';
 import { API } from '~/constants/api';
 import { store } from '~/redux/store';
-import { IResultWithStatus } from '~/redux/types';
+import { IApiErrorResult, IResultWithStatus } from '~/redux/types';
 
 export const authMiddleware = r => {
   store.dispatch(push('/login'));
@@ -33,10 +33,15 @@ export const resultMiddleware = <T extends {}>({
 
 export const errorMiddleware = <T extends any>(debug): IResultWithStatus<T> =>
   debug && debug.response
-    ? debug.response.data || debug.response
+    ? {
+        status: debug.response.status,
+        data:
+          (debug.response.data as T & IApiErrorResult) || (debug.response as T & IApiErrorResult),
+        error: debug?.response?.data?.error || debug?.response?.error || 'Неизвестная ошибка',
+      }
     : {
         status: HTTP_RESPONSES.CONNECTION_REFUSED,
-        data: {},
+        data: {} as T & IApiErrorResult,
         debug,
         error: 'Ошибка сети',
       };