Adds support for client subdir (#1516)

waspc/ChangeLog.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 0.11.8
+
+### 🎉 [New Feature] Serving the Client From a Subdirectory
+
+You can now serve the client from a subdirectory. This is useful if you want to serve the client from a subdirectory of your domain, e.g. `https://example.com/my-app/`.
+
+To do this, you need to add the `client.baseDir` property to your `.wasp` file:
+
+```wasp
+app todoApp {
+  // ...
+  client: {
+    baseDir: "/my-app",
+  },
+}
+```
+
 ## 0.11.7
 
 ### 🐞 Bug fixes / 🔧 small improvements

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

@@ -47,7 +47,7 @@ export const routes = {
 export type Routes = RouteDefinitionsToRoutes<typeof routes>
 
 const router = (
-  <Router>
+  <Router basename="{= baseDir =}">
     {=# rootComponent.isDefined =}
     <{= rootComponent.importIdentifier =}>
     {=/ rootComponent.isDefined =}

waspc/data/Generator/templates/react-app/vite.config.ts

@@ -12,9 +12,10 @@ const _waspUserProvidedConfig = {};
 {=/ customViteConfig.isDefined =}
 
 const defaultViteConfig = {
+  base: "{= baseDir =}",
   plugins: [react()],
   server: {
-    port: 3000,
+    port: {= defaultClientPort =},
     host: "0.0.0.0",
     open: true,
   },

waspc/data/Generator/templates/server/src/config.js

@@ -32,7 +32,7 @@ const resolvedConfig = merge(config.all, config[env])
 export default resolvedConfig
 
 function getDevelopmentConfig() {
-  const frontendUrl = stripTrailingSlash(process.env.WASP_WEB_CLIENT_URL) || 'http://localhost:3000';
+  const frontendUrl = stripTrailingSlash(process.env.WASP_WEB_CLIENT_URL || '{= defaultClientUrl =}');
   return {
     frontendUrl,
     allowedCORSOrigins: '*',

waspc/src/Wasp/AppSpec/App/Client.hs

@@ -10,6 +10,8 @@ import Wasp.AppSpec.ExtImport (ExtImport)
 
 data Client = Client
   { setupFn :: Maybe ExtImport,
-    rootComponent :: Maybe ExtImport
+    rootComponent :: Maybe ExtImport,
+    -- We expect the base dir to start with a slash e.g. /client
+    baseDir :: Maybe String
   }
   deriving (Show, Eq, Data)

waspc/src/Wasp/AppSpec/Valid.hs

@@ -23,6 +23,7 @@ import Wasp.AppSpec.App (App)
 import qualified Wasp.AppSpec.App as AS.App
 import qualified Wasp.AppSpec.App as App
 import qualified Wasp.AppSpec.App.Auth as Auth
+import qualified Wasp.AppSpec.App.Client as Client
 import qualified Wasp.AppSpec.App.Db as AS.Db
 import qualified Wasp.AppSpec.App.Wasp as Wasp
 import Wasp.AppSpec.Core.Decl (takeDecls)
@@ -61,7 +62,8 @@ validateAppSpec spec =
           validateApiRoutesAreUnique spec,
           validateApiNamespacePathsAreUnique spec,
           validateCrudOperations spec,
-          validatePrismaOptions spec
+          validatePrismaOptions spec,
+          validateWebAppBaseDir spec
         ]
 
 validateExactlyOneAppExists :: AppSpec -> Maybe ValidationError
@@ -364,6 +366,19 @@ validatePrismaOptions spec =
     prismaClientPreviewFeatures = AS.Db.clientPreviewFeatures =<< prismaOptions
     prismaDbExtensions = AS.Db.dbExtensions =<< prismaOptions
 
+validateWebAppBaseDir :: AppSpec -> [ValidationError]
+validateWebAppBaseDir spec = case maybeBaseDir of
+  Just baseDir
+    | not (startsWithSlash baseDir) ->
+        [GenericValidationError "The app.client.baseDir should start with a slash e.g. \"/test\""]
+  _anyOtherCase -> []
+  where
+    maybeBaseDir = Client.baseDir =<< AS.App.client (snd $ getApp spec)
+
+    startsWithSlash :: String -> Bool
+    startsWithSlash ('/' : _) = True
+    startsWithSlash _ = False
+
 -- | This function assumes that @AppSpec@ it operates on was validated beforehand (with @validateAppSpec@ function).
 -- TODO: It would be great if we could ensure this at type level, but we decided that was too much work for now.
 --   Check https://github.com/wasp-lang/wasp/pull/455 for considerations on this and analysis of different approaches.

waspc/src/Wasp/Generator/ServerGenerator/ConfigG.hs

@@ -1,6 +1,5 @@
 module Wasp.Generator.ServerGenerator.ConfigG
   ( genConfigFile,
-    configFileInSrcDir,
   )
 where
 
@@ -12,6 +11,7 @@ import Wasp.AppSpec.Valid (isAuthEnabled)
 import Wasp.Generator.FileDraft (FileDraft)
 import Wasp.Generator.Monad (Generator)
 import qualified Wasp.Generator.ServerGenerator.Common as C
+import qualified Wasp.Generator.WebAppGenerator.Common as WebApp
 import Wasp.Project.Db (databaseUrlEnvVarName)
 
 genConfigFile :: AppSpec -> Generator FileDraft
@@ -22,7 +22,8 @@ genConfigFile spec = return $ C.mkTmplFdWithDstAndData tmplFile dstFile (Just tm
     tmplData =
       object
         [ "isAuthEnabled" .= isAuthEnabled spec,
-          "databaseUrlEnvVarName" .= databaseUrlEnvVarName
+          "databaseUrlEnvVarName" .= databaseUrlEnvVarName,
+          "defaultClientUrl" .= WebApp.getDefaultClientUrl spec
         ]
 
 configFileInSrcDir :: Path' (Rel C.ServerSrcDir) File'