@tthr/vue 0.0.33 → 0.0.35

package/nuxt/module.ts

@@ -19,7 +19,7 @@
  * - TETHER_API_KEY: Your project's API key (required, kept server-side)
  */
 
-import { defineNuxtModule, addPlugin, createResolver, addImports, addComponent, addServerHandler, addServerImports } from '@nuxt/kit';
+import { defineNuxtModule, addPlugin, createResolver, addImports, addComponent, addServerHandler, addServerImports, addTemplate } from '@nuxt/kit';
 
 export interface TetherModuleOptions {
   /** Project ID from Tether dashboard */
@@ -138,12 +138,25 @@ export default defineNuxtModule<TetherModuleOptions>({
     nuxt.options.build.transpile = nuxt.options.build.transpile || [];
     nuxt.options.build.transpile.push('@tthr/vue');
 
+    // Create a virtual wrapper for the cron plugin to avoid absolute path issues in production
+    // The wrapper imports from the package export which gets resolved correctly at build time
+    const cronPluginWrapper = addTemplate({
+      filename: 'tether/cron-plugin.mjs',
+      write: true,
+      getContents: () => `
+// Virtual wrapper for Tether cron plugin
+// This ensures the import path is resolved correctly in production builds
+import cronPlugin from '@tthr/vue/nuxt/cron-plugin';
+export default cronPlugin;
+`.trim(),
+    });
+
     // Add Nitro plugin for cron WebSocket connection
     // This auto-connects to Tether when the server starts
-    // Use .js extension to ensure the pre-built file is used
     nuxt.hook('nitro:config', (nitroConfig) => {
       nitroConfig.plugins = nitroConfig.plugins || [];
-      nitroConfig.plugins.push(resolver.resolve('./runtime/server/plugins/cron.js'));
+      // Use the generated wrapper file instead of direct path
+      nitroConfig.plugins.push(cronPluginWrapper.dst);
 
       // Ensure Nitro inlines and transpiles the plugin from node_modules
       nitroConfig.externals = nitroConfig.externals || {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tthr/vue",
-  "version": "0.0.33",
+  "version": "0.0.35",
   "description": "Tether Vue/Nuxt SDK",
   "type": "module",
   "main": "./dist/index.js",
@@ -16,11 +16,21 @@
     },
     "./nuxt": {
       "import": "./nuxt/module.ts"
+    },
+    "./nuxt/cron-plugin": {
+      "import": "./nuxt/runtime/server/plugins/cron.js"
     }
   },
   "files": [
     "dist",
-    "nuxt"
+    "nuxt/module.ts",
+    "nuxt/module.js",
+    "nuxt/module.js.map",
+    "nuxt/runtime/**/*.js",
+    "nuxt/runtime/**/*.js.map",
+    "nuxt/runtime/**/*.d.ts",
+    "nuxt/runtime/**/*.d.ts.map",
+    "nuxt/runtime/**/*.vue"
   ],
   "dependencies": {
     "@nuxt/kit": "^3.14.0",

package/nuxt/runtime/composables.ts

@@ -1,348 +0,0 @@
-/**
- * Nuxt composables for Tether
- *
- * These are auto-imported when using the Tether Nuxt module.
- * Queries and mutations are executed server-side to keep API keys secure.
- * WebSocket subscriptions run client-side for realtime updates.
- */
-
-import { ref, onMounted, onUnmounted, type Ref } from 'vue';
-
-/**
- * Query state returned by useQuery
- */
-export interface QueryState<T> {
-  data: Ref<T | undefined>;
-  error: Ref<Error | null>;
-  isLoading: Ref<boolean>;
-  refetch: () => Promise<void>;
-  /** Update data directly (used for hot-swapping from WebSocket) */
-  setData: (newData: T) => void;
-}
-
-/**
- * Query function reference
- */
-export interface QueryFunction<TArgs = void, TResult = unknown> {
-  _name: string;
-  _args?: TArgs;
-  _result?: TResult;
-}
-
-/**
- * Reactive query composable with auto-refresh on subscription updates
- *
- * @example
- * ```vue
- * <script setup>
- * const { data: posts, isLoading } = useQuery(api.posts.list);
- * </script>
- * ```
- */
-export function useQuery<TArgs, TResult>(
-  query: QueryFunction<TArgs, TResult> | string,
-  args?: TArgs
-): QueryState<TResult> {
-  const queryName = typeof query === 'string' ? query : query._name;
-  const data = ref<TResult>();
-  const error = ref<Error | null>(null);
-  const isLoading = ref(true);
-
-  const fetchData = async () => {
-    try {
-      isLoading.value = true;
-      error.value = null;
-
-      const response = await $fetch<{ data: TResult }>('/api/_tether/query', {
-        method: 'POST',
-        body: {
-          function: queryName,
-          args,
-        },
-      });
-
-      data.value = response.data;
-    } catch (e) {
-      error.value = e instanceof Error ? e : new Error(String(e));
-    } finally {
-      isLoading.value = false;
-    }
-  };
-
-  // Fetch on mount (client-side)
-  onMounted(() => {
-    fetchData();
-  });
-
-  // Also fetch immediately for SSR
-  if (import.meta.server) {
-    fetchData();
-  }
-
-  // Direct data setter for hot-swapping from WebSocket
-  const setData = (newData: TResult) => {
-    data.value = newData;
-  };
-
-  return {
-    data: data as Ref<TResult | undefined>,
-    error,
-    isLoading,
-    refetch: fetchData,
-    setData,
-  };
-}
-
-/**
- * Mutation state returned by useMutation
- */
-export interface MutationState<TArgs, TResult> {
-  data: Ref<TResult | undefined>;
-  error: Ref<Error | null>;
-  isPending: Ref<boolean>;
-  mutate: (args: TArgs) => Promise<TResult>;
-  reset: () => void;
-}
-
-/**
- * Mutation function reference
- */
-export interface MutationFunction<TArgs = void, TResult = unknown> {
-  _name: string;
-  _args?: TArgs;
-  _result?: TResult;
-}
-
-/**
- * Mutation composable
- *
- * @example
- * ```vue
- * <script setup>
- * const { mutate: createPost, isPending } = useMutation(api.posts.create);
- *
- * async function handleSubmit() {
- *   await createPost({ title: 'Hello', content: '...' });
- * }
- * </script>
- * ```
- */
-export function useMutation<TArgs, TResult>(
-  mutation: MutationFunction<TArgs, TResult> | string
-): MutationState<TArgs, TResult> {
-  const mutationName = typeof mutation === 'string' ? mutation : mutation._name;
-  const data = ref<TResult>();
-  const error = ref<Error | null>(null);
-  const isPending = ref(false);
-
-  const mutate = async (args: TArgs): Promise<TResult> => {
-    try {
-      isPending.value = true;
-      error.value = null;
-
-      const response = await $fetch<{ data: TResult }>('/api/_tether/mutation', {
-        method: 'POST',
-        body: {
-          function: mutationName,
-          args,
-        },
-      });
-
-      data.value = response.data;
-      return response.data;
-    } catch (e) {
-      error.value = e instanceof Error ? e : new Error(String(e));
-      throw e;
-    } finally {
-      isPending.value = false;
-    }
-  };
-
-  const reset = () => {
-    data.value = undefined;
-    error.value = null;
-    isPending.value = false;
-  };
-
-  return {
-    data: data as Ref<TResult | undefined>,
-    error,
-    isPending,
-    mutate,
-    reset,
-  };
-}
-
-/**
- * WebSocket subscription composable for realtime updates
- * This runs client-side only and calls refetch when updates are received
- *
- * @example
- * ```vue
- * <script setup>
- * const { data: posts, refetch } = useQuery('posts.list');
- * useTetherSubscription('posts.list', {}, refetch);
- * </script>
- * ```
- */
-export function useTetherSubscription(
-  queryName: string,
-  args: Record<string, unknown> | undefined,
-  onUpdate: (data?: unknown) => void
-): { isConnected: Ref<boolean> } {
-  const isConnected = ref(false);
-
-  if (import.meta.client) {
-    let ws: WebSocket | null = null;
-    let reconnectTimeout: ReturnType<typeof setTimeout> | null = null;
-    let heartbeatInterval: ReturnType<typeof setInterval> | null = null;
-    let heartbeatTimeout: ReturnType<typeof setTimeout> | null = null;
-    let awaitingPong = false;
-    let isConnecting = false;
-    let isMounted = false;
-
-    // Heartbeat configuration
-    const HEARTBEAT_INTERVAL = 25000; // 25 seconds (well under server's 90s timeout)
-    const HEARTBEAT_TIMEOUT = 15000; // 15 seconds to receive pong (generous for slow networks)
-
-    // Generate a unique subscription ID
-    const subscriptionId = `${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
-
-    const startHeartbeat = () => {
-      stopHeartbeat();
-      heartbeatInterval = setInterval(() => {
-        if (ws?.readyState === WebSocket.OPEN) {
-          awaitingPong = true;
-          ws.send(JSON.stringify({ type: 'ping' }));
-
-          heartbeatTimeout = setTimeout(() => {
-            if (awaitingPong && isMounted) {
-              console.warn('[Tether] Heartbeat timeout - forcing reconnect');
-              ws?.close();
-            }
-          }, HEARTBEAT_TIMEOUT);
-        }
-      }, HEARTBEAT_INTERVAL);
-    };
-
-    const stopHeartbeat = () => {
-      if (heartbeatInterval) {
-        clearInterval(heartbeatInterval);
-        heartbeatInterval = null;
-      }
-      if (heartbeatTimeout) {
-        clearTimeout(heartbeatTimeout);
-        heartbeatTimeout = null;
-      }
-      awaitingPong = false;
-    };
-
-    const connect = () => {
-      // Don't connect if unmounted or already connecting/connected
-      if (!isMounted) return;
-      if (isConnecting) return;
-      if (ws && (ws.readyState === WebSocket.OPEN || ws.readyState === WebSocket.CONNECTING)) {
-        return;
-      }
-
-      // Get config from window (set by plugin)
-      const config = (window as any).__TETHER_CONFIG__;
-      if (!config?.wsUrl || !config?.projectId) {
-        console.warn('[Tether] WebSocket config not available');
-        return;
-      }
-
-      isConnecting = true;
-      const wsUrl = `${config.wsUrl}/ws/${config.projectId}`;
-      ws = new WebSocket(wsUrl);
-
-      ws.onopen = () => {
-        isConnecting = false;
-        // Wait for connected message before subscribing
-      };
-
-      ws.onmessage = (event) => {
-        try {
-          const message = JSON.parse(event.data);
-
-          if (message.type === 'connected') {
-            isConnected.value = true;
-            startHeartbeat();
-            // Subscribe to the query with our ID
-            ws?.send(JSON.stringify({
-              type: 'subscribe',
-              id: subscriptionId,
-              query: queryName,
-              args,
-            }));
-          } else if (message.type === 'data' && message.id === subscriptionId) {
-            // Call onUpdate with the fresh data
-            onUpdate(message.data);
-          } else if (message.type === 'pong') {
-            // Heartbeat acknowledged
-            awaitingPong = false;
-            if (heartbeatTimeout) {
-              clearTimeout(heartbeatTimeout);
-              heartbeatTimeout = null;
-            }
-          }
-        } catch {
-          // Ignore parse errors
-        }
-      };
-
-      ws.onclose = () => {
-        isConnected.value = false;
-        isConnecting = false;
-        stopHeartbeat();
-        // Only reconnect if still mounted
-        if (isMounted) {
-          reconnectTimeout = setTimeout(connect, 3000);
-        }
-      };
-
-      ws.onerror = () => {
-        isConnecting = false;
-        ws?.close();
-      };
-    };
-
-    // Handle page visibility changes - reconnect when tab becomes visible
-    const handleVisibilityChange = () => {
-      if (!isMounted) return;
-      if (document.visibilityState === 'visible') {
-        // Tab became visible - check connection health
-        if (!ws || ws.readyState === WebSocket.CLOSED) {
-          // Clear any pending reconnect and connect immediately
-          if (reconnectTimeout) {
-            clearTimeout(reconnectTimeout);
-            reconnectTimeout = null;
-          }
-          connect();
-        }
-      }
-    };
-
-    onMounted(() => {
-      isMounted = true;
-      connect();
-      document.addEventListener('visibilitychange', handleVisibilityChange);
-    });
-
-    onUnmounted(() => {
-      isMounted = false;
-      document.removeEventListener('visibilitychange', handleVisibilityChange);
-      stopHeartbeat();
-      if (reconnectTimeout) {
-        clearTimeout(reconnectTimeout);
-        reconnectTimeout = null;
-      }
-      if (ws) {
-        ws.close();
-        ws = null;
-      }
-    });
-  }
-
-  return { isConnected };
-}

package/nuxt/runtime/plugin.client.ts

@@ -1,34 +0,0 @@
-/**
- * Client-side Tether plugin
- *
- * Sets up the WebSocket configuration for realtime subscriptions.
- * This only exposes the project ID and WebSocket URL - no secrets.
- */
-
-import { defineNuxtPlugin, useRuntimeConfig } from '#imports';
-
-declare global {
-  interface Window {
-    __TETHER_CONFIG__?: {
-      projectId: string;
-      wsUrl: string;
-    };
-  }
-}
-
-export default defineNuxtPlugin(() => {
-  const config = useRuntimeConfig();
-
-  // Make config available for WebSocket connections
-  // This is safe - no secrets are exposed
-  const tetherConfig = {
-    projectId: config.public.tether?.projectId || '',
-    wsUrl: config.public.tether?.wsUrl || '',
-  };
-
-  window.__TETHER_CONFIG__ = tetherConfig;
-
-  if (!tetherConfig.wsUrl || !tetherConfig.projectId) {
-    console.warn('[Tether] Config incomplete - WebSocket subscriptions will not work');
-  }
-});

package/nuxt/runtime/server/plugins/cron.ts

@@ -1,342 +0,0 @@
-/**
- * Nuxt server plugin for Tether cron execution
- *
- * This plugin automatically connects to Tether via WebSocket as a server connection
- * to receive cron triggers. When a cron is due, Tether sends a trigger message,
- * this plugin executes the function, and reports the result back.
- *
- * The connection is secured with the API key and only server connections
- * (identified by ?type=server) receive cron triggers.
- */
-
-import { defineNitroPlugin } from 'nitropack/runtime';
-import { useRuntimeConfig } from '#imports';
-
-// Store for registered cron handlers
-const cronHandlers: Map<string, (args: unknown) => Promise<unknown>> = new Map();
-
-// WebSocket connection state
-let ws: WebSocket | null = null;
-let connectionId: string | null = null;
-let reconnectAttempts = 0;
-let heartbeatTimer: ReturnType<typeof setInterval> | null = null;
-let heartbeatTimeoutTimer: ReturnType<typeof setTimeout> | null = null;
-let awaitingPong = false;
-let shouldReconnect = true;
-
-const MAX_RECONNECT_ATTEMPTS = 10;
-const HEARTBEAT_INTERVAL = 30000;
-const HEARTBEAT_TIMEOUT = 10000;
-const RECONNECT_DELAY = 1000;
-
-/**
- * Register a cron handler for a specific function
- *
- * @example
- * ```ts
- * // In your Nuxt server setup
- * import { registerCronHandler } from '#imports';
- *
- * registerCronHandler('reports.generate', async (args) => {
- *   // Your function logic here
- *   return { generated: true };
- * });
- * ```
- */
-export function registerCronHandler(
-  functionName: string,
-  handler: (args: unknown) => Promise<unknown>
-): void {
-  cronHandlers.set(functionName, handler);
-  console.log(`[Tether Cron] Registered handler for: ${functionName}`);
-}
-
-/**
- * Unregister a cron handler
- */
-export function unregisterCronHandler(functionName: string): void {
-  cronHandlers.delete(functionName);
-}
-
-/**
- * Get all registered cron handlers
- */
-export function getCronHandlers(): string[] {
-  return Array.from(cronHandlers.keys());
-}
-
-interface CronTriggerMessage {
-  type: 'cron_trigger';
-  executionId: string;
-  cronId: string;
-  functionName: string;
-  functionType: string;
-  args?: unknown;
-}
-
-interface ServerMessage {
-  type: 'connected' | 'cron_trigger' | 'pong' | 'error';
-  connection_id?: string;
-  server_time?: string;
-  executionId?: string;
-  cronId?: string;
-  functionName?: string;
-  functionType?: string;
-  args?: unknown;
-  error?: { code: string; message: string };
-}
-
-function getWsUrl(config: { url: string; projectId: string; apiKey: string; environment?: string }): string {
-  const base = config.url
-    .replace('https://', 'wss://')
-    .replace('http://', 'ws://')
-    .replace(/\/$/, '');
-
-  const env = config.environment;
-  let wsPath: string;
-
-  if (env && env !== 'production') {
-    wsPath = `${base}/ws/${config.projectId}/${env}`;
-  } else {
-    wsPath = `${base}/ws/${config.projectId}`;
-  }
-
-  // Add type=server to identify as server connection and token for auth
-  return `${wsPath}?type=server&token=${encodeURIComponent(config.apiKey)}`;
-}
-
-async function reportExecution(
-  config: { url: string; projectId: string; apiKey: string; environment?: string },
-  trigger: CronTriggerMessage,
-  result: { success: boolean; result?: unknown; error?: string },
-  durationMs: number
-): Promise<void> {
-  const base = config.url.replace(/\/$/, '');
-  const env = config.environment;
-
-  let apiPath: string;
-  if (env && env !== 'production') {
-    apiPath = `${base}/api/v1/projects/${config.projectId}/env/${env}`;
-  } else {
-    apiPath = `${base}/api/v1/projects/${config.projectId}`;
-  }
-
-  const url = `${apiPath}/crons/${trigger.cronId}/executions`;
-
-  try {
-    const response = await fetch(url, {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-        'Authorization': `Bearer ${config.apiKey}`,
-      },
-      body: JSON.stringify({
-        executionId: trigger.executionId,
-        success: result.success,
-        errorMessage: result.error,
-        result: result.result,
-        durationMs,
-      }),
-    });
-
-    if (!response.ok) {
-      console.error(`[Tether Cron] Failed to report execution: ${response.status} ${response.statusText}`);
-    } else {
-      console.log(`[Tether Cron] Reported execution ${trigger.executionId}: ${result.success ? 'success' : 'failed'}`);
-    }
-  } catch (error) {
-    console.error('[Tether Cron] Failed to report execution:', error);
-  }
-}
-
-async function handleCronTrigger(
-  config: { url: string; projectId: string; apiKey: string; environment?: string },
-  trigger: CronTriggerMessage
-): Promise<void> {
-  console.log(`[Tether Cron] Received trigger for ${trigger.functionName} (execution: ${trigger.executionId})`);
-
-  const startTime = Date.now();
-  const handler = cronHandlers.get(trigger.functionName);
-
-  if (!handler) {
-    console.warn(`[Tether Cron] No handler registered for: ${trigger.functionName}`);
-    const durationMs = Date.now() - startTime;
-    await reportExecution(config, trigger, {
-      success: false,
-      error: `No handler registered for function: ${trigger.functionName}`,
-    }, durationMs);
-    return;
-  }
-
-  try {
-    const result = await handler(trigger.args);
-    const durationMs = Date.now() - startTime;
-
-    await reportExecution(config, trigger, {
-      success: true,
-      result,
-    }, durationMs);
-  } catch (error) {
-    const durationMs = Date.now() - startTime;
-    const errorMessage = error instanceof Error ? error.message : String(error);
-
-    console.error(`[Tether Cron] Handler error for ${trigger.functionName}:`, errorMessage);
-
-    await reportExecution(config, trigger, {
-      success: false,
-      error: errorMessage,
-    }, durationMs);
-  }
-}
-
-function startHeartbeat(): void {
-  stopHeartbeat();
-
-  heartbeatTimer = setInterval(() => {
-    if (ws?.readyState === WebSocket.OPEN) {
-      awaitingPong = true;
-      ws.send(JSON.stringify({ type: 'ping' }));
-
-      heartbeatTimeoutTimer = setTimeout(() => {
-        if (awaitingPong) {
-          console.warn('[Tether Cron] Heartbeat timeout - forcing reconnect');
-          ws?.close();
-        }
-      }, HEARTBEAT_TIMEOUT);
-    }
-  }, HEARTBEAT_INTERVAL);
-}
-
-function stopHeartbeat(): void {
-  if (heartbeatTimer) {
-    clearInterval(heartbeatTimer);
-    heartbeatTimer = null;
-  }
-  if (heartbeatTimeoutTimer) {
-    clearTimeout(heartbeatTimeoutTimer);
-    heartbeatTimeoutTimer = null;
-  }
-  awaitingPong = false;
-}
-
-function connect(config: { url: string; projectId: string; apiKey: string; environment?: string }): void {
-  if (ws?.readyState === WebSocket.OPEN || ws?.readyState === WebSocket.CONNECTING) {
-    return;
-  }
-
-  try {
-    const url = getWsUrl(config);
-
-    // Use ws package for Node.js
-    // eslint-disable-next-line @typescript-eslint/no-require-imports
-    const WebSocketImpl = typeof WebSocket !== 'undefined' ? WebSocket : require('ws');
-    ws = new WebSocketImpl(url);
-
-    ws!.onopen = () => {
-      reconnectAttempts = 0;
-      console.log('[Tether Cron] WebSocket connected');
-    };
-
-    ws!.onmessage = async (event: { data: string | Buffer }) => {
-      const data = typeof event.data === 'string' ? event.data : event.data.toString();
-
-      try {
-        const message = JSON.parse(data) as ServerMessage;
-
-        switch (message.type) {
-          case 'connected':
-            connectionId = message.connection_id ?? null;
-            startHeartbeat();
-            console.log(`[Tether Cron] Connected with ID: ${connectionId}`);
-            break;
-
-          case 'cron_trigger':
-            await handleCronTrigger(config, message as CronTriggerMessage);
-            break;
-
-          case 'pong':
-            awaitingPong = false;
-            if (heartbeatTimeoutTimer) {
-              clearTimeout(heartbeatTimeoutTimer);
-              heartbeatTimeoutTimer = null;
-            }
-            break;
-
-          case 'error':
-            console.error('[Tether Cron] Server error:', message.error);
-            break;
-        }
-      } catch (e) {
-        console.error('[Tether Cron] Failed to parse message:', e);
-      }
-    };
-
-    ws!.onerror = (error: Event | Error) => {
-      const err = error instanceof Error ? error : new Error('WebSocket error');
-      console.error('[Tether Cron] WebSocket error:', err.message);
-    };
-
-    ws!.onclose = () => {
-      connectionId = null;
-      stopHeartbeat();
-      console.log('[Tether Cron] WebSocket disconnected');
-      handleReconnect(config);
-    };
-  } catch (error) {
-    console.error('[Tether Cron] Failed to connect:', error);
-    handleReconnect(config);
-  }
-}
-
-function handleReconnect(config: { url: string; projectId: string; apiKey: string; environment?: string }): void {
-  if (!shouldReconnect) {
-    return;
-  }
-
-  if (reconnectAttempts >= MAX_RECONNECT_ATTEMPTS) {
-    console.error('[Tether Cron] Max reconnection attempts reached');
-    return;
-  }
-
-  reconnectAttempts++;
-  const delay = Math.min(RECONNECT_DELAY * Math.pow(2, reconnectAttempts - 1), 30000);
-
-  console.log(`[Tether Cron] Reconnecting in ${delay}ms (attempt ${reconnectAttempts}/${MAX_RECONNECT_ATTEMPTS})`);
-
-  setTimeout(() => {
-    connect(config);
-  }, delay);
-}
-
-export default defineNitroPlugin((nitro) => {
-  // Get config from runtime config
-  const config = useRuntimeConfig();
-
-  const apiKey = config.tether?.apiKey || process.env.TETHER_API_KEY;
-  const url = config.tether?.url || process.env.TETHER_URL || 'https://tether-api.strands.gg';
-  const projectId = config.tether?.projectId || process.env.TETHER_PROJECT_ID;
-
-  // Only connect if we have all required config
-  if (!apiKey || !projectId) {
-    console.log('[Tether Cron] Missing config (apiKey or projectId) - cron connection disabled');
-    return;
-  }
-
-  console.log('[Tether Cron] Initialising cron connection...');
-
-  // Connect on next tick to allow handlers to be registered first
-  process.nextTick(() => {
-    connect({ url, projectId, apiKey });
-  });
-
-  // Clean up on shutdown
-  nitro.hooks.hook('close', () => {
-    shouldReconnect = false;
-    stopHeartbeat();
-    if (ws) {
-      ws.close();
-      ws = null;
-    }
-    console.log('[Tether Cron] Connection closed');
-  });
-});