feat(project-list): highlight active link.
This commit is contained in:
20
src/commons/route/active-link.tsx
Normal file
20
src/commons/route/active-link.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import { ActiveHookProps, Link, LinkProps, useActive } from '@curi/react-dom';
|
||||
import React, { FC, ReactNode } from 'react';
|
||||
|
||||
export type ActiveLinkProps = ActiveHookProps &
|
||||
LinkProps & {
|
||||
className?: string;
|
||||
children: ReactNode;
|
||||
};
|
||||
|
||||
export const ActiveLink:FC<ActiveLinkProps> = ({ name, params, partial, className = "", ...rest }) => {
|
||||
const active = useActive({ name, params, partial });
|
||||
return (
|
||||
<Link
|
||||
name={name}
|
||||
params={params}
|
||||
{...rest}
|
||||
className={active ? `${className} active` : className}
|
||||
/>
|
||||
);
|
||||
};
|
Reference in New Issue
Block a user