refactor: moving from nextjs to vite+react

src/utils/api.ts

@@ -1,36 +0,0 @@
-import { httpBatchLink, loggerLink } from "@trpc/client";
-import { createTRPCNext } from "@trpc/next";
-import { type inferRouterInputs, type inferRouterOutputs } from "@trpc/server";
-import superjson from "superjson";
-
-import { type AppRouter } from "~/server/api/root";
-
-const getBaseUrl = () => {
-  if (typeof window !== "undefined") return ""; // browser should use relative url
-  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`; // SSR should use vercel url
-  return `http://localhost:${process.env.PORT ?? 3000}`; // dev SSR should use localhost
-};
-
-export const api = createTRPCNext<AppRouter>({
-  config() {
-    return {
-      transformer: superjson,
-
-      links: [
-        loggerLink({
-          enabled: opts =>
-            process.env.NODE_ENV === "development" ||
-            (opts.direction === "down" && opts.result instanceof Error),
-        }),
-        httpBatchLink({
-          url: `${getBaseUrl()}/api/trpc`,
-        }),
-      ],
-    };
-  },
-  ssr: false,
-});
-
-export type RouterInputs = inferRouterInputs<AppRouter>;
-
-export type RouterOutputs = inferRouterOutputs<AppRouter>;

src/utils/filesystem.ts

@@ -1,32 +0,0 @@
-import { Cell } from "./terminal/cell";
-import { theme } from "./terminal/theme";
-
-export const FILE_STYLES = {
-  directory: {
-    char: "\ue6ad", //  \ue6ad ||| \ueaf6
-    foreground: theme.blue,
-  },
-  md: {
-    char: "\ue73e",
-    foreground: theme.blue,
-  },
-  asc: {
-    char: "\uf43d",
-    foreground: theme.yellow,
-  },
-} as const satisfies Record<string, Cell>;
-
-export type FileType = keyof typeof FILE_STYLES;
-
-export type File = {
-  name: string;
-} & (
-  | {
-      type: Exclude<FileType, "directory">;
-    }
-  | {
-      type: "directory";
-      children: Array<File>;
-      folded: boolean;
-    }
-);

src/utils/math.ts

@@ -1,7 +0,0 @@
-export const clamp = (v: number, min: number, max: number): number =>
-  Math.min(Math.max(min, v), max);
-
-export const clamp01 = (v: number): number => clamp(v, 0, 1);
-
-export const floorAll = (...xs: Array<number>): Array<number> =>
-  xs.map(Math.floor);

src/utils/terminal/cell.ts

@@ -1,9 +0,0 @@
-export type Cell = {
-  char: string;
-} & CellStyle;
-
-export type CellStyle = Partial<{
-  foreground: string;
-  background: string;
-  fontWeight: number;
-}>;

src/utils/terminal/element.ts

@@ -1,7 +0,0 @@
-import { type Cell } from "./cell";
-
-export interface TerminalElement {
-  readonly data: Array<Array<Cell>>;
-  readonly width: number;
-  readonly height: number;
-}

src/utils/terminal/elements/box.ts

@@ -1,38 +0,0 @@
-import { type Cell, type CellStyle } from "../cell";
-import { TerminalRenderer } from "../renderer";
-import { type TerminalElement } from "../element";
-
-export class TerminalBoxElement implements TerminalElement {
-  public readonly data: Array<Array<Cell>>;
-
-  constructor(
-    public readonly width: number,
-    public readonly height: number,
-    style: CellStyle = {},
-  ) {
-    const canvas = new TerminalRenderer(width, height, style);
-
-    if (width == 1 && height > 1) {
-      for (let y = 0; y < height - 1; y++) {
-        canvas.write(0, y, "│");
-      }
-    } else if (height == 1 && width > 1) {
-      canvas.write(0, 0, "─".repeat(width - 2));
-    } else {
-      canvas.write(0, 0, "┌");
-      canvas.write(width - 1, 0, "┐");
-      canvas.write(0, height - 1, "└");
-      canvas.write(width - 1, height - 1, "┘");
-
-      canvas.write(1, 0, "─".repeat(width - 2));
-      canvas.write(1, height - 1, "─".repeat(width - 2));
-
-      for (let y = 1; y < height - 1; y++) {
-        canvas.write(0, y, "│");
-        canvas.write(width - 1, y, "│");
-      }
-    }
-
-    this.data = canvas.data;
-  }
-}

