opendocker 0.1.0 → 0.1.1

package/src/layouts/BaseLayout.tsx

@@ -1,60 +0,0 @@
-
-import { useTerminalDimensions } from "@opentui/react";
-import { useState, useEffect } from "react";
-import { colors, padding } from "../utils/styling";
-import { TextAttributes } from "@opentui/core";
-import { useApplicationStore } from "../stores/application";
-import { SplitBorder } from "../components/Border";
-
-export default function BaseLayout({ children }: { children: React.ReactNode }) {
-    const { activePane, setActivePane } = useApplicationStore((state) => state);
-    const dimensions = useTerminalDimensions();
-    const [pwd, setPwd] = useState<string>("");
-
-    useEffect(() => {
-        Bun.$`pwd`.quiet().then(result => setPwd(result.text()));
-        setActivePane("containers");
-        
-    }, [setActivePane]);
-
-    return (
-        <box 
-            width={dimensions.width}
-            height={dimensions.height}
-            backgroundColor={colors.background}
-        >
-            <box
-                flexDirection="row"
-                gap={1}
-                width="100%"
-                {...padding}
-            >
-                {children}
-            </box>
-            <box
-                height={1}
-                backgroundColor={colors.backgroundPanel}
-                flexDirection="row"
-                justifyContent="space-between"
-                flexShrink={0}
-            >
-                <box flexDirection="row">
-                    <box flexDirection="row" backgroundColor={colors.backgroundElement} paddingLeft={1} paddingRight={1}>
-                        <text fg={colors.textMuted}>open</text>
-                        <text attributes={TextAttributes.BOLD}>docker </text>
-                        <text fg={colors.textMuted}>alpha</text>
-                    </box>
-                    <box paddingLeft={1} paddingRight={1}>
-                        <text fg={colors.textMuted}>~{pwd}</text>
-                    </box>
-                </box>
-                <box flexDirection="row" gap={1}>
-                    <text fg={colors.textMuted}>tab</text>
-                    <box backgroundColor={colors.accent} paddingLeft={1} paddingRight={1} {...SplitBorder} borderColor={colors.backgroundPanel}>
-                        <text fg={colors.backgroundPanel} attributes={TextAttributes.BOLD}>{activePane}</text>
-                    </box>
-                </box>
-            </box>
-        </box>
-    )
-}

package/src/lib/docker.ts

@@ -1,68 +0,0 @@
-
-export class Docker {
-    private socket = "/var/run/docker.sock";
-    
-    private async request(path: string) {
-        try {
-            const process = Bun.spawn([
-                "curl", "-s", "--unix-socket", this.socket, 
-                `http://localhost${path}`
-            ], { stdout: "pipe", stderr: "pipe" });
-
-            const output = await new Response(process.stdout).text();
-            process.kill();
-            
-            return JSON.parse(output);
-        } catch (error) {
-            console.error('Docker socket request failed:', error);
-            throw error;
-        }
-    }
-
-    async getContainers() {
-        return this.request("/v1.41/containers/json?all=true");
-    }
-
-    async watch(callback: (containers: any[]) => void) {
-        try {
-            let containers = await this.getContainers();
-            callback(containers);
-
-            const process = Bun.spawn([
-                "curl", "-s", "--no-buffer", "--unix-socket", this.socket,
-                "http://localhost/v1.41/events"
-            ], { stdout: "pipe", stderr: "pipe" });
-
-            const reader = process.stdout.getReader();
-            const decoder = new TextDecoder();
-            let buffer = "";
-
-            while (true) {
-                const { value, done } = await reader.read();
-                if (done) break;
-
-                buffer += decoder.decode(value, { stream: true });
-                const lines = buffer.split('\n');
-                buffer = lines.pop() || "";
-
-                for (const line of lines) {
-                    if (line.trim()) {
-                        try {
-                            const event = JSON.parse(line);
-                            if (event.Type === "container") {
-                                containers = await this.getContainers();
-                                callback(containers);
-                            }
-                        } catch (parseError) {
-                            console.error('Failed to parse event:', line, parseError);
-                        }
-                    }
-                }
-            }
-            
-        } catch (error) {
-            console.error('Docker watch failed', error);
-            throw error;
-        }
-    }
-}

package/src/main.tsx

@@ -1,40 +0,0 @@
-#!/usr/bin/env bun
-
-import { useRenderer, render, useKeyboard } from "@opentui/react";
-import ContainersPane from "./components/ContainersPane";
-import LogsPane from "./components/LogsPane";
-import ImagesPane from "./components/ImagesPane";
-import VolumesPane from "./components/VolumesPanes";
-import BaseLayout from "./layouts/BaseLayout";
-
-function App() {
-    const renderer = useRenderer();
-
-    useKeyboard((key) => {
-        if (key.name === "q") {
-            process.exit(0);
-        }
-
-        if (key.ctrl && key.name === "k") {
-            renderer?.console.toggle()
-            renderer?.toggleDebugOverlay()
-        }
-    })
-
-    return (
-        <BaseLayout>
-            <box
-                flexDirection="column"
-                width="30%"
-                gap={1}
-            >
-                <ContainersPane />
-                <ImagesPane />
-                <VolumesPane />
-            </box>
-            <LogsPane />
-        </BaseLayout>
-    )
-}
-
-render (<App />);

