Change SubmenuItem to SidebarSubItem

Signed-off-by: hiba-aldalaty <hibaaldalaty@gmail.com>

packages/core-components/api-report.md

@@ -1988,6 +1988,22 @@ export const SidebarSpacer: React_2.ComponentType<
     }
 >;
 
+// @public
+export const SidebarSubItem: ({
+  title,
+  to,
+  icon: Icon,
+  dropdownItems,
+}: SidebarSubItemProps) => JSX.Element;
+
+// @public
+export type SidebarSubItemProps = {
+  title: string;
+  to: string;
+  icon: IconComponent;
+  dropdownItems?: DropDownItem[];
+};
+
 // Warning: (ae-forgotten-export) The symbol "Props" needs to be exported by the entry point index.d.ts
 // Warning: (ae-missing-release-tag) "SignInPage" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
 //
@@ -2093,22 +2109,6 @@ export type StructuredMetadataTableListClassKey = 'root';
 // @public (undocumented)
 export type StructuredMetadataTableNestedListClassKey = 'root';
 
-// @public
-export const SubmenuItem: ({
-  title,
-  to,
-  icon: Icon,
-  dropdownItems,
-}: SubmenuItemProps) => JSX.Element;
-
-// @public
-export type SubmenuItemProps = {
-  title: string;
-  to: string;
-  icon: IconComponent;
-  dropdownItems?: DropDownItem[];
-};
-
 // Warning: (ae-forgotten-export) The symbol "SubvalueCellProps" needs to be exported by the entry point index.d.ts
 // Warning: (ae-missing-release-tag) "SubvalueCell" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
 //

packages/core-components/src/layout/Sidebar/Bar.test.tsx

@@ -24,7 +24,7 @@ import { CatalogSidebarLogo } from './icons/CatalogSidebarLogo';
 import { MiscIcon } from './icons/MiscIcon';
 import { Sidebar, SidebarExpandButton } from './Bar';
 import { SidebarItem, SidebarSearchField } from './Items';
-import { SubmenuItem } from './SubmenuItem';
+import { SidebarSubItem } from './SidebarSubItem';
 
 async function renderScalableSidebar() {
   await renderInTestApp(
@@ -37,8 +37,8 @@ async function renderScalableSidebar() {
         hasSubMenu
         submenuTitle="Catalog"
       >
-        <SubmenuItem title="Tools" to="/1" icon={BuildRoundedIcon} />
-        <SubmenuItem
+        <SidebarSubItem title="Tools" to="/1" icon={BuildRoundedIcon} />
+        <SidebarSubItem
           title="Misc"
           to="/6"
           icon={MiscIcon}

packages/core-components/src/layout/Sidebar/Sidebar.stories.tsx

@@ -30,7 +30,7 @@ import {
   SidebarSearchField,
   SidebarSpace,
 } from '.';
-import { SubmenuItem } from './SubmenuItem';
+import { SidebarSubItem } from './SidebarSubItem';
 import { CatalogSidebarLogo } from './icons/CatalogSidebarLogo';
 import { APIsIcon } from './icons/APIsIcon';
 import { ServicesIcon } from './icons/ServicesIcon';
@@ -74,12 +74,16 @@ export const SampleScalableSidebar = () => (
       hasSubMenu
       submenuTitle="Catalog"
     >
-      <SubmenuItem title="Tools" to="/1" icon={BuildRoundedIcon} />
-      <SubmenuItem title="APIs" to="/2" icon={APIsIcon} />
-      <SubmenuItem title="Services" to="/3" icon={ServicesIcon} />
-      <SubmenuItem title="Libraries" to="/4" icon={LibraryBooksOutlinedIcon} />
-      <SubmenuItem title="Websites" to="/5" icon={WebOutlinedIcon} />
-      <SubmenuItem
+      <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}

packages/core-components/src/layout/Sidebar/SidebarSubItem.tsx

@@ -100,7 +100,7 @@ export type DropDownItem = {
  *
  * @public
  */
-export type SubmenuItemProps = {
+export type SidebarSubItemProps = {
   title: string;
   to: string;
   icon: IconComponent;
@@ -112,12 +112,12 @@ export type SubmenuItemProps = {
  *
  * @public
  */
-export const SubmenuItem = ({
+export const SidebarSubItem = ({
   title,
   to,
   icon: Icon,
   dropdownItems,
-}: SubmenuItemProps) => {
+}: SidebarSubItemProps) => {
   const classes = useStyles();
   const { pathname: locationPathname } = useLocation();
   const { pathname: toPathname } = useResolvedPath(to);

packages/core-components/src/layout/Sidebar/index.ts

@@ -15,8 +15,8 @@
  */
 
 export { Sidebar, SidebarExpandButton } from './Bar';
-export { SubmenuItem } from './SubmenuItem';
-export type { SubmenuItemProps, DropDownItem } from './SubmenuItem';
+export { SidebarSubItem } from './SidebarSubItem';
+export type { SidebarSubItemProps, DropDownItem } from './SidebarSubItem';
 export type { SidebarClassKey } from './Bar';
 export { SidebarPage, SidebarPinStateContext } from './Page';
 export type { SidebarPinStateContextType, SidebarPageClassKey } from './Page';