~ knotless Search/
↑↓ move↵ open⇧↵ all results

chadtmiller.com/pds.js

An atproto PDS in JavaScript, for Cloudflare Workers and Node

0
0
main
47 lines · 1.4 KB Raw History
import { fileSummary } from '#/lib/collab.js';

/**
 * A set of paths as one line, opening to the whole list.
 *
 * A pull request written by an agent touches tens of files, and a card that
 * prints them all says nothing else. The line carries the count and where the
 * paths are; the list underneath is for the reader who wants it.
 *
 * A short list is its own summary, so up to `inline` paths are printed
 * outright and nothing opens.
 */
export function PathList({ paths, label = '', inline = 3, className = '' }) {
  if (paths.length === 0) return null;
  const { count, dirs } = fileSummary(paths);
  const lead = label ? `${label} ` : '';

  if (count <= inline) {
    return (
      <span className={`min-w-0 ${className}`}>
        {lead}
        <span className="font-mono">{paths.join(' ')}</span>
      </span>
    );
  }

  const where =
    dirs.length === 1
      ? `in ${dirs[0].dir || 'the root'}`
      : `across ${dirs.length} directories`;

  return (
    <details className={`min-w-0 ${className}`}>
      <summary className="cursor-pointer list-none marker:content-none hover:underline">
        {lead}
        <span className="font-semibold">{count}</span> files {where}
      </summary>
      <div className="mt-1 flex flex-col gap-0.5 pl-1 font-mono text-[12px] text-faint">
        {paths.map((path) => (
          <span key={path} className="truncate">
            {path}
          </span>
        ))}
      </div>
    </details>
  );
}