package/src/stores/application.ts

@@ -1,11 +0,0 @@
-import { create } from "zustand";
-
-interface ApplicationStore {
-    activePane: string;
-    setActivePane: (activePane: string) => void;
-}
-
-export const useApplicationStore = create<ApplicationStore>((set) => ({
-    activePane: "containers",
-    setActivePane: (activePane) => set({ activePane }),
-}));

package/src/stores/containers.ts

@@ -1,22 +0,0 @@
-import { create } from "zustand";
-
-export type Container = {
-    name: string;
-    status: string;
-    health: string;
-    state: string;
-}
-
-interface ContainerStore {
-    containers: Container[];
-    activeContainer: Container;
-    setContainers: (containers: Container[]) => void;
-    setActiveContainer: (activeContainer: Container) => void;
-}
-
-export const useContainerStore = create<ContainerStore>((set) => ({
-    containers: [],
-    activeContainer: null,
-    setContainers: (containers: Container[]) => set({ containers }),
-    setActiveContainer: (activeContainer) => set({ activeContainer }),
-}));

package/src/stores/images.ts

@@ -1,11 +0,0 @@
-import { create } from "zustand";
-
-export interface ImageStore {
-    images: string[];
-    setImages: (images: string[]) => void;
-}
-
-export const useImageStore = create<ImageStore>((set) => ({
-  images: [],
-  setImages: (images: string[]) => set({ images }),
-}));

package/src/stores/volumes.ts

@@ -1,11 +0,0 @@
-import { create } from "zustand";
-
-interface VolumeStore {
-    volumes: string[];
-    setVolumes: (volumes: string[]) => void;
-}
-
-export const useVolumeStore = create<VolumeStore>((set) => ({
-    volumes: [],
-    setVolumes: (volumes: string[]) => set({ volumes }),
-}));

package/src/utils/styling.ts

