@owlmeans/client-socket 0.1.2 → 0.1.4

package/README.md

@@ -1,582 +1,62 @@
 # @owlmeans/client-socket
 
-The **@owlmeans/client-socket** package provides client-side WebSocket integration for OwlMeans Common Libraries, enabling real-time communication between React frontend applications and backend services through WebSocket connections.
+React hook and factory for WebSocket connections via OwlMeans module routing.
 
-## Purpose
+## Overview
 
-This package serves as the client-side WebSocket implementation, specifically designed for:
-
-- **React WebSocket Integration**: Seamless WebSocket connections in React applications
-- **Module-based Socket Management**: Integration with the OwlMeans module system for WebSocket endpoints
-- **Connection Lifecycle Management**: Automatic connection establishment, maintenance, and cleanup
-- **Authentication Integration**: Built-in authentication support for secure WebSocket connections
-- **Real-time Communication**: Enable real-time features like chat, notifications, and live updates
-- **TypeScript Support**: Full TypeScript support with proper type safety
-
-## Key Concepts
-
-### Client-side WebSocket Management
-This package provides client-side WebSocket functionality that integrates with the OwlMeans module system, allowing WebSocket connections to be defined as modules.
-
-### Connection Abstraction
-Wraps native WebSocket connections in a unified `Connection` interface that provides consistent API for message handling, authentication, and lifecycle management.
-
-### React Integration
-Provides React hooks for managing WebSocket connections with automatic cleanup and re-connection logic.
-
-### Module-driven Connections
-WebSocket endpoints are defined as modules, ensuring consistent URL generation and authentication handling across the application.
+- `ws(module, request?)` — creates a `Connection` by resolving the module URL and opening a WebSocket
+- `useWs(module, request?)` — React hook wrapping `ws()` with lifecycle management
+- The returned `Connection` implements `@owlmeans/socket`'s `Connection` interface
 
 ## Installation
 
 ```bash
-npm install @owlmeans/client-socket
-```
-
-## API Reference
-
-### Types
-
-#### `Config`
-Configuration interface extending ClientConfig.
-
-```typescript
-interface Config extends ClientConfig { }
-```
-
-#### `Context<C extends Config = Config>`
-Context interface for client applications with socket support.
-
-```typescript
-interface Context<C extends Config = Config> extends ClientContext<C> { }
-```
-
-### Core Functions
-
-#### `ws(module: ClientModule<string>, request?: AbstractRequest<{ token?: string }>): Promise<Connection>`
-
-Creates a WebSocket connection using a client module.
-
-**Parameters:**
-- `module`: Client module that defines the WebSocket endpoint
-- `request`: Optional request object with authentication token
-
-**Returns:** Promise that resolves to a Connection instance
-
-```typescript
-import { ws } from '@owlmeans/client-socket'
-
-const socketModule = context.module<ClientModule>('chat-socket')
-const connection = await ws(socketModule, {
-  query: { token: authToken }
-})
-```
-
-### React Hooks
-
-#### `useWs(module: string | ClientModule<any>, request?: Partial<AbstractRequest<any>>): Connection | null`
-
-React hook for managing WebSocket connections with automatic lifecycle management.
-
-**Parameters:**
-- `module`: Module alias or ClientModule instance
-- `request`: Optional request parameters
-
-**Returns:** Connection instance or null if not connected
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-
-function ChatComponent() {
-  const connection = useWs('chat-socket', {
-    query: { room: 'general' }
-  })
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('message', handleMessage)
-    }
-  }, [connection])
-  
-  return <div>Chat interface</div>
-}
-```
-
-### Utility Functions
-
-#### `makeConnection<C extends Config = Config, T extends Context<C> = Context<C>>(conn: WebSocket, context: T): Connection`
-
-Creates a Connection wrapper around a native WebSocket instance.
-
-**Parameters:**
-- `conn`: Native WebSocket instance
-- `context`: Application context
-
-**Returns:** Connection wrapper with enhanced functionality
-
-## Usage Examples
-
-### Basic WebSocket Connection
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useContext } from '@owlmeans/client'
-import { useEffect, useState } from 'react'
-
-function WebSocketExample() {
-  const [messages, setMessages] = useState<string[]>([])
-  const connection = useWs('websocket-endpoint')
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('message', (message) => {
-        setMessages(prev => [...prev, message.payload])
-      })
-      
-      // Send a message
-      connection.send({ 
-        type: 'text',
-        payload: 'Hello WebSocket!'
-      })
-    }
-  }, [connection])
-  
-  return (
-    <div>
-      <h3>Messages:</h3>
-      {messages.map((msg, idx) => (
-        <div key={idx}>{msg}</div>
-      ))}
-    </div>
-  )
-}
-```
-
-### Authenticated WebSocket Connection
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useAuth } from '@owlmeans/client-auth'
-import { useEffect } from 'react'
-
-function AuthenticatedSocket() {
-  const auth = useAuth()
-  const connection = useWs('secure-socket', {
-    query: { 
-      token: auth.getToken() 
-    }
-  })
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('authenticated', () => {
-        console.log('Socket authenticated successfully')
-      })
-      
-      connection.on('auth-error', (error) => {
-        console.error('Socket authentication failed:', error)
-      })
-    }
-  }, [connection])
-  
-  return <div>Authenticated WebSocket connection</div>
-}
+bun add @owlmeans/client-socket
 ```
 
-### Chat Application
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useState, useEffect } from 'react'
+## Usage
 
-interface ChatMessage {
-  id: string
-  user: string
-  message: string
-  timestamp: number
-}
-
-function ChatRoom({ roomId }: { roomId: string }) {
-  const [messages, setMessages] = useState<ChatMessage[]>([])
-  const [inputMessage, setInputMessage] = useState('')
-  
-  const connection = useWs('chat-socket', {
-    query: { room: roomId }
-  })
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('chat-message', (event) => {
-        const message: ChatMessage = event.payload
-        setMessages(prev => [...prev, message])
-      })
-      
-      connection.on('user-joined', (event) => {
-        console.log(`${event.payload.user} joined the room`)
-      })
-      
-      connection.on('user-left', (event) => {
-        console.log(`${event.payload.user} left the room`)
-      })
-    }
-  }, [connection, roomId])
-  
-  const sendMessage = () => {
-    if (connection && inputMessage.trim()) {
-      connection.send({
-        type: 'chat-message',
-        payload: {
-          message: inputMessage,
-          room: roomId
-        }
-      })
-      setInputMessage('')
-    }
-  }
-  
-  return (
-    <div>
-      <div className="messages">
-        {messages.map(msg => (
-          <div key={msg.id}>
-            <strong>{msg.user}:</strong> {msg.message}
-          </div>
-        ))}
-      </div>
-      <div className="input">
-        <input
-          value={inputMessage}
-          onChange={(e) => setInputMessage(e.target.value)}
-          onKeyPress={(e) => e.key === 'Enter' && sendMessage()}
-        />
-        <button onClick={sendMessage}>Send</button>
-      </div>
-    </div>
-  )
-}
-```
-
-### Real-time Notifications
+Connect to a WebSocket module and observe events:
 
 ```typescript
 import { useWs } from '@owlmeans/client-socket'
-import { useEffect, useState } from 'react'
+import { MessageType } from '@owlmeans/socket'
 
-interface Notification {
-  id: string
-  type: 'info' | 'warning' | 'error' | 'success'
-  title: string
-  message: string
-}
+function ThinkingPanel({ storyId }: { storyId: string }) {
+  const conn = useWs('story-thinking', { params: { id: storyId } })
 
-function NotificationSystem() {
-  const [notifications, setNotifications] = useState<Notification[]>([])
-  const connection = useWs('notification-socket')
-  
   useEffect(() => {
-    if (connection) {
-      connection.on('notification', (event) => {
-        const notification: Notification = event.payload
-        setNotifications(prev => [notification, ...prev])
-        
-        // Auto-remove after 5 seconds
-        setTimeout(() => {
-          setNotifications(prev => 
-            prev.filter(n => n.id !== notification.id)
-          )
-        }, 5000)
-      })
-      
-      connection.on('notification-clear', (event) => {
-        const { notificationId } = event.payload
-        setNotifications(prev => 
-          prev.filter(n => n.id !== notificationId)
-        )
-      })
-    }
-  }, [connection])
-  
-  return (
-    <div className="notification-container">
-      {notifications.map(notification => (
-        <div key={notification.id} className={`notification ${notification.type}`}>
-          <h4>{notification.title}</h4>
-          <p>{notification.message}</p>
-        </div>
-      ))}
-    </div>
-  )
+    if (!conn) return
+    const unsubscribe = conn.observe<ThinkingEvent>('thinking-update', async (event) => {
+      dispatch({ type: 'update', payload: event.payload })
+    })
+    return unsubscribe
+  }, [conn])
 }
 ```
 
