@muhammedaksam/easiarr 0.1.0

package/src/ui/components/PageLayout.ts

@@ -0,0 +1,104 @@
+import { BoxRenderable, TextRenderable, type CliRenderer } from "@opentui/core"
+import { getVersion } from "../../VersionInfo"
+
+export interface PageLayoutOptions {
+  title: string
+  stepInfo?: string
+  footerHint?: string
+}
+
+export interface PageLayoutResult {
+  container: BoxRenderable
+  content: BoxRenderable
+}
+
+export function createPageLayout(renderer: CliRenderer, options: PageLayoutOptions): PageLayoutResult {
+  const { title, stepInfo, footerHint } = options
+  const idPrefix = title
+    .replace(/[^a-zA-Z]/g, "")
+    .slice(0, 10)
+    .toLowerCase()
+
+  // Create main container
+  const container = new BoxRenderable(renderer, {
+    id: `${idPrefix}-page-layout`,
+    width: "100%",
+    height: "100%",
+    flexDirection: "column",
+    backgroundColor: "#1a1a2e",
+  })
+
+  // Header
+  const headerText = stepInfo ? `easiarr | ${stepInfo}` : "easiarr"
+
+  const headerBox = new BoxRenderable(renderer, {
+    id: `${idPrefix}-header-box`,
+    width: "100%",
+    height: 3,
+    borderStyle: "single",
+    borderColor: "#4a9eff",
+    title: headerText,
+    titleAlignment: "left",
+    paddingLeft: 1,
+    paddingRight: 1,
+    backgroundColor: "#1a1a2e",
+  })
+
+  headerBox.add(
+    new TextRenderable(renderer, {
+      id: `${idPrefix}-page-title`,
+      content: title,
+      fg: "#ffffff",
+    })
+  )
+
+  container.add(headerBox)
+
+  // Content area (flex grow)
+  const content = new BoxRenderable(renderer, {
+    id: `${idPrefix}-content`,
+    flexGrow: 1,
+    width: "100%",
+    padding: 1,
+    flexDirection: "column",
+    backgroundColor: "#1a1a2e",
+  })
+
+  container.add(content)
+
+  // Footer box with border
+  const footerBox = new BoxRenderable(renderer, {
+    id: `${idPrefix}-footer-box`,
+    borderStyle: "single",
+    borderColor: "#4a9eff",
+    paddingLeft: 1,
+    paddingRight: 1,
+    width: "100%",
+    flexDirection: "row",
+    justifyContent: "space-between",
+    backgroundColor: "#1a1a2e",
+  })
+
+  // Hint text
+  const hintText = footerHint || "↑↓ Navigate  Enter Select  q Quit"
+  footerBox.add(
+    new TextRenderable(renderer, {
+      id: `${idPrefix}-footer-hint`,
+      content: hintText,
+      fg: "#aaaaaa",
+    })
+  )
+
+  // Version
+  footerBox.add(
+    new TextRenderable(renderer, {
+      id: `${idPrefix}-version`,
+      content: getVersion(),
+      fg: "#555555",
+    })
+  )
+
+  container.add(footerBox)
+
+  return { container, content }
+}

package/src/ui/index.ts

@@ -0,0 +1 @@
+export * from "./App"

package/src/ui/screens/AdvancedSettings.ts

