add feed in / out button page and also button to redirect to button page
This commit is contained in:
1 parent
07b8e2dc25
commit
b86bd7a2f4
17 files changed
+719
-28
No files matched your search
@@ -6,6 +6,7 @@ export interface NavItem {
|
||||
label: string;
|
||||
icon: React.ReactNode;
|
||||
permissionId?: string;
|
||||
href?: string;
|
||||
subItems?: NavItem[];
|
||||
disabled?: boolean;
|
||||
}
|
||||
@@ -60,26 +61,40 @@ const NavLink: React.FC<NavLinkProps> = ({ item, isActive, isCollapsed, setView,
|
||||
{!isCollapsed && isOpen && (
|
||||
<ul className="pl-8 mt-1 space-y-1">
|
||||
{item.subItems.map((subItem) => (
|
||||
<li key={subItem.view}>
|
||||
<button
|
||||
onClick={() => !subItem.disabled && setView(subItem.view)}
|
||||
disabled={subItem.disabled}
|
||||
className={`w-full flex items-center h-9 pl-3 pr-2 rounded-md transition-colors duration-200 group text-left ${
|
||||
subItem.disabled
|
||||
? 'opacity-40 cursor-not-allowed text-gray-400'
|
||||
: view === subItem.view
|
||||
? 'bg-red-600 text-white shadow-sm'
|
||||
: 'text-gray-500 hover:bg-gray-100 hover:text-gray-800'
|
||||
}`}
|
||||
>
|
||||
<div className="w-6 text-base flex items-center justify-center -ml-1">
|
||||
{subItem.icon}
|
||||
</div>
|
||||
<span className="ml-2 text-sm font-medium whitespace-nowrap">
|
||||
{subItem.label}
|
||||
</span>
|
||||
{subItem.disabled && <i className="fa-solid fa-lock ml-auto text-xs"></i>}
|
||||
</button>
|
||||
<li key={subItem.href ?? subItem.view}>
|
||||
{subItem.href ? (
|
||||
<a
|
||||
href={subItem.href}
|
||||
className={`w-full flex items-center h-9 pl-3 pr-2 rounded-md transition-colors duration-200 group text-left text-gray-500 hover:bg-gray-100 hover:text-gray-800`}
|
||||
>
|
||||
<div className="w-6 text-base flex items-center justify-center -ml-1">
|
||||
{subItem.icon}
|
||||
</div>
|
||||
<span className="ml-2 text-sm font-medium whitespace-nowrap">
|
||||
{subItem.label}
|
||||
</span>
|
||||
</a>
|
||||
) : (
|
||||
<button
|
||||
onClick={() => !subItem.disabled && setView(subItem.view)}
|
||||
disabled={subItem.disabled}
|
||||
className={`w-full flex items-center h-9 pl-3 pr-2 rounded-md transition-colors duration-200 group text-left ${
|
||||
subItem.disabled
|
||||
? 'opacity-40 cursor-not-allowed text-gray-400'
|
||||
: view === subItem.view
|
||||
? 'bg-red-600 text-white shadow-sm'
|
||||
: 'text-gray-500 hover:bg-gray-100 hover:text-gray-800'
|
||||
}`}
|
||||
>
|
||||
<div className="w-6 text-base flex items-center justify-center -ml-1">
|
||||
{subItem.icon}
|
||||
</div>
|
||||
<span className="ml-2 text-sm font-medium whitespace-nowrap">
|
||||
{subItem.label}
|
||||
</span>
|
||||
{subItem.disabled && <i className="fa-solid fa-lock ml-auto text-xs"></i>}
|
||||
</button>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
|
||||
Reference in new issue
Block a user