diff --git a/.changeset/wicked-masks-love.md b/.changeset/wicked-masks-love.md new file mode 100644 index 0000000000..a845151cc8 --- /dev/null +++ b/.changeset/wicked-masks-love.md @@ -0,0 +1,2 @@ +--- +--- diff --git a/packages/apps/dev-wallet/src/App/Layout/KLogo.tsx b/packages/apps/dev-wallet/src/App/Layout/KLogo.tsx new file mode 100644 index 0000000000..be5aa27cf4 --- /dev/null +++ b/packages/apps/dev-wallet/src/App/Layout/KLogo.tsx @@ -0,0 +1,31 @@ +import type { FC } from 'react'; + +export const KLogo: FC<{ height: number; className?: string }> = (props) => ( + + + + + + + + + + + + +); diff --git a/packages/apps/dev-wallet/src/App/Layout/SideBar.tsx b/packages/apps/dev-wallet/src/App/Layout/SideBar.tsx index 68dae5f4a2..4d0cadaef2 100644 --- a/packages/apps/dev-wallet/src/App/Layout/SideBar.tsx +++ b/packages/apps/dev-wallet/src/App/Layout/SideBar.tsx @@ -6,7 +6,6 @@ import { MonoDarkMode, MonoKey, MonoLightMode, - MonoLogout, MonoNetworkCheck, MonoSignature, MonoSwapHoriz, @@ -14,14 +13,8 @@ import { } from '@kadena/kode-icons/system'; import { NetworkSelector } from '@/Components/NetworkSelector/NetworkSelector'; -import { useWallet } from '@/modules/wallet/wallet.hook'; -import { - Button, - ContextMenu, - ContextMenuItem, - Themes, - useTheme, -} from '@kadena/kode-ui'; + +import { Button, Themes, useTheme } from '@kadena/kode-ui'; import { SideBarItem, SideBarItemsInline, @@ -30,22 +23,24 @@ import { } from '@kadena/kode-ui/patterns'; import { FC } from 'react'; import { Link } from 'react-router-dom'; +import { KLogo } from './KLogo'; export const SideBar: FC = () => { const { theme, setTheme } = useTheme(); const { isExpanded } = useLayout(); - const { lockProfile } = useWallet(); const toggleTheme = (): void => { const newTheme = theme === Themes.dark ? Themes.light : Themes.dark; setTheme(newTheme); }; - const handleLogout = () => { - lockProfile(); - }; return ( + + + } appContext={ } label="Select network"> { context={ <> - } label="Profile"> - } - > - {isExpanded ? 'Profile' : undefined} - - } - > - } - label="Logout" - onClick={handleLogout} - /> - - } onPress={toggleTheme} diff --git a/packages/libs/kode-ui/src/patterns/SideBarLayout/SideBar.tsx b/packages/libs/kode-ui/src/patterns/SideBarLayout/SideBar.tsx index e68d30674c..46d47baa06 100644 --- a/packages/libs/kode-ui/src/patterns/SideBarLayout/SideBar.tsx +++ b/packages/libs/kode-ui/src/patterns/SideBarLayout/SideBar.tsx @@ -3,10 +3,9 @@ import classNames from 'classnames'; import type { FC, PropsWithChildren, ReactElement } from 'react'; import React from 'react'; import type { PressEvent } from './../../components'; -import { Button, Media, Stack } from './../../components'; +import { Button, Stack } from './../../components'; import { useLayout } from './components/LayoutProvider'; import { KLogo } from './components/Logo/KLogo'; -import { KadenaLogo } from './components/Logo/KadenaLogo'; import { SideBarAppContext } from './components/SideBarAppContext'; import { SideBarContext } from './components/SideBarContext'; import { SideBarNavigation } from './components/SideBarNavigation'; @@ -24,7 +23,6 @@ export interface ISideBarProps extends PropsWithChildren { navigation?: ReactElement; context?: ReactElement; logo?: ReactElement; - minifiedLogo?: ReactElement; } export const SideBar: FC = ({ @@ -33,7 +31,6 @@ export const SideBar: FC = ({ navigation, context, logo, - minifiedLogo, }) => { const { isExpanded, handleToggleExpand } = useLayout(); @@ -44,11 +41,7 @@ export const SideBar: FC = ({ }; const ShowLogo = () => { - if (!isExpanded) { - return minifiedLogo ? minifiedLogo : ; - } - - return logo ? logo : ; + return logo ? logo : ; }; return ( @@ -65,10 +58,7 @@ export const SideBar: FC = ({ })} > - - {ShowLogo()} - {ShowLogo()} - + {ShowLogo()} { content @@ -94,11 +93,6 @@ const InnerLayout = () => { sidebar={ - - - } - minifiedLogo={ @@ -312,7 +306,7 @@ const InnerLayoutFull = () => { }} logo={ - + } variant="full" diff --git a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KLogo.tsx b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KLogo.tsx index f86e9b6f77..d494e491cb 100644 --- a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KLogo.tsx +++ b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KLogo.tsx @@ -4,25 +4,29 @@ import React from 'react'; export const KLogo: FC<{ height: number; className?: string }> = (props) => ( - - - + + + + + + + + + + ); diff --git a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KadenaLogo.tsx b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KadenaLogo.tsx deleted file mode 100644 index bf8d54b47c..0000000000 --- a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/Logo/KadenaLogo.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import type { FC } from 'react'; -import React from 'react'; - -export const KadenaLogo: FC<{ height: number; className?: string }> = ( - props, -) => ( - - - - - - - - - - - -); diff --git a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/RightAside/RightAside.tsx b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/RightAside/RightAside.tsx index 01f834df32..f4980e438d 100644 --- a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/RightAside/RightAside.tsx +++ b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/RightAside/RightAside.tsx @@ -1,5 +1,5 @@ import type { FC, PropsWithChildren } from 'react'; -import React from 'react'; +import React, { useEffect } from 'react'; import { createPortal } from 'react-dom'; import { useLayout } from '../LayoutProvider'; import { rightAsideClass } from './style.css'; @@ -9,7 +9,17 @@ export interface iRightAside extends PropsWithChildren { } export const RightAside: FC = ({ children, isOpen }) => { - const { rightAsideRef } = useLayout(); + const { + rightAsideRef, + location, + setIsRightAsideExpanded, + isRightAsideExpanded, + } = useLayout(); + + useEffect(() => { + if (!isRightAsideExpanded) return; + setIsRightAsideExpanded(false); + }, [location?.url]); if (!isOpen || !rightAsideRef) return null; diff --git a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/SideBarAside.tsx b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/SideBarAside.tsx index e8142a1df1..8492ed07ec 100644 --- a/packages/libs/kode-ui/src/patterns/SideBarLayout/components/SideBarAside.tsx +++ b/packages/libs/kode-ui/src/patterns/SideBarLayout/components/SideBarAside.tsx @@ -17,7 +17,7 @@ import { useLayout } from './LayoutProvider'; export const SideBarAside: FC<{ location: ISideBarLayoutLocation; -}> = ({ location }) => { +}> = () => { const { setIsRightAsideExpanded, isRightAsideExpanded, @@ -35,10 +35,6 @@ export const SideBarAside: FC<{ setRightAsideRef(ref.current); }, [ref.current]); - useEffect(() => { - setIsRightAsideExpanded(false); - }, [location.url]); - return ( <>