Customizing sider items
is there a way to customize the sider items in the render function?
<ThemedSiderV2
render={({ items, logout }) => {
console.log('SIDER ITEM RENDER - ', items);
return (
<>
{items.map((item) =>
React.cloneElement(item, {
onClick: async () => {
await invalidate({
resource: item.props.resource,
invalidates: ['resourceAll'],
});
},
}),
)}
{logout}
</>
);
}}
Title={(props) => {
return (
<div
style={{
display: 'flex',
alignItems: 'center',
}}
>
{!props.collapsed && (
<>
<Typography.Text strong>
{parameters.app.name || 'Admin Panel'}
</Typography.Text>
</>
)}
</div>
);
}}
/>
here i'd like to make some of the parent resources to be always expanded
<ThemedSiderV2
render={({ items, logout }) => {
console.log('SIDER ITEM RENDER - ', items);
return (
<>
{items.map((item) =>
React.cloneElement(item, {
onClick: async () => {
await invalidate({
resource: item.props.resource,
invalidates: ['resourceAll'],
});
},
}),
)}
{logout}
</>
);
}}
Title={(props) => {
return (
<div
style={{
display: 'flex',
alignItems: 'center',
}}
>
{!props.collapsed && (
<>
<Typography.Text strong>
{parameters.app.name || 'Admin Panel'}
</Typography.Text>
</>
)}
</div>
);
}}
/>
here i'd like to make some of the parent resources to be always expanded