@@ -0,0 +1,177 @@
+/**
+ * Advanced Settings Screen
+ * Edit configuration files directly
+ */
+
+import {
+  BoxRenderable,
+  SelectRenderable,
+  SelectRenderableEvents,
+  CliRenderer,
+  RenderContext,
+  KeyEvent,
+} from "@opentui/core"
+import { App } from "../App"
+import { EasiarrConfig } from "../../config/schema"
+import { createPageLayout } from "../components/PageLayout"
+import { FileEditor } from "../components/FileEditor"
+import { readFile, writeFile } from "node:fs/promises"
+import { getConfigPath, getComposePath } from "../../config/manager"
+import { existsSync } from "node:fs"
+
+export class AdvancedSettings {
+  private renderer: CliRenderer
+  private container: BoxRenderable
+  private app: App
+  private config: EasiarrConfig
+  private keyHandler: ((k: KeyEvent) => void) | null = null
+  private activeEditor: FileEditor | null = null
+
+  constructor(renderer: CliRenderer | RenderContext, container: BoxRenderable, app: App, config: EasiarrConfig) {
+    this.renderer = renderer as CliRenderer
+    this.container = container
+    this.app = app
+    this.config = config
+
+    this.renderMenu()
+  }
+
+  private clear() {
+    if (this.keyHandler) {
+      this.renderer.keyInput.off("keypress", this.keyHandler)
+      this.keyHandler = null
+    }
+    if (this.activeEditor) {
+      this.activeEditor.destroy()
+      this.activeEditor = null
+    }
+    const children = this.container.getChildren()
+    for (const child of children) {
+      this.container.remove(child.id)
+    }
+  }
+
+  private renderMenu(): void {
+    this.clear()
+
+    const { container: page, content } = createPageLayout(this.renderer, {
+      title: "Advanced Settings",
+      stepInfo: "Direct File Editing",
+      footerHint: "Enter Select  Esc Back",
+    })
+
+    const menu = new SelectRenderable(this.renderer, {
+      id: "advanced-menu",
+      width: "100%",
+      flexGrow: 1,
+      options: [
+        {
+          name: "📄 Edit config.json",
+          description: "Raw application configuration",
+        },
+        {
+          name: "🔑 Edit .env Secrets",
+          description: "Environment variables and secrets",
+        },
+        {
+          name: "🐳 View docker-compose.yml",
+          description: "Generated Docker composition (Read-only recommended)",
+        },
+        {
+          name: "◀ Back",
+          description: "Return to Main Menu",
+        },
+      ],
+    })
+
+    menu.on(SelectRenderableEvents.ITEM_SELECTED, async (index) => {
+      switch (index) {
+        case 0:
+          await this.editFile("config.json", getConfigPath(), async (content) => {
+            // Validate JSON?
+            try {
+              const newConfig = JSON.parse(content)
+              await writeFile(getConfigPath(), content, "utf-8")
+              this.app.saveAndReload(newConfig)
+            } catch {
+              // Show error? For now just log/ignore or loop
+              // Ideally show an error dialog.
+            }
+          })
+          break
+        case 1: {
+          const envPath = getComposePath().replace("docker-compose.yml", ".env")
+          await this.editFile(".env", envPath, async (content) => {
+            await writeFile(envPath, content, "utf-8")
+            this.renderMenu()
+          })
+          break
+        }
+        case 2:
+          await this.editFile("docker-compose.yml", getComposePath(), async (content) => {
+            await writeFile(getComposePath(), content, "utf-8")
+            this.renderMenu()
+          })
+          break
+        case 3:
+          this.app.navigateTo("main")
+          break
+      }
+    })
+
+    content.add(menu)
+    menu.focus()
+
+    this.keyHandler = (k: KeyEvent) => {
+      if (k.name === "escape") {
+        this.app.navigateTo("main")
+      }
+    }
+    this.renderer.keyInput.on("keypress", this.keyHandler)
+
+    this.container.add(page)
+  }
+
+  private async editFile(name: string, path: string, onSave: (content: string) => Promise<void>) {
+    this.clear()
+
+    let initialContent = ""
+    try {
+      if (existsSync(path)) {
+        initialContent = await readFile(path, "utf-8")
+      }
+    } catch {
+      initialContent = "// Failed to read file or file does not exist"
+    }
+
+    const editor = new FileEditor(this.renderer, {
+      id: `editor-${name}`,
+      width: "100%",
+      height: "100%",
+      filename: name,
+      initialContent,
+      onSave: async (content) => {
+        await onSave(content)
+        // onSave callback might navigate away (reload), but if not:
+        if (name !== "config.json") {
+          this.renderMenu()
+        }
+      },
+      onCancel: () => {
+        this.renderMenu()
+      },
+    })
+
+    // FileEditor handles its own keys?
+    // We cleared our keyHandler in this.clear().
+    // FileEditor constructor attaches listeners?
+    // Check FileEditor implementation again:
+    // It attaches to this.textarea.on("keypress").
+    // If that works, fine.
+
+    // Wait, FileEditor focus?
+    this.container.add(editor)
+    this.activeEditor = editor
+    setTimeout(() => editor.focus(), 10)
+  }
+}

