feat: 🎸 about & dapp list & change network

packages/hooks/hooks-eoa/cms/banner.ts

@@ -0,0 +1,100 @@
+import { useCallback, useEffect, useMemo } from 'react';
+import { useAppEOASelector } from '../index';
+import {
+  TBaseCardItemType,
+  THomeBannerList,
+  TDiscoverDappBannerList,
+  TDiscoverLearnBannerList,
+} from '@portkey-wallet/types/types-ca/cms';
+import { useCurrentNetworkInfo, useNetworkList } from '../network';
+import { ChainId } from '@portkey-wallet/types';
+import { useAppCommonDispatch } from '../..';
+import {
+  getDiscoverDappBannerAsync,
+  getDiscoverLearnBannerAsync,
+  getHomeBannerListAsync,
+  getTokenDetailBannerAsync,
+} from '@portkey-wallet/store/store-ca/cms/actions';
+
+export const useCMS = () => useAppEOASelector(state => state.cms);
+
+export const useCmsBanner = () => {
+  const dispatch = useAppCommonDispatch();
+  const { networkType } = useCurrentNetworkInfo();
+
+  const { homeBannerListMap, discoverDappBannerListMap, discoverLearnBannerListMap, tokenDetailBannerListMap } =
+    useCMS();
+
+  const homeBannerList = useMemo<THomeBannerList>(
+    () => homeBannerListMap?.[networkType] || [],
+    [homeBannerListMap, networkType],
+  );
+
+  const dappBannerList = useMemo<TDiscoverDappBannerList>(
+    () => discoverDappBannerListMap?.[networkType] || [],
+    [discoverDappBannerListMap, networkType],
+  );
+
+  const learnBannerList = useMemo<TDiscoverLearnBannerList>(
+    () => discoverLearnBannerListMap?.[networkType] || [],
+    [discoverLearnBannerListMap, networkType],
+  );
+
+  const getTokenDetailBannerList = useCallback(
+    (chainId: ChainId, symbol: string): TBaseCardItemType[] => {
+      return (
+        tokenDetailBannerListMap?.[networkType]?.find(
+          ele =>
+            ele.chainId?.toLocaleLowerCase() === chainId?.toLocaleLowerCase() &&
+            ele.symbol?.toLocaleLowerCase() === symbol?.toLocaleLowerCase(),
+        )?.items || []
+      );
+    },
+    [networkType, tokenDetailBannerListMap],
+  );
+
+  const fetchHomeBannerListAsync = useCallback(
+    () => dispatch(getHomeBannerListAsync(networkType)),
+    [dispatch, networkType],
+  );
+
+  const fetchDiscoverDappBannerAsync = useCallback(
+    () => dispatch(getDiscoverDappBannerAsync(networkType)),
+    [dispatch, networkType],
+  );
+
+  const fetchTokenDetailBannerAsync = useCallback(
+    () => dispatch(getTokenDetailBannerAsync(networkType)),
+    [dispatch, networkType],
+  );
+
+  const fetchDiscoverLearnBannerAsync = useCallback(
+    () => dispatch(getDiscoverLearnBannerAsync(networkType)),
+    [dispatch, networkType],
+  );
+
+  return {
+    homeBannerList,
+    dappBannerList,
+    learnBannerList,
+    getTokenDetailBannerList,
+    fetchHomeBannerListAsync,
+    fetchDiscoverDappBannerAsync,
+    fetchTokenDetailBannerAsync,
+    fetchDiscoverLearnBannerAsync,
+  };
+};
+
+export const useInitCmsBanner = () => {
+  const dispatch = useAppCommonDispatch();
+  const networkList = useNetworkList();
+
+  useEffect(() => {
+    networkList.forEach(item => {
+      dispatch(getTokenDetailBannerAsync(item.networkType));
+      dispatch(getHomeBannerListAsync(item.networkType));
+      dispatch(getDiscoverDappBannerAsync(item.networkType));
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};

packages/hooks/hooks-eoa/cms/discover.ts

@@ -0,0 +1,89 @@
+import { useCallback, useEffect, useMemo } from 'react';
+import { useAppEOASelector } from '../index';
+import { TDiscoverTabList, TDiscoverLearnGroupList, TDiscoverEarnList } from '@portkey-wallet/types/types-ca/cms';
+import { useAppCommonDispatch } from '../..';
+import { useCurrentNetworkInfo, useNetworkList } from '../network';
+import {
+  getDiscoverEarnAsync,
+  getDiscoverLearnAsync,
+  getDiscoverTabAsync,
+  getDappWhiteListAsync,
+} from '@portkey-wallet/store/store-ca/cms/actions';
+
+const DEFAULT_DISCOVER_TAB_LIST: TDiscoverTabList = [{ index: 2, name: 'Market', value: 'Market' }];
+
+export const useCMS = () => useAppEOASelector(state => state.cms);
+
+export const useDiscoverData = () => {
+  const dispatch = useAppCommonDispatch();
+  const { networkType } = useCurrentNetworkInfo();
+  const { discoverTabListMap, discoverEarnListMap, discoverLearnGroupListMap } = useCMS();
+
+  const discoverHeaderTabList = useMemo<TDiscoverTabList>(() => {
+    if (!discoverTabListMap?.[networkType] || discoverTabListMap?.[networkType]?.length === 0)
+      return DEFAULT_DISCOVER_TAB_LIST;
+
+    return discoverTabListMap?.[networkType] || DEFAULT_DISCOVER_TAB_LIST;
+  }, [discoverTabListMap, networkType]);
+
+  const earnList = useMemo<TDiscoverEarnList>(
+    () => discoverEarnListMap?.[networkType] || [],
+    [discoverEarnListMap, networkType],
+  );
+
+  const learnGroupList = useMemo<TDiscoverLearnGroupList>(
+    () => discoverLearnGroupListMap?.[networkType] || [],
+    [discoverLearnGroupListMap, networkType],
+  );
+  const learnShortGroupList = useMemo<TDiscoverLearnGroupList>(() => {
+    const learnGroupList = discoverLearnGroupListMap?.[networkType] || [];
+    return learnGroupList.map(group => ({
+      ...group,
+      items: group.items?.slice(0, 4),
+    }));
+  }, [discoverLearnGroupListMap, networkType]);
+
+  const fetchDiscoverTabAsync = useCallback(() => dispatch(getDiscoverTabAsync(networkType)), [dispatch, networkType]);
+
+  const fetchDiscoverEarnAsync = useCallback(
+    () => dispatch(getDiscoverEarnAsync(networkType)),
+    [dispatch, networkType],
+  );
+
+  const fetchDiscoverLearnAsync = useCallback(
+    () => dispatch(getDiscoverLearnAsync(networkType)),
+    [dispatch, networkType],
+  );
+  return {
+    discoverHeaderTabList,
+    earnList,
+    learnGroupList,
+    learnShortGroupList,
+    fetchDiscoverTabAsync,
+    fetchDiscoverEarnAsync,
+    fetchDiscoverLearnAsync,
+  };
+};
+
+export const useInitCMSDiscoverNewData = () => {
+  const dispatch = useAppCommonDispatch();
+  const networkList = useNetworkList();
+
+  useEffect(() => {
+    networkList.forEach(item => {
+      dispatch(getDiscoverTabAsync(item.networkType));
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};
+
+export const useInitDappWhiteListData = () => {
+  const dispatch = useAppCommonDispatch();
+  const networkList = useNetworkList();
+  useEffect(() => {
+    networkList.forEach(item => {
+      dispatch(getDappWhiteListAsync(item.networkType));
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};