From 791592108bb59e431b5f357b41ff1739970eef24 Mon Sep 17 00:00:00 2001 From: luca Date: Mon, 4 Nov 2024 14:13:05 +0800 Subject: [PATCH 1/4] feat: display hyperweb logo --- .../chain-admin/components/common/Header/Header.tsx | 11 ++++------- .../components/common/Sidebar/Sidebar.tsx | 8 ++++---- .../chain-admin/public/logos/brand-logo-dark.svg | 8 -------- .../chain-admin/public/logos/brand-logo-sm-dark.svg | 12 ------------ templates/chain-admin/public/logos/brand-logo-sm.svg | 12 ------------ templates/chain-admin/public/logos/brand-logo.svg | 8 -------- .../chain-admin/public/logos/hyperweb-logo-dark.svg | 5 +++++ .../logos/{hyperweb.svg => hyperweb-logo-sm.svg} | 0 templates/chain-admin/public/logos/hyperweb-logo.svg | 5 +++++ 9 files changed, 18 insertions(+), 51 deletions(-) delete mode 100644 templates/chain-admin/public/logos/brand-logo-dark.svg delete mode 100644 templates/chain-admin/public/logos/brand-logo-sm-dark.svg delete mode 100644 templates/chain-admin/public/logos/brand-logo-sm.svg delete mode 100644 templates/chain-admin/public/logos/brand-logo.svg create mode 100644 templates/chain-admin/public/logos/hyperweb-logo-dark.svg rename templates/chain-admin/public/logos/{hyperweb.svg => hyperweb-logo-sm.svg} (100%) create mode 100644 templates/chain-admin/public/logos/hyperweb-logo.svg diff --git a/templates/chain-admin/components/common/Header/Header.tsx b/templates/chain-admin/components/common/Header/Header.tsx index daabda17..db87ccb2 100644 --- a/templates/chain-admin/components/common/Header/Header.tsx +++ b/templates/chain-admin/components/common/Header/Header.tsx @@ -17,14 +17,11 @@ export const Header = ({ onOpenSidebar }: HeaderProps) => { const { isDesktop, isMobile } = useDetectBreakpoints(); const brandLogo = useColorModeValue( - '/logos/brand-logo.svg', - '/logos/brand-logo-dark.svg' + '/logos/hyperweb-logo.svg', + '/logos/hyperweb-logo-dark.svg' ); - const brandLogoSm = useColorModeValue( - '/logos/brand-logo-sm.svg', - '/logos/brand-logo-sm-dark.svg' - ); + const brandLogoSm = '/logos/hyperweb-logo-sm.svg'; return ( { alt="your logo" width="0" height="0" - style={{ width: isMobile ? '40px' : '180px', height: 'auto' }} + style={{ width: isMobile ? '30px' : '150px', height: 'auto' }} /> )} diff --git a/templates/chain-admin/components/common/Sidebar/Sidebar.tsx b/templates/chain-admin/components/common/Sidebar/Sidebar.tsx index 16bf6fca..ba298d55 100644 --- a/templates/chain-admin/components/common/Sidebar/Sidebar.tsx +++ b/templates/chain-admin/components/common/Sidebar/Sidebar.tsx @@ -16,8 +16,8 @@ export const Sidebar = ({ isOpen, onClose }: SidebarProps) => { const { isDesktop } = useDetectBreakpoints(); const brandLogoSrc = useColorModeValue( - '/logos/brand-logo.svg', - '/logos/brand-logo-dark.svg' + '/logos/hyperweb-logo.svg', + '/logos/hyperweb-logo-dark.svg' ); const desktopSidebar = ( @@ -37,13 +37,13 @@ export const Sidebar = ({ isOpen, onClose }: SidebarProps) => { borderRightWidth="1px" borderRightStyle="solid" > - + your logo diff --git a/templates/chain-admin/public/logos/brand-logo-dark.svg b/templates/chain-admin/public/logos/brand-logo-dark.svg deleted file mode 100644 index e6d02d4d..00000000 --- a/templates/chain-admin/public/logos/brand-logo-dark.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/templates/chain-admin/public/logos/brand-logo-sm-dark.svg b/templates/chain-admin/public/logos/brand-logo-sm-dark.svg deleted file mode 100644 index 45876097..00000000 --- a/templates/chain-admin/public/logos/brand-logo-sm-dark.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/templates/chain-admin/public/logos/brand-logo-sm.svg b/templates/chain-admin/public/logos/brand-logo-sm.svg deleted file mode 100644 index a692bc2d..00000000 --- a/templates/chain-admin/public/logos/brand-logo-sm.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/templates/chain-admin/public/logos/brand-logo.svg b/templates/chain-admin/public/logos/brand-logo.svg deleted file mode 100644 index 719d5891..00000000 --- a/templates/chain-admin/public/logos/brand-logo.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - diff --git a/templates/chain-admin/public/logos/hyperweb-logo-dark.svg b/templates/chain-admin/public/logos/hyperweb-logo-dark.svg new file mode 100644 index 00000000..21306def --- /dev/null +++ b/templates/chain-admin/public/logos/hyperweb-logo-dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/templates/chain-admin/public/logos/hyperweb.svg b/templates/chain-admin/public/logos/hyperweb-logo-sm.svg similarity index 100% rename from templates/chain-admin/public/logos/hyperweb.svg rename to templates/chain-admin/public/logos/hyperweb-logo-sm.svg diff --git a/templates/chain-admin/public/logos/hyperweb-logo.svg b/templates/chain-admin/public/logos/hyperweb-logo.svg new file mode 100644 index 00000000..6f1031ed --- /dev/null +++ b/templates/chain-admin/public/logos/hyperweb-logo.svg @@ -0,0 +1,5 @@ + + + + + From 4f4f69a4219b188b220936c0a5d003566e7a43a2 Mon Sep 17 00:00:00 2001 From: luca Date: Mon, 4 Nov 2024 14:24:32 +0800 Subject: [PATCH 2/4] feat: add hyperweb social links --- templates/chain-admin/components/common/Footer.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/templates/chain-admin/components/common/Footer.tsx b/templates/chain-admin/components/common/Footer.tsx index 95e1658c..269def2b 100644 --- a/templates/chain-admin/components/common/Footer.tsx +++ b/templates/chain-admin/components/common/Footer.tsx @@ -45,7 +45,7 @@ const TextDivider = () => { const socialLinks = [ { icon: , - href: 'https://github.com/cosmology-tech', + href: 'https://github.com/hyperweb-io', }, { icon: , @@ -57,7 +57,7 @@ const socialLinks = [ ), - href: 'https://x.com/cosmology_tech', + href: 'https://x.com/Hyperweb_', }, { icon: , From b484b6f556f6d108af27c499da51b65c3160a796 Mon Sep 17 00:00:00 2001 From: luca Date: Mon, 4 Nov 2024 15:06:54 +0800 Subject: [PATCH 3/4] fix: sidebar style --- templates/chain-admin/components/common/Sidebar/Sidebar.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/templates/chain-admin/components/common/Sidebar/Sidebar.tsx b/templates/chain-admin/components/common/Sidebar/Sidebar.tsx index ba298d55..903e02e7 100644 --- a/templates/chain-admin/components/common/Sidebar/Sidebar.tsx +++ b/templates/chain-admin/components/common/Sidebar/Sidebar.tsx @@ -22,7 +22,8 @@ export const Sidebar = ({ isOpen, onClose }: SidebarProps) => { const desktopSidebar = ( Date: Mon, 4 Nov 2024 21:14:00 +0800 Subject: [PATCH 4/4] feat: display hyperweb chain only --- .../common/Header/ChainDropdown.tsx | 39 +----- .../components/common/Header/Header.tsx | 7 +- .../chain-admin/components/common/Layout.tsx | 67 +++++++++- .../components/common/Sidebar/NavItems.tsx | 24 +++- .../common/Sidebar/SidebarContent.tsx | 125 ++++++++++-------- .../components/common/Sidebar/index.ts | 1 + templates/chain-admin/config/chains.ts | 11 +- templates/chain-admin/contexts/chain.ts | 11 +- .../hooks/asset-list/useTotalAssets.ts | 7 +- templates/chain-admin/hooks/common/index.ts | 1 + .../hooks/common/useAddHyperwebChain.ts | 38 ++++++ .../hooks/common/useStarshipChains.ts | 7 +- templates/chain-admin/pages/_app.tsx | 7 - templates/chain-admin/pages/index.tsx | 38 ++++-- 14 files changed, 242 insertions(+), 141 deletions(-) create mode 100644 templates/chain-admin/hooks/common/useAddHyperwebChain.ts diff --git a/templates/chain-admin/components/common/Header/ChainDropdown.tsx b/templates/chain-admin/components/common/Header/ChainDropdown.tsx index db44ab3a..e31633a9 100644 --- a/templates/chain-admin/components/common/Header/ChainDropdown.tsx +++ b/templates/chain-admin/components/common/Header/ChainDropdown.tsx @@ -1,54 +1,25 @@ import Image from 'next/image'; -import { useEffect, useState } from 'react'; +import { useState } from 'react'; import { useChain, useManager } from '@cosmos-kit/react'; import { Box, Combobox, Skeleton, Stack, Text } from '@interchain-ui/react'; import { useStarshipChains, useDetectBreakpoints } from '@/hooks'; import { chainStore, useChainStore } from '@/contexts'; -import { chainOptions } from '@/config'; -import { getSignerOptions } from '@/utils'; export const ChainDropdown = () => { const { selectedChain } = useChainStore(); const { chain } = useChain(selectedChain); const [input, setInput] = useState(chain.pretty_name); - const { isMobile } = useDetectBreakpoints(); - const { data: starshipChains, refetch } = useStarshipChains(); - - const [isChainsAdded, setIsChainsAdded] = useState(false); - const { addChains, getChainLogo } = useManager(); - - useEffect(() => { - if ( - starshipChains?.chains.length && - starshipChains?.assets.length && - !isChainsAdded - ) { - addChains( - starshipChains.chains, - starshipChains.assets, - getSignerOptions() - ); - setIsChainsAdded(true); - } - }, [starshipChains, isChainsAdded]); + const { data: starshipChains } = useStarshipChains(); + const { getChainLogo } = useManager(); - const onOpenChange = (isOpen: boolean) => { - if (isOpen && !isChainsAdded) { - refetch(); - } - }; - - const chains = isChainsAdded - ? chainOptions.concat(starshipChains?.chains ?? []) - : chainOptions; + const { isMobile } = useDetectBreakpoints(); return ( { setInput(input); }} - onOpenChange={onOpenChange} selectedKey={selectedChain} onSelectionChange={(key) => { const chainName = key as string | null; @@ -77,7 +48,7 @@ export const ChainDropdown = () => { width: isMobile ? '130px' : '260px', }} > - {chains.map((c) => ( + {(starshipChains?.chains ?? []).map((c) => ( { const { theme, setTheme } = useTheme(); const { isDesktop, isMobile } = useDetectBreakpoints(); + const { isHyperwebAdded } = useAddHyperwebChain(); const brandLogo = useColorModeValue( '/logos/hyperweb-logo.svg', @@ -42,8 +43,8 @@ export const Header = ({ onOpenSidebar }: HeaderProps) => { )} - - + {isHyperwebAdded && } + {isHyperwebAdded && } + + + ); + + const renderContent = useMemo(() => { + if (router.pathname === ROUTES.HOME) + return ( + <> + {notRunningWarning} + {children} + + ); + if (router.pathname === ROUTES.DOCS || isHyperwebAdded) return children; + return notRunningWarning; + }, [router.pathname, isHyperwebAdded, notRunningWarning, children]); return (
- {children} + + {renderContent} +