paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 40 Packages Projects Releases Wiki Activity

Fix tSidebar ests and storybook after merging change caused isPinned to be true by default

Browse Source 
Signed-off-by: hiba-aldalaty <hibaaldalaty@gmail.com>
This commit is contained in:
hiba-aldalaty
2021-11-24 09:29:41 +00:00
parent 8928c0f7c2
commit 949633623f
2 changed files with 86 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/core-components/src/layout/Sidebar/Bar.test.tsx
+34 -25
View File
@@ -26,34 +26,43 @@ import { Sidebar, SidebarExpandButton } from './Bar';
import { SidebarItem, SidebarSearchField } from './Items';
import { SidebarSubItem } from './SidebarSubItem';
import { Submenu } from './Submenu';
import { SidebarPinStateContext } from '.';
async function renderScalableSidebar() {
await renderInTestApp(
<Sidebar disableExpandOnHover>
<SidebarSearchField onSearch={() => {}} to="/search" />
<SidebarItem icon={CatalogSidebarLogo} onClick={() => {}} text="Catalog">
<Submenu title="Catalog">
<SidebarSubItem title="Tools" to="/1" icon={BuildRoundedIcon} />
<SidebarSubItem
title="Misc"
to="/6"
icon={MiscIcon}
dropdownItems={[
{
title: 'dropdown item 1',
to: '/dropdownitemlink',
},
{
title: 'dropdown item 2',
to: '/dropdownitemlink2',
},
]}
/>
</Submenu>
</SidebarItem>
<SidebarItem icon={CreateComponentIcon} to="create" text="Create..." />
<SidebarExpandButton />
</Sidebar>,
<SidebarPinStateContext.Provider
value={{ isPinned: false, toggleSidebarPinState: () => {} }}
>
<Sidebar disableExpandOnHover>
<SidebarSearchField onSearch={() => {}} to="/search" />
<SidebarItem
icon={CatalogSidebarLogo}
onClick={() => {}}
text="Catalog"
>
<Submenu title="Catalog">
<SidebarSubItem title="Tools" to="/1" icon={BuildRoundedIcon} />
<SidebarSubItem
title="Misc"
to="/6"
icon={MiscIcon}
dropdownItems={[
{
title: 'dropdown item 1',
to: '/dropdownitemlink',
},
{
title: 'dropdown item 2',
to: '/dropdownitemlink2',
},
]}
/>
</Submenu>
</SidebarItem>
<SidebarItem icon={CreateComponentIcon} to="create" text="Create..." />
<SidebarExpandButton />
</Sidebar>
</SidebarPinStateContext.Provider>,
);
}
packages/core-components/src/layout/Sidebar/Sidebar.stories.tsx
+52 -47
View File
@@ -27,6 +27,7 @@ import {
SidebarExpandButton,
SidebarIntro,
SidebarItem,
SidebarPage,
SidebarSearchField,
SidebarSpace,
} from '.';
@@ -53,54 +54,58 @@ const handleSearch = (input: string) => {
};
export const SampleSidebar = () => (
<Sidebar>
<SidebarSearchField onSearch={handleSearch} to="/search" />
<SidebarDivider />
<SidebarItem icon={HomeOutlinedIcon} to="#" text="Plugins" />
<SidebarItem icon={AddCircleOutlineIcon} to="#" text="Create..." />
<SidebarDivider />
<SidebarIntro />
<SidebarSpace />
</Sidebar>
<SidebarPage>
<Sidebar>
<SidebarSearchField onSearch={handleSearch} to="/search" />
<SidebarDivider />
<SidebarItem icon={HomeOutlinedIcon} to="#" text="Plugins" />
<SidebarItem icon={AddCircleOutlineIcon} to="#" text="Create..." />
<SidebarDivider />
<SidebarIntro />
<SidebarSpace />
</Sidebar>
</SidebarPage>
);
export const SampleScalableSidebar = () => (
<Sidebar disableExpandOnHover>
<SidebarSearchField onSearch={handleSearch} to="/search" />
<SidebarDivider />
<SidebarItem icon={CatalogSidebarLogo} onClick={() => {}} text="Catalog">
<Submenu title="Catalog">
<SidebarSubItem title="Tools" to="/1" icon={BuildRoundedIcon} />
<SidebarSubItem title="APIs" to="/2" icon={APIsIcon} />
<SidebarSubItem title="Services" to="/3" icon={ServicesIcon} />
<SidebarSubItem
title="Libraries"
to="/4"
icon={LibraryBooksOutlinedIcon}
/>
<SidebarSubItem title="Websites" to="/5" icon={WebOutlinedIcon} />
<SidebarSubItem
title="Misc"
to="/6"
icon={MiscIcon}
dropdownItems={[
{
title: 'Lorem Ipsum',
to: '/7',
},
{
title: 'Lorem Ipsum',
to: '/8',
},
]}
/>
</Submenu>
</SidebarItem>
<SidebarItem icon={HomeOutlinedIcon} to="#" text="Plugins" />
<SidebarItem icon={AddCircleOutlineIcon} to="#" text="Create..." />
<SidebarDivider />
<SidebarIntro />
<SidebarSpace />
<SidebarExpandButton />
</Sidebar>
<SidebarPage>
<Sidebar disableExpandOnHover>
<SidebarSearchField onSearch={handleSearch} to="/search" />
<SidebarDivider />
<SidebarItem icon={CatalogSidebarLogo} onClick={() => {}} text="Catalog">
<Submenu title="Catalog">
<SidebarSubItem title="Tools" to="/1" icon={BuildRoundedIcon} />
<SidebarSubItem title="APIs" to="/2" icon={APIsIcon} />
<SidebarSubItem title="Services" to="/3" icon={ServicesIcon} />
<SidebarSubItem
title="Libraries"
to="/4"
icon={LibraryBooksOutlinedIcon}
/>
<SidebarSubItem title="Websites" to="/5" icon={WebOutlinedIcon} />
<SidebarSubItem
title="Misc"
to="/6"
icon={MiscIcon}
dropdownItems={[
{
title: 'Lorem Ipsum',
to: '/7',
},
{
title: 'Lorem Ipsum',
to: '/8',
},
]}
/>
</Submenu>
</SidebarItem>
<SidebarItem icon={HomeOutlinedIcon} to="#" text="Plugins" />
<SidebarItem icon={AddCircleOutlineIcon} to="#" text="Create..." />
<SidebarDivider />
<SidebarIntro />
<SidebarSpace />
<SidebarExpandButton />
</Sidebar>
</SidebarPage>
);