@automattic/data-stores 1.0.0-alpha.0 → 3.0.0

package/src/user/actions.ts

@@ -1,50 +1,100 @@
-/**
- * Internal dependencies
- */
-import {
-	ActionType,
+import { stringify } from 'qs';
+import { wpcomRequest, requestAllBlogsAccess, reloadProxy } from '../wpcom-request-controls';
+import type { WpcomClientCredentials } from '../shared-types';
+import type {
 	CurrentUser,
 	CreateAccountParams,
 	NewUserErrorResponse,
 	NewUserSuccessResponse,
 } from './types';
 
-export const fetchCurrentUser = () => ( {
-	type: ActionType.FETCH_CURRENT_USER as const,
-} );
-
-export const receiveCurrentUser = ( currentUser: CurrentUser ) => ( {
-	type: ActionType.RECEIVE_CURRENT_USER as const,
-	currentUser,
-} );
-
-export const receiveCurrentUserFailed = () => ( {
-	type: ActionType.RECEIVE_CURRENT_USER_FAILED as const,
-} );
-
-export const fetchNewUser = () => ( {
-	type: ActionType.FETCH_NEW_USER as const,
-} );
-
-export const receiveNewUser = ( response: NewUserSuccessResponse ) => ( {
-	type: ActionType.RECEIVE_NEW_USER as const,
-	response,
-} );
-
-export const receiveNewUserFailed = ( error: NewUserErrorResponse ) => ( {
-	type: ActionType.RECEIVE_NEW_USER_FAILED as const,
-	error,
-} );
-
-export function* createAccount( params: CreateAccountParams ) {
-	yield fetchNewUser();
-	try {
-		const newUser = yield {
-			type: ActionType.CREATE_ACCOUNT as const,
-			params,
-		};
-		return receiveNewUser( newUser );
-	} catch ( err ) {
-		return receiveNewUserFailed( err );
+export function createActions( clientCreds: WpcomClientCredentials ) {
+	const receiveCurrentUser = ( currentUser: CurrentUser ) => ( {
+		type: 'RECEIVE_CURRENT_USER' as const,
+		currentUser,
+	} );
+
+	const receiveCurrentUserFailed = () => ( {
+		type: 'RECEIVE_CURRENT_USER_FAILED' as const,
+	} );
+
+	const fetchNewUser = () => ( {
+		type: 'FETCH_NEW_USER' as const,
+	} );
+
+	const receiveNewUser = ( response: NewUserSuccessResponse ) => ( {
+		type: 'RECEIVE_NEW_USER' as const,
+		response,
+	} );
+
+	const receiveNewUserFailed = ( error: NewUserErrorResponse ) => ( {
+		type: 'RECEIVE_NEW_USER_FAILED' as const,
+		error,
+	} );
+
+	const clearErrors = () => ( {
+		type: 'CLEAR_ERRORS' as const,
+	} );
+
+	function* createAccount( params: CreateAccountParams ) {
+		yield fetchNewUser();
+		try {
+			const newUser: NewUserSuccessResponse = yield wpcomRequest( {
+				body: {
+					// defaults
+					is_passwordless: true,
+					signup_flow_name: 'gutenboarding',
+					locale: 'en',
+
+					...clientCreds,
+					...params,
+
+					// Set to false because account validation should be a separate action
+					validate: false,
+				},
+				path: '/users/new',
+				apiVersion: '1.1',
+				method: 'post',
+				query: stringify( { locale: params.locale } ),
+			} );
+
+			yield reloadProxy();
+
+			// Need to rerequest access after the proxy is reloaded
+			yield requestAllBlogsAccess();
+
+			yield receiveNewUser( newUser );
+
+			return { ok: true } as const;
+		} catch ( error ) {
+			const newUserError: NewUserErrorResponse = error as NewUserErrorResponse;
+			yield receiveNewUserFailed( newUserError as NewUserErrorResponse );
+
+			return { ok: false, newUserError } as const;
+		}
 	}
+
+	return {
+		receiveCurrentUser,
+		receiveCurrentUserFailed,
+		fetchNewUser,
+		receiveNewUser,
+		receiveNewUserFailed,
+		clearErrors,
+		createAccount,
+	};
 }
+
+type ActionCreators = ReturnType< typeof createActions >;
+
+export type Action =
+	| ReturnType<
+			| ActionCreators[ 'receiveCurrentUser' ]
+			| ActionCreators[ 'receiveCurrentUserFailed' ]
+			| ActionCreators[ 'fetchNewUser' ]
+			| ActionCreators[ 'receiveNewUser' ]
+			| ActionCreators[ 'receiveNewUserFailed' ]
+			| ActionCreators[ 'clearErrors' ]
+	  >
+	// Type added so we can dispatch actions in tests, but has no runtime cost
+	| { type: 'TEST_ACTION' };

package/src/user/index.ts

@@ -1,33 +1,25 @@
-/**
- * External dependencies
- */
 import { registerStore } from '@wordpress/data';
-
-/**
- * Internal dependencies
- */
+import { controls } from '../wpcom-request-controls';
+import { createActions } from './actions';
 import { STORE_KEY } from './constants';
 import reducer, { State } from './reducer';
-import * as actions from './actions';
-import * as resolvers from './resolvers';
+import { createResolvers } from './resolvers';
 import * as selectors from './selectors';
-import createControls from './controls';
-import { DispatchFromMap, SelectFromMap } from '../mapped-types';
-import { WpcomClientCredentials } from '../utils';
+import type { DispatchFromMap, SelectFromMap } from '../mapped-types';
+import type { WpcomClientCredentials } from '../shared-types';
 
 export * from './types';
-export { State };
+export type { State };
 
 let isRegistered = false;
 export function register( clientCreds: WpcomClientCredentials ): typeof STORE_KEY {
 	if ( ! isRegistered ) {
-		const controls = createControls( clientCreds );
 		isRegistered = true;
 		registerStore< State >( STORE_KEY, {
-			actions,
-			controls,
-			reducer: reducer as any,
-			resolvers,
+			actions: createActions( clientCreds ),
+			controls: controls as any,
+			reducer,
+			resolvers: createResolvers( clientCreds ),
 			selectors,
 		} );
 	}
@@ -35,6 +27,6 @@ export function register( clientCreds: WpcomClientCredentials ): typeof STORE_KE
 }
 
 declare module '@wordpress/data' {
-	function dispatch( key: typeof STORE_KEY ): DispatchFromMap< typeof actions >;
+	function dispatch( key: typeof STORE_KEY ): DispatchFromMap< ReturnType< typeof createActions > >;
 	function select( key: typeof STORE_KEY ): SelectFromMap< typeof selectors >;
 }

package/src/user/reducer.ts

@@ -1,59 +1,44 @@
-/**
- * External dependencies
- */
-import { Reducer } from 'redux';
 import { combineReducers } from '@wordpress/data';
+import type { Action } from './actions';
+import type { CurrentUser, NewUser, NewUserErrorResponse } from './types';
+import type { Reducer } from 'redux';
 
-/**
- * Internal dependencies
- */
-import { ActionType, CurrentUser, NewUser, NewUserErrorResponse } from './types';
-import * as Actions from './actions';
-
-const currentUser: Reducer<
-	CurrentUser | null | undefined,
-	| ReturnType< typeof Actions[ 'receiveCurrentUser' ] >
-	| ReturnType< typeof Actions[ 'receiveCurrentUserFailed' ] >
-> = ( state = undefined, action ) => {
+export const currentUser: Reducer< CurrentUser | null | undefined, Action > = ( state, action ) => {
 	switch ( action.type ) {
-		case ActionType.RECEIVE_CURRENT_USER:
+		case 'RECEIVE_CURRENT_USER':
 			return action.currentUser;
-		case ActionType.RECEIVE_CURRENT_USER_FAILED:
+		case 'RECEIVE_CURRENT_USER_FAILED':
 			return null;
 	}
 	return state;
 };
 
-const newUserData: Reducer<
-	NewUser | undefined,
-	| ReturnType< typeof Actions[ 'receiveNewUser' ] >
-	| ReturnType< typeof Actions[ 'receiveNewUserFailed' ] >
-> = ( state = undefined, action ) => {
-	if ( action.type === ActionType.RECEIVE_NEW_USER ) {
+export const newUserData: Reducer< NewUser | undefined, Action > = ( state, action ) => {
+	if ( action.type === 'RECEIVE_NEW_USER' ) {
 		const { response } = action;
 		return {
 			username: response.signup_sandbox_username || response.username,
 			userId: response.signup_sandbox_user_id || response.user_id,
 			bearerToken: response.bearer_token,
 		};
-	} else if ( action.type === ActionType.RECEIVE_NEW_USER_FAILED ) {
+	} else if ( action.type === 'RECEIVE_NEW_USER_FAILED' ) {
 		return undefined;
 	}
 	return state;
 };
 
-const newUserError: Reducer<
-	NewUserErrorResponse | undefined,
-	| ReturnType< typeof Actions[ 'fetchNewUser' ] >
-	| ReturnType< typeof Actions[ 'receiveNewUser' ] >
-	| ReturnType< typeof Actions[ 'receiveNewUserFailed' ] >
-> = ( state = undefined, action ) => {
+export const newUserError: Reducer< NewUserErrorResponse | undefined, Action > = (
+	state,
+	action
+) => {
 	switch ( action.type ) {
-		case ActionType.FETCH_NEW_USER:
+		case 'FETCH_NEW_USER':
+			return undefined;
+		case 'RECEIVE_NEW_USER':
 			return undefined;
-		case ActionType.RECEIVE_NEW_USER:
+		case 'CLEAR_ERRORS':
 			return undefined;
-		case ActionType.RECEIVE_NEW_USER_FAILED:
+		case 'RECEIVE_NEW_USER_FAILED':
 			return {
 				error: action.error.error,
 				status: action.error.status,
@@ -65,18 +50,16 @@ const newUserError: Reducer<
 	return state;
 };
 
-const isFetchingNewUser: Reducer<
-	boolean | undefined,
-	| ReturnType< typeof Actions[ 'fetchNewUser' ] >
-	| ReturnType< typeof Actions[ 'receiveNewUser' ] >
-	| ReturnType< typeof Actions[ 'receiveNewUserFailed' ] >
-> = ( state = false, action ) => {
+export const isFetchingNewUser: Reducer< boolean | undefined, Action > = (
+	state = false,
+	action
+) => {
 	switch ( action.type ) {
-		case ActionType.FETCH_NEW_USER:
+		case 'FETCH_NEW_USER':
 			return true;
-		case ActionType.RECEIVE_NEW_USER:
+		case 'RECEIVE_NEW_USER':
 			return false;
-		case ActionType.RECEIVE_NEW_USER_FAILED:
+		case 'RECEIVE_NEW_USER_FAILED':
 			return false;
 	}
 	return state;

package/src/user/resolvers.ts

@@ -1,13 +1,36 @@
-/**
- * Internal dependencies
- */
-import { fetchCurrentUser, receiveCurrentUser, receiveCurrentUserFailed } from './actions';
-
-export function* getCurrentUser() {
-	try {
-		const currentUser = yield fetchCurrentUser();
-		return receiveCurrentUser( currentUser );
-	} catch ( err ) {
-		return receiveCurrentUserFailed();
+import { wpcomRequest } from '../wpcom-request-controls';
+import { createActions } from './actions';
+import type { WpcomClientCredentials } from '../shared-types';
+import type { CurrentUser } from './types';
+
+declare global {
+	interface Window {
+		currentUser?: CurrentUser;
+	}
+}
+
+export function createResolvers( clientCreds: WpcomClientCredentials ) {
+	const { receiveCurrentUser, receiveCurrentUserFailed } = createActions( clientCreds );
+
+	function* getCurrentUser() {
+		// In environments where `wpcom-user-bootstrap` is set to true, the currentUser
+		// object will be server-side rendered to window.currentUser. In these cases,
+		// return that object instead of performing another API request to `/me`.
+		if ( window.currentUser ) {
+			return receiveCurrentUser( window.currentUser );
+		}
+		try {
+			const currentUser: CurrentUser = yield wpcomRequest( {
+				path: '/me',
+				apiVersion: '1.1',
+			} );
+			return receiveCurrentUser( currentUser );
+		} catch ( err ) {
+			return receiveCurrentUserFailed();
+		}
 	}
+
+	return {
+		getCurrentUser,
+	};
 }

package/src/user/selectors.ts

@@ -1,7 +1,4 @@
-/**
- * Internal dependencies
- */
-import { State } from './reducer';
+import type { State } from './reducer';
 
 export const getState = ( state: State ) => state;
 

package/src/user/test/actions.ts

@@ -0,0 +1,153 @@
+/*
+ * These tests shouldn't require the jsdom environment,
+ * but we're waiting for this PR to merge:
+ * https://github.com/WordPress/gutenberg/pull/20486
+ *
+ * @jest-environment jsdom
+ */
+
+import { createActions } from '../actions';
+
+const client_id = 'magic_client_id';
+const client_secret = 'magic_client_secret';
+
+describe( 'createAccount', () => {
+	const { createAccount } = createActions( {
+		client_id,
+		client_secret,
+	} );
+
+	const params = {
+		email: 'test@example.com',
+		extra: {
+			username_hint: 'Test Site Title',
+		},
+	};
+
+	const paramsWithPasswordAndLocale = {
+		email: 'test@example.com',
+		password: 'abctesting!',
+		extra: {
+			username_hint: 'Test Site Title',
+		},
+		locale: 'fr',
+	};
+
+	const defaults = {
+		client_id,
+		client_secret,
+		is_passwordless: true,
+		signup_flow_name: 'gutenboarding',
+		locale: 'en',
+	};
+
+	it( 'requests a new passwordless account to be created', () => {
+		const generator = createAccount( params );
+
+		expect( generator.next().value ).toEqual( { type: 'FETCH_NEW_USER' } );
+
+		const apiResponse = {
+			success: true,
+			bearer_token: 'bearer-token',
+			username: 'testusernamer12345',
+			user_id: 12345,
+		};
+
+		expect( generator.next().value ).toEqual( {
+			type: 'WPCOM_REQUEST',
+			request: expect.objectContaining( {
+				body: {
+					...defaults,
+					...params,
+					validate: false,
+				},
+			} ),
+		} );
+
+		expect( generator.next( apiResponse ).value ).toEqual( { type: 'RELOAD_PROXY' } );
+		expect( generator.next().value ).toEqual( { type: 'REQUEST_ALL_BLOGS_ACCESS' } );
+
+		expect( generator.next().value ).toEqual( {
+			type: 'RECEIVE_NEW_USER',
+			response: apiResponse,
+		} );
+
+		const finalResult = generator.next();
+
+		expect( finalResult.value ).toEqual( { ok: true } );
+		expect( finalResult.done ).toBe( true );
+	} );
+
+	it( 'receives an error object and returns ok=false', () => {
+		const generator = createAccount( params );
+
+		expect( generator.next().value ).toEqual( { type: 'FETCH_NEW_USER' } );
+
+		const apiResponse = {
+			error: 'email_exists',
+			status: 400,
+			statusCode: 400,
+			name: 'EmailExistsError',
+			message: 'Invalid email input',
+		};
+
+		expect( generator.next().value ).toEqual( {
+			type: 'WPCOM_REQUEST',
+			request: expect.objectContaining( {
+				body: {
+					...defaults,
+					...params,
+					validate: false,
+				},
+			} ),
+		} );
+
+		expect( generator.throw( apiResponse ).value ).toEqual( {
+			type: 'RECEIVE_NEW_USER_FAILED',
+			error: apiResponse,
+		} );
+
+		const finalResult = generator.next();
+
+		expect( finalResult.value ).toMatchObject( { ok: false, newUserError: expect.anything() } );
+		expect( finalResult.done ).toBe( true );
+	} );
+
+	it( 'requests a passwordful account to be created with French locale set in query', () => {
+		const generator = createAccount( paramsWithPasswordAndLocale );
+
+		expect( generator.next().value ).toEqual( { type: 'FETCH_NEW_USER' } );
+
+		const apiResponse = {
+			success: true,
+			bearer_token: 'bearer-token',
+			username: 'testusernamer12345',
+			user_id: 12345,
+		};
+
+		expect( generator.next().value ).toEqual( {
+			type: 'WPCOM_REQUEST',
+			request: expect.objectContaining( {
+				body: {
+					...defaults,
+					...paramsWithPasswordAndLocale,
+					validate: false,
+				},
+				query: 'locale=fr',
+			} ),
+		} );
+
+		expect( generator.next( apiResponse ).value ).toEqual( { type: 'RELOAD_PROXY' } );
+		expect( generator.next().value ).toEqual( { type: 'REQUEST_ALL_BLOGS_ACCESS' } );
+
+		expect( generator.next().value ).toEqual( {
+			type: 'RECEIVE_NEW_USER',
+			response: apiResponse,
+		} );
+
+		const finalResult = generator.next();
+
+		expect( finalResult.value ).toEqual( { ok: true } );
+		expect( finalResult.done ).toBe( true );
+	} );
+} );

package/src/user/test/reducer.ts

@@ -0,0 +1,153 @@
+/*
+ * These tests shouldn't require the jsdom environment,
+ * but we're waiting for this PR to merge:
+ * https://github.com/WordPress/gutenberg/pull/20486
+ *
+ * @jest-environment jsdom
+ */
+
+import { createActions } from '../actions';
+import { currentUser, newUserData, newUserError, isFetchingNewUser } from '../reducer';
+
+const {
+	receiveCurrentUser,
+	receiveCurrentUserFailed,
+	fetchNewUser,
+	receiveNewUser,
+	receiveNewUserFailed,
+	clearErrors,
+} = createActions( {
+	client_id: '',
+	client_secret: '',
+} );
+
+const newUserSuccessResponse = {
+	success: true,
+	bearer_token: 'bearer-token',
+	username: 'testusernamer12345',
+	user_id: 12345,
+	is_signup_sandbox: false,
+};
+
+const newUserSuccessResponseSandboxed = {
+	success: true,
+	bearer_token: 'bearer-token',
+	signup_sandbox_username: 'testusernamer12345',
+	signup_sandbox_user_id: 12345,
+	is_signup_sandbox: true,
+};
+
+const newUserErrorResponse = {
+	error: 'email_exists',
+	status: 400,
+	statusCode: 400,
+	name: 'EmailExistsError',
+	message: 'Invalid email input',
+};
+
+describe( 'currentUser', () => {
+	it( 'defaults to undefined', () => {
+		const state = currentUser( undefined, { type: 'TEST_ACTION' } );
+		expect( state ).toBe( undefined );
+	} );
+
+	it( 'returns a current user object', () => {
+		const testUser = {
+			ID: 1,
+			username: 'testusername',
+			display_name: 'testusername',
+			language: 'en',
+			locale_variant: '',
+		};
+		const state = currentUser( undefined, receiveCurrentUser( testUser ) );
+		expect( state ).toEqual( testUser );
+	} );
+
+	it( 'returns null if receiving the current user failed', () => {
+		const state = currentUser( undefined, receiveCurrentUserFailed() );
+		expect( state ).toBe( null );
+	} );
+} );
+
+describe( 'newUserData', () => {
+	it( 'defaults to undefined', () => {
+		const state = newUserData( undefined, { type: 'TEST_ACTION' } );
+		expect( state ).toBe( undefined );
+	} );
+
+	it( 'sets username, userId, and bearerToken from a standard response', () => {
+		const state = newUserData( undefined, receiveNewUser( newUserSuccessResponse ) );
+		const { username, user_id, bearer_token } = newUserSuccessResponse;
+		expect( state ).toEqual( {
+			username,
+			userId: user_id,
+			bearerToken: bearer_token,
+		} );
+	} );
+
+	it( 'set username, userId, and bearerToken from a sandboxed response', () => {
+		const state = newUserData( undefined, receiveNewUser( newUserSuccessResponseSandboxed ) );
+		const { signup_sandbox_username, signup_sandbox_user_id, bearer_token } =
+			newUserSuccessResponseSandboxed;
+		expect( state ).toEqual( {
+			username: signup_sandbox_username,
+			userId: signup_sandbox_user_id,
+			bearerToken: bearer_token,
+		} );
+	} );
+} );
+
+describe( 'newUserError', () => {
+	it( 'defaults to undefined', () => {
+		const state = newUserError( undefined, { type: 'TEST_ACTION' } );
+		expect( state ).toBe( undefined );
+	} );
+
+	it( 'stores an error message', () => {
+		const state = newUserError( undefined, receiveNewUserFailed( newUserErrorResponse ) );
+		expect( state ).toEqual( newUserErrorResponse );
+	} );
+
+	it( 'clears existing error messages on clearErrors', () => {
+		const originalState = newUserError( undefined, receiveNewUserFailed( newUserErrorResponse ) );
+		expect( originalState ).toEqual( newUserErrorResponse );
+		const state = newUserError( originalState, clearErrors() );
+		expect( state ).toBe( undefined );
+	} );
+
+	it( 'clears existing error messages on fetching a new user', () => {
+		const originalState = newUserError( undefined, receiveNewUserFailed( newUserErrorResponse ) );
+		expect( originalState ).toEqual( newUserErrorResponse );
+		const state = newUserError( originalState, fetchNewUser() );
+		expect( state ).toBe( undefined );
+	} );
+
+	it( 'clears existing error messages on receiving a new user', () => {
+		const originalState = newUserError( undefined, receiveNewUserFailed( newUserErrorResponse ) );
+		expect( originalState ).toEqual( newUserErrorResponse );
+		const state = newUserError( originalState, receiveNewUser( newUserSuccessResponse ) );
+		expect( state ).toBe( undefined );
+	} );
+} );
+
+describe( 'isFetchingNewUser', () => {
+	it( 'defaults to false', () => {
+		const state = isFetchingNewUser( undefined, { type: 'TEST_ACTION' } );
+		expect( state ).toBe( false );
+	} );
+
+	it( 'returns true on fetching a new user', () => {
+		const state = isFetchingNewUser( undefined, fetchNewUser() );
+		expect( state ).toBe( true );
+	} );
+
+	it( 'returns false on receiving a new user', () => {
+		const state = isFetchingNewUser( true, receiveNewUser( newUserSuccessResponse ) );
+		expect( state ).toBe( false );
+	} );
+
+	it( 'returns false on a failed new user request', () => {
+		const state = isFetchingNewUser( true, receiveNewUserFailed( newUserErrorResponse ) );
+		expect( state ).toBe( false );
+	} );
+} );