nextjs-breadcrumbs icon indicating copy to clipboard operation
nextjs-breadcrumbs copied to clipboard

Adding an 'additionalItems' prop

Open NicolasPineau opened this issue 2 years ago • 3 comments

Hi,

Great module, thank you for your work. Here is a suggestion to make it fit with even more contexts, I hope this make sense.

Issue : sometimes we might have breadcrumb items that do not match any part from the current route, it is therefore impossible to make them appear in the breadcrumbs.

Proposed solution : add a props to supply "extra items".

Proposed implementation (not tested yet) :

export interface BreadcrumbsProps {
  /** ... */
  /** Additional breadcrumb items */
  additionalItems?: Array<{
    position: number,
    items: Breadcrumb[],
  }>
}

/** ... */
  
const defaultProps: BreadcrumbsProps = {
  /** ... */
  additionalItems: [],
};
  
/** ... */

const Breadcrumbs = ({ /** ... */ additionalItems }: BreadcrumbsProps) => {

/** ... */

useEffect(() => {
  if (router) {
    /** ... */
     (additionalItems || [])
      .sort(({ position: a }, { position: b }) => b - a)
      .forEach(({ position, items }) => {
        const insertPos = Math.min(pathArray.length, Math.max(0, position));
        pathArray.splice(insertPos, 0, ...items);
      });
    setBreadcrumbs(pathArray);
  }
}, [router]);

Hope this helps. You might think this is dirty or breaks your logic, otherwiser let me know if you'd like me to submit a pull request.

NicolasPineau avatar Mar 23 '22 11:03 NicolasPineau

Instead of / while supplying this additionalItems prop we might add a `breadCrumbItems' props that would allow to bypass the logic around router to force breadcrumb items to be shown.

NicolasPineau avatar Mar 23 '22 13:03 NicolasPineau

Any update on @NicolasPineau's suggestion ? sometimes we could want to link up a category url instead of the route

red1 avatar Jan 27 '23 20:01 red1

@NicolasPineau did you forked the project and add the feature ? It seems that this is no more maintenance activity in here

red1 avatar Mar 08 '23 14:03 red1