package/src/ui/screens/ApiKeyViewer.ts

@@ -0,0 +1,223 @@
+import { BoxRenderable, CliRenderer, TextRenderable, KeyEvent } from "@opentui/core"
+import { existsSync, readFileSync } from "node:fs"
+import { writeFile, readFile } from "node:fs/promises"
+import { join } from "node:path"
+import { createPageLayout } from "../components/PageLayout"
+import { EasiarrConfig } from "../../config/schema"
+import { getApp } from "../../apps/registry"
+import { getComposePath } from "../../config/manager"
+
+export class ApiKeyViewer extends BoxRenderable {
+  private config: EasiarrConfig
+  private keys: Array<{ appId: string; app: string; key: string; status: "found" | "missing" | "error" }> = []
+  private keyHandler!: (key: KeyEvent) => void
+  private cliRenderer: CliRenderer
+  private statusText: TextRenderable | null = null
+
+  constructor(renderer: CliRenderer, config: EasiarrConfig, onBack: () => void) {
+    super(renderer, {
+      id: "api-key-viewer",
+      width: "100%",
+      height: "100%",
+      backgroundColor: "#111111", // Dark bg
+      zIndex: 200, // Above main menu
+    })
+    this.cliRenderer = renderer
+    this.config = config
+
+    this.scanKeys()
+    this.renderPage(onBack)
+  }
+
+  private scanKeys() {
+    this.keys = []
+
+    for (const appConfig of this.config.apps) {
+      if (!appConfig.enabled) continue
+
+      const appDef = getApp(appConfig.id)
+      if (!appDef || !appDef.apiKeyMeta) continue
+
+      try {
+        // Resolve config path
+        // Volumes are: ["${root}/config/radarr:/config", ...]
+        // We assume index 0 is the config volume
+        const volumes = appDef.volumes(this.config.rootDir)
+        if (volumes.length === 0) continue
+
+        const parts = volumes[0].split(":")
+        const hostPath = parts[0]
+
+        const configFilePath = join(hostPath, appDef.apiKeyMeta.configFile)
+
+        if (existsSync(configFilePath)) {
+          const content = readFileSync(configFilePath, "utf-8")
+
+          if (appDef.apiKeyMeta.parser === "regex") {
+            const regex = new RegExp(appDef.apiKeyMeta.selector)
+            const match = regex.exec(content)
+            if (match && match[1]) {
+              this.keys.push({ appId: appDef.id, app: appDef.name, key: match[1], status: "found" })
+            } else {
+              this.keys.push({ appId: appDef.id, app: appDef.name, key: "Not found in file", status: "error" })
+            }
+          } else if (appDef.apiKeyMeta.parser === "json") {
+            const json = JSON.parse(content)
+            // Support dot notation like "main.apiKey"
+            const value = appDef.apiKeyMeta.selector.split(".").reduce((obj, key) => obj?.[key], json)
+            if (value && typeof value === "string") {
+              this.keys.push({ appId: appDef.id, app: appDef.name, key: value, status: "found" })
+            } else {
+              this.keys.push({ appId: appDef.id, app: appDef.name, key: "Key not found in JSON", status: "error" })
+            }
+          }
+        } else {
+          this.keys.push({
+            appId: appDef.id,
+            app: appDef.name,
+            key: "Config file not found (Run app first)",
+            status: "missing",
+          })
+        }
+      } catch {
+        this.keys.push({ appId: appDef.id, app: appDef.name, key: "Error reading file", status: "error" })
+      }
+    }
+  }
+
+  private renderPage(onBack: () => void) {
+    const foundKeys = this.keys.filter((k) => k.status === "found")
+    const hasFoundKeys = foundKeys.length > 0
+
+    const { container, content } = createPageLayout(this.cliRenderer, {
+      title: "API Key Extractor",
+      stepInfo: "Found Keys",
+      footerHint: hasFoundKeys ? "S Save to .env  Esc/Enter Return" : "Esc/Enter: Return",
+    })
+    this.add(container)
+
+    if (this.keys.length === 0) {
+      content.add(
+        new TextRenderable(this.cliRenderer, {
+          content: "No enabled apps have extractable API keys.",
+          fg: "#aaaaaa",
+        })
+      )
+    } else {
+      // Header
+      const header = new BoxRenderable(this.cliRenderer, {
+        width: "100%",
+        height: 1,
+        flexDirection: "row",
+        marginBottom: 1,
+      })
+      header.add(
+        new TextRenderable(this.cliRenderer, { content: "Application".padEnd(20), fg: "#ffffff", attributes: 1 })
+      )
+      header.add(new TextRenderable(this.cliRenderer, { content: "API Key", fg: "#ffffff", attributes: 1 }))
+      content.add(header)
+
+      // Rows
+      this.keys.forEach((k) => {
+        const row = new BoxRenderable(this.cliRenderer, {
+          width: "100%",
+          height: 1,
+          flexDirection: "row",
+          marginBottom: 0,
+        })
+
+        // App Name
+        row.add(
+          new TextRenderable(this.cliRenderer, {
+            content: k.app.padEnd(20),
+            fg: k.status === "found" ? "#50fa7b" : "#ff5555",
+          })
+        )
+
+        // Key
+        row.add(
+          new TextRenderable(this.cliRenderer, {
+            content: k.key,
+            fg: k.status === "found" ? "#f1fa8c" : "#6272a4",
+          })
+        )
+        content.add(row)
+      })
+
+      // Status text for feedback
+      content.add(new BoxRenderable(this.cliRenderer, { width: 1, height: 1 })) // Spacer
+      this.statusText = new TextRenderable(this.cliRenderer, {
+        id: "api-key-status",
+        content: "",
+        fg: "#50fa7b",
+      })
+      content.add(this.statusText)
+    }
+
+    // Key Handler
+    this.keyHandler = (key: KeyEvent) => {
+      if (key.name === "escape" || key.name === "enter") {
+        this.destroy()
+        onBack()
+      } else if (key.name === "s" && hasFoundKeys) {
+        this.saveToEnv()
+      }
+    }
+    this.cliRenderer.keyInput.on("keypress", this.keyHandler)
+  }
+
+  public destroy() {
+    this.cliRenderer.keyInput.off("keypress", this.keyHandler)
+    if (this.parent) {
+      if (this.id) {
+        try {
+          this.parent.remove(this.id)
+        } catch {
+          /* ignore */
+        }
+      }
+    }
+  }
+
+  private async saveToEnv() {
+    const foundKeys = this.keys.filter((k) => k.status === "found")
+    if (foundKeys.length === 0) return
+
+    try {
+      const envPath = getComposePath().replace("docker-compose.yml", ".env")
+
+      // Read existing .env if present
+      const currentEnv: Record<string, string> = {}
+      if (existsSync(envPath)) {
+        const content = await readFile(envPath, "utf-8")
+        content.split("\n").forEach((line) => {
+          const [key, ...val] = line.split("=")
+          if (key && val.length > 0) currentEnv[key.trim()] = val.join("=").trim()
+        })
+      }
+
+      // Add API keys with format API_KEY_SONARR, API_KEY_RADARR, etc.
+      for (const k of foundKeys) {
+        const envKey = `API_KEY_${k.appId.toUpperCase()}`
+        currentEnv[envKey] = k.key
+      }
+
+      // Reconstruct .env content
+      const envContent = Object.entries(currentEnv)
+        .map(([k, v]) => `${k}=${v}`)
+        .join("\n")
+
+      await writeFile(envPath, envContent, "utf-8")
+
+      // Update status
+      if (this.statusText) {
+        this.statusText.content = `✓ Saved ${foundKeys.length} API key(s) to .env`
+      }
+    } catch (e) {
+      if (this.statusText) {
+        this.statusText.content = `✗ Error saving to .env: ${e}`
+        this.statusText.fg = "#ff5555"
+      }
+    }
+  }
+}