src/utils/terminal/renderer.tsx

@@ -1,124 +0,0 @@
-import { type ReactNode } from "react";
-import { floorAll } from "../math";
-import { type CellStyle, type Cell } from "./cell";
-import { type TerminalElement } from "./element";
-
-export class TerminalRenderer implements TerminalElement {
-  public readonly data: Array<Array<Cell>>;
-
-  constructor(
-    public readonly width: number,
-    public readonly height: number,
-    public readonly defaultStyle: CellStyle = {},
-  ) {
-    [this.width, this.height] = floorAll(this.width, this.height);
-
-    this.data = new Array(this.height).fill(0).map(() =>
-      new Array<Cell>(this.width).fill({
-        char: " ",
-        ...defaultStyle,
-      }),
-    );
-  }
-
-  apply(x: number, y: number, cell: Partial<Cell>): void {
-    [x, y] = floorAll(x, y);
-
-    if (x < 0 || x >= this.width || y < 0 || y >= this.height) return;
-
-    this.data[y][x] = {
-      ...this.data[y][x],
-      ...cell,
-    };
-  }
-
-  write(x: number, y: number, text: string, style: CellStyle = {}): void {
-    [x, y] = floorAll(x, y);
-
-    for (let i = 0; i < text.length; i++) {
-      this.apply(x + i, y, {
-        char: text[i],
-        ...style,
-      });
-    }
-  }
-
-  writeFilter(
-    x: number,
-    y: number,
-    text: string,
-    filter: (cell: Cell) => Cell,
-  ): void {
-    [x, y] = floorAll(x, y);
-
-    for (let i = 0; i < text.length; i++) {
-      this.apply(x + i, y, {
-        ...filter(this.data[y][x + i]),
-        char: text[i],
-      });
-    }
-  }
-
-  writeElement(canvas: TerminalElement, dx: number, dy: number): void {
-    [dx, dy] = floorAll(dx, dy);
-
-    for (let y = 0; y < canvas.height; y++) {
-      for (let x = 0; x < canvas.width; x++) {
-        this.apply(dx + x, dy + y, canvas.data[y][x]);
-      }
-    }
-  }
-
-  subCanvas(
-    x: number,
-    y: number,
-    width: number,
-    height: number,
-  ): TerminalRenderer {
-    [x, y, width, height] = floorAll(x, y, width, height);
-
-    const canvas = new TerminalRenderer(width, height);
-    for (let cy = 0; cy < height; cy++) {
-      for (let cx = 0; cx < width; cx++) {
-        canvas.apply(cx, cy, this.data[y + cy][x + cx]);
-      }
-    }
-
-    return canvas;
-  }
-
-  render(): Array<ReactNode> {
-    const nodes: Array<ReactNode> = [];
-
-    for (let y = 0; y < this.height; y++) {
-      for (let x = 0; x < this.width; x++) {
-        const cell = this.data[y][x];
-        /*
-        const span = document.createElement("span");
-        span.innerHTML = cell.char;
-        span.style.color = cell.foreground ?? "unset";
-        span.style.background = cell.background ?? "unset";
-        span.style.fontWeight = String(cell.fontWeight ?? "unset");
-
-        target.appendChild(span);
-        */
-        nodes.push(
-          <span
-            key={`${x}-${y}`}
-            style={{
-              color: cell.foreground,
-              background: cell.background,
-              fontWeight: cell.fontWeight,
-            }}
-          >
-            {cell.char}
-          </span>,
-        );
-      }
-
-      nodes.push(<br key={y} />);
-    }
-
-    return nodes;
-  }
-}

src/utils/terminal/theme.ts

@@ -1,12 +0,0 @@
-export const theme = {
-  black: "#45475a",
-  red: "#f38ba8",
-  green: "#a6e3a1",
-  yellow: "#f9e2af",
-  blue: "#89bafa",
-  magenta: "#f5c2e7",
-  cyan: "#94e2d5",
-  white: "#bac2de",
-  grey: "#585B70",
-  lightGrey: "#a6adc8",
-};

src/utils/types.ts

@@ -1,6 +0,0 @@
-export type Manifest = {
-  projects: Array<{
-    name: string;
-    files: Array<string>;
-  }>;
-};