-### Live Data Updates
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useState, useEffect } from 'react'
-
-interface LiveData {
-  timestamp: number
-  value: number
-  status: string
-}
-
-function LiveDataDashboard() {
-  const [data, setData] = useState<LiveData[]>([])
-  const connection = useWs('live-data-socket')
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('data-update', (event) => {
-        const newData: LiveData = event.payload
-        setData(prev => {
-          const updated = [newData, ...prev.slice(0, 99)] // Keep last 100 entries
-          return updated
-        })
-      })
-      
-      // Request initial data
-      connection.send({
-        type: 'request-initial-data',
-        payload: {}
-      })
-    }
-  }, [connection])
-  
-  return (
-    <div>
-      <h2>Live Data Stream</h2>
-      <div className="data-grid">
-        {data.map((item, idx) => (
-          <div key={idx} className="data-item">
-            <span>Value: {item.value}</span>
-            <span>Status: {item.status}</span>
-            <span>Time: {new Date(item.timestamp).toLocaleTimeString()}</span>
-          </div>
-        ))}
-      </div>
-    </div>
-  )
-}
-```
-
-### Connection Status Management
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useState, useEffect } from 'react'
-
-function ConnectionStatusProvider({ children }: { children: React.ReactNode }) {
-  const [isConnected, setIsConnected] = useState(false)
-  const [connectionError, setConnectionError] = useState<string | null>(null)
-  const connection = useWs('main-socket')
-  
-  useEffect(() => {
-    if (connection) {
-      setIsConnected(true)
-      setConnectionError(null)
-      
-      connection.on('close', () => {
-        setIsConnected(false)
-        setConnectionError('Connection lost')
-      })
-      
-      connection.on('error', (event) => {
-        setConnectionError(event.payload.message)
-      })
-    } else {
-      setIsConnected(false)
-    }
-  }, [connection])
-  
-  return (
-    <div>
-      <div className={`connection-status ${isConnected ? 'connected' : 'disconnected'}`}>
-        {isConnected ? 'Connected' : 'Disconnected'}
-        {connectionError && <span>: {connectionError}</span>}
-      </div>
-      {children}
-    </div>
-  )
-}
-```
-
-### Manual Connection Management
+Direct connection (non-hook):
 
 ```typescript
 import { ws } from '@owlmeans/client-socket'
-import { useContext } from '@owlmeans/client'
-import { useEffect, useState } from 'react'
-
-function ManualConnectionComponent() {
-  const context = useContext()
-  const [connection, setConnection] = useState<Connection | null>(null)
-  const [status, setStatus] = useState<'disconnected' | 'connecting' | 'connected'>('disconnected')
-  
-  const connect = async () => {
-    try {
-      setStatus('connecting')
-      const socketModule = context.module<ClientModule>('manual-socket')
-      const conn = await ws(socketModule)
-      
-      conn.on('close', () => {
-        setStatus('disconnected')
-        setConnection(null)
-      })
-      
-      setConnection(conn)
-      setStatus('connected')
-    } catch (error) {
-      console.error('Connection failed:', error)
-      setStatus('disconnected')
-    }
-  }
-  
-  const disconnect = async () => {
-    if (connection) {
-      await connection.close()
-      setConnection(null)
-      setStatus('disconnected')
-    }
-  }
-  
-  useEffect(() => {
-    return () => {
-      if (connection) {
-        connection.close()
-      }
-    }
-  }, [])
-  
-  return (
-    <div>
-      <div>Status: {status}</div>
-      <button onClick={connect} disabled={status !== 'disconnected'}>
-        Connect
-      </button>
-      <button onClick={disconnect} disabled={status === 'disconnected'}>
-        Disconnect
-      </button>
-    </div>
-  )
-}
-```
-
-## Error Handling
-
-```typescript
-import { useWs } from '@owlmeans/client-socket'
-import { useEffect, useState } from 'react'
-
-function ErrorHandlingExample() {
-  const [error, setError] = useState<string | null>(null)
-  const connection = useWs('error-prone-socket')
-  
-  useEffect(() => {
-    if (connection) {
-      connection.on('error', (event) => {
-        setError(event.payload.message || 'Unknown error occurred')
-      })
-      
-      connection.on('close', (event) => {
-        if (event.payload.code !== 1000) { // Not a normal closure
-          setError(`Connection closed unexpectedly (Code: ${event.payload.code})`)
-        }
-      })
-      
-      // Clear error when reconnected
-      connection.on('open', () => {
-        setError(null)
-      })
-    }
-  }, [connection])
-  
-  return (
-    <div>
-      {error && (
-        <div className="error-message">
-          Error: {error}
-        </div>
-      )}
-      <div>
-        Connection Status: {connection ? 'Connected' : 'Disconnected'}
-      </div>
-    </div>
-  )
-}
-```
+import type { ClientModule } from '@owlmeans/client-module'
 
