unity-hub-cli 0.8.0 → 0.10.0

package/dist/index.js

@@ -621,9 +621,133 @@ var UnityTempDirectoryCleaner = class {
 
 // src/presentation/App.tsx
 import clipboard from "clipboardy";
-import { Box, Text, useApp, useInput, useStdout } from "ink";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { Box as Box5, Text as Text3, useApp, useInput, useStdout } from "ink";
+import { useCallback, useEffect as useEffect3, useMemo as useMemo2, useState as useState3 } from "react";
+
+// src/presentation/components/LayoutManager.tsx
+import { Box } from "ink";
 import { jsx, jsxs } from "react/jsx-runtime";
+var getLayoutMode = () => {
+  const value = process.env.UNITYHUBCLI_LAYOUT;
+  if (value === "right") return "rightPanel";
+  if (value === "screen") return "screenSwitch";
+  return "screenSwitch";
+};
+var LayoutManager = ({
+  layoutMode,
+  panelVisible,
+  list,
+  panel,
+  statusBar
+}) => {
+  if (layoutMode === "rightPanel") {
+    return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
+        /* @__PURE__ */ jsx(Box, { flexGrow: 1, children: list }),
+        panelVisible ? /* @__PURE__ */ jsx(Box, { marginLeft: 1, children: panel }) : null
+      ] }),
+      /* @__PURE__ */ jsx(Box, { children: statusBar })
+    ] });
+  }
+  if (layoutMode === "screenSwitch") {
+    return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsx(Box, { children: panelVisible ? panel : list }),
+      /* @__PURE__ */ jsx(Box, { children: statusBar })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx(Box, { children: list }),
+    panelVisible ? /* @__PURE__ */ jsx(Box, { marginTop: 1, children: panel }) : null,
+    /* @__PURE__ */ jsx(Box, { children: statusBar })
+  ] });
+};
+
+// src/presentation/components/ProjectList.tsx
+import { Box as Box3 } from "ink";
+import { useMemo } from "react";
+
+// src/presentation/utils/path.ts
+var homeDirectory = process.env.HOME ?? process.env.USERPROFILE ?? "";
+var normalizedHomeDirectory = homeDirectory.replace(/\\/g, "/");
+var homePrefix = normalizedHomeDirectory ? `${normalizedHomeDirectory}/` : "";
+var shortenHomePath = (targetPath) => {
+  if (!normalizedHomeDirectory) {
+    return targetPath;
+  }
+  const normalizedTarget = targetPath.replace(/\\/g, "/");
+  if (normalizedTarget === normalizedHomeDirectory) {
+    return "~";
+  }
+  if (homePrefix && normalizedTarget.startsWith(homePrefix)) {
+    return `~/${normalizedTarget.slice(homePrefix.length)}`;
+  }
+  return targetPath;
+};
+var buildCdCommand = (targetPath) => {
+  if (process.platform === "win32") {
+    const escapedForWindows = targetPath.replace(/"/g, '""');
+    return `cd "${escapedForWindows}"`;
+  }
+  const escapedForPosix = targetPath.replace(/'/g, "'\\''");
+  return `cd '${escapedForPosix}'`;
+};
+
+// src/presentation/components/ProjectRow.tsx
+import { Box as Box2, Text } from "ink";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var ProjectRow = ({
+  isSelected,
+  selectionBar,
+  projectName,
+  projectColor,
+  versionLabel,
+  updatedText,
+  statusLabel,
+  statusColor,
+  branchLine,
+  pathLine,
+  showBranch,
+  showPath,
+  scrollbar
+}) => {
+  return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "row", children: [
+    /* @__PURE__ */ jsxs2(Box2, { width: 1, flexDirection: "column", alignItems: "center", marginLeft: isSelected ? 1 : 0, children: [
+      /* @__PURE__ */ jsx2(Text, { color: isSelected ? "green" : void 0, children: selectionBar }),
+      showBranch ? /* @__PURE__ */ jsx2(Text, { color: isSelected ? "green" : void 0, children: selectionBar }) : null,
+      showPath ? /* @__PURE__ */ jsx2(Text, { color: isSelected ? "green" : void 0, children: selectionBar }) : null
+    ] }),
+    /* @__PURE__ */ jsxs2(Box2, { flexGrow: 1, flexDirection: "column", marginLeft: isSelected ? 2 : 1, children: [
+      /* @__PURE__ */ jsxs2(Text, { wrap: "truncate", children: [
+        /* @__PURE__ */ jsx2(Text, { color: projectColor, bold: true, children: projectName }),
+        /* @__PURE__ */ jsxs2(Text, { children: [
+          " ",
+          versionLabel
+        ] }),
+        updatedText ? /* @__PURE__ */ jsx2(Text, { children: `  ${updatedText}` }) : null,
+        statusLabel && statusColor ? /* @__PURE__ */ jsx2(Text, { color: statusColor, children: `  ${statusLabel}` }) : null
+      ] }),
+      showBranch ? /* @__PURE__ */ jsx2(Text, { color: "#e3839c", wrap: "truncate", children: branchLine }) : null,
+      showPath ? /* @__PURE__ */ jsx2(Text, { color: "#719bd8", wrap: "truncate", children: pathLine }) : null,
+      /* @__PURE__ */ jsx2(Text, { children: " " })
+    ] }),
+    /* @__PURE__ */ jsxs2(Box2, { marginLeft: 1, width: 1, flexDirection: "column", alignItems: "center", children: [
+      /* @__PURE__ */ jsx2(Text, { children: scrollbar.title }),
+      showBranch ? /* @__PURE__ */ jsx2(Text, { children: scrollbar.branch }) : null,
+      showPath ? /* @__PURE__ */ jsx2(Text, { children: scrollbar.path }) : null,
+      /* @__PURE__ */ jsx2(Text, { children: scrollbar.spacer })
+    ] })
+  ] });
+};
+
+// src/presentation/components/ProjectList.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var PROJECT_COLOR = "#abd8e7";
+var LOCK_COLOR = "yellow";
+var STATUS_LABELS = {
+  idle: "",
+  running: "[running]",
+  crashed: "[crash]"
+};
 var extractRootFolder = (repository) => {
   if (!repository?.root) {
     return void 0;
@@ -634,13 +758,13 @@ var extractRootFolder = (repository) => {
   }
   return segments[segments.length - 1];
 };
-var formatProjectName = (project, repository, useGitRootName) => {
+var formatProjectName = (projectTitle, repository, useGitRootName) => {
   if (!useGitRootName) {
-    return project.title;
+    return projectTitle;
   }
   const rootFolder = extractRootFolder(repository);
   if (!rootFolder) {
-    return project.title;
+    return projectTitle;
   }
   return rootFolder;
 };
@@ -704,34 +828,269 @@ var formatUpdatedText = (lastModified) => {
   }
   return `${UPDATED_LABEL} ${relativeTime}`;
 };
-var homeDirectory = process.env.HOME ?? "";
-var homePrefix = homeDirectory ? `${homeDirectory}/` : "";
-var minimumVisibleProjectCount = 4;
-var defaultHintMessage = "Move with arrows or j/k \xB7 Launch with o \xB7 Quit Unity with q \xB7 Refresh with r \xB7 Copy cd path with c";
-var PROJECT_COLOR = "#abd8e7";
-var BRANCH_COLOR = "#e3839c";
-var PATH_COLOR = "#719bd8";
-var LOCK_COLOR = "yellow";
-var STATUS_LABELS = {
-  idle: "",
-  running: "[running]",
-  crashed: "[crash]"
+var ProjectList = ({
+  visibleProjects,
+  startIndex,
+  selectedIndex,
+  linesPerProject,
+  showBranch,
+  showPath,
+  useGitRootName,
+  releasedProjects,
+  launchedProjects,
+  totalProjects
+}) => {
+  const scrollbarChars = useMemo(() => {
+    const totalLines = totalProjects * linesPerProject;
+    const windowProjects = visibleProjects.length;
+    const visibleLines = windowProjects * linesPerProject;
+    if (totalLines === 0 || visibleLines === 0) {
+      return [];
+    }
+    if (totalLines <= visibleLines) {
+      return Array.from({ length: visibleLines }, () => "\u2588");
+    }
+    const trackLength = visibleLines;
+    const sliderSize = Math.max(1, Math.round(visibleLines / totalLines * trackLength));
+    const maxSliderStart = Math.max(0, trackLength - sliderSize);
+    const topLine = startIndex * linesPerProject;
+    const denominator = Math.max(1, totalLines - visibleLines);
+    const sliderStart = Math.min(
+      maxSliderStart,
+      Math.round(topLine / denominator * maxSliderStart)
+    );
+    return Array.from({ length: trackLength }, (_, position) => {
+      if (position >= sliderStart && position < sliderStart + sliderSize) {
+        return "\u2588";
+      }
+      return "|";
+    });
+  }, [linesPerProject, startIndex, totalProjects, visibleProjects.length]);
+  const rows = useMemo(() => {
+    return visibleProjects.map(({ project, repository, launchStatus }, offset) => {
+      const rowIndex = startIndex + offset;
+      const isSelected = rowIndex === selectedIndex;
+      const selectionBar = isSelected ? "\u2503" : " ";
+      const projectName = formatProjectName(project.title, repository, useGitRootName);
+      const versionLabel = `(${project.version.value})`;
+      const updatedText = formatUpdatedText(project.lastModified);
+      const pathLine = shortenHomePath(project.path);
+      const branchLine = formatBranch(repository?.branch);
+      const hasReleasedLock = releasedProjects.has(project.id);
+      const isLocallyLaunched = launchedProjects.has(project.id);
+      const displayStatus = (() => {
+        if (isLocallyLaunched) {
+          return "running";
+        }
+        if (hasReleasedLock) {
+          return "idle";
+        }
+        return launchStatus;
+      })();
+      const baseScrollbarIndex = offset * linesPerProject;
+      const titleScrollbar = scrollbarChars[baseScrollbarIndex] ?? " ";
+      const branchScrollbar = showBranch ? scrollbarChars[baseScrollbarIndex + 1] ?? " " : " ";
+      const pathScrollbar = showPath ? scrollbarChars[baseScrollbarIndex + 1 + (showBranch ? 1 : 0)] ?? " " : " ";
+      const spacerScrollbar = scrollbarChars[baseScrollbarIndex + linesPerProject - 1] ?? " ";
+      const statusLabel = STATUS_LABELS[displayStatus];
+      const statusColor = displayStatus === "running" ? LOCK_COLOR : displayStatus === "crashed" ? "red" : void 0;
+      return /* @__PURE__ */ jsx3(
+        ProjectRow,
+        {
+          isSelected,
+          selectionBar,
+          projectName,
+          projectColor: PROJECT_COLOR,
+          versionLabel,
+          updatedText,
+          statusLabel,
+          statusColor,
+          branchLine,
+          pathLine,
+          showBranch,
+          showPath,
+          scrollbar: {
+            title: titleScrollbar,
+            branch: branchScrollbar,
+            path: pathScrollbar,
+            spacer: spacerScrollbar
+          }
+        },
+        project.id
+      );
+    });
+  }, [
+    launchedProjects,
+    releasedProjects,
+    scrollbarChars,
+    selectedIndex,
+    showBranch,
+    showPath,
+    startIndex,
+    useGitRootName,
+    visibleProjects,
+    linesPerProject
+  ]);
+  return /* @__PURE__ */ jsx3(Box3, { flexDirection: "column", children: rows.length === 0 ? null : rows });
 };
-var shortenHomePath = (targetPath) => {
-  if (!homeDirectory) {
-    return targetPath;
+
+// src/presentation/components/SortPanel.tsx
+import { Box as Box4, Text as Text2 } from "ink";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var lineForPrimary = (primary) => {
+  return `Primary: ${primary === "updated" ? "Updated" : "Name (Git root)"}`;
+};
+var lineForDirection = (prefs) => {
+  if (prefs.primary === "updated") {
+    return `Direction: ${prefs.direction === "desc" ? "New to Old" : "Old to New"}`;
   }
-  if (targetPath === homeDirectory) {
-    return "~";
+  return `Direction: ${prefs.direction === "asc" ? "A to Z" : "Z to A"}`;
+};
+var lineForFavorites = (favoritesFirst) => {
+  return `Favorites first: ${favoritesFirst ? "ON" : "OFF"}`;
+};
+var SortPanel = ({ sortPreferences, focusedIndex, width }) => {
+  const primaryLine = lineForPrimary(sortPreferences.primary);
+  const directionLine = lineForDirection(sortPreferences);
+  const favoritesLine = lineForFavorites(sortPreferences.favoritesFirst);
+  const Item = ({ label, selected }) => {
+    const prefix = selected ? "> " : "  ";
+    return /* @__PURE__ */ jsxs3(Text2, { children: [
+      selected ? /* @__PURE__ */ jsx4(Text2, { color: "green", children: prefix }) : prefix,
+      label
+    ] });
+  };
+  return /* @__PURE__ */ jsxs3(
+    Box4,
+    {
+      flexDirection: "column",
+      borderStyle: "round",
+      borderColor: "green",
+      paddingX: 1,
+      width,
+      children: [
+        /* @__PURE__ */ jsx4(Item, { label: primaryLine, selected: focusedIndex === 0 }),
+        /* @__PURE__ */ jsx4(Item, { label: directionLine, selected: focusedIndex === 1 }),
+        /* @__PURE__ */ jsx4(Item, { label: favoritesLine, selected: focusedIndex === 2 })
+      ]
+    }
+  );
+};
+
+// src/presentation/hooks/useSortPreferences.ts
+import { useEffect, useState } from "react";
+
+// src/infrastructure/config.ts
+import { mkdir, readFile as readFile3, writeFile as writeFile2 } from "fs/promises";
+var defaultPreferences = {
+  favoritesFirst: true,
+  primary: "updated",
+  direction: "desc"
+};
+var getConfigDir = () => {
+  const home = process.env.HOME ?? "";
+  return `${home}/Library/Application Support/UnityHubCli`;
+};
+var getConfigPath = () => `${getConfigDir()}/config.json`;
+var isValidPrimary = (value) => value === "updated" || value === "name";
+var isValidDirection = (value) => value === "asc" || value === "desc";
+var sanitizePreferences = (input) => {
+  if (!input || typeof input !== "object") {
+    return defaultPreferences;
   }
-  if (homePrefix && targetPath.startsWith(homePrefix)) {
-    return `~/${targetPath.slice(homePrefix.length)}`;
+  const record = input;
+  const favoritesFirst = typeof record.favoritesFirst === "boolean" ? record.favoritesFirst : defaultPreferences.favoritesFirst;
+  const primary = isValidPrimary(record.primary) ? record.primary : defaultPreferences.primary;
+  const direction = isValidDirection(record.direction) ? record.direction : defaultPreferences.direction;
+  return { favoritesFirst, primary, direction };
+};
+var readSortPreferences = async () => {
+  try {
+    const content = await readFile3(getConfigPath(), "utf8");
+    const json = JSON.parse(content);
+    return sanitizePreferences(json);
+  } catch {
+    return defaultPreferences;
   }
-  return targetPath;
 };
-var buildCdCommand = (targetPath) => {
-  const escapedPath = targetPath.replaceAll('"', '\\"');
-  return `cd "${escapedPath}"`;
+var writeSortPreferences = async (prefs) => {
+  try {
+    await mkdir(getConfigDir(), { recursive: true });
+  } catch {
+  }
+  const sanitized = sanitizePreferences(prefs);
+  const json = JSON.stringify(sanitized, void 0, 2);
+  await writeFile2(getConfigPath(), json, "utf8");
+};
+var getDefaultSortPreferences = () => defaultPreferences;
+
+// src/presentation/hooks/useSortPreferences.ts
+var useSortPreferences = () => {
+  const [sortPreferences, setSortPreferences] = useState(getDefaultSortPreferences());
+  const [isLoaded, setIsLoaded] = useState(false);
+  useEffect(() => {
+    void (async () => {
+      try {
+        const prefs = await readSortPreferences();
+        setSortPreferences(prefs);
+      } finally {
+        setIsLoaded(true);
+      }
+    })();
+  }, []);
+  useEffect(() => {
+    if (!isLoaded) {
+      return;
+    }
+    void writeSortPreferences(sortPreferences);
+  }, [isLoaded, sortPreferences]);
+  return { sortPreferences, setSortPreferences, isLoaded };
+};
+
+// src/presentation/hooks/useVisibleCount.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
+var useVisibleCount = (stdout, linesPerProject, panelVisible, panelHeight, minimumVisibleProjectCount2) => {
+  const compute = () => {
+    if (!stdout || typeof stdout.columns !== "number" || typeof stdout.rows !== "number") {
+      return minimumVisibleProjectCount2;
+    }
+    const borderRows = 2;
+    const hintRows = 1;
+    const reservedRows = borderRows + hintRows + (panelVisible ? panelHeight : 0);
+    const availableRows = Math.max(0, stdout.rows - reservedRows);
+    const rowsPerProject = Math.max(linesPerProject, 1);
+    const calculatedCount = Math.max(1, Math.floor(availableRows / rowsPerProject));
+    return calculatedCount;
+  };
+  const [visibleCount, setVisibleCount] = useState2(compute);
+  useEffect2(() => {
+    const updateVisible = () => setVisibleCount(compute());
+    updateVisible();
+    stdout?.on("resize", updateVisible);
+    return () => {
+      stdout?.off("resize", updateVisible);
+    };
+  }, [stdout, linesPerProject, panelVisible, panelHeight]);
+  return visibleCount;
+};
+
+// src/presentation/App.tsx
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var extractRootFolder2 = (repository) => {
+  if (!repository?.root) {
+    return void 0;
+  }
+  const segments = repository.root.split("/").filter((segment) => segment.length > 0);
+  if (segments.length === 0) {
+    return void 0;
+  }
+  return segments[segments.length - 1];
+};
+var minimumVisibleProjectCount = 4;
+var defaultHintMessage = "Select: j/k \xB7 Open: o \xB7 Quit: q \xB7 Refresh: r \xB7 CopyPath: c \xB7 Sort: s \xB7 Close: ctrl + c";
+var getCopyTargetPath = (view) => {
+  const root = view.repository?.root;
+  return root && root.length > 0 ? root : view.project.path;
 };
 var App = ({
   projects,
@@ -744,45 +1103,72 @@ var App = ({
 }) => {
   const { exit } = useApp();
   const { stdout } = useStdout();
-  const [projectViews, setProjectViews] = useState(projects);
-  const [visibleCount, setVisibleCount] = useState(minimumVisibleProjectCount);
-  const [index, setIndex] = useState(0);
-  const [hint, setHint] = useState(defaultHintMessage);
-  const [windowStart, setWindowStart] = useState(0);
-  const [releasedProjects, setReleasedProjects] = useState(/* @__PURE__ */ new Set());
-  const [launchedProjects, setLaunchedProjects] = useState(/* @__PURE__ */ new Set());
-  const [isRefreshing, setIsRefreshing] = useState(false);
+  const [projectViews, setProjectViews] = useState3(projects);
+  const [isSortMenuOpen, setIsSortMenuOpen] = useState3(false);
   const linesPerProject = (showBranch ? 1 : 0) + (showPath ? 1 : 0) + 2;
-  const sortedProjects = useMemo(() => {
+  const panelHeight = 6;
+  const visibleCount = useVisibleCount(stdout, linesPerProject, isSortMenuOpen, panelHeight, minimumVisibleProjectCount);
+  const [index, setIndex] = useState3(0);
+  const [hint, setHint] = useState3(defaultHintMessage);
+  const [windowStart, setWindowStart] = useState3(0);
+  const [releasedProjects, setReleasedProjects] = useState3(/* @__PURE__ */ new Set());
+  const [launchedProjects, setLaunchedProjects] = useState3(/* @__PURE__ */ new Set());
+  const [isRefreshing, setIsRefreshing] = useState3(false);
+  const [sortMenuIndex, setSortMenuIndex] = useState3(0);
+  const { sortPreferences, setSortPreferences } = useSortPreferences();
+  const sortedProjects = useMemo2(() => {
     const fallbackTime = 0;
-    const toSortKey = (view) => {
-      if (useGitRootName) {
-        const rootName = extractRootFolder(view.repository);
-        if (rootName) {
-          return rootName.toLocaleLowerCase();
-        }
+    const getNameKey = (view) => {
+      const rootName = extractRootFolder2(view.repository);
+      const base = rootName || view.project.title;
+      return base.toLocaleLowerCase();
+    };
+    const tieBreaker = (view) => view.project.path.toLocaleLowerCase();
+    const compareByUpdated = (a, b, direction) => {
+      const timeA = a.project.lastModified?.getTime() ?? fallbackTime;
+      const timeB = b.project.lastModified?.getTime() ?? fallbackTime;
+      if (timeA === timeB) {
+        return 0;
       }
-      return view.project.title.toLocaleLowerCase();
+      return direction === "desc" ? timeB - timeA : timeA - timeB;
+    };
+    const compareByName = (a, b, direction) => {
+      const keyA = getNameKey(a);
+      const keyB = getNameKey(b);
+      if (keyA === keyB) {
+        return 0;
+      }
+      return direction === "desc" ? keyB.localeCompare(keyA) : keyA.localeCompare(keyB);
     };
-    const toTieBreaker = (view) => view.project.path.toLocaleLowerCase();
     return [...projectViews].sort((a, b) => {
-      if (a.project.favorite !== b.project.favorite) {
+      if (sortPreferences.favoritesFirst && a.project.favorite !== b.project.favorite) {
         return a.project.favorite ? -1 : 1;
       }
-      const timeA = a.project.lastModified?.getTime() ?? fallbackTime;
-      const timeB = b.project.lastModified?.getTime() ?? fallbackTime;
-      if (timeA !== timeB) {
-        return timeB - timeA;
+      const primary = sortPreferences.primary;
+      const direction = sortPreferences.direction;
+      if (primary === "updated") {
+        const updatedOrder2 = compareByUpdated(a, b, direction);
+        if (updatedOrder2 !== 0) {
+          return updatedOrder2;
+        }
+        const nameOrder2 = compareByName(a, b, "asc");
+        if (nameOrder2 !== 0) {
+          return nameOrder2;
+        }
+        return tieBreaker(a).localeCompare(tieBreaker(b));
       }
-      const keyA = toSortKey(a);
-      const keyB = toSortKey(b);
-      if (keyA === keyB) {
-        return toTieBreaker(a).localeCompare(toTieBreaker(b));
+      const nameOrder = compareByName(a, b, direction);
+      if (nameOrder !== 0) {
+        return nameOrder;
       }
-      return keyA.localeCompare(keyB);
+      const updatedOrder = compareByUpdated(a, b, "desc");
+      if (updatedOrder !== 0) {
+        return updatedOrder;
+      }
+      return tieBreaker(a).localeCompare(tieBreaker(b));
     });
-  }, [projectViews, useGitRootName]);
-  useEffect(() => {
+  }, [projectViews, sortPreferences]);
+  useEffect3(() => {
     const handleSigint = () => {
       exit();
     };
@@ -791,30 +1177,7 @@ var App = ({
       process.off("SIGINT", handleSigint);
     };
   }, [exit]);
-  useEffect(() => {
-    const updateVisibleCount = () => {
-      if (!stdout || typeof stdout.columns !== "number" || typeof stdout.rows !== "number") {
-        setVisibleCount(minimumVisibleProjectCount);
-        return;
-      }
-      const borderRows = 2;
-      const hintRows = 1;
-      const reservedRows = borderRows + hintRows;
-      const availableRows = stdout.rows - reservedRows;
-      const rowsPerProject = Math.max(linesPerProject, 1);
-      const calculatedCount = Math.max(
-        minimumVisibleProjectCount,
-        Math.floor(availableRows / rowsPerProject)
-      );
-      setVisibleCount(calculatedCount);
-    };
-    updateVisibleCount();
-    stdout?.on("resize", updateVisibleCount);
-    return () => {
-      stdout?.off("resize", updateVisibleCount);
-    };
-  }, [linesPerProject, stdout]);
-  const limit = Math.max(minimumVisibleProjectCount, visibleCount);
+  const limit = Math.max(1, visibleCount);
   const move = useCallback(
     (delta) => {
       setIndex((prev) => {
@@ -858,7 +1221,7 @@ var App = ({
     },
     [index, limit, sortedProjects.length]
   );
-  useEffect(() => {
+  useEffect3(() => {
     setWindowStart((prevStart) => {
       if (sortedProjects.length <= limit) {
         return prevStart === 0 ? prevStart : 0;
@@ -880,7 +1243,8 @@ var App = ({
     });
   }, [index, limit, sortedProjects.length]);
   const copyProjectPath = useCallback(() => {
-    const projectPath = sortedProjects[index]?.project.path;
+    const projectView = sortedProjects[index];
+    const projectPath = projectView ? getCopyTargetPath(projectView) : void 0;
     if (!projectPath) {
       setHint("No project to copy");
       setTimeout(() => {
@@ -892,7 +1256,7 @@ var App = ({
       const command = buildCdCommand(projectPath);
       clipboard.writeSync(command);
       const displayPath = shortenHomePath(projectPath);
-      setHint(`Copied command: cd "${displayPath}"`);
+      setHint(`Copied command: cd ${displayPath}`);
     } catch (error) {
       const message = error instanceof Error ? error.message : String(error);
       setHint(`Failed to copy: ${message}`);
@@ -912,7 +1276,8 @@ var App = ({
     }
     const { project } = projectView;
     try {
-      const command = buildCdCommand(project.path);
+      const cdTarget = getCopyTargetPath(projectView);
+      const command = buildCdCommand(cdTarget);
       clipboard.writeSync(command);
     } catch (error) {
       const message = error instanceof Error ? error.message : String(error);
@@ -999,7 +1364,7 @@ var App = ({
       }, 3e3);
     }
   }, [index, onTerminate, sortedProjects]);
-  useEffect(() => {
+  useEffect3(() => {
     setProjectViews(projects);
     setReleasedProjects(/* @__PURE__ */ new Set());
     setLaunchedProjects(/* @__PURE__ */ new Set());
@@ -1058,6 +1423,47 @@ var App = ({
     }
   }, [isRefreshing, onRefresh, sortedProjects]);
   useInput((input, key) => {
+    if (isSortMenuOpen) {
+      if (key.escape || input === "\x1B") {
+        setIsSortMenuOpen(false);
+        return;
+      }
+      if (input === "j") {
+        setSortMenuIndex((prev) => {
+          const last = 2;
+          const next = prev + 1;
+          return next > last ? 0 : next;
+        });
+        return;
+      }
+      if (input === "k") {
+        setSortMenuIndex((prev) => {
+          const last = 2;
+          const next = prev - 1;
+          return next < 0 ? last : next;
+        });
+        return;
+      }
+      const toggleCurrent = () => {
+        if (sortMenuIndex === 0) {
+          setSortPreferences((prev) => ({ ...prev, primary: prev.primary === "updated" ? "name" : "updated" }));
+          return;
+        }
+        if (sortMenuIndex === 1) {
+          setSortPreferences((prev) => ({ ...prev, direction: prev.direction === "asc" ? "desc" : "asc" }));
+          return;
+        }
+        setSortPreferences((prev) => ({ ...prev, favoritesFirst: !prev.favoritesFirst }));
+      };
+      if (input === " ") {
+        toggleCurrent();
+      }
+      return;
+    }
+    if (input === "S" || input === "s") {
+      setIsSortMenuOpen(true);
+      return;
+    }
     if (input === "j" || key.downArrow) {
       move(1);
     }
@@ -1080,7 +1486,7 @@ var App = ({
       copyProjectPath();
     }
   });
-  const { startIndex, visibleProjects } = useMemo(() => {
+  const { startIndex, visibleProjects } = useMemo2(() => {
     if (sortedProjects.length <= limit) {
       return {
         startIndex: 0,
@@ -1095,113 +1501,53 @@ var App = ({
       visibleProjects: sortedProjects.slice(clampedStart, end)
     };
   }, [limit, sortedProjects, windowStart]);
-  const scrollbarChars = useMemo(() => {
-    const totalProjects = projectViews.length;
-    const totalLines = totalProjects * linesPerProject;
-    const windowProjects = visibleProjects.length;
-    const visibleLines = windowProjects * linesPerProject;
-    if (totalLines === 0 || visibleLines === 0) {
-      return [];
-    }
-    if (totalLines <= visibleLines) {
-      return Array.from({ length: visibleLines }, () => "\u2588");
-    }
-    const trackLength = visibleLines;
-    const sliderSize = Math.max(1, Math.round(visibleLines / totalLines * trackLength));
-    const maxSliderStart = Math.max(0, trackLength - sliderSize);
-    const topLine = startIndex * linesPerProject;
-    const denominator = Math.max(1, totalLines - visibleLines);
-    const sliderStart = Math.min(
-      maxSliderStart,
-      Math.round(topLine / denominator * maxSliderStart)
-    );
-    return Array.from({ length: trackLength }, (_, position) => {
-      if (position >= sliderStart && position < sliderStart + sliderSize) {
-        return "\u2588";
-      }
-      return "|";
-    });
-  }, [linesPerProject, projectViews.length, startIndex, visibleProjects]);
-  const rows = useMemo(() => {
-    return visibleProjects.map(({ project, repository, launchStatus }, offset) => {
-      const rowIndex = startIndex + offset;
-      const isSelected = rowIndex === index;
-      const arrow = isSelected ? ">" : " ";
-      const projectName = formatProjectName(project, repository, useGitRootName);
-      const versionLabel = `(${project.version.value})`;
-      const updatedText = formatUpdatedText(project.lastModified);
-      const pathLine = shortenHomePath(project.path);
-      const branchLine = formatBranch(repository?.branch);
-      const hasReleasedLock = releasedProjects.has(project.id);
-      const isLocallyLaunched = launchedProjects.has(project.id);
-      const displayStatus = (() => {
-        if (isLocallyLaunched) {
-          return "running";
-        }
-        if (hasReleasedLock) {
-          return "idle";
+  return /* @__PURE__ */ jsx5(
+    LayoutManager,
+    {
+      layoutMode: getLayoutMode(),
+      panelVisible: isSortMenuOpen,
+      list: /* @__PURE__ */ jsx5(
+        Box5,
+        {
+          flexDirection: "column",
+          borderStyle: "round",
+          borderColor: "green",
+          width: typeof stdout?.columns === "number" ? stdout.columns : void 0,
+          children: sortedProjects.length === 0 ? /* @__PURE__ */ jsx5(Text3, { children: "No Unity Hub projects were found." }) : /* @__PURE__ */ jsx5(
+            ProjectList,
+            {
+              visibleProjects,
+              startIndex,
+              selectedIndex: index,
+              linesPerProject,
+              showBranch,
+              showPath,
+              useGitRootName,
+              releasedProjects,
+              launchedProjects,
+              totalProjects: sortedProjects.length
+            }
+          )
         }
-        return launchStatus;
-      })();
-      const baseScrollbarIndex = offset * linesPerProject;
-      const titleScrollbar = scrollbarChars[baseScrollbarIndex] ?? " ";
-      const branchScrollbar = showBranch ? scrollbarChars[baseScrollbarIndex + 1] ?? " " : " ";
-      const pathScrollbar = showPath ? scrollbarChars[baseScrollbarIndex + 1 + (showBranch ? 1 : 0)] ?? " " : " ";
-      const spacerScrollbar = scrollbarChars[baseScrollbarIndex + linesPerProject - 1] ?? " ";
-      const statusLabel = STATUS_LABELS[displayStatus];
-      const statusColor = displayStatus === "running" ? LOCK_COLOR : displayStatus === "crashed" ? "red" : void 0;
-      return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
-        /* @__PURE__ */ jsxs(Box, { flexGrow: 1, flexDirection: "column", children: [
-          /* @__PURE__ */ jsxs(Text, { children: [
-            /* @__PURE__ */ jsxs(Text, { color: isSelected ? "green" : PROJECT_COLOR, bold: true, children: [
-              arrow,
-              " ",
-              projectName
-            ] }),
-            /* @__PURE__ */ jsxs(Text, { color: isSelected ? "green" : void 0, children: [
-              " ",
-              versionLabel
-            ] }),
-            updatedText ? /* @__PURE__ */ jsx(Text, { color: isSelected ? "green" : void 0, children: `  ${updatedText}` }) : null,
-            statusLabel && statusColor ? /* @__PURE__ */ jsx(Text, { color: statusColor, children: `  ${statusLabel}` }) : null
-          ] }),
-          showBranch ? /* @__PURE__ */ jsxs(Text, { color: isSelected ? "green" : BRANCH_COLOR, children: [
-            "  ",
-            branchLine
-          ] }) : null,
-          showPath ? /* @__PURE__ */ jsxs(Text, { color: isSelected ? "green" : PATH_COLOR, children: [
-            "  ",
-            pathLine
-          ] }) : null,
-          /* @__PURE__ */ jsx(Text, { children: " " })
-        ] }),
-        /* @__PURE__ */ jsxs(Box, { marginLeft: 1, width: 1, flexDirection: "column", alignItems: "center", children: [
-          /* @__PURE__ */ jsx(Text, { children: titleScrollbar }),
-          showBranch ? /* @__PURE__ */ jsx(Text, { children: branchScrollbar }) : null,
-          showPath ? /* @__PURE__ */ jsx(Text, { children: pathScrollbar }) : null,
-          /* @__PURE__ */ jsx(Text, { children: spacerScrollbar })
-        ] })
-      ] }, project.id);
-    });
-  }, [
-    index,
-    launchedProjects,
-    releasedProjects,
-    scrollbarChars,
-    showBranch,
-    showPath,
-    startIndex,
-    useGitRootName,
-    visibleProjects
-  ]);
-  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: "green", children: rows.length === 0 ? /* @__PURE__ */ jsx(Text, { children: "No Unity Hub projects were found." }) : rows }),
-    /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Text, { children: hint }) })
-  ] });
+      ),
+      panel: /* @__PURE__ */ jsxs4(Box5, { flexDirection: "column", width: typeof stdout?.columns === "number" ? stdout.columns : void 0, children: [
+        /* @__PURE__ */ jsx5(Text3, { children: "Sort Settings" }),
+        /* @__PURE__ */ jsx5(Box5, { marginTop: 1, children: /* @__PURE__ */ jsx5(
+          SortPanel,
+          {
+            sortPreferences,
+            focusedIndex: sortMenuIndex,
+            width: typeof stdout?.columns === "number" ? stdout.columns : void 0
+          }
+        ) })
+      ] }),
+      statusBar: isSortMenuOpen ? /* @__PURE__ */ jsx5(Text3, { wrap: "truncate", children: "Select: j/k, Toggle: Space, Back: Esc" }) : /* @__PURE__ */ jsx5(Text3, { wrap: "truncate", children: hint })
+    }
+  );
 };
 
 // src/index.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 var bootstrap = async () => {
   const unityHubReader = new UnityHubProjectsReader();
   const gitRepositoryInfoReader = new GitRepositoryInfoReader();
@@ -1237,7 +1583,7 @@ var bootstrap = async () => {
   try {
     const projects = await listProjectsUseCase.execute();
     const { waitUntilExit } = render(
-      /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx6(
         App,
         {
           projects,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "unity-hub-cli",
-  "version": "0.8.0",
+  "version": "0.10.0",
   "description": "A CLI tool that reads Unity Hub's projects and launches Unity Editor with an interactive TUI",
   "main": "dist/index.js",
   "scripts": {