Merge branch 'develop' into mochi-web-preview

consolelabs · Feb 23, 2024 · aba0962 · aba0962
2 parents bf69cc8 + 6f6d443
commit aba0962
Show file tree

Hide file tree

Showing 19 changed files with 344 additions and 151 deletions.
diff --git a/apps/mochi-web/components/DashboardLayout.tsx b/apps/mochi-web/components/DashboardLayout.tsx
@@ -19,7 +19,7 @@ import { ROUTES } from '~constants/routes'
 import clsx from 'clsx'
 import { LoginWidget, useLoginWidget } from '@mochi-web3/login-widget'
 import { appVersion } from '~constants/common'
-import { useTheme } from '~context/theme'
+import { useTheme } from '~hooks/useTheme'
 import { useSidebarContext } from '../context/app/sidebar'
 import { matchUrl } from '../utils/url'
 import { DashboardSkeleton } from './DashboardSkeleton'
@@ -50,7 +50,7 @@ export default function DashboardLayout({
   className,
 }: DashboardLayoutProps) {
   const { pathname, query } = useRouter()
-  const { theme } = useTheme()
+  const { activeTheme } = useTheme()
   const { isLoggedIn, isLoggingIn, isLoadingProfile } = useLoginWidget()
 
   const { variant } = useSidebarContext()
@@ -65,20 +65,23 @@ export default function DashboardLayout({
           type: 'link',
           as: Link,
           href: ROUTES.MY_PROFILE,
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
         {
           title: 'Servers',
           Icon: Discord,
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
         {
           title: 'Settings',
           type: 'link',
           Icon: GearSolid,
           as: Link,
           href: ROUTES.SETTINGS(),
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
         {
           title: 'Developer',
@@ -87,12 +90,14 @@ export default function DashboardLayout({
           as: Link,
           href: ROUTES.APPLICATON_LIST,
           badge: getSidebarBadge['NEW'],
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
         {
           title: 'Invite Friends',
           Icon: AddUserSolid,
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
       ],
       footerItems: [
@@ -125,15 +130,17 @@ export default function DashboardLayout({
           type: 'link',
           as: Link,
           href: ROUTES.APPLICATION_DETAIL.getPath(query?.id as string),
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
         {
           title: 'Revenue',
           Icon: SafeBoxSolid,
           type: 'link',
           as: Link,
           href: ROUTES.APPLICATION_DETAIL_REVENUE.getPath(query?.id as string),
-          selectedIconClassName: theme === 'dark' ? '!text-primary-500' : '',
+          selectedIconClassName:
+            activeTheme === 'dark' ? '!text-primary-500' : '',
         },
       ],
       footerItems: [],

diff --git a/apps/mochi-web/components/Header/Header.tsx b/apps/mochi-web/components/Header/Header.tsx
@@ -45,7 +45,6 @@ import {
   MoonLine,
   SunLine,
 } from '@mochi-ui/icons'
-import { useTheme } from '~context/theme'
 import NotificationList from '~cpn/NotificationList'
 import clsx from 'clsx'
 import { DISCORD_LINK, GITHUB_LINK, TELEGRAM_LINK } from '~envs'
@@ -55,6 +54,7 @@ import { LoginWidget, useLoginWidget } from '@mochi-web3/login-widget'
 import ProfileDropdown from '~cpn/ProfileDropdown'
 import NotificationModal from '~cpn/NotificationList/NotificationModal'
 import { useFetchChangelogLatest } from '~hooks/app/useFetchChangelogLatest'
+import { useTheme } from '~hooks/useTheme'
 import { MobileNavAccordionItem } from './MobileNavAccordionItem'
 import { DashboardMobileSidebar } from './DashboardMobileSidebar'
 import { useIsNavOpenStore } from './util'

diff --git a/apps/mochi-web/components/MochiWidget/Recipient/Recipient.tsx b/apps/mochi-web/components/MochiWidget/Recipient/Recipient.tsx
@@ -24,7 +24,7 @@ import {
 import { useDebounce } from '@dwarvesf/react-hooks'
 import { BottomSheet, useBottomSheetContext } from '~cpn/BottomSheet'
 import { useLoginWidget } from '@mochi-web3/login-widget'
-import { useTheme } from '~context/theme'
+import { useTheme } from '~hooks/useTheme'
 import { ChainPicker } from '../ChainPicker'
 import { Platform } from '../PlatformPicker/type'
 import { RecipientList } from './RecipientList'
@@ -63,7 +63,7 @@ export const Recipient: React.FC<RecipientProps> = ({
   onRemoveRecipient,
 }) => {
   const { isLoggedIn: authorized } = useLoginWidget()
-  const { theme } = useTheme()
+  const { activeTheme } = useTheme()
   const { openSheets, setOpenSheets } = useBottomSheetContext()
   const [searchTerm, setSearchTerm] = useState('')
   const [searchContactTerm, setSearchContactTerm] = useState('')
@@ -395,7 +395,7 @@ export const Recipient: React.FC<RecipientProps> = ({
           className="flex flex-col gap-y-2 justify-center items-center text-text-disabled"
           style={{ height: 84 }}
         >
-          {theme === 'dark' ? (
+          {activeTheme === 'dark' ? (
             <ProfileGuardSuccessDarkColoredLine className="w-10 h-10" />
           ) : (
             <ProfileGuardSuccessColoredLine className="w-10 h-10" />

diff --git a/apps/mochi-web/components/MonikerTableList.tsx b/apps/mochi-web/components/MonikerTableList.tsx
@@ -16,7 +16,7 @@ import { Balance, useWalletStore } from '~store/wallets'
 import clsx from 'clsx'
 import useSWR from 'swr'
 import { api } from '~constants/mochi'
-import { useTheme } from '~context/theme'
+import { useTheme } from '~hooks/useTheme'
 import { Moniker } from './MochiWidget/TokenPicker/type'
 import { MonikerIcons } from './MochiWidget/TokenPicker/utils'
 import { BalanceWithSource } from './TokenTableList'
@@ -68,7 +68,7 @@ export const MonikerTableList = ({
 }: Props) => {
   const { searchTerm } = props
   const { wallets } = useWalletStore()
-  const { theme } = useTheme()
+  const { activeTheme } = useTheme()
 
   const { data = [], isLoading } = useSWR<Moniker[], any, [string, Balance[]]>(
     ['moniker-list', balances],
@@ -160,7 +160,7 @@ export const MonikerTableList = ({
             )}
             emptyContent={
               <div className="flex flex-col justify-center items-center h-full">
-                {theme === 'dark' ? (
+                {activeTheme === 'dark' ? (
                   <BagDark className="w-14 h-14 text-text-tertiary" />
                 ) : (
                   <Bag className="w-14 h-14 text-text-tertiary" />