-## Integration Patterns
-
-### Module Definition
-
-```typescript
-// Define WebSocket module in your module configuration
-import { module } from '@owlmeans/client-module'
-import { route } from '@owlmeans/route'
-
-const chatSocketModule = module(
-  route('chat-socket', '/ws/chat'),
-  guard('authenticated')
-)
-
-// Register the module with your context
-context.registerModule(chatSocketModule)
+const wsModule = context.module<ClientModule<string>>('story-thinking')
+const connection = await ws(wsModule, { params: { id: storyId } })
 ```
 
-### Context Provider Pattern
-
-```typescript
-import React, { createContext, useContext as useReactContext } from 'react'
-import { Connection } from '@owlmeans/socket'
-import { useWs } from '@owlmeans/client-socket'
-
-const SocketContext = createContext<Connection | null>(null)
-
-export function SocketProvider({ children }: { children: React.ReactNode }) {
-  const connection = useWs('global-socket')
-  
-  return (
-    <SocketContext.Provider value={connection}>
-      {children}
-    </SocketContext.Provider>
-  )
-}
-
-export function useGlobalSocket() {
-  const connection = useReactContext(SocketContext)
-  if (!connection) {
-    throw new Error('useGlobalSocket must be used within SocketProvider')
-  }
-  return connection
-}
-```
+## API
 
