fix: ProjectSearchBarDialog (search small screen) Suggestions once (#223)

Refactor the rendering logic of the suggestion list in `ProjectSearchBarDialog` component. This change simplifies the conditional rendering by restructuring the JSX to be more readable and maintainable. Now, the 'Suggestions' label is rendered once if there are items, and the items are mapped afterward.

---
This commit is contained in:
Vivian Phung 2024-06-24 18:54:32 -04:00 committed by GitHub
parent 41bcb2e7d0
commit 4a78eb13f6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -100,22 +100,24 @@ export const ProjectSearchBarDialog = ({
},
)}
>
{items.length > 0
? items.map((item, index) => (
<>
<div className="px-2 py-2">
<p className="text-elements-mid-em text-xs font-medium">
Suggestions
</p>
</div>
<ProjectSearchBarItem
key={item.id}
item={item}
{...getItemProps({ item, index })}
/>
</>
))
: inputValue && <ProjectSearchBarEmpty />}
{items.length > 0 ? (
<>
<div className="px-2 py-2">
<p className="text-elements-mid-em text-xs font-medium">
Suggestions
</p>
</div>
{items.map((item, index) => (
<ProjectSearchBarItem
key={item.id}
item={item}
{...getItemProps({ item, index })}
/>
))}
</>
) : (
inputValue && <ProjectSearchBarEmpty />
)}
</div>
</div>
</Dialog.Content>