framer-code-link 0.1.3 → 0.2.0

package/src/helpers/connection.ts

@@ -7,7 +7,7 @@
 
 import { WebSocketServer, WebSocket } from "ws"
 import type { IncomingMessage, OutgoingMessage } from "../types.js"
-import { info, error } from "../utils/logging.js"
+import { debug, error } from "../utils/logging.js"
 
 export interface ConnectionCallbacks {
   onHandshake: (
@@ -68,11 +68,12 @@ export function initConnection(port: number): Promise<Connection> {
     // Server is ready when it starts listening
     wss.on("listening", () => {
       isReady = true
-      info(`WebSocket server listening on port ${port}`)
+      debug(`WebSocket server listening on port ${port}`)
 
       wss.on("connection", (ws: WebSocket) => {
         const connId = ++connectionId
-        info(`[CONN ${connId}] Client connected (readyState: ${ws.readyState})`)
+        let handshakeReceived = false
+        debug(`Client connected (conn ${connId})`)
 
         ws.on("message", (data: Buffer) => {
           try {
@@ -80,25 +81,31 @@ export function initConnection(port: number): Promise<Connection> {
 
             // Special handling for handshake
             if (message.type === "handshake") {
-              info(`[CONN ${connId}] Received handshake`)
+              debug(`Received handshake (conn ${connId})`)
+              handshakeReceived = true
               handlers.onHandshake?.(ws, message)
-            } else {
+            } else if (handshakeReceived) {
               handlers.onMessage?.(message)
+            } else {
+              // Ignore messages before handshake - plugin will send full snapshot after
+              debug(
+                `Ignoring ${message.type} before handshake (conn ${connId})`
+              )
             }
           } catch (err) {
-            error(`[CONN ${connId}] Failed to parse message:`, err)
+            error(`Failed to parse message:`, err)
           }
         })
 
         ws.on("close", (code, reason) => {
-          info(
-            `[CONN ${connId}] Client disconnected (code: ${code}, reason: ${reason?.toString() || "none"})`
+          debug(
+            `Client disconnected (code: ${code}, reason: ${reason?.toString() || "none"})`
           )
           handlers.onDisconnect?.()
         })
 
         ws.on("error", (err) => {
-          error(`[CONN ${connId}] WebSocket error:`, err)
+          error(`WebSocket error:`, err)
         })
       })
 
@@ -163,14 +170,14 @@ export function sendMessage(
     // Check socket state before attempting to send
     if (socket.readyState !== READY_STATE.OPEN) {
       const stateStr = readyStateToString(socket.readyState)
-      info(`[WS] Cannot send ${message.type}: socket is ${stateStr}`)
+      debug(`Cannot send ${message.type}: socket is ${stateStr}`)
       resolve(false)
       return
     }
 
     socket.send(JSON.stringify(message), (err) => {
       if (err) {
-        error(`[WS] Send error for ${message.type}:`, err.message)
+        debug(`Send error for ${message.type}: ${err.message}`)
         resolve(false)
       } else {
         resolve(true)

package/src/helpers/files.ts

@@ -18,9 +18,9 @@ import type {
   Conflict,
   ConflictVersionData,
 } from "../types.js"
-import type { HashTracker } from "../utils/hashing.js"
+import type { HashTracker } from "../utils/hash-tracker.js"
 import { normalizePath, sanitizeFilePath } from "@code-link/shared"
-import { info, warn, debug } from "../utils/logging.js"
+import { warn, debug } from "../utils/logging.js"
 import {
   hashFileContent,
   type PersistedFileState,
@@ -30,6 +30,11 @@ const SUPPORTED_EXTENSIONS = [".ts", ".tsx", ".js", ".jsx", ".json"]
 const DEFAULT_EXTENSION = ".tsx"
 const DEFAULT_REMOTE_DRIFT_MS = 2000
 
+/** Normalize file name for case-insensitive comparison (macOS/Windows compat) */
+function normalizeForComparison(fileName: string): string {
+  return fileName.toLowerCase()
+}
+
 /**
  * Lists all supported files in the files directory
  */
@@ -98,42 +103,79 @@ export async function detectConflicts(
   const conflicts: Conflict[] = []
   const writes: FileInfo[] = []
   const localOnly: FileInfo[] = []
+  const unchanged: FileInfo[] = []
   const detect = options.detectConflicts ?? true
   const preferRemote = options.preferRemote ?? false
   const persistedState = options.persistedState
 
+  const getPersistedState = (fileName: string) =>
+    persistedState?.get(normalizeForComparison(fileName)) ??
+    persistedState?.get(fileName)
+
   debug(`Detecting conflicts for ${remoteFiles.length} remote files`)
 
-  // Build a snapshot of all local files
+  // Build a snapshot of all local files (keyed by lowercase for case-insensitive matching)
   const localFiles = await listFiles(filesDir)
-  const localFileMap = new Map(localFiles.map((f) => [f.name, f]))
+  const localFileMap = new Map(
+    localFiles.map((f) => [normalizeForComparison(f.name), f])
+  )
 
-  // Track which files we've processed
+  // Build a set of remote file names for quick lookup (lowercase keys)
+  const remoteFileMap = new Map(
+    remoteFiles.map((f) => {
+      const normalized = resolveRemoteReference(filesDir, f.name)
+      return [normalizeForComparison(normalized.relativePath), f]
+    })
+  )
+
+  // Track which files we've processed (lowercase for case-insensitive matching)
   const processedFiles = new Set<string>()
 
   // Process remote files (remote-only or both sides)
   for (const remote of remoteFiles) {
     const normalized = resolveRemoteReference(filesDir, remote.name)
-    const local = localFileMap.get(normalized.relativePath)
-    processedFiles.add(normalized.relativePath)
+    const normalizedKey = normalizeForComparison(normalized.relativePath)
+    const local = localFileMap.get(normalizedKey)
+    processedFiles.add(normalizedKey)
 
-    const persisted = persistedState?.get(normalized.relativePath)
+    const persisted = getPersistedState(normalized.relativePath)
     const localHash = local ? hashFileContent(local.content) : null
     const localMatchesPersisted =
       !!persisted && !!local && localHash === persisted.contentHash
 
     if (!local) {
-      // Remote-only: download
-      writes.push({
-        name: normalized.relativePath,
-        content: remote.content,
-        modifiedAt: remote.modifiedAt,
-      })
+      // File exists in remote but not locally
+      if (persisted) {
+        // File was previously synced but now missing locally → deleted locally while offline
+        // This is a conflict: local=null (deleted), remote=content
+        debug(
+          `Conflict: ${normalized.relativePath} deleted locally while offline`
+        )
+        conflicts.push({
+          fileName: normalized.relativePath,
+          localContent: null,
+          remoteContent: remote.content,
+          remoteModifiedAt: remote.modifiedAt,
+          lastSyncedAt: persisted?.timestamp,
+        })
+      } else {
+        // New file from remote (never synced before): download
+        writes.push({
+          name: normalized.relativePath,
+          content: remote.content,
+          modifiedAt: remote.modifiedAt,
+        })
+      }
       continue
     }
 
     if (local.content === remote.content) {
-      // No change needed
+      // Content matches - no disk write needed but track for metadata
+      unchanged.push({
+        name: normalized.relativePath,
+        content: remote.content,
+        modifiedAt: remote.modifiedAt,
+      })
       continue
     }
 
@@ -163,17 +205,51 @@ export async function detectConflicts(
 
   // Process local-only files (not present in remote)
   for (const local of localFiles) {
-    if (!processedFiles.has(local.name)) {
-      // Local-only: upload later
-      localOnly.push({
-        name: local.name,
-        content: local.content,
-        modifiedAt: local.modifiedAt,
-      })
+    const localKey = normalizeForComparison(local.name)
+    if (!processedFiles.has(localKey)) {
+      const persisted = getPersistedState(local.name)
+      if (persisted) {
+        // File was previously synced but now missing from remote → deleted in Framer
+        const localHash = hashFileContent(local.content)
+        const localClean = localHash === persisted.contentHash
+        debug(
+          `Conflict: ${local.name} deleted in Framer (localClean=${localClean})`
+        )
+        conflicts.push({
+          fileName: local.name,
+          localContent: local.content,
+          remoteContent: null,
+          localModifiedAt: local.modifiedAt,
+          lastSyncedAt: persisted?.timestamp,
+          localClean,
+        })
+      } else {
+        // New local file (never synced before): upload later
+        localOnly.push({
+          name: local.name,
+          content: local.content,
+          modifiedAt: local.modifiedAt,
+        })
+      }
+    }
+  }
+
+  // Check for files in persisted state that are missing from BOTH sides
+  // These were deleted on both sides while offline - auto-clean them (no conflict)
+  if (persistedState) {
+    for (const [fileName] of persistedState) {
+      const normalizedKey = normalizeForComparison(fileName)
+      const inLocal = localFileMap.has(normalizedKey)
+      const inRemote = remoteFileMap.has(normalizedKey)
+      if (!inLocal && !inRemote) {
+        debug(`[AUTO-RESOLVE] ${fileName}: deleted on both sides, no conflict`)
+        // No action needed - the file is gone from both sides
+        // The persisted state will be cleaned up when we persist
+      }
     }
   }
 
-  return { conflicts, writes, localOnly }
+  return { conflicts, writes, localOnly, unchanged }
 }
 
 export interface AutoResolveResult {
@@ -199,42 +275,51 @@ export function autoResolveConflicts(
   for (const conflict of conflicts) {
     const latestRemoteVersionMs = versionMap.get(conflict.fileName)
     const lastSyncedAt = conflict.lastSyncedAt
+    const localClean = conflict.localClean === true
+
+    debug(`Auto-resolve checking ${conflict.fileName}`)
 
-    info(`[AUTO-RESOLVE] Checking ${conflict.fileName}...`)
+    // Remote deletion: file deleted in Framer
+    if (conflict.remoteContent === null) {
+      if (localClean) {
+        debug(`  Remote deleted, local clean -> REMOTE (delete locally)`)
+        autoResolvedRemote.push(conflict)
+      } else {
+        debug(`  Remote deleted, local modified -> conflict`)
+        remainingConflicts.push(conflict)
+      }
+      continue
+    }
 
     if (!latestRemoteVersionMs) {
-      info(`-> No remote version data, keeping conflict`)
+      debug(`  No remote version data, keeping conflict`)
       remainingConflicts.push(conflict)
       continue
     }
 
     if (!lastSyncedAt) {
-      info(`-> No last sync timestamp, keeping conflict`)
+      debug(`  No last sync timestamp, keeping conflict`)
       remainingConflicts.push(conflict)
       continue
     }
 
-    info(
-      `-> Latest remote: ${new Date(latestRemoteVersionMs).toISOString()} (${latestRemoteVersionMs})`
-    )
-    info(
-      `-> Last synced: ${new Date(lastSyncedAt).toISOString()} (${lastSyncedAt})`
-    )
+    debug(`  Remote: ${new Date(latestRemoteVersionMs).toISOString()}`)
+    debug(`  Synced: ${new Date(lastSyncedAt).toISOString()}`)
 
     const remoteUnchanged =
       latestRemoteVersionMs <= lastSyncedAt + remoteDriftMs
-    const localClean = conflict.localClean === true
+    // localClean already declared above for remote deletion handling
 
     if (remoteUnchanged && !localClean) {
-      info(`  -> Remote unchanged, local changed. Auto-applying LOCAL.`)
+      debug(`  Remote unchanged, local changed -> LOCAL`)
       autoResolvedLocal.push(conflict)
     } else if (localClean && !remoteUnchanged) {
-      info(`  -> Local unchanged, remote changed. Auto-applying REMOTE.`)
+      debug(`  Local unchanged, remote changed -> REMOTE`)
       autoResolvedRemote.push(conflict)
     } else if (remoteUnchanged && localClean) {
-      info(`  -> Both unchanged. Skipping (no conflict).`)
+      debug(`  Both unchanged, skipping`)
     } else {
-      info(`  -> Both sides changed. Real conflict.`)
+      debug(`  Both changed, real conflict`)
       remainingConflicts.push(conflict)
     }
   }
@@ -256,7 +341,7 @@ export async function writeRemoteFiles(
   hashTracker: HashTracker,
   installer?: { process: (fileName: string, content: string) => void }
 ): Promise<void> {
-  info(`Writing ${files.length} remote files`)
+  debug(`Writing ${files.length} remote files`)
 
   for (const file of files) {
     try {
@@ -302,14 +387,14 @@ export async function deleteLocalFile(
     // Clear the hash immediately
     hashTracker.forget(normalized.relativePath)
 
-    info(`Deleted file: ${normalized.relativePath}`)
+    debug(`Deleted file: ${normalized.relativePath}`)
   } catch (err) {
     const nodeError = err as NodeJS.ErrnoException
 
     if (nodeError?.code === "ENOENT") {
       // Treat missing files as already deleted to keep hash tracker in sync
       hashTracker.forget(normalized.relativePath)
-      info(`File already deleted: ${normalized.relativePath}`)
+      debug(`File already deleted: ${normalized.relativePath}`)
       return
     }
 

package/src/helpers/installer.ts

@@ -1,9 +1,5 @@
 /**
- * Type installer helper
- *
- * Wraps @typescript/ata with our custom fetcher and initialization routines.
- * This preserves the battle-tested logic from the classic CLI while
- * conforming to the controller-centric architecture.
+ * Type installer helper using @typescript/ata
  */
 
 import { setupTypeAcquisition } from "@typescript/ata"
@@ -11,7 +7,7 @@ import ts from "typescript"
 import path from "path"
 import fs from "fs/promises"
 import { extractImports } from "../utils/imports.js"
-import { info, debug, warn } from "../utils/logging.js"
+import { debug, warn } from "../utils/logging.js"
 
 export interface InstallerConfig {
   projectDir: string
@@ -85,7 +81,7 @@ export class Installer {
 
           if (pkgMatch && !seenPackages.has(pkgMatch[1])) {
             seenPackages.add(pkgMatch[1])
-            info(`📦 Types: ${pkgMatch[1]}`)
+            debug(`📦 Types: ${pkgMatch[1]}`)
           }
 
           await this.writeTypeFile(receivedPath, code)
@@ -93,7 +89,7 @@ export class Installer {
       },
     })
 
-    info("Type installer initialized")
+    debug("Type installer initialized")
   }
 
   /**
@@ -181,7 +177,7 @@ export class Installer {
     }
 
     this.processedImports.add(hash)
-    info(`Processing imports for ${fileName} (${imports.length} packages)`)
+    debug(`Processing imports for ${fileName} (${imports.length} packages)`)
 
     try {
       await this.ata(content)
@@ -318,7 +314,7 @@ export class Installer {
         include: ["files/**/*", "framer-modules.d.ts"],
       }
       await fs.writeFile(tsconfigPath, JSON.stringify(config, null, 2))
-      info("Created tsconfig.json")
+      debug("Created tsconfig.json")
     }
   }
 
@@ -334,7 +330,7 @@ export class Installer {
         trailingComma: "es5",
       }
       await fs.writeFile(prettierPath, JSON.stringify(config, null, 2))
-      info("Created .prettierrc")
+      debug("Created .prettierrc")
     }
   }
 
@@ -352,7 +348,7 @@ declare module "https://framerusercontent.com/*"
 declare module "*.json"
 `
       await fs.writeFile(declarationsPath, declarations)
-      info("Created framer-modules.d.ts")
+      debug("Created framer-modules.d.ts")
     }
   }
 
@@ -369,7 +365,7 @@ declare module "*.json"
         description: "Framer files synced with framer-code-link",
       }
       await fs.writeFile(packagePath, JSON.stringify(pkg, null, 2))
-      info("Created package.json")
+      debug("Created package.json")
     }
   }
 
@@ -390,9 +386,9 @@ declare module "*.json"
     if (
       await this.hasTypePackage(reactTypesDir, REACT_TYPES_VERSION, reactFiles)
     ) {
-      info("📦 React types (from cache)")
+      debug("📦 React types (from cache)")
     } else {
-      info("Downloading React 18 types for Framer compatibility...")
+      debug("Downloading React 18 types...")
       await this.downloadTypePackage(
         "@types/react",
         REACT_TYPES_VERSION,
@@ -415,7 +411,7 @@ declare module "*.json"
         reactDomFiles
       )
     ) {
-      info("📦 React DOM types (from cache)")
+      debug("📦 React DOM types (from cache)")
     } else {
       await this.downloadTypePackage(
         "@types/react-dom",

package/src/helpers/user-actions.ts

@@ -8,7 +8,7 @@
 import type { WebSocket } from "ws"
 import type { Conflict } from "../types.js"
 import { sendMessage } from "./connection.js"
-import { info, warn } from "../utils/logging.js"
+import { debug, warn } from "../utils/logging.js"
 
 class PluginDisconnectedError extends Error {
   constructor() {
@@ -55,9 +55,7 @@ export class UserActionCoordinator {
         return await confirmationPromise
       } catch (err) {
         if (err instanceof PluginDisconnectedError) {
-          info(
-            `[USER-ACTION] Plugin disconnected while waiting for delete confirmation: ${fileName}`
-          )
+          debug(`Plugin disconnected while waiting for delete confirmation: ${fileName}`)
           return false
         }
         throw err
@@ -111,9 +109,7 @@ export class UserActionCoordinator {
       return new Map(results)
     } catch (err) {
       if (err instanceof PluginDisconnectedError) {
-        info(
-          "[USER-ACTION] Plugin disconnected while awaiting conflict decisions"
-        )
+        debug("Plugin disconnected while awaiting conflict decisions")
         return new Map()
       }
       throw err
@@ -129,7 +125,7 @@ export class UserActionCoordinator {
   ): Promise<T> {
     return new Promise<T>((resolve, reject) => {
       this.pendingActions.set(actionId, { resolve, reject })
-      info(`[USER-ACTION] Awaiting ${description}: ${actionId}`)
+      debug(`Awaiting ${description}: ${actionId}`)
     })
   }
 
@@ -139,13 +135,13 @@ export class UserActionCoordinator {
   handleConfirmation<T>(actionId: string, value: T): boolean {
     const pending = this.pendingActions.get(actionId)
     if (!pending) {
-      warn(`[USER-ACTION] Unexpected confirmation for ${actionId}`)
+      debug(`Unexpected confirmation for ${actionId}`)
       return false
     }
 
     this.pendingActions.delete(actionId)
     pending.resolve(value)
-    info(`[USER-ACTION] Confirmed: ${actionId}`)
+    debug(`Confirmed: ${actionId}`)
     return true
   }
 
@@ -155,7 +151,7 @@ export class UserActionCoordinator {
   cleanup(): void {
     for (const [actionId, pending] of this.pendingActions.entries()) {
       pending.reject(new PluginDisconnectedError())
-      warn(`[USER-ACTION] Cancelled pending action: ${actionId}`)
+      debug(`Cancelled pending action: ${actionId}`)
     }
     this.pendingActions.clear()
   }

package/src/helpers/watcher.test.ts

@@ -0,0 +1,74 @@
+import { describe, expect, it, vi, afterEach } from "vitest"
+import fs from "fs/promises"
+import os from "os"
+import path from "path"
+import { initWatcher } from "./watcher.js"
+
+const createdWatchers: any[] = []
+
+vi.mock("chokidar", () => {
+  const createMockWatcher = () => {
+    const handlers: Record<string, Array<(filePath: string) => any>> = {
+      add: [],
+      change: [],
+      unlink: [],
+    }
+
+    return {
+      on(event: "add" | "change" | "unlink", handler: (file: string) => any) {
+        handlers[event]?.push(handler)
+        return this
+      },
+      async __emit(event: "add" | "change" | "unlink", filePath: string) {
+        for (const handler of handlers[event] ?? []) {
+          await handler(filePath)
+        }
+      },
+      close: vi.fn().mockResolvedValue(undefined),
+    }
+  }
+
+  const watch = vi.fn(() => {
+    const instance = createMockWatcher()
+    createdWatchers.push(instance)
+    return instance
+  })
+
+  return { default: { watch }, watch }
+})
+
+describe("initWatcher", () => {
+  afterEach(() => {
+    createdWatchers.length = 0
+  })
+
+  it("ignores unsupported extensions and sanitizes added files", async () => {
+    const tmpDir = await fs.mkdtemp(path.join(os.tmpdir(), "framer-watcher-"))
+    const events: any[] = []
+    const watcher = initWatcher(tmpDir)
+    watcher.on("change", (event) => events.push(event))
+    const rawWatcher = createdWatchers.at(-1)!
+
+    const unsupportedPath = path.join(tmpDir, "note.txt")
+    await fs.writeFile(unsupportedPath, "hello", "utf-8")
+    await rawWatcher.__emit("add", unsupportedPath)
+    expect(events).toHaveLength(0)
+
+    const rawPath = path.join(tmpDir, "bad name!.tsx")
+    await fs.writeFile(rawPath, "export const X = 1;", "utf-8")
+    await rawWatcher.__emit("add", rawPath)
+
+    const addEvent = events.find((e) => e.kind === "add")
+    expect(addEvent).toBeDefined()
+    expect(addEvent?.relativePath).toBe("bad_name_.tsx")
+    expect(addEvent?.content).toContain("export const X")
+
+    const renamedPath = path.join(tmpDir, "bad_name_.tsx")
+    await expect(fs.readFile(renamedPath, "utf-8")).resolves.toContain(
+      "export const X"
+    )
+
+    await watcher.close()
+    await fs.rm(tmpDir, { recursive: true, force: true })
+  })
+})

package/src/helpers/watcher.ts

@@ -16,7 +16,7 @@ import {
   sanitizeFilePath,
 } from "@code-link/shared"
 import { getRelativePath } from "../utils/paths.js"
-import { info, debug, warn } from "../utils/logging.js"
+import { debug, warn } from "../utils/logging.js"
 
 export interface Watcher {
   on(event: "change", handler: (event: WatcherEvent) => void): void
@@ -35,7 +35,7 @@ export function initWatcher(filesDir: string): Watcher {
     ignoreInitial: false, // Emit add events for existing files so we can sanitize them
   })
 
-  info(`Watching directory: ${filesDir}`)
+  debug(`Watching directory: ${filesDir}`)
 
   // Helper to emit normalized events
   const emitEvent = async (
@@ -62,15 +62,10 @@ export function initWatcher(filesDir: string): Watcher {
       try {
         await fs.mkdir(path.dirname(newAbsolutePath), { recursive: true })
         await fs.rename(absolutePath, newAbsolutePath)
-        info(
-          `Renamed ${rawRelativePath} -> ${relativePath} to match Framer rules`
-        )
+        debug(`Renamed ${rawRelativePath} -> ${relativePath}`)
         effectiveAbsolutePath = newAbsolutePath
       } catch (err) {
-        warn(
-          `Failed to rename ${rawRelativePath} to ${relativePath}, syncing with original name`,
-          err
-        )
+        warn(`Failed to rename ${rawRelativePath}`, err)
       }
     }
 

package/src/index.ts

@@ -10,8 +10,8 @@
 import { Command } from "commander"
 import { start } from "./controller.js"
 import type { Config } from "./types.js"
-import { setLogLevel, LogLevel, info } from "./utils/logging.js"
-import { getPortFromHash } from "./utils/hashing.js"
+import { setLogLevel, LogLevel, banner, warn } from "./utils/logging.js"
+import { getPortFromHash } from "@code-link/shared"
 import { getProjectHashFromCwd } from "./utils/project.js"
 
 const program = new Command()
@@ -77,6 +77,9 @@ program
 
     const port = getPortFromHash(projectHash)
 
+    // Show startup banner
+    banner("0.1.3", port)
+
     const config: Config = {
       port,
       projectHash,
@@ -88,8 +91,8 @@ program
     }
 
     if (config.dangerouslyAutoDelete) {
-      info(
-        "⚠️  Auto-delete mode enabled - files will be deleted without confirmation"
+      warn(
+        "Auto-delete mode enabled - files will be deleted without confirmation"
       )
     }