added account list and ability to drop them

src/redux/auth/actions.ts

@@ -1,5 +1,5 @@
 import { AUTH_USER_ACTIONS } from '~/redux/auth/constants';
-import { IAuthState, IUser } from '~/redux/auth/types';
+import { IAuthState, ISocialProvider, IUser } from '~/redux/auth/types';
 import { IMessage } from '../types';
 
 export const userSendLoginRequest = ({
@@ -101,3 +101,23 @@ export const authRestorePassword = (password: string) => ({
   type: AUTH_USER_ACTIONS.RESTORE_PASSWORD,
   password,
 });
+
+export const authGetSocials = () => ({
+  type: AUTH_USER_ACTIONS.GET_SOCIALS,
+});
+
+export const authAddSocial = (provider: ISocialProvider) => ({
+  type: AUTH_USER_ACTIONS.ADD_SOCIAL,
+  provider,
+});
+
+export const authDropSocial = (provider: string, id: string) => ({
+  type: AUTH_USER_ACTIONS.DROP_SOCIAL,
+  provider,
+  id,
+});
+
+export const authSetSocials = (socials: Partial<IAuthState['profile']['socials']>) => ({
+  type: AUTH_USER_ACTIONS.SET_SOCIALS,
+  socials,
+});

src/redux/auth/api.ts

@@ -2,7 +2,7 @@ import { api, errorMiddleware, resultMiddleware, configWithToken } from '~/utils
 import { API } from '~/constants/api';
 import { IResultWithStatus, IMessage, INotification } from '~/redux/types';
 import { userLoginTransform } from '~/redux/auth/transforms';
-import { IUser } from './types';
+import { ISocialAccount, IUser } from './types';
 
 export const apiUserLogin = ({
   username,
@@ -55,9 +55,10 @@ export const apiAuthGetUpdates = ({
   access,
   exclude_dialogs,
   last,
-}): Promise<
-  IResultWithStatus<{ notifications: INotification[]; boris: { commented_at: string } }>
-> =>
+}): Promise<IResultWithStatus<{
+  notifications: INotification[];
+  boris: { commented_at: string };
+}>> =>
   api
     .get(API.USER.GET_UPDATES, configWithToken(access, { params: { exclude_dialogs, last } }))
     .then(resultMiddleware)
@@ -86,3 +87,31 @@ export const apiRestoreCode = ({ code, password }): Promise<IResultWithStatus<{}
     .post(API.USER.REQUEST_CODE(code), { password })
     .then(resultMiddleware)
     .catch(errorMiddleware);
+
+export const apiGetSocials = ({
+  access,
+}: {
+  access: string;
+}): Promise<IResultWithStatus<{
+  accounts: ISocialAccount[];
+}>> =>
+  api
+    .get(API.USER.GET_SOCIALS, configWithToken(access))
+    .then(resultMiddleware)
+    .catch(errorMiddleware);
+
+export const apiDropSocial = ({
+  access,
+  id,
+  provider,
+}: {
+  access: string;
+  id: string;
+  provider: string;
+}): Promise<IResultWithStatus<{
+  accounts: ISocialAccount[];
+}>> =>
+  api
+    .delete(API.USER.DROP_SOCIAL(provider, id), configWithToken(access))
+    .then(resultMiddleware)
+    .catch(errorMiddleware);

src/redux/auth/constants.ts

@@ -24,6 +24,11 @@ export const AUTH_USER_ACTIONS = {
   REQUEST_RESTORE_CODE: 'REQUEST_RESTORE_CODE',
   SHOW_RESTORE_MODAL: 'SHOW_RESTORE_MODAL',
   RESTORE_PASSWORD: 'RESTORE_PASSWORD',
+
+  GET_SOCIALS: 'GET_SOCIALS',
+  DROP_SOCIAL: 'DROP_SOCIAL',
+  ADD_SOCIAL: 'ADD_SOCIAL',
+  SET_SOCIALS: 'SET_SOCIALS',
 };
 
 export const USER_ERRORS = {

src/redux/auth/handlers.ts

@@ -1,7 +1,6 @@
 import { AUTH_USER_ACTIONS } from '~/redux/auth/constants';
 import * as ActionCreators from '~/redux/auth/actions';
 import { IAuthState } from '~/redux/auth/types';
-import { Action } from 'history';
 
 interface ActionHandler<T> {
   (state: IAuthState, payload: T extends (...args: any[]) => infer R ? R : any): IAuthState;
@@ -65,6 +64,16 @@ const setRestore: ActionHandler<typeof ActionCreators.authSetRestore> = (state,
     ...restore,
   },
 });
+const setSocials: ActionHandler<typeof ActionCreators.authSetSocials> = (state, { socials }) => ({
+  ...state,
+  profile: {
+    ...state.profile,
+    socials: {
+      ...state.profile.socials,
+      ...socials,
+    },
+  },
+});
 
 export const AUTH_USER_HANDLERS = {
   [AUTH_USER_ACTIONS.SET_LOGIN_ERROR]: setLoginError,
@@ -74,4 +83,5 @@ export const AUTH_USER_HANDLERS = {
   [AUTH_USER_ACTIONS.SET_UPDATES]: setUpdates,
   [AUTH_USER_ACTIONS.SET_LAST_SEEN_MESSAGES]: setLastSeenMessages,
   [AUTH_USER_ACTIONS.SET_RESTORE]: setRestore,
+  [AUTH_USER_ACTIONS.SET_SOCIALS]: setSocials,
 };

src/redux/auth/reducer.ts

@@ -31,6 +31,12 @@ const INITIAL_STATE: IAuthState = {
     messages: [],
     messages_error: null,
     patch_errors: {},
+
+    socials: {
+      accounts: [],
+      error: '',
+      is_loading: false,
+    },
   },
 
   restore: {

src/redux/auth/sagas.ts

@@ -1,48 +1,53 @@
-import { call, put, takeEvery, takeLatest, select, delay } from 'redux-saga/effects';
+import { call, delay, put, select, takeEvery, takeLatest } from 'redux-saga/effects';
 import { AUTH_USER_ACTIONS, EMPTY_USER, USER_ERRORS, USER_ROLES } from '~/redux/auth/constants';
 import {
-  authSetToken,
-  userSetLoginError,
-  authSetUser,
-  userSendLoginRequest,
-  gotAuthPostMessage,
-  authOpenProfile,
-  authSetProfile,
+  authDropSocial,
   authGetMessages,
-  authSendMessage,
-  authSetUpdates,
+  authGetSocials,
+  authLoadProfile,
   authLoggedIn,
-  authSetLastSeenMessages,
+  authOpenProfile,
   authPatchUser,
-  authShowRestoreModal,
-  authSetRestore,
   authRequestRestoreCode,
   authRestorePassword,
-  authLoadProfile,
+  authSendMessage,
+  authSetLastSeenMessages,
+  authSetProfile,
+  authSetRestore,
+  authSetSocials,
+  authSetToken,
+  authSetUpdates,
+  authSetUser,
+  authShowRestoreModal,
+  gotAuthPostMessage,
+  userSendLoginRequest,
+  userSetLoginError,
 } from '~/redux/auth/actions';
 import {
-  apiUserLogin,
-  apiAuthGetUser,
-  apiAuthGetUserProfile,
-  apiAuthGetUserMessages,
-  apiAuthSendMessage,
   apiAuthGetUpdates,
-  apiUpdateUser,
-  apiRequestRestoreCode,
+  apiAuthGetUser,
+  apiAuthGetUserMessages,
+  apiAuthGetUserProfile,
+  apiAuthSendMessage,
   apiCheckRestoreCode,
+  apiDropSocial,
+  apiGetSocials,
+  apiRequestRestoreCode,
   apiRestoreCode,
+  apiUpdateUser,
+  apiUserLogin,
 } from '~/redux/auth/api';
 import { modalSetShown, modalShowDialog } from '~/redux/modal/actions';
 import {
-  selectToken,
-  selectAuthProfile,
-  selectAuthUser,
-  selectAuthUpdates,
-  selectAuthRestore,
   selectAuth,
+  selectAuthProfile,
+  selectAuthRestore,
+  selectAuthUpdates,
+  selectAuthUser,
+  selectToken,
 } from './selectors';
-import { IResultWithStatus, INotification, IMessageNotification, Unwrap } from '../types';
-import { IUser, IAuthState } from './types';
+import { IMessageNotification, IResultWithStatus, Unwrap } from '../types';
+import { IAuthState, IUser } from './types';
 import { REHYDRATE, RehydrateAction } from 'redux-persist';
 import { selectModal } from '~/redux/modal/selectors';
 import { IModalState } from '~/redux/modal/reducer';
@@ -372,6 +377,45 @@ function* restorePassword({ password }: ReturnType<typeof authRestorePassword>)
   yield call(refreshUser);
 }
 
+function* getSocials() {
+  yield put(authSetSocials({ is_loading: true, error: '' }));
+
+  try {
+    const { data, error }: Unwrap<ReturnType<typeof apiGetSocials>> = yield call(
+      reqWrapper,
+      apiGetSocials,
+      {}
+    );
+
+    if (error) {
+      throw new Error(error);
+    }
+
+    yield put(authSetSocials({ is_loading: false, accounts: data.accounts, error: '' }));
+  } catch (e) {
+    yield put(authSetSocials({ is_loading: false, error: e.toString() }));
+  }
+}
+
+function* dropSocial({ provider, id }: ReturnType<typeof authDropSocial>) {
+  try {
+    yield put(authSetSocials({ error: '' }));
+    const { error }: Unwrap<ReturnType<typeof apiDropSocial>> = yield call(
+      reqWrapper,
+      apiDropSocial,
+      { id, provider }
+    );
+
+    if (error) {
+      throw new Error(error);
+    }
+
+    yield call(getSocials);
+  } catch (e) {
+    yield put(authSetSocials({ error: e.toString() }));
+  }
+}
+
 function* authSaga() {
   yield takeEvery(REHYDRATE, checkUserSaga);
   yield takeLatest([REHYDRATE, AUTH_USER_ACTIONS.LOGGED_IN], startPollingSaga);
@@ -388,6 +432,8 @@ function* authSaga() {
   yield takeLatest(AUTH_USER_ACTIONS.REQUEST_RESTORE_CODE, requestRestoreCode);
   yield takeLatest(AUTH_USER_ACTIONS.SHOW_RESTORE_MODAL, showRestoreModal);
   yield takeLatest(AUTH_USER_ACTIONS.RESTORE_PASSWORD, restorePassword);
+  yield takeLatest(AUTH_USER_ACTIONS.GET_SOCIALS, getSocials);
+  yield takeLatest(AUTH_USER_ACTIONS.DROP_SOCIAL, dropSocial);
 }
 
 export default authSaga;

src/redux/auth/types.ts

@@ -24,6 +24,15 @@ export interface IUser {
   is_user: boolean;
 }
 
+export type ISocialProvider = 'vkontakte' | 'google';
+
+export interface ISocialAccount {
+  provider: ISocialProvider;
+  id: string;
+  name: string;
+  photo: string;
+}
+
 export type IAuthState = Readonly<{
   user: IUser;
   token: string;
@@ -48,8 +57,13 @@ export type IAuthState = Readonly<{
     user: IUser;
     messages: IMessage[];
     messages_error: string;
-
     patch_errors: Record<string, string>;
+
+    socials: {
+      accounts: ISocialAccount[];
+      error: string;
+      is_loading: boolean;
+    };
   };
 
   restore: {