-## Best Practices
+### `ws(module, request?): Promise<Connection>`
 
-1. **Connection Management**: Always handle connection lifecycle properly with cleanup
-2. **Error Handling**: Implement comprehensive error handling for network issues
-3. **Reconnection Logic**: Consider implementing automatic reconnection for critical connections
-4. **Message Validation**: Validate incoming messages to ensure data integrity
-5. **Performance**: Avoid creating too many simultaneous WebSocket connections
-6. **Authentication**: Securely handle authentication tokens in WebSocket connections
-7. **Memory Leaks**: Ensure proper cleanup of event listeners and connections
+Resolves the module URL, opens a WebSocket, and returns a `Connection` once the socket opens.
 
-## Dependencies
+### `useWs(module, request?): Connection | null`
 
-This package depends on:
-- `@owlmeans/auth` - Authentication framework
-- `@owlmeans/client` - Client framework
-- `@owlmeans/client-context` - Client context management
-- `@owlmeans/client-module` - Client module system
-- `@owlmeans/context` - Context management
-- `@owlmeans/module` - Module system
-- `@owlmeans/socket` - Core socket functionality
-- `react` - React framework
+React hook version of `ws()`. Returns `null` while connecting. Manages connection lifecycle (opens on mount, closes on unmount).
 
 ## Related Packages
 
-- [`@owlmeans/socket`](../socket) - Core socket functionality
-- [`@owlmeans/server-socket`](../server-socket) - Server-side WebSocket implementation
-- [`@owlmeans/client`](../client) - Client framework
-- [`@owlmeans/client-module`](../client-module) - Client module system
+- [`@owlmeans/socket`](../socket) — `Connection` interface with `notify`, `observe`, `call` methods
+- [`@owlmeans/server-socket`](../server-socket) — server-side connection handler
+- [`@owlmeans/client-module`](../client-module) — `ClientModule` passed to `ws()`

