const contract = props.contract || 'docschain.ws-protocol-63'; const componentOwnerId = props.componentOwnerId ?? 'calimero.testnet'; const redirectConfig = !componentOwnerId || componentOwnerId === 'calimero.near' ? {} : { redirect: (url) => url.replace('calimero.near', componentOwnerId) }; const transformUrl = (url) => !componentOwnerId || componentOwnerId === 'calimero.near' ? 'calimero.near' : url.replace('calimero.near', componentOwnerId); const SideMenu = styled.div` background-color: #0e0e10; padding-top: 1rem; width: 317px; `; const HorizontalSeparatorLine = styled.div` background-color: '#BF4F74'; width: 317px; height: 1px; background-color: #282933; margin-top: 1rem; margin-bottom: 1rem; `; const handleCreatePage = useCallback( (isPrivate) => { props.onOpenCreatePage(isPrivate); }, [props.createPageOpen], ); return ( <SideMenu> <Widget src={'calimero.near/widget/Calimero.DocsChain.Sidebar.Header'} config={redirectConfig} props={{ title: 'Shared Pages', onChange: () => handleCreatePage(false), componentName: 'CreateArticle', }} /> <Widget src={'calimero.near/widget/Calimero.DocsChain.Sidebar.AllArticlesList'} config={redirectConfig} /> <HorizontalSeparatorLine /> <Widget src={'calimero.near/widget/Calimero.DocsChain.Sidebar.Header'} config={redirectConfig} props={{ title: 'Settings', }} /> <Widget src={'calimero.near/widget/Calimero.DocsChain.Sidebar.SettingsList'} config={redirectConfig} /> </SideMenu> );