[New SDK]: 'wasp/client/api'. (#1681)

waspc/data/Generator/templates/react-app/src/auth/pages/OAuthCodeExchange.jsx

@@ -3,7 +3,7 @@ import React, { useEffect, useRef } from 'react'
 import { useHistory } from 'react-router-dom'
 
 import config from 'wasp/core/config'
-import api from 'wasp/api'
+import { api } from 'wasp/client/api'
 import { initSession } from 'wasp/auth/helpers/user'
 
 // After a user authenticates via an Oauth 2.0 provider, this is the page that

waspc/data/Generator/templates/sdk/api/index.ts

@@ -4,7 +4,8 @@ import config from 'wasp/core/config'
 import { storage } from 'wasp/core/storage'
 import { apiEventsEmitter } from './events.js'
 
-const api = axios.create({
+// PUBLIC API
+export const api = axios.create({
   baseURL: config.apiUrl,
 })
 
@@ -12,22 +13,26 @@ const WASP_APP_AUTH_SESSION_ID_NAME = 'sessionId'
 
 let waspAppAuthSessionId = storage.get(WASP_APP_AUTH_SESSION_ID_NAME) as string | undefined
 
+// PRIVATE API (sdk)
 export function setSessionId(sessionId: string): void {
   waspAppAuthSessionId = sessionId
   storage.set(WASP_APP_AUTH_SESSION_ID_NAME, sessionId)
   apiEventsEmitter.emit('sessionId.set')
 }
 
+// PRIVATE API (sdk)
 export function getSessionId(): string | undefined {
   return waspAppAuthSessionId
 }
 
+// PRIVATE API (sdk)
 export function clearSessionId(): void {
   waspAppAuthSessionId = undefined
   storage.remove(WASP_APP_AUTH_SESSION_ID_NAME)
   apiEventsEmitter.emit('sessionId.clear')
 }
 
+// PRIVATE API (sdk)
 export function removeLocalUserData(): void {
   waspAppAuthSessionId = undefined
   storage.clear()
@@ -66,6 +71,7 @@ window.addEventListener('storage', (event) => {
   }
 })
 
+// PRIVATE API (sdk)
 /**
  * Takes an error returned by the app's API (as returned by axios), and transforms into a more
  * standard format to be further used by the client. It is also assumed that given API
@@ -100,5 +106,3 @@ class WaspHttpError extends Error {
     this.data = data
   }
 }
-
-export default api

waspc/data/Generator/templates/sdk/auth/email/actions/login.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 import { initSession } from '../../helpers/user';
 
 export async function login(data: { email: string; password: string }): Promise<void> {

waspc/data/Generator/templates/sdk/auth/email/actions/passwordReset.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 
 export async function requestPasswordReset(data: { email: string; }): Promise<{ success: boolean }> {
     try {

waspc/data/Generator/templates/sdk/auth/email/actions/signup.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 
 export async function signup(data: { email: string; password: string }): Promise<{ success: boolean }> {
     try {

waspc/data/Generator/templates/sdk/auth/email/actions/verifyEmail.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 
 export async function verifyEmail(data: {
   token: string

waspc/data/Generator/templates/sdk/auth/helpers/user.ts

@@ -1,4 +1,4 @@
-import { setSessionId } from 'wasp/api'
+import { setSessionId } from 'wasp/client/api'
 import { invalidateAndRemoveQueries } from 'wasp/operations/resources'
 
 export async function initSession(sessionId: string): Promise<void> {

waspc/data/Generator/templates/sdk/auth/login.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 import { initSession } from './helpers/user'
 
 export default async function login(username: string, password: string): Promise<void> {

waspc/data/Generator/templates/sdk/auth/logout.ts

@@ -1,4 +1,4 @@
-import api, { removeLocalUserData } from 'wasp/api'
+import { api, removeLocalUserData } from 'wasp/client/api'
 import { invalidateAndRemoveQueries } from 'wasp/operations/resources'
 
 export default async function logout(): Promise<void> {

waspc/data/Generator/templates/sdk/auth/signup.ts

@@ -1,5 +1,5 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 
 export default async function signup(userFields: { username: string; password: string }): Promise<void> {
   try {

waspc/data/Generator/templates/sdk/auth/useAuth.ts

@@ -1,9 +1,9 @@
 {{={= =}=}}
 import { deserialize as superjsonDeserialize } from 'superjson'
 import { useQuery } from 'wasp/rpc'
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 import { HttpMethod } from 'wasp/types'
-import type { User } from './types' 
+import type { User } from './types'
 import { addMetadataToQuery } from 'wasp/rpc/queries'
 
 export const getMe = createUserGetter()

waspc/data/Generator/templates/sdk/operations/index.ts

@@ -1,4 +1,4 @@
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 import { HttpMethod } from 'wasp/types'
 import {
   serialize as superjsonSerialize,

waspc/data/Generator/templates/sdk/package.json

@@ -83,8 +83,6 @@
       "./auth/helpers/*": "./dist/auth/helpers/*.jsx",
       {=!  Used by our code, uncodumented (but accessible) for users. =}
       "./auth/pages/createAuthRequiredPage": "./dist/auth/pages/createAuthRequiredPage.jsx",
-      {=!  Used by users, documented. =}
-      "./api": "./dist/api/index.js",
       {=!  Used by our framework code (Websockets), undocumented (but accessible) for users. =}
       "./api/events": "./dist/api/events.js",
       {=!  Used by users, documented. =}
@@ -148,12 +146,28 @@
 
       {=! ================= NEW API HERE =================== =}
       {=! Public: { type MyApiRoute1, type MyApiRoute2, ... }  =}
-      "./server/api": "./dist/server/api/index.js"
+      {=! Private: [] =}
+      "./server/api": "./dist/server/api/index.js",
+      {=! Public: { api }  =}
+      {=! Private: [sdk] =}
+      "./client/api": "./dist/api/index.js"
+   },
+   {=!
+     TypeScript doesn't care about the redirects we define above in "exports" field; those
+     are used only in runtime. TypeScript instead follows exact path as stated in an import when
+     trying to find the type declarations. Therefore, when "exports" redirect doesn't match the path
+     it redirects to, we need to also let TypeScript know about it, and that can be done with
+     `typesVersions` field below.
+    =}
+   "typesVersions": {
+     "*": {
+       "client/api": ["api/index.ts"]
+     }
    },
    "license": "ISC",
     "include": [
       "src/**/*"
    ],
-  {=& depsChunk =},
-  {=& devDepsChunk =}
+   {=& depsChunk =},
+   {=& devDepsChunk =}
 }

waspc/data/Generator/templates/sdk/server/api/index.ts

@@ -14,8 +14,8 @@ import {
   {=/ shouldImportAuthenticatedApi =}
 } from '../_types'
 
-// PUBLIC API
 
+// PUBLIC API
 {=# apiRoutes =}
 export type {= typeName =}<
   P extends ExpressParams = ExpressParams,
@@ -23,7 +23,7 @@ export type {= typeName =}<
   ReqBody = any,
   ReqQuery extends ExpressQuery = ExpressQuery,
   Locals extends Record<string, any> = Record<string, any>
-> = 
+> =
   {=# usesAuth =}
   AuthenticatedApi<
   {=/ usesAuth =}
@@ -41,5 +41,4 @@ export type {= typeName =}<
     ReqQuery,
     Locals
   >
-
 {=/ apiRoutes =}

waspc/data/Generator/templates/sdk/webSocket/WebSocketProvider.tsx

@@ -2,7 +2,7 @@
 import { createContext, useState, useEffect } from 'react'
 import { io, Socket } from 'socket.io-client'
 
-import { getSessionId } from 'wasp/api'
+import { getSessionId } from 'wasp/client/api'
 import { apiEventsEmitter } from 'wasp/api/events'
 import config from 'wasp/core/config'
 

waspc/examples/todo-typescript/src/ChatPage.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef, useState } from 'react'
-import api from 'wasp/api'
+import { api } from 'wasp/client/api'
 import {
   useSocket,
   useSocketListener,