Update tooltip, hide most liked tab, add redirect

src/Router.tsx

@@ -70,9 +70,16 @@ import Changelog from './pages/Changelog'
 
 import MetricsWarning from './components/MetricsWarning'
 import ScrollToTop from './components/ScrollToTop'
+import ExternalRedirect from './components/ExternalRedirect'
 
 import { getHistoryFromStorage, setHistoryToStorage } from './core/transferHistory'
-import { BRIDGE_PAGES, MAINNET_CHAIN_NAME, STAKING_PAGES, STATS_API } from './core/constants'
+import {
+  BRIDGE_PAGES,
+  MAINNET_CHAIN_NAME,
+  STAKING_PAGES,
+  STATS_API,
+  SUBMIT_PROJECT_URL
+} from './core/constants'
 import { type IValidator, type ISkaleContractsMap, type StakingInfoMap } from './core/interfaces'
 import { getValidators } from './core/delegation/validators'
 import { initContracts } from './core/contracts'
@@ -304,6 +311,10 @@ export default function Router() {
               path="/epicgames"
               element={<Navigate to="/ecosystem?categories=gaming_epic-games-store" replace />}
             />
+            <Route
+              path="/ecosystem/submit"
+              element={<ExternalRedirect to={SUBMIT_PROJECT_URL} />}
+            />
             <Route
               path="ecosystem"
               element={

src/components/ExternalRedirect.tsx

@@ -0,0 +1,37 @@
+/**
+ * @license
+ * SKALE portal
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+/**
+ * @file ExternalRedirect.tsx
+ * @copyright SKALE Labs 2024-Present
+ */
+
+import { useEffect } from 'react'
+
+interface ExternalRedirectProps {
+  to: string
+}
+
+const ExternalRedirect: React.FC<ExternalRedirectProps> = ({ to }) => {
+  useEffect(() => {
+    window.location.href = to
+  }, [to])
+
+  return null
+}
+
+export default ExternalRedirect

src/components/ecosystem/AppCardV2.tsx

@@ -33,7 +33,7 @@ import { chainBg, getChainAlias } from '../../core/metadata'
 import CollapsibleDescription from '../CollapsibleDescription'
 import CategoriesChips from './CategoriesChips'
 import SocialButtons from './Socials'
-import { ChipMostLiked, ChipNew, ChipPreTge, ChipTrending } from '../Chip'
+import { ChipNew, ChipPreTge, ChipTrending } from '../Chip'
 
 export default function AppCard(props: {
   skaleNetwork: types.SkaleNetwork
@@ -82,7 +82,6 @@ export default function AppCard(props: {
           <p className={cls(cmn.p, cmn.pPrim, cmn.p600, cmn.p1, 'shortP', cmn.flexg)}>
             {getChainAlias(props.chainsMeta, props.schainName, props.appName)}
           </p>
-          {props.mostLiked !== undefined && <ChipMostLiked />}
           {props.trending && <ChipTrending />}
           {props.isNew && <ChipNew />}
           {appMeta.categories && Object.keys(appMeta.categories).includes('pretge') && (

src/components/profile/ProfileModal.tsx

@@ -105,7 +105,12 @@ const ProfileModal: React.FC = () => {
             </Grid>
             {emailError && (
               <Grid item xs={12}>
-                <Message text={emailError} type="error" icon={<EmailRoundedIcon />} closable={false} />
+                <Message
+                  text={emailError}
+                  type="error"
+                  icon={<EmailRoundedIcon />}
+                  closable={false}
+                />
               </Grid>
             )}
 

src/core/meta.ts

@@ -29,12 +29,13 @@ export const META_TAGS = {
   },
   stats: {
     title: 'SKALE Portal - Network Stats',
-    description: 'SKALE Network statistics - Transactions, active users, gas fees saved.'
+    description: 'SKALE Network statistics - Transactions, active users, gas fees saved.',
+    help: 'Check live SKALE Network statistics like active wallets, transactions, and total gas fees saved by users.'
   },
   bridge: {
     title: 'SKALE Portal - Bridge Tokens',
     description: 'Bridge tokens using SKALE Bridge - Zero Gas Fees between SKALE Chains.',
-    help: 'Bridge tokens between Ethereum and SKALE chains with zero gas fees.'
+    help: 'Transfer your assets to the SKALE Network and move easily across SKALE Chains to access a variety of dApps.'
   },
   history: {
     title: 'SKALE Portal - Bridge History',
@@ -48,26 +49,31 @@ export const META_TAGS = {
   chains: {
     title: 'SKALE Portal - Chains',
     description:
-      'Explore SKALE Hubs, AppChains, connect to SKALE Chains, get block explorer links, endpoints, linked tokens and verified contracts info.'
+      'Explore SKALE Hubs, AppChains, connect to SKALE Chains, get block explorer links, endpoints, linked tokens and verified contracts info.',
+    help: 'SKALE Chains are custom blockchains within the SKALE Network designed to power specific dAps and use cases.'
   },
   ecosystem: {
     title: 'SKALE Portal - Ecosystem',
-    description: 'Explore and interact with dApps on SKALE Network.'
+    description: 'Explore and interact with dApps on SKALE Network.',
+    help: 'Discover and explore all the dApps available across the SKALE Network in one place.'
   },
   faq: {
     title: 'SKALE Portal - Bridge FAQ',
     description: 'Common questions about SKALE Bridge and transfers on SKALE.'
   },
   staking: {
     title: 'SKALE Portal - Staking',
-    description: 'Delegate, review delegations and withdraw staking rewards'
+    description: 'Delegate, review delegations and withdraw staking rewards',
+    help: 'Delegate your SKL tokens to help secure the SKALE Network and earn rewards.'
   },
   validators: {
     title: 'SKALE Portal - Validators',
-    description: 'List of validators on SKALE Network'
+    description: 'List of validators on SKALE Network',
+    help: 'Explore validators that secure the SKALE Network and choose your preferred ones to stake SKL tokens with to earn rewards.'
   },
   onramp: {
     title: 'SKALE Portal - Onramp',
-    description: 'Purchase crypto directly on SKALE Europa Hub using the Transak onramp.'
+    description: 'Purchase crypto directly on SKALE Europa Hub using the Transak onramp.',
+    help: 'Use your preferred fiat currency to get USDC directly on the SKALE Europa Hub.'
   }
 }

src/pages/App.tsx

@@ -71,7 +71,7 @@ import CategoriesChips from '../components/ecosystem/CategoriesChips'
 import { useLikedApps } from '../LikedAppsContext'
 import { useAuth } from '../AuthContext'
 import ErrorTile from '../components/ErrorTile'
-import { ChipNew, ChipPreTge, ChipTrending, ChipMostLiked } from '../components/Chip'
+import { ChipNew, ChipPreTge, ChipTrending } from '../components/Chip'
 import { getRecentApps, isNewApp, isTrending } from '../core/ecosystem/utils'
 import { useApps } from '../useApps'
 
@@ -88,9 +88,7 @@ export default function App(props: {
     appLikes,
     toggleLikedApp,
     getAppId,
-    getMostLikedApps,
-    refreshLikedApps,
-    getMostLikedRank
+    refreshLikedApps
   } = useLikedApps()
   const { isSignedIn, handleSignIn } = useAuth()
 
@@ -135,8 +133,6 @@ export default function App(props: {
   const isLiked = likedApps.includes(appId)
   const likesCount = appLikes[appId] || 0
 
-  const mostLiked = useMemo(() => getMostLikedApps(), [getMostLikedApps])
-  const mostLikedIndex = getMostLikedRank(mostLiked, appId)
   const isNew = isNewApp({ chain, app }, newApps)
   const trending = isTrending(trendingApps, chain, app)
 
@@ -248,7 +244,6 @@ export default function App(props: {
                 <div className={cls(cmn.flex, cmn.flexcv)}>
                   <h2 className={cls(cmn.nom, cmn.p1)}>{appAlias}</h2>
                   <div className={cls(cmn.flex, cmn.mleft10)}>
-                    {mostLikedIndex !== undefined && <ChipMostLiked />}
                     {trending && <ChipTrending />}
                     {isNew && <ChipNew />}
                     {appMeta.categories && Object.keys(appMeta.categories).includes('pretge') && (

src/pages/Ecosystem.tsx

@@ -28,7 +28,6 @@ import FavoriteRoundedIcon from '@mui/icons-material/FavoriteRounded'
 import TrendingUpRoundedIcon from '@mui/icons-material/TrendingUpRounded'
 import StarRoundedIcon from '@mui/icons-material/StarRounded'
 import AddCircleOutlineRoundedIcon from '@mui/icons-material/AddCircleOutlineRounded'
-import PeopleRoundedIcon from '@mui/icons-material/PeopleRounded'
 
 import { type types } from '@/core'
 import { cmn, cls, type MetaportCore } from '@skalenetwork/metaport'
@@ -120,21 +119,13 @@ export default function Ecosystem(props: {
       ], // Trending Apps
       [
         3,
-        mostLikedApps.filter((app) =>
-          filteredApps.some(
-            (filteredApp) => filteredApp.chain === app.chain && filteredApp.appName === app.appName
-          )
-        )
-      ], // Most liked Apps
-      [
-        4,
         isSignedIn
           ? favoriteApps.filter((app) =>
-              filteredApps.some(
-                (filteredApp) =>
-                  filteredApp.chain === app.chain && filteredApp.appName === app.appName
-              )
+            filteredApps.some(
+              (filteredApp) =>
+                filteredApp.chain === app.chain && filteredApp.appName === app.appName
             )
+          )
           : []
       ] // Favorite Apps
     ])
@@ -216,12 +207,6 @@ export default function Ecosystem(props: {
               iconPosition="start"
               className={cls('btn', 'btnSm', cmn.mri5, cmn.mleft5, 'tab', 'fwmobile')}
             />
-            <Tab
-              label="Most Liked"
-              icon={<PeopleRoundedIcon />}
-              iconPosition="start"
-              className={cls('btn', 'btnSm', cmn.mri5, cmn.mleft5, 'tab', 'fwmobile')}
-            />
             <Tab
               label="Favorites"
               icon={<FavoriteRoundedIcon />}