Merge branch 'main' into homepage-typo

Author: SaltyAom

docs/.vitepress/config.ts

@@ -128,6 +128,10 @@ export default defineConfig({
                         text: 'Derive',
                         link: '/concept/derive'
                     },
+                    {
+                        text: 'Plugin',
+                        link: '/concept/plugin'
+                    },
                     {
                         text: 'Group',
                         link: '/concept/group'
@@ -152,10 +156,6 @@ export default defineConfig({
                         text: 'Config',
                         link: '/concept/config'
                     },
-                    {
-                        text: 'Plugin',
-                        link: '/concept/plugin'
-                    },
                     {
                         text: 'Explicit Body',
                         link: '/concept/explicit-body'

docs/concept/plugin.md

@@ -74,9 +74,9 @@ You can customize plugin by creating function to return callback which accepts E
 ```typescript
 import { Elysia } from 'elysia'
 
-const plugin = ({
+const plugin = <const Prefix>({
     prefix = '/v1'
-}) => (app: Elysia) => app
+}: { prefix: Prefix }) => new Elysia({ prefix })
     .get(`/${prefix}/hi`, () => 'Hi')
 
 const app = new Elysia()

docs/patterns/dependency-injection.md

@@ -27,7 +27,7 @@ const app = new Elysia()
     // and so on...
 
 // routes/authen.ts
-const authen = (app: Elysia) => app
+const authen = new Elysia()
     .post('/sign-in', signIn)
     .post('/sign-up', signUp)
 ```
@@ -43,7 +43,7 @@ const app = new Elysia()
     // and so on...
 
 // routes/authen.ts
-const authen = (app: Elysia) => app
+const authen = new Elysia()
     .post('/sign-in', signIn)
     .post('/sign-up', signUp)
     // But then there is no type
@@ -56,7 +56,7 @@ const authen = (app: Elysia) => app
 
 If you hovered over the main `app` in `index.ts`, you can see that it has some type auto-generated for your main server which might look something like this:
 ```typescript
-const app: Elysia<{
+const app: Elysia<'', {
     store: {
         redis: Redis;
      };
@@ -72,12 +72,12 @@ But this type isn't applied to sub-modules.
 To apply the type to sub-modules, you can create a plugin which only contains `state` and `decorate` which caused **type side-effect** as dependency, and apply to the module you want to use.
 
 ```typescript
-const setup = (app: Elysia) => app
+const setup = new Elysia({ name: 'setup' })
     .decorate('signOut', signOut)
     .state('redis', redis)
 
 // routes/authen.ts
-const authen = (app: Elysia) => app
+const authen = new Elysia()
     .use(setup)
     .post('/sign-in', signIn)
     .post('/sign-up', signUp)

docs/patterns/reference-models.md

@@ -84,14 +84,13 @@ Now when we need to quickly access the model's group, we can separate a `setMode
 // auth.model.ts
 import { Elysia } from 'elysia'
 
-export const authModel = (app: Elysia) => 
-    app
-        .model({
-            sign: t.Object({
-                username: t.String(),
-                password: t.String()
-            })
+export const authModel = new Elysia()
+    .model({
+        sign: t.Object({
+            username: t.String(),
+            password: t.String()
         })
+    })
 
 // index.ts
 import { Elysia } from 'elysia'
@@ -113,15 +112,14 @@ const app = new Elysia()
 // auth.model.ts
 import { Elysia } from 'elysia'
 
-export const authModel = (app: Elysia) => 
-    app
-        .model({
-            sign: t.Object({
-                username: t.String(),
-                password: t.String()
-            }),
-            number: t.Number()
-        })
+export const authModel = new Elysia()
+    .model({
+        sign: t.Object({
+            username: t.String(),
+            password: t.String()
+        }),
+        number: t.Number()
+    })
 ```
 
 ## Naming Convention
@@ -133,24 +131,22 @@ Let's say that you have all models stored at `models/<name>.ts`, you can declare
 
 ```typescript
 // admin.model.ts
-export const authModel = (app: Elysia) => 
-    app
-        .model({
-            'admin.auth': t.Object({
-                username: t.String(),
-                password: t.String()
-            })
+export const authModel = new Elysia()
+    .model({
+        'admin.auth': t.Object({
+            username: t.String(),
+            password: t.String()
         })
+    })
 
 // user.model.ts
-export const authModel = (app: Elysia) => 
-    app
-        .model({
-            'user.auth': t.Object({
-                username: t.String(),
-                password: t.String()
-            })
+export const authModel = new Elysia()
+    .model({
+        'user.auth': t.Object({
+            username: t.String(),
+            password: t.String()
         })
+    })
 ```
 
 This can prevent naming duplication at some level, but in the end, it's best to let the naming convention decision up to your team's agreement is the best option.