Feature search results

[nicklitvin]

Changes

• Created Search Results component
• Create Stories page to showcase appearance with different props

Usage

SearchResults contains several props for customization.

• groupBy will return the name of the group/category that a SearchResult will be placed into
• className is tailwind that is applied to the entire Accordion element
• HeaderComponent will replace the default component that renders the name of the group and can be clicked on to open/close the content
• RowComponent will replace the default component that renders each SearchResult
• ContentWrapper will replace the default wrapper around all the RowComponents in one group

The Components and Wrapper will receive props that may be useful for conditional rendering of certain parts if desired

[robxbob]

The accordian content overlaps when collapsing. Also, is there a reason why you aren't using the accordian from shadcn? Which would make your code alot simpler and not need openCategories and isLast.

Your solution of passing in components directly isn't bad at all; was just hoping for it to have a similar design structure as the model components like so:

interface SearchResults<Category extends string> {
  data: SearchResult[];
  groupBy: (searchResult: SearchResult) => Category
  getLabel: ({ category: Category, items: SearchResult[] }) => ReactNode
  getContent: ({ category: Category, items: SearchResult[] }) => ReactNode
}

You can see how much more powerful the customization of the label and content can become as it now has direct access to the content and category.

[nicklitvin]

2nd round of changes:

• replaced radix accordion with shadcn accordion
• refactored SearchResults props
• added generic Category type to pass into SearchResults
• removed collpase all button
• utilized forward ref for component
• added sortby prop

[robxbob]

Did you make these changes or was it something from a tailwind update lol.

[nicklitvin]

This might have been from the install of a shadcn component that needed accordion and/or our formatter. Should I revert the change?