Create a new file.

Pick a path, paste your content, and write a short commit message. The commit lands directly on{" "} {ref}.

File path

{dirPath && ( {dirPath}/ )}

Content

</div>
            <div class="editor-field" style="margin-bottom:0">
              <label class="editor-label" for="commit-message-input">Commit message</label>
              <input
                class="editor-input"
                id="commit-message-input"
                name="message"
                placeholder="Create new file"
                required
                aria-label="Commit message"
              />
            </div>
          </div>
          <div class="editor-actions">
            <button type="submit" class="editor-btn editor-btn-primary">
              Commit new file
            </button>
            <a href={`/${owner}/${repo}`} class="editor-btn editor-btn-ghost">
              Cancel
            </a>
          </div>
        </form>
      </div>
      <style dangerouslySetInnerHTML={{ __html: editorStyles }} />
    </Layout>
  );
});

// Create file via commit
editor.post("/:owner/:repo/new/:ref", requireAuth, requireRepoAccess("write"), async (c) => {
  const { owner, repo } = c.req.param();
  const user = c.get("user")!;
  const ref = c.req.param("ref");
  const body = await c.req.parseBody();
  const dirPath = String(body.dir_path || "").trim();
  const filename = String(body.filename || "").trim();
  const content = String(body.content || "");
  const message = String(body.message || `Create ${filename}`).trim();

if (!filename) return c.redirect(`/${owner}/${repo}`);

const fullPath = dirPath ? `${dirPath}/${filename}` : filename;

// Use git hash-object + update-index + write-tree + commit-tree
  const repoDir = getRepoPath(owner, repo);

// Hash the new file content
  const blobSha = await run(
    ["git", "hash-object", "-w", "--stdin"],
    repoDir,
    content
  );

// Read current tree
  const currentTreeSha = await run(
    ["git", "rev-parse", `${ref}^{tree}`],
    repoDir
  );

// Read current tree and add new entry
  const treeContent = await run(["git", "ls-tree", "-r", ref], repoDir);
  const entries = treeContent
    .split("\n")
    .filter(Boolean)
    .map((line) => line + "\n")
    .join("");
  const newEntry = `100644 blob ${blobSha}\t${fullPath}\n`;

const newTreeSha = await run(
    ["git", "mktree"],
    repoDir,
    entries + newEntry
  );

// Get parent commit
  const parentSha = await run(
    ["git", "rev-parse", ref],
    repoDir
  );

// Create commit
  const env = {
    GIT_AUTHOR_NAME: user.displayName || user.username,
    GIT_AUTHOR_EMAIL: user.email,
    GIT_COMMITTER_NAME: user.displayName || user.username,
    GIT_COMMITTER_EMAIL: user.email,
  };

const commitProc = Bun.spawn(
    ["git", "commit-tree", newTreeSha, "-p", parentSha, "-m", message],
    {
      cwd: repoDir,
      stdout: "pipe",
      stderr: "pipe",
      env: { ...process.env, ...env },
    }
  );
  const commitSha = (await new Response(commitProc.stdout).text()).trim();
  await commitProc.exited;

// Update branch ref
  await run(
    ["git", "update-ref", `refs/heads/${ref}`, commitSha],
    repoDir
  );

return c.redirect(`/${owner}/${repo}/blob/${ref}/${fullPath}`);
});

// Edit file form
editor.get("/:owner/:repo/edit/:ref{.+$}", requireAuth, requireRepoAccess("write"), async (c) => {
  const { owner, repo } = c.req.param();
  const user = c.get("user")!;
  const refAndPath = c.req.param("ref");

// Parse ref/path
  const slashIdx = refAndPath.indexOf("/");
  if (slashIdx === -1) return c.text("Not found", 404);
  const ref = refAndPath.slice(0, slashIdx);
  const filePath = refAndPath.slice(slashIdx + 1);

const blob = await getBlob(owner, repo, ref, filePath);
  if (!blob || blob.isBinary) {
    return c.html(
      <Layout title="Cannot edit" user={user}>
        <EmptyState title={blob?.isBinary ? "Cannot edit binary file" : "File not found"} />
      </Layout>,
      404
    );
  }

const fileName = filePath.split("/").pop() || filePath;
  const dirParts = filePath.split("/").slice(0, -1);

return c.html(
    <Layout title={`Editing ${filePath} — ${owner}/${repo}`} user={user}>
      <RepoHeader owner={owner} repo={repo} />
      <RepoNav owner={owner} repo={repo} active="code" />
      <div class="editor-wrap">
        <header class="editor-head">
          <div class="editor-eyebrow">
            <span class="editor-eyebrow-dot" aria-hidden="true" />
            Editor · Edit file
          </div>
          <h1 class="editor-title">
            <span class="editor-title-grad">Edit{" "}</span>
            <code style="font-family:var(--font-mono);font-size:0.82em;color:var(--text-strong);font-weight:700">{fileName}</code>
          </h1>
          <p class="editor-sub">
            Save your changes as a commit on{" "}
            <code style="font-size:12.5px">{ref}</code>. Write a clear
            one-line message so reviewers can follow the history.
          </p>
        </header>

<div class="editor-toolbar">
          <div class="editor-path" title={filePath}>
            <a
              href={`/${owner}/${repo}`}
              class="editor-path-seg"
              style="color:var(--text-muted);text-decoration:none"
            >
              {owner}/{repo}
            </a>
            {dirParts.map((seg, i) => {
              const subPath = dirParts.slice(0, i + 1).join("/");
              return (
                <>
                  <span class="editor-path-sep">/</span>
                  <a
                    href={`/${owner}/${repo}/tree/${ref}/${subPath}`}
                    class="editor-path-seg"
                    style="text-decoration:none"
                  >
                    {seg}
                  </a>
                </>
              );
            })}
            <span class="editor-path-sep">/</span>
            <span class="editor-path-name">{fileName}</span>
          </div>
          <span class="editor-branch-pill" title="Target branch">
            <IconBranch />
            {ref}
          </span>
        </div>

<form
          method="post"
          action={`/${owner}/${repo}/edit/${ref}/${filePath}`}
          class="editor-card"
        >
          <div class="editor-body">
            <div class="editor-field">
              <label class="editor-label" for="editor-content-edit">Content</label>
              <textarea
                class="editor-textarea"
                id="editor-content-edit"
                name="content"
                rows={25}
                spellcheck={false}
              >{blob.content}

Commit message

Cancel