add truncate

Author: sanjaypinna

app/[locale]/(user)/datasets/[datasetIdentifier]/components/Metadata/index.tsx

@@ -124,7 +124,7 @@ const MetadataComponent: React.FC<MetadataProps> = ({ data, setOpen }) => {
             }
           >
             <Text
-              className="max-w-xs truncate "
+              className="line-clamp-2 "
               variant="bodyLg"
               fontWeight="medium"
             >

app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/page.tsx

@@ -184,14 +184,14 @@ export default function DatasetPage({
       header: 'Title',
       cell: ({ row }: any) =>
         navigationTab === 'published' ? (
-          <Text>{row.original.title}</Text>
+          <Text className="line-clamp-1 max-w-[280px]">{row.original.title}</Text>
         ) : (
           <LinkButton
             kind="tertiary"
             size="medium"
             href={`/dashboard/${params.entityType}/${params.entitySlug}/usecases/edit/${row.original.id}/details`}
           >
-            {row.original.title}
+            <span className="line-clamp-1 max-w-[280px]">{row.original.title}</span>
           </LinkButton>
         ),
     },

components/BreadCrumbs/index.tsx

@@ -23,7 +23,7 @@ const BreadCrumbs: React.FC<BreadCrumbsProps> = ({ data }) => {
                 <BreadcrumbItem>
                   <BreadcrumbPage
                     title={item.label}
-                    className="max-w-[20ch] truncate  font-bold lg:max-w-[40ch]"
+                    className="max-w-[16ch] truncate  font-bold lg:max-w-[40ch]"
                   >
                     {item.label}
                   </BreadcrumbPage>
@@ -33,7 +33,7 @@ const BreadCrumbs: React.FC<BreadCrumbsProps> = ({ data }) => {
                   <BreadcrumbLink
                     href={item.href}
                     title={item.label}
-                    className="max-w-[20ch] truncate  font-bold lg:max-w-[40ch]"
+                    className="max-w-[16ch] truncate  font-bold lg:max-w-[40ch]"
                   >
                     {item.label}
                   </BreadcrumbLink>