Hide items in sidebar

Hello. I wonder how to hide specific items in sidebar that in resources?

2 Replies

Hi @zxj7664. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- In Refine, the sidebar (also known as the Sider component) uses the resources property of the <Refine> component to render the navigation links. If a resource has a list property, it will be rendered as a navigation link in the sidebar. To hide a specific resource from the sidebar, you can use the meta.hide property of the resource. Here's an example:

import { Refine } from "@refinedev/core";  
  
const App = () => (  
 <Refine  
 ...
 resources={[  
 {  
 name: "posts",  
 list: "/posts",  
 meta: {  
 label: "Posts",  
 icon: "📝",  
 },  
 },  
 {  
 name: "users",  
 list: "/users",  
 meta: {  
 // Users resource will be hidden from the menu but will be accessible via the URL  
 hide: true,  
 },  
 },  
 ]}  
 />  
);

import { Refine } from "@refinedev/core";  
  
const App = () => (  
 <Refine  
 ...
 resources={[  
 {  
 name: "posts",  
 list: "/posts",  
 meta: {  
 label: "Posts",  
 icon: "📝",  
 },  
 },  
 {  
 name: "users",  
 list: "/users",  
 meta: {  
 // Users resource will be hidden from the menu but will be accessible via the URL  
 hide: true,  
 },  
 },  
 ]}  
 />  
);

In this example, the "users" resource will be hidden from the sidebar, but it will still be accessible via the URL. For more information, you can refer to the Refine documentation (https://refine.dev/docs/guides-concepts/faq#how-to-hide-items-from-the-sider-component). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•5mo ago

<@152885107315834880> kapa.ai is still learning and improving, please let us know how it did by reacting below