miolo 3.0.0-beta.203 → 3.0.0-beta.204

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "miolo",
-  "version": "3.0.0-beta.203",
+  "version": "3.0.0-beta.204",
   "description": "all-in-one koa-based server",
   "author": "Donato Lorenzo <donato@afialapis.com>",
   "contributors": [
@@ -47,7 +47,7 @@
     "@babel/plugin-proposal-decorators": "^7.29.0",
     "@babel/preset-env": "^7.29.5",
     "@babel/preset-react": "^7.28.5",
-    "@dotenvx/dotenvx": "^1.66.0",
+    "@dotenvx/dotenvx": "^1.67.0",
     "@koa/bodyparser": "^6.1.0",
     "@koa/cors": "^5.0.0",
     "@koa/router": "^15.5.0",
@@ -72,7 +72,7 @@
     "is-plain-object": "^5.0.0",
     "joi": "^18.2.1",
     "jwt-simple": "^0.5.6",
-    "koa": "^3.2.0",
+    "koa": "^3.2.1",
     "koa-compress": "^5.2.1",
     "koa-connect": "^2.1.1",
     "koa-favicon": "^2.1.0",
@@ -83,7 +83,7 @@
     "koa-session": "^7.0.2",
     "koa-static": "^5.0.0",
     "nanoid": "^5.1.11",
-    "nodemailer": "^8.0.7",
+    "nodemailer": "^8.0.8",
     "passport-google-oauth20": "^2.0.0",
     "passport-local": "^1.0.0",
     "rollup": "^4.60.4",
@@ -94,7 +94,7 @@
     "statuses": "^2.0.2",
     "tailwindcss": "^4.3.0",
     "tinguir": "^0.0.7",
-    "vite": "^8.0.13",
+    "vite": "^8.0.14",
     "winston": "^3.19.0",
     "winston-daily-rotate-file": "^5.0.0",
     "yargs-parser": "^22.0.0"

package/src/config/defaults.mjs

@@ -476,10 +476,13 @@ export default function make_config_defaults() {
 
     socket: {
       enabled: false,
+      // Auto create rooms based on sessions
+      // To be able to do like: app.context.miolo.io.to('user_<id>').emit('ns', newData);
+      userRooms: true,
       cli: {
         /**
-         domain: '',
-        options: {}
+         url: '',
+         options: {}
         */
       }
       /*

package/src/engines/socket/index.mjs

@@ -1,4 +1,3 @@
-//import IO from 'koa-socket-2'
 import { Server } from "socket.io"
 
 function init_socket(app, config) {
@@ -12,8 +11,44 @@ function init_socket(app, config) {
 
   const io = new Server(app.http.server)
 
+  if (config?.userRooms === true) {
+    io.use(async (socket, next) => {
+      try {
+        const { store, options } = app.context.miolo.session || {}
+        if (store && options) {
+          // Create a fake Koa context to easily parse the signed cookies
+          const ctx = app.createContext(
+            socket.request,
+            socket.request.res || { headersSent: false }
+          )
+
+          // Read the session cookie (Koa handles signature validation if options.signed is true)
+          const sessionCookieValue = ctx.cookies.get(options.key, options)
+
+          if (sessionCookieValue) {
+            // If the cookie is present, koa-session stores the external key directly
+            // or sometimes it's base64 encoded. koa-session's decode function:
+            const sessionId = sessionCookieValue
+
+            const session = await store.get(sessionId, undefined, {})
+
+            if (session?.user) {
+              const userId = session.user?.id
+              socket.join(`user_${userId}`)
+              socket.mioloUser = userId // Attach for convenience
+              logger.info(`[socket] Socket ${socket.id} joined room user_${userId}`)
+            }
+          }
+        }
+      } catch (err) {
+        logger.error(`[socket] Error parsing session: ${err.message}`)
+      }
+      next()
+    })
+  }
+
   io.on("connection", (socket) => {
-    logger.debug(`[socket] Connection from ... `) // ${i.ip} ${i.id}`)
+    logger.info(`[socket] Connection from ... `) // ${i.ip} ${i.id}`)
 
     if (config?.connection) {
       config.connection(socket)
@@ -24,42 +59,7 @@ function init_socket(app, config) {
     }
   })
 
-  //  const getInfo = (ctx) => {
-  //    let i= {id: '', ip: ''}
-  //    try {
-  //      i.id = ctx.socket.id
-  //    } catch (e) {}
-  //    try {
-  //      i.ip = ctx.socket.handshake.address
-  //    } catch (e) {}
-  //    return i
-  //  }
-
-  // const io = new IO({ origins: '*:*'})
-
-  //  io.on('connection', function (ctx, data) {
-  //    const logger = ctx.miolo.logger
-  //    const i= getInfo(ctx)
-  //    logger.warn(`[socket] Connection from ${i.ip} ${i.id}`)
-  //    if (config?.connection) {
-  //      config.connection(ctx, data)
-  //    }
-  //  })
-
-  //  io.on('disconnect', function (ctx, data) {
-  //    const logger = ctx.miolo.logger
-  //    const i = getInfo(ctx)
-  //    logger.warn(`[socket] Disconnected ${i.ip} ${i.id} => ${data}`)
-  //  })
-  //
-  //  io.on('error', function (ctx, data) {
-  //    const logger = ctx.miolo.logger
-  //    const i = getInfo(ctx)
-  //    logger.error(`[socket] Error on ${i.ip} ${i.id} => ${data}`)
-  //  })
-  //
-  //
-  //  io.attach(app)
+  app.context.miolo.io = io
 }
 
 export { init_socket }

package/src/middleware/auth/passport/session/index.mjs

@@ -18,6 +18,11 @@ function init_session_middleware(app, sessionConfig, cacheConfig) {
     ...(sessionConfig.options || {})
   }
 
+  app.context.miolo.session = {
+    store,
+    options
+  }
+
   app.use(createSession(options, app))
 
   app.use(async (ctx, next) => {

package/src/middleware/ssr/ssr_render.mjs

@@ -6,7 +6,7 @@ export async function init_ssr_render_middleware(app, config, devRender = undefi
   const ssrConfig = config.build.ssr
   const httpConfig = config.http
   const authConfig = config?.auth || {}
-  // const socketConfig = config?.socket || {}
+  const socketConfig = config?.socket || {}
 
   const ssr_build_context = ssr_context_builder_make(app, ssrConfig)
   const ssr_loader = ssr_loader_make(app, ssrConfig)
@@ -32,11 +32,12 @@ export async function init_ssr_render_middleware(app, config, devRender = undefi
         logout_url:
           ctx.session?.auth_method === "google"
             ? authConfig?.passport?.google_url_logout
-            : authConfig?.passport?.local_url_logout
-        //socket: {
-        //  enabled: socketConfig?.enabled===true,
-        //  config: socketConfig?.config?.cli || {}
-        //}
+            : authConfig?.passport?.local_url_logout,
+        socket: {
+          enabled: socketConfig?.enabled === true,
+          url: socketConfig?.config?.cli?.url || null,
+          options: socketConfig?.config?.cli?.options || {}
+        }
       }
       ctx.miolo.logger.debug(
         `[render-ssr] rendering an ${ctx?.session?.authenticated === true ? "authenticated" : "unauthenticated"} context...`

package/src/server.mjs

@@ -1,8 +1,8 @@
 import Koa from "koa"
 import { init_config } from "./config/index.mjs"
-//import {init_socket}                      from './engines/socket/index.mjs'
 import { init_cron } from "./engines/cron/index.mjs"
 import { init_http_server } from "./engines/http/index.mjs"
+import { init_socket } from "./engines/socket/index.mjs"
 import { init_basic_auth_middleware } from "./middleware/auth/basic.mjs"
 import { init_guest_auth_middleware } from "./middleware/auth/guest.mjs"
 import { init_passport_auth_middleware } from "./middleware/auth/passport/index.mjs"
@@ -102,6 +102,9 @@ async function miolo(makeConfig, devInit = undefined, devRender = undefined) {
     }
 
     await app.http.start()
+    if (app.context.miolo?.io) {
+      app.context.miolo.io.attach(app.http.server)
+    }
     await app.cron.start()
   }
 
@@ -124,7 +127,7 @@ async function miolo(makeConfig, devInit = undefined, devRender = undefined) {
   }
 
   // Socket.io
-  // init_socket(app, config?.socket)
+  init_socket(app, config?.socket)
 
   return app
 }

package/template/package.json

@@ -45,9 +45,9 @@
     "intre": "^3.0.0-beta.4",
     "joi": "^18.2.1",
     "lucide-react": "^1.16.0",
-    "miolo-cli": "^3.0.0-beta.203",
+    "miolo-cli": "^3.0.0-beta.204",
     "miolo-model": "file:../miolo-model",
-    "miolo-react": "^3.0.0-beta.203",
+    "miolo-react": "^3.0.0-beta.204",
     "next-themes": "^0.4.6",
     "radix-ui": "^1.4.3",
     "react": "^19.2.6",
@@ -62,8 +62,8 @@
   },
   "devDependencies": {
     "@biomejs/biome": "2.4.15",
-    "miolo": "^3.0.0-beta.203",
-    "sass-embedded": "^1.99.0"
+    "miolo": "^3.0.0-beta.204",
+    "sass-embedded": "^1.100.0"
   },
   "overrides": {
     "@babel/runtime": "^7.28.6",

package/template/src/cli/pages/todos/TodoActions.jsx

@@ -1,4 +1,4 @@
-import { Bomb, Bone, CircleQuestionMark, RefreshCw } from "lucide-react"
+import { Bomb, Bone, CircleQuestionMark, Phone, RefreshCw } from "lucide-react"
 import { useState } from "react"
 import { Field, FieldContent, FieldLabel } from "#cli/components/ui/field.jsx"
 import { Button } from "#cli/components/ui/patched/button.jsx"
@@ -12,8 +12,15 @@ const throwAnError = () => {
 }
 
 export default function TodoActions() {
-  const { refreshTodoList, checkLastHours, insertFakeTodo, canEdit, useCrud, setUseCrud } =
-    useTodosContext()
+  const {
+    refreshTodoList,
+    checkLastHours,
+    insertFakeTodo,
+    canEdit,
+    useCrud,
+    setUseCrud,
+    pingSocket
+  } = useTodosContext()
   const [hours, _setHours] = useState(1)
 
   return (
@@ -51,6 +58,15 @@ export default function TodoActions() {
           <Bomb size={18} />
           {`Throw an JS error`}
         </Button>
+
+        <Button
+          onClick={() => pingSocket()}
+          disabled={!canEdit}
+          className={`px-4 py-6  text-white rounded-lg transition-colors flex items-center gap-2 cursor-pointer ${useCrud ? "bg-pink-500 hover:bg-pink-400" : "bg-blue-500 hover:bg-blue-400"}`}
+        >
+          <Phone size={18} />
+          Ping through socket
+        </Button>
       </div>
 
       <h1 className="text-3xl font-bold text-center mt-8 mb-8 text-gray-800 dark:text-white">

package/template/src/cli/pages/todos/context/TodosProvider.jsx

@@ -1,4 +1,4 @@
-import { useCallback, useState } from "react"
+import { useCallback, useEffect, useState } from "react"
 import useSessionContext from "#cli/context/session/useSessionContext.mjs"
 import useUIContext from "#cli/context/ui/useUIContext.mjs"
 import TodoList from "#ns/models/TodoList.mjs"
@@ -6,9 +6,10 @@ import TodosContext from "./TodosContext.jsx"
 
 const TodosProvider = ({ children }) => {
   // const [status, setStatus] = useState("loaded")
-  const { useSsrData, fetcher, authenticated } = useSessionContext()
+  const { useSsrData, fetcher, socket, authenticated } = useSessionContext()
   const { toast } = useUIContext()
   const [useCrud, setUseCrud] = useState(true)
+  const [socketInited, setSocketInited] = useState(false)
 
   const {
     data: todoList,
@@ -132,6 +133,34 @@ const TodosProvider = ({ children }) => {
     refreshTodoList()
   }, [fetcher, refreshTodoList, toast])
 
+  const pingSocket = useCallback(() => {
+    if (!socket) {
+      toast.error("Socket not initialized")
+      return
+    }
+    socket.emit("ping", { timestamp: new Date().toISOString() })
+  }, [socket, toast])
+
+  useEffect(() => {
+    if (socket === undefined) {
+      return
+    }
+
+    if (socketInited) {
+      return
+    }
+    setSocketInited(true)
+
+    socket.on("connect", () => {
+      console.log("Connected to server!")
+    })
+
+    socket.on("todos-update", (data) => {
+      console.log("TODOS UPDATED!!!")
+      console.log(data)
+    })
+  }, [socket, socketInited])
+
   return (
     <TodosContext.Provider
       value={{
@@ -146,7 +175,8 @@ const TodosProvider = ({ children }) => {
         insertFakeTodo,
         canEdit: authenticated,
         useCrud,
-        setUseCrud
+        setUseCrud,
+        pingSocket
       }}
     >
       {children}

package/template/src/server/miolo/index.mjs

@@ -19,6 +19,25 @@ export default () => {
     build: {
       ssr: { loader }
     },
-    cron: init_cron()
+    cron: init_cron(),
+    socket: {
+      enabled: true,
+      namespaces: [
+        {
+          name: "todos-update",
+          listener: (data) => {
+            console.log("TODOS UPDATED!!!")
+            console.log(data)
+          }
+        },
+        {
+          name: "ping",
+          listener: (data) => {
+            console.log("PING!!!")
+            console.log(data)
+          }
+        }
+      ]
+    }
   }
 }