package/build/helper.d.ts

@@ -1,8 +1,8 @@
-import type { ClientModule } from '@owlmeans/client-module';
-import type { AbstractRequest } from '@owlmeans/module';
+import type { ClientEntrypoint } from '@owlmeans/client-entrypoint';
+import type { AbstractRequest } from '@owlmeans/entrypoint';
 import type { Connection } from '@owlmeans/socket';
-export declare const ws: (module: ClientModule<string>, request?: AbstractRequest<{
+export declare const ws: (module: ClientEntrypoint<string>, request?: AbstractRequest<{
     token?: string;
 }>) => Promise<Connection>;
-export declare const useWs: (module: string | ClientModule<any>, request?: Partial<AbstractRequest<any>>) => Connection | null;
+export declare const useWs: (module: string | ClientEntrypoint<any>, request?: Partial<AbstractRequest<any>>) => Connection | null;
 //# sourceMappingURL=helper.d.ts.map

package/build/helper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../src/helper.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAA;AAC3D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAGvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAUlD,eAAO,MAAM,EAAE,GAAU,QAAQ,YAAY,CAAC,MAAM,CAAC,EAAE,UAAU,eAAe,CAAC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,KAAG,OAAO,CAAC,UAAU,CAexH,CAAA;AAED,eAAO,MAAM,KAAK,GAAI,QAAQ,MAAM,GAAG,YAAY,CAAC,GAAG,CAAC,EAAE,UAAU,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,KAAG,UAAU,GAAG,IAyBhH,CAAA"}
+{"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../src/helper.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAA;AACnE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAA;AAG3D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAUlD,eAAO,MAAM,EAAE,GAAU,QAAQ,gBAAgB,CAAC,MAAM,CAAC,EAAE,UAAU,eAAe,CAAC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,KAAG,OAAO,CAAC,UAAU,CA0B5H,CAAA;AAED,eAAO,MAAM,KAAK,GAAI,QAAQ,MAAM,GAAG,gBAAgB,CAAC,GAAG,CAAC,EAAE,UAAU,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,KAAG,UAAU,GAAG,IAyBpH,CAAA"}

package/build/helper.js

@@ -1,29 +1,38 @@
-import { provideRequest } from '@owlmeans/client-module';
-import { ModuleOutcome } from '@owlmeans/module';
+import { provideRequest } from '@owlmeans/client-entrypoint';
+import { EntrypointOutcome } from '@owlmeans/entrypoint';
 import { SocketInitializationError } from '@owlmeans/socket';
 import { makeConnection } from './utils/connection.js';
 import { assertContext } from '@owlmeans/context';
 import { useContext, useValue } from '@owlmeans/client';
 import { AUTH_QUERY } from '@owlmeans/auth';
-import { urlCall } from '@owlmeans/client-module/utils';
+import { urlCall } from '@owlmeans/client-entrypoint/utils';
 import { useEffect, useMemo } from 'react';
 export const ws = async (module, request) => {
     const ctx = assertContext(module.ctx, 'client-ws');
     request = request ?? provideRequest(module.getAlias(), module.getPath());
     const [url, state] = await urlCall({ ref: module })(request);
-    if (state !== ModuleOutcome.Ok) {
+    if (state !== EntrypointOutcome.Ok) {
         throw new SocketInitializationError;
     }
     const socket = new WebSocket(url);
     return new Promise(resolve => {
         socket.onopen = () => {
+            const heartbeat = setInterval(() => {
+                if (socket.readyState === WebSocket.OPEN) {
+                    socket.send(JSON.stringify({ type: 'ping' }));
+                }
+            }, 30_000);
+            socket.addEventListener('close', () => {
+                console.info('WebSocket connection closed, clearing heartbeat interval.');
+                clearInterval(heartbeat);
+            });
             resolve(makeConnection(socket, ctx));
         };
     });
 };
 export const useWs = (module, request) => {
     const ctx = useContext();
-    const mod = useMemo(() => typeof module === 'string' ? ctx.module(module) : module, [module]);
+    const mod = useMemo(() => typeof module === 'string' ? ctx.entrypoint(module) : module, [module]);
     const connection = useValue(async () => {
         const _request = provideRequest(mod.getAlias(), mod.getPath());
         Object.assign(_request, request);

package/build/helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"helper.js","sourceRoot":"","sources":["../src/helper.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAEhD,OAAO,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAEjD,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAA;AACvD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAE1C,MAAM,CAAC,MAAM,EAAE,GAAG,KAAK,EAAE,MAA4B,EAAE,OAA6C,EAAuB,EAAE;IAC3H,MAAM,GAAG,GAAG,aAAa,CAAkB,MAAM,CAAC,GAAc,EAAE,WAAW,CAAC,CAAA;IAC9E,OAAO,GAAG,OAAO,IAAI,cAAc,CAAC,MAAM,CAAC,QAAQ,EAAE,EAAE,MAAM,CAAC,OAAO,EAAE,CAAC,CAAA;IACxE,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,GAAG,MAAM,OAAO,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC,OAAO,CAAC,CAAA;IAE5D,IAAI,KAAK,KAAK,aAAa,CAAC,EAAE,EAAE,CAAC;QAC/B,MAAM,IAAI,yBAAyB,CAAA;IACrC,CAAC;IACD,MAAM,MAAM,GAAG,IAAI,SAAS,CAAC,GAAG,CAAC,CAAA;IAEjC,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;QAC3B,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;YACnB,OAAO,CAAC,cAAc,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;QACtC,CAAC,CAAA;IACH,CAAC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,MAAkC,EAAE,OAAuC,EAAqB,EAAE;IACtH,MAAM,GAAG,GAAG,UAAU,EAAE,CAAA;IACxB,MAAM,GAAG,GAAG,OAAO,CACjB,GAAG,EAAE,CAAC,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAe,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,EAC5E,CAAC,MAAM,CAAC,CACT,CAAA;IACD,MAAM,UAAU,GAAG,QAAQ,CAAa,KAAK,IAAI,EAAE;QACjD,MAAM,QAAQ,GAAG,cAAc,CAAC,GAAG,CAAC,QAAQ,EAAE,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC,CAAA;QAC9D,MAAM,CAAC,MAAM,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;QAChC,OAAO,MAAM,EAAE,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAA;IAChC,CAAC,EAAE;QACD,GAAG,CAAC,QAAQ,EAAE;QACd,OAAO,EAAE,KAAK,EAAE,CAAC,UAAU,CAAC;QAC5B,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS;KAC7D,CAAC,CAAA;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,IAAI,IAAI,EAAE,CAAC;YACvB,OAAO,GAAG,EAAE;gBACV,KAAK,UAAU,CAAC,KAAK,EAAE,CAAA;YACzB,CAAC,CAAA;QACH,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,UAAU,CAAA;AACnB,CAAC,CAAA"}
+{"version":3,"file":"helper.js","sourceRoot":"","sources":["../src/helper.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@owlmeans/client-socket",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -24,19 +24,20 @@
     "react": "*"
   },
   "devDependencies": {
+    "@owlmeans/dep-config": "workspace:*",
     "@types/react": "^19.2.7",
     "nodemon": "^3.1.11",
-    "typescript": "^5.8.3"
+    "typescript": "^6.0.2"
   },
   "dependencies": {
-    "@owlmeans/auth": "^0.1.2",
-    "@owlmeans/basic-envelope": "^0.1.2",
-    "@owlmeans/client": "^0.1.2",
-    "@owlmeans/client-context": "^0.1.2",
-    "@owlmeans/client-module": "^0.1.2",
-    "@owlmeans/context": "^0.1.2",
-    "@owlmeans/module": "^0.1.2",
-    "@owlmeans/socket": "^0.1.2"
+    "@owlmeans/auth": "^0.1.4",
+    "@owlmeans/basic-envelope": "^0.1.4",
+    "@owlmeans/client": "^0.1.4",
+    "@owlmeans/client-context": "^0.1.4",
+    "@owlmeans/client-entrypoint": "^0.1.4",
+    "@owlmeans/context": "^0.1.4",
+    "@owlmeans/entrypoint": "^0.1.4",
+    "@owlmeans/socket": "^0.1.4"
   },
   "publishConfig": {
     "access": "public"

package/src/helper.ts

@@ -1,7 +1,7 @@
-import type { ClientModule } from '@owlmeans/client-module'
-import type { AbstractRequest } from '@owlmeans/module'
-import { provideRequest } from '@owlmeans/client-module'
-import { ModuleOutcome } from '@owlmeans/module'
+import type { ClientEntrypoint } from '@owlmeans/client-entrypoint'
+import type { AbstractRequest } from '@owlmeans/entrypoint'
+import { provideRequest } from '@owlmeans/client-entrypoint'
+import { EntrypointOutcome } from '@owlmeans/entrypoint'
 import type { Connection } from '@owlmeans/socket'
 import { SocketInitializationError } from '@owlmeans/socket'
 import { makeConnection } from './utils/connection.js'
@@ -9,30 +9,41 @@ import { assertContext } from '@owlmeans/context'
 import type { Config, Context } from './types.js'
 import { useContext, useValue } from '@owlmeans/client'
 import { AUTH_QUERY } from '@owlmeans/auth'
-import { urlCall } from '@owlmeans/client-module/utils'
+import { urlCall } from '@owlmeans/client-entrypoint/utils'
 import { useEffect, useMemo } from 'react'
 
-export const ws = async (module: ClientModule<string>, request?: AbstractRequest<{ token?: string }>): Promise<Connection> => {
+export const ws = async (module: ClientEntrypoint<string>, request?: AbstractRequest<{ token?: string }>): Promise<Connection> => {
   const ctx = assertContext<Config, Context>(module.ctx as Context, 'client-ws')
   request = request ?? provideRequest(module.getAlias(), module.getPath())
   const [url, state] = await urlCall({ ref: module })(request)
 
-  if (state !== ModuleOutcome.Ok) {
+  if (state !== EntrypointOutcome.Ok) {
     throw new SocketInitializationError
   }
   const socket = new WebSocket(url)
 
   return new Promise(resolve => {
     socket.onopen = () => {
+      const heartbeat = setInterval(() => {
+        if (socket.readyState === WebSocket.OPEN) {
+          socket.send(JSON.stringify({ type: 'ping' }))
+        }
+      }, 30_000)
+
+      socket.addEventListener('close', () => {
+        console.info('WebSocket connection closed, clearing heartbeat interval.')
+        clearInterval(heartbeat)
+      })
+
       resolve(makeConnection(socket, ctx))
     }
   })
 }
 
-export const useWs = (module: string | ClientModule<any>, request?: Partial<AbstractRequest<any>>): Connection | null => {
+export const useWs = (module: string | ClientEntrypoint<any>, request?: Partial<AbstractRequest<any>>): Connection | null => {
   const ctx = useContext()
   const mod = useMemo(
-    () => typeof module === 'string' ? ctx.module<ClientModule>(module) : module,
+    () => typeof module === 'string' ? ctx.entrypoint<ClientEntrypoint>(module) : module,
     [module]
   )
   const connection = useValue<Connection>(async () => {
@@ -40,8 +51,8 @@ export const useWs = (module: string | ClientModule<any>, request?: Partial<Abst
     Object.assign(_request, request)
     return await ws(mod, _request)
   }, [
-    mod.getAlias(), 
-    request?.query?.[AUTH_QUERY], 
+    mod.getAlias(),
+    request?.query?.[AUTH_QUERY],
     request?.params ? JSON.stringify(request.params) : undefined
   ])
 

package/tsconfig.json

@@ -1,16 +1,11 @@
 {
   "extends": [
-    "../tsconfig.default.json",
-    "../tsconfig.react.json",
+    "@owlmeans/dep-config/tsconfig.base.json",
+    "@owlmeans/dep-config/tsconfig.react.json"
   ],
   "compilerOptions": {
-    "rootDir": "./src/", /* Specify the root folder within your source files. */
-    "outDir": "./build/", /* Specify an output folder for all emitted files. */
-    "moduleResolution": "Bundler"
+    "rootDir": "./src/",
+    "outDir": "./build/"
   },
-  "exclude": [
-    "./dist/**/*",
-    "./build/**/*",
-    "./*.ts"
-  ]
-}
+  "exclude": ["./dist/**/*", "./build/**/*", "./*.ts"]
+}