New SDK

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/react-app/src/auth/pages/createAuthRequiredPage.jsx

@@ -2,7 +2,7 @@
 import React from 'react'
 
 import { Redirect } from 'react-router-dom'
-import useAuth from 'wasp/auth/useAuth'
+import { useAuth } from 'wasp/client/auth'
 
 
 const createAuthRequiredPage = (Page) => {

waspc/data/Generator/templates/react-app/src/index.tsx

@@ -7,14 +7,14 @@ import router from './router'
 import {
   initializeQueryClient,
   queryClientInitialized,
-} from 'wasp/rpc/queryClient'
+} from 'wasp/client/operations'
 
 {=# setupFn.isDefined =}
 {=& setupFn.importStatement =}
 {=/ setupFn.isDefined =}
 
 {=# areWebSocketsUsed =}
-import { WebSocketProvider } from 'wasp/webSocket/WebSocketProvider'
+import { WebSocketProvider } from 'wasp/client/webSocket/WebSocketProvider'
 {=/ areWebSocketsUsed =}
 
 startApp()

waspc/data/Generator/templates/react-app/src/router.tsx

@@ -17,7 +17,7 @@ import createAuthRequiredPage from "./auth/pages/createAuthRequiredPage"
 import OAuthCodeExchange from "./auth/pages/OAuthCodeExchange"
 {=/ isExternalAuthEnabled =}
 
-import { routes } from 'wasp/router'
+import { routes } from 'wasp/client/router'
 
 export const routeNameToRouteComponent = {
   {=# routes =}

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

@@ -4,30 +4,35 @@ 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,
 })
 
 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,7 +1,8 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 import { initSession } from '../../helpers/user';
 
+// PUBLIC API
 export async function login(data: { email: string; password: string }): Promise<void> {
     try {
         const response = await api.post('{= loginPath =}', data);

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

@@ -1,6 +1,7 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 
+// PUBLIC API
 export async function requestPasswordReset(data: { email: string; }): Promise<{ success: boolean }> {
     try {
         const response = await api.post('{= requestPasswordResetPath =}', data);
@@ -10,6 +11,7 @@ export async function requestPasswordReset(data: { email: string; }): Promise<{
     }
 }
 
+// PUBLIC API
 export async function resetPassword(data: { token: string; password: string; }): Promise<{ success: boolean }> {
     try {
         const response = await api.post('{= resetPasswordPath =}', data);

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

@@ -1,6 +1,7 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api';
+import { api, handleApiError } from 'wasp/client/api';
 
+// PUBLIC API
 export async function signup(data: { email: string; password: string }): Promise<{ success: boolean }> {
     try {
         const response = await api.post('{= signupPath =}', data);

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

@@ -1,6 +1,7 @@
 {{={= =}=}}
-import api, { handleApiError } from 'wasp/api'
+import { api, handleApiError } from 'wasp/client/api'
 
+// PUBLIC API
 export async function verifyEmail(data: {
   token: string
 }): Promise<{ success: boolean; reason?: string }> {

waspc/data/Generator/templates/sdk/auth/forms/Auth.tsx

@@ -33,6 +33,7 @@ const HeaderText = styled('h2', {
 })
 
 
+// PRIVATE API
 export const AuthContext = createContext({
   isLoading: false,
   setIsLoading: (isLoading: boolean) => {},
@@ -98,4 +99,5 @@ function Auth ({ state, appearance, logo, socialLayout = 'horizontal', additiona
   )
 }
 
+// PRIVATE API
 export default Auth;

waspc/data/Generator/templates/sdk/auth/forms/ForgotPassword.tsx

@@ -1,6 +1,7 @@
 import Auth from './Auth'
 import { type CustomizationOptions, State } from './types'
 
+// PUBLIC API
 export function ForgotPasswordForm({
   appearance,
   logo,

waspc/data/Generator/templates/sdk/auth/forms/Login.tsx

@@ -1,6 +1,7 @@
 import Auth from './Auth'
 import { type CustomizationOptions, State } from './types'
 
+// PUBLIC API
 export function LoginForm({
   appearance,
   logo,

waspc/data/Generator/templates/sdk/auth/forms/ResetPassword.tsx

@@ -1,6 +1,7 @@
 import Auth from './Auth'
 import { type CustomizationOptions, State } from './types'
 
+// PUBLIC API
 export function ResetPasswordForm({
   appearance,
   logo,

waspc/data/Generator/templates/sdk/auth/forms/Signup.tsx

@@ -5,6 +5,7 @@ import {
   State,
 } from './types'
 
+// PUBLIC API
 export function SignupForm({
   appearance,
   logo,

waspc/data/Generator/templates/sdk/auth/forms/VerifyEmail.tsx

@@ -1,6 +1,7 @@
 import Auth from './Auth'
 import { type CustomizationOptions, State } from './types'
 
+// PUBLIC API
 export function VerifyEmailForm({
   appearance,
   logo,

waspc/data/Generator/templates/sdk/auth/forms/internal/Form.tsx

@@ -1,15 +1,18 @@
 import { styled } from 'wasp/core/stitches.config'
 
+// PRIVATE API
 export const Form = styled('form', {
   marginTop: '1.5rem',
 })
 
+// PUBLIC API
 export const FormItemGroup = styled('div', {
   '& + div': {
     marginTop: '1.5rem',
   },
 })
 
+// PUBLIC API
 export const FormLabel = styled('label', {
   display: 'block',
   fontSize: '$sm',
@@ -48,10 +51,13 @@ const commonInputStyles = {
   margin: 0,
 }
 
+// PUBLIC API
 export const FormInput = styled('input', commonInputStyles)
 
+// PUBLIC API
 export const FormTextarea = styled('textarea', commonInputStyles)
 
+// PUBLIC API
 export const FormError = styled('div', {
   display: 'block',
   fontSize: '$sm',
@@ -60,6 +66,7 @@ export const FormError = styled('div', {
   marginTop: '0.5rem',
 })
 
+// PRIVATE API
 export const SubmitButton = styled('button', {
   display: 'flex',
   justifyContent: 'center',

waspc/data/Generator/templates/sdk/auth/forms/internal/Message.tsx

@@ -1,17 +1,20 @@
 import { styled } from 'wasp/core/stitches.config'
 
+// PRIVATE API
 export const Message = styled('div', {
   padding: '0.5rem 0.75rem',
   borderRadius: '0.375rem',
   marginTop: '1rem',
   background: '$gray400',
 })
 
+// PRIVATE API
 export const MessageError = styled(Message, {
   background: '$errorBackground',
   color: '$errorText',
 })
 
+// PRIVATE API
 export const MessageSuccess = styled(Message, {
   background: '$successBackground',
   color: '$successText',

waspc/data/Generator/templates/sdk/auth/forms/internal/common/LoginSignupForm.tsx

@@ -117,10 +117,12 @@ const gitHubSignInUrl = `${config.apiUrl}{= gitHubSignInPath =}`
 // know the exact shape of the form values. We are assuming that the form values
 // will be a flat object with string values.
 =}
+// PRIVATE API
 export type LoginSignupFormFields = {
   [key: string]: string;
 }
 
+// PRIVATE API
 export const LoginSignupForm = ({
     state,
     socialButtonsDirection = 'horizontal',

waspc/data/Generator/templates/sdk/auth/forms/internal/email/ForgotPasswordForm.tsx

@@ -4,6 +4,7 @@ import { requestPasswordReset } from '../../../email/actions/passwordReset.js'
 import { Form, FormItemGroup, FormLabel, FormInput, SubmitButton, FormError } from '../Form'
 import { AuthContext } from '../../Auth'
 
+// PRIVATE API
 export const ForgotPasswordForm = () => {
   const { register, handleSubmit, reset, formState: { errors } } = useForm<{ email: string }>()
   const { isLoading, setErrorMessage, setSuccessMessage, setIsLoading } = useContext(AuthContext)

waspc/data/Generator/templates/sdk/auth/forms/internal/email/ResetPasswordForm.tsx

@@ -5,6 +5,7 @@ import { useLocation } from 'react-router-dom'
 import { Form, FormItemGroup, FormLabel, FormInput, SubmitButton, FormError } from '../Form'
 import { AuthContext } from '../../Auth'
 
+// PRIVATE API
 export const ResetPasswordForm = () => {
   const { register, handleSubmit, reset, formState: { errors } } = useForm<{ password: string; passwordConfirmation: string }>()
   const { isLoading, setErrorMessage, setSuccessMessage, setIsLoading } = useContext(AuthContext)

waspc/data/Generator/templates/sdk/auth/forms/internal/email/VerifyEmailForm.tsx

@@ -4,6 +4,7 @@ import { verifyEmail } from '../../../email/actions/verifyEmail.js'
 import { Message } from '../Message'
 import { AuthContext } from '../../Auth'
 
+// PRIVATE API
 export const VerifyEmailForm = () => {
   const { isLoading, setErrorMessage, setSuccessMessage, setIsLoading } = useContext(AuthContext)
   const location = useLocation()

waspc/data/Generator/templates/sdk/auth/forms/internal/email/useEmail.ts

@@ -1,6 +1,7 @@
 import { signup } from '../../../email/actions/signup'
 import { login } from '../../../email/actions/login'
 
+// PRIVATE API
 export function useEmail({
   onError,
   showEmailVerificationPending,

waspc/data/Generator/templates/sdk/auth/forms/internal/social/SocialButton.tsx

@@ -1,5 +1,6 @@
 import { styled } from 'wasp/core/stitches.config'
 
+// PRIVATE API
 export const SocialButton = styled('a', {
   display: 'flex',
   justifyContent: 'center',

waspc/data/Generator/templates/sdk/auth/forms/internal/social/SocialIcons.tsx

@@ -5,6 +5,7 @@ const defaultStyles = css({
   height: '1.25rem',
 })
 
+// PRIVATE API
 export const Google = () => (
   <svg
     className={defaultStyles()}
@@ -23,6 +24,7 @@ export const Google = () => (
   </svg>
 )
 
+// PRIVATE API
 export const GitHub = () => (
   <svg
     className={defaultStyles()}

waspc/data/Generator/templates/sdk/auth/forms/internal/usernameAndPassword/useUsernameAndPassword.ts

@@ -1,6 +1,7 @@
 import signup from '../../../signup'
 import login from '../../../login'
 
+// PRIVATE API
 export function useUsernameAndPassword({
   onError,
   onSuccess,

waspc/data/Generator/templates/sdk/auth/forms/types.ts

@@ -3,6 +3,7 @@ import { createTheme } from '@stitches/react'
 import { UseFormReturn, RegisterOptions } from 'react-hook-form'
 import type { LoginSignupFormFields } from './internal/common/LoginSignupForm'
 
+// PRIVATE API
 export enum State {
   Login = 'login',
   Signup = 'signup',
@@ -13,33 +14,39 @@ export enum State {
   {=/ isEmailAuthEnabled =}
 }
 
+// PUBLIC API
 export type CustomizationOptions = {
   logo?: string
   socialLayout?: 'horizontal' | 'vertical'
   appearance?: Parameters<typeof createTheme>[0]
 }
 
+// PRIVATE API
 export type ErrorMessage = {
   title: string
   description?: string
 }
 
+// PRIVATE API
 export type FormState = {
   isLoading: boolean
 }
 
+// PRIVATE API
 export type AdditionalSignupFieldRenderFn = (
   hookForm: UseFormReturn<LoginSignupFormFields>,
   formState: FormState
 ) => React.ReactNode
 
+// PRIVATE API
 export type AdditionalSignupField = {
   name: string
   label: string
   type: 'input' | 'textarea'
   validations?: RegisterOptions<LoginSignupFormFields>
 }
 
+// PRIVATE API
 export type AdditionalSignupFields =
   | (AdditionalSignupField | AdditionalSignupFieldRenderFn)[]
   | AdditionalSignupFieldRenderFn

waspc/data/Generator/templates/sdk/auth/helpers/Generic.tsx

@@ -4,8 +4,10 @@ import config from 'wasp/core/config'
 import { SocialButton } from '../forms/internal/social/SocialButton'
 import * as SocialIcons from '../forms/internal/social/SocialIcons'
 
+// PUBLIC API
 export const signInUrl = `${config.apiUrl}{= signInPath =}`
 
+// PUBLIC API
 export function SignInButton() {
   return (
     <SocialButton href={signInUrl}>