diff --git a/FIX_PROPOSAL.md b/FIX_PROPOSAL.md new file mode 100644 index 0000000..1fd2bf5 --- /dev/null +++ b/FIX_PROPOSAL.md @@ -0,0 +1,65 @@ +To solve this issue, we need to modify the `WelcomeRecentFiles.tsx` component to handle long project names and provide a way to view the full path when it's truncated. Here's the exact code fix: + +```tsx +// src/components/cortex/WelcomeRecentFiles.tsx + +import React from 'react'; +import { Tooltip } from '@material-ui/core'; + +const RecentProject = ({ project }) => { + const projectName = project.name; + const projectPath = project.path; + + return ( + + ); +}; + +const WelcomeRecentFiles = () => { + // ... existing code ... + + return ( +
+ {recentProjects.map((project) => ( + + ))} +
+ ); +}; + +export default WelcomeRecentFiles; +``` + +In this code fix, we've added the following changes: + +1. We've wrapped the `projectName` and `projectPath` spans in a `button` element to make them interactive. +2. We've added `overflow: 'hidden'`, `textOverflow: 'ellipsis'`, and `whiteSpace: 'nowrap'` styles to the `projectName` span to truncate long names. +3. We've added a `maxWidth` style to the `projectName` and `projectPath` spans to control the width of the text. +4. We've wrapped the `projectPath` span in a `Tooltip` component from `@material-ui/core` to provide a way to view the full path when it's truncated. +5. We've added a `title` attribute to the `projectName` span to provide a way to view the full name when it's truncated. + +With these changes, long project names will be truncated with an ellipsis, and the full path will be available via a tooltip when it's truncated. \ No newline at end of file