🔰 [Initiative] Component Search Data Enrichment + Intuitive Component Display

[TiffanyGYJ]

Description

This initiative is aiming to improve component Search with richer data + intuitive display and view

User Flow

1. A developer is looking to find a pagination component and search for "pagination" in the search bar (this should be doable from the search bar on top + command palette search + search bar within the sandbox)
2. A developer land on a search result page with the component filter; It has the list of components on the left and a snapshot of the component loaded on the right with some more information about the component
3. The details page include following information about the component

   • Description, tags and other metadata of the component
   • Number of times this component is forked
   • Number of times this component is used in other components
   • Number of times this component is loaded across BOS
   • Number of times there is render errors
   • Ability to preview the component
   • A list of parent component(with links to open these components) where this component is used in
   • Information about the creator of this component (number of days they are active, reputation score calculated from data such as num of components published/forked/used, lines of code, number of likes/save received etc.)
   • <Dev Data MVP Req: Total Components Published; Total Components Forkek; Time joined>
   • Number of likes and bookmark this component has received (when available)

4. The developer also sees options to view source code, historical updates made to the component and a discussion section of the component in the opened page
5. After careful examination, the developer decide to fork the component they find most suitable for their needs

Question to consider

• What would the experience look like if the component renders into blank? (this could happen to components that are embedded in some frames or code; or logic components such as the ones for "infinite scroll" etc.)

Dependencies

• Developer Reputation System as additional data to rank components

Resources

(Relevant documentation, Figma links, and other reference material)

• Design WIP by Xuan
• Insights by Robert Yan
• Wireframe by Tiffany
• NEARCon Design

### MVP
- [ ] https://github.com/near/data-platform/issues/2
- [ ] https://github.com/near/data-analytics/issues/17

### Next Ver.
- [ ] https://github.com/near/data-platform/issues/51
- [ ] https://github.com/near/data-platform/issues/4
- [ ] https://github.com/near/data-platform/issues/6
- [ ] https://github.com/near/near-search/issues/46
- [ ] https://github.com/near/near-discovery/issues/622

[TiffanyGYJ]

• component search result page with loading of components
• analytics data input

[TiffanyGYJ]

In different epic but related topic

We want to incentivize or make it easy for developers to fill in more metadata about their components to increase the discoverability of them, here are several options; this will be handled in a separate initiative

• Component Profile Completeness Rate --- Make it higher to increase the chance of discoverability of your component to boost your reputation
• Auto-generated metadata/tags detected from codew
• Make code info part of search index and algo

[pkudinov]

@Ishatt how to add https://github.com/near/near-discovery/issues/618 as a sub-epic for this initiative?

[TiffanyGYJ]

• connect algolia to the search bar on near.org/components
• connect algolia to the search bar in IDE