@@ -1,198 +0,0 @@
-export const colors = {
-    primary: '#fab283',
-    secondary: '#5c9cf5',
-    accent: '#9d7cd8',
-    error: '#e06c75',
-    warning: '#f5a742',
-    success: '#7fd88f',
-    info: '#56b6c2',
-    text: '#eeeeee',
-    textMuted: '#808080',
-    background: '#0a0a0a',
-    backgroundPanel: '#141414',
-    backgroundElement: '#1e1e1e',
-    border: '#484848',
-    borderActive: '#606060',
-    borderSubtle: '#3c3c3c',
-}
-
-export const padding = {
-    paddingTop: 1,
-    paddingBottom: 1,
-    paddingLeft: 2,
-    paddingRight: 2,
-}
-
-export const termColors = {
-   gray01: "#111111",
-   gray02: "#191919",
-   gray03: "#222222",
-   gray04: "#2a2a2a",
-   gray05: "#313131",
-   gray06: "#3a3a3a",
-   gray07: "#484848",
-   gray08: "#606060",
-   gray09: "#6e6e6e",
-   gray10: "#7b7b7b",
-   gray11: "#b4b4b4",
-   gray12: "#eeeeee",
-   gray13: "#ffffff",
-   gray1: "#0b0b0b",
-   gray00: "#0d0d0d",
-   red01: "#191111",
-   red02: "#201314",
-   red03: "#3b1219",
-   red04: "#500f1c",
-   red05: "#611623",
-   red06: "#72232d",
-   red07: "#8c333a",
-   red08: "#b54548",
-   red09: "#e5484d",
-   red10: "#ec5d5e",
-   red11: "#ff9592",
-   red12: "#ffd1d9",
-   green01: "#0e1512",
-   green02: "#121b17",
-   green03: "#132d21",
-   green04: "#113b29",
-   green05: "#174933",
-   green06: "#20573e",
-   green07: "#28684a",
-   green08: "#2f7c57",
-   green09: "#30a46c",
-   green10: "#33b074",
-   green11: "#3dd68c",
-   green12: "#b1f1cb",
-   blue01: "#0d1520",
-   blue02: "#111927",
-   blue03: "#0d2847",
-   blue04: "#003362",
-   blue05: "#004074",
-   blue06: "#104d87",
-   blue07: "#205d9e",
-   blue08: "#2870bd",
-   blue09: "#0090ff",
-   blue10: "#3b9eff",
-   blue11: "#70b8ff",
-   blue12: "#c2e6ff",
-   orange01: "#17120e",
-   orange02: "#1e160f",
-   orange03: "#331e0b",
-   orange04: "#462100",
-   orange05: "#562800",
-   orange06: "#66350c",
-   orange07: "#7e451d",
-   orange08: "#a35829",
-   orange09: "#f76b15",
-   orange10: "#ff801f",
-   orange11: "#ffa057",
-   orange12: "#ffe0c2",
-   purple01: "#18111b",
-   purple02: "#1e1523",
-   purple03: "#301c3b",
-   purple04: "#3d224e",
-   purple05: "#48295c",
-   purple06: "#54346b",
-   purple07: "#664282",
-   purple08: "#8457aa",
-   purple09: "#8e4ec6",
-   purple10: "#9a5cd0",
-   purple11: "#d19dff",
-   purple12: "#ecd9fa",
-   teal01: "#0d1514",
-   teal02: "#111c1b",
-   teal03: "#0d2d2a",
-   teal04: "#023b37",
-   teal05: "#084843",
-   teal06: "#145750",
-   teal07: "#1c6961",
-   teal08: "#207e73",
-   teal09: "#12a594",
-   teal10: "#0eb39e",
-   teal11: "#0bd8b6",
-   teal12: "#adf0dd",
-   yellow01: "#14120b",
-   yellow02: "#1b180f",
-   yellow03: "#2d2305",
-   yellow04: "#362b00",
-   yellow05: "#433500",
-   yellow06: "#524202",
-   yellow07: "#665417",
-   yellow08: "#836a21",
-   yellow09: "#ffe629",
-   yellow10: "#ffff57",
-   yellow11: "#f5e147",
-   yellow12: "#f6eeb4",
-   pink01: "#191117",
-   pink02: "#21121d",
-   pink03: "#37172f",
-   pink04: "#4b143d",
-   pink05: "#591c47",
-   pink06: "#692955",
-   pink07: "#833869",
-   pink08: "#a84885",
-   pink09: "#d6409f",
-   pink10: "#de51a8",
-   pink11: "#ff8dcc",
-   pink12: "#fdd1ea",
-   brown01: "#12110f",
-   brown02: "#1c1816",
-   brown03: "#28211d",
-   brown04: "#322922",
-   brown05: "#3e3128",
-   brown06: "#4d3c2f",
-   brown07: "#614a39",
-   brown08: "#7c5f46",
-   brown09: "#ad7f58",
-   brown10: "#b88c67",
-   brown11: "#dbb594",
-   brown12: "#f2e1ca",
-   iris01: "#13131e",
-   iris02: "#171625",
-   iris03: "#202248",
-   iris04: "#262a65",
-   iris05: "#303374",
-   iris06: "#3d3e82",
-   iris07: "#4a4a95",
-   iris08: "#5958b1",
-   iris09: "#5b5bd6",
-   iris10: "#6e6ade",
-   iris11: "#b1a9ff",
-   iris12: "#e0dffe",
-   lime01: "#11130c",
-   lime02: "#151a10",
-   lime03: "#1f2917",
-   lime04: "#29371d",
-   lime05: "#334423",
-   lime06: "#3d522a",
-   lime07: "#496231",
-   lime08: "#577538",
-   lime09: "#bdee63",
-   lime10: "#d4ff70",
-   lime11: "#bde56c",
-   lime12: "#e3f7ba",
-   amber01: "#16120c",
-   amber02: "#1d180f",
-   amber03: "#302008",
-   amber04: "#3f2700",
-   amber05: "#4d3000",
-   amber06: "#5c3d05",
-   amber07: "#714f19",
-   amber08: "#8f6424",
-   amber09: "#ffc53d",
-   amber10: "#ffd60a",
-   amber11: "#ffca16",
-   amber12: "#ffe7b3",
-   tomato01: "#181111",
-   tomato02: "#1f1513",
-   tomato03: "#391714",
-   tomato04: "#4e1511",
-   tomato05: "#5e1c16",
-   tomato06: "#6e2920",
-   tomato07: "#853a2d",
-   tomato08: "#ac4d39",
-   tomato09: "#e54d2e",
-   tomato10: "#ec6142",
-   tomato11: "#ff977d",
-   tomato12: "#fbd3cb",
-}

package/tsconfig.json

@@ -1,15 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "extends": "@tsconfig/bun/tsconfig.json",
-  "compilerOptions": {
-    "jsx": "preserve",
-    "jsxImportSource": "@opentui/react",
-    "lib": ["ESNext", "DOM", "DOM.Iterable"],
-    "customConditions": ["browser"],
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"],
-      "@tui/*": ["./src/cli/cmd/tui/*"]
-    }
-  }
-}