Fix: Truncate names in project view

src/app/(loading-group)/[organizationSlug]/projects/[projectSlug]/page.tsx

@@ -43,6 +43,7 @@ import SubgroupsAndAssetsList, {
   checkType,
 } from "@/components/SubgroupsAndAssetsList";
 import { useAutoTour } from "@/hooks/useAutoTour";
+import { truncateEnd } from "@/utils/common";
 
 export default function RepositoriesPage() {
   const [viewedProject, setViewedProject] = useState<"active" | "inactive">(
@@ -90,6 +91,7 @@ export default function RepositoriesPage() {
   const [showProjectModal, setShowProjectModal] = useState(false);
 
   const projectMenu = useProjectMenu();
+  const truncatedProjectName = truncateEnd(project.name, 65);
 
   // a filtered list that comes back empty means "no matches", not "nothing created yet",
   // so the inline create form is only offered on the unfiltered, genuinely empty group
@@ -263,10 +265,10 @@ export default function RepositoriesPage() {
           }
           primaryHeadline
           description={
-            "Repositories managed by the " + project.name + " group."
+            "Repositories managed by the " + truncatedProjectName + " group."
           }
           forceVertical
-          title={project.name}
+          title={truncatedProjectName}
         >
           {!showInlineCreateForm && (
             <>

src/utils/common.ts

@@ -313,6 +313,12 @@ export const truncateMiddle = (
   return text.slice(0, start) + "..." + text.slice(-end);
 };
 
+export const truncateEnd = (text: string, maxLength: number = 50): string => {
+  if (text.length <= maxLength) return text;
+
+  return text.slice(0, maxLength) + "...";
+};
+
 export const formatPurlQualifiers = (purl: string, maxLength = 48) =>
   truncateMiddle(extractPurlQualifiers(purl), maxLength);