fix: removed vechain from ecosystem and renamed section

vechain · Feb 7, 2025 · b44d495 · b44d495
1 parent 9835054
commit b44d495
Show file tree

Hide file tree

Showing 6 changed files with 18 additions and 20 deletions.
diff --git a/examples/homepage/src/app/providers/VechainKitProviderWrapper.tsx b/examples/homepage/src/app/providers/VechainKitProviderWrapper.tsx
@@ -92,6 +92,11 @@ export function VechainKitProviderWrapper({ children }: Props) {
                 description:
                     'Choose between social login through VeChain or by connecting your wallet.',
             }}
+            loginMethods={[
+                { method: 'vechain', gridColumn: 4 },
+                { method: 'dappkit', gridColumn: 4 },
+                { method: 'ecosystem', gridColumn: 4 },
+            ]}
             darkMode={isDarkMode}
             language={i18n.language}
             network={{

diff --git a/packages/vechain-kit/src/components/ConnectModal/Components/EcosystemButton.tsx b/packages/vechain-kit/src/components/ConnectModal/Components/EcosystemButton.tsx
@@ -1,8 +1,8 @@
 import { GridItem, useDisclosure } from '@chakra-ui/react';
-import { IoPlanet } from 'react-icons/io5';
 import { ConnectionButton, EcosystemModal } from '@/components';
 import { useTranslation } from 'react-i18next';
 import { PrivyAppInfo } from '@/types';
+import { IoMdApps } from 'react-icons/io';
 
 type Props = {
     isDark: boolean;
@@ -26,11 +26,9 @@ export const EcosystemButton = ({
                 <ConnectionButton
                     isDark={isDark}
                     onClick={ecosystemModal.onOpen}
-                    icon={IoPlanet}
+                    icon={IoMdApps}
                     text={
-                        gridColumn && gridColumn >= 2
-                            ? t('Ecosystem')
-                            : undefined
+                        gridColumn && gridColumn >= 2 ? t('Other') : undefined
                     }
                 />
             </GridItem>

diff --git a/packages/vechain-kit/src/components/ConnectModal/Contents/MainContent.tsx b/packages/vechain-kit/src/components/ConnectModal/Contents/MainContent.tsx
@@ -225,7 +225,7 @@ export const MainContent = ({ setCurrentContent, onClose }: Props) => {
                                 />
                             ))}
 
-                        {showPasskey && (
+                        {gridLayout.passkeyColumn && (
                             <PasskeyLoginButton
                                 isDark={isDark}
                                 gridColumn={gridLayout.passkeyColumn}

diff --git a/packages/vechain-kit/src/components/EcosystemModal/EcosystemContent.tsx b/packages/vechain-kit/src/components/EcosystemModal/EcosystemContent.tsx
@@ -14,14 +14,14 @@ import {
 } from '@chakra-ui/react';
 import { StickyHeaderContainer } from '@/components/common';
 import { useCrossAppConnectionCache } from '@/hooks';
-import { IoPlanet } from 'react-icons/io5';
 import { usePrivyCrossAppSdk } from '@/providers/PrivyCrossAppProvider';
 import { useState } from 'react';
 import { LoginLoadingModal } from '../LoginLoadingModal';
 import { useTranslation } from 'react-i18next';
 import { PrivyAppInfo } from '@/types';
 import { useVeChainKitConfig } from '@/providers';
 import { handlePopupError } from '@/utils/handlePopupError';
+import { IoMdApps } from 'react-icons/io';
 
 type Props = {
     onClose: () => void;
@@ -105,8 +105,8 @@ export const EcosystemContent = ({ onClose, appsInfo, isLoading }: Props) => {
                         display={'flex'}
                         gap={2}
                     >
-                        <Icon as={IoPlanet} size={'20px'} />
-                        {t('Ecosystem Login')}
+                        <Icon as={IoMdApps} size={'20px'} />
+                        {t('Select an app')}
                     </ModalHeader>
                     <ModalCloseButton />
                 </StickyHeaderContainer>
@@ -131,9 +131,7 @@ export const EcosystemContent = ({ onClose, appsInfo, isLoading }: Props) => {
                         mb={4}
                         textAlign={'center'}
                     >
-                        {t(
-                            'Use your existing VeChain wallet from other ecosystem apps to sign in seamlessly.',
-                        )}
+                        {t('Sign in with a wallet from other x2earn apps.')}
                     </Text>
                     {isLoading && (
                         <VStack

diff --git a/packages/vechain-kit/src/languages/en.json b/packages/vechain-kit/src/languages/en.json
@@ -337,5 +337,8 @@
     "{{element}} website": "{{element}} website",
     "{{name}}": "{{name}}",
     "Sending to OceanX or other exchanges may result in loss of funds.": "Sending to OceanX or other exchanges may result in loss of funds.",
-    "Send the tokens to your VeWorld wallet first.": "Send the tokens to your VeWorld wallet first."
+    "Send the tokens to your VeWorld wallet first.": "Send the tokens to your VeWorld wallet first.",
+    "Sign in with a wallet from other x2earn apps.": "Sign in with a wallet from other x2earn apps.",
+    "Select an app": "Select an app",
+    "Other": "Other"
 }
diff --git a/packages/vechain-kit/src/providers/VeChainKitProvider.tsx b/packages/vechain-kit/src/providers/VeChainKitProvider.tsx
@@ -35,7 +35,6 @@ import i18n from '../../i18n';
 import { initializeI18n } from '@/utils/i18n';
 
 const DEFAULT_PRIVY_ECOSYSTEM_APP_IDS = [
-    'cm4wxxujb022fyujl7g0thb21', //vechain
     'clz41gcg00e4ay75dmq3uzzgr', //cleanify
     'cm153hrup0817axti38avlfyg', //greencart
 ];
@@ -215,11 +214,6 @@ export const VeChainKitProvider = ({
         );
     }, [loginMethods]);
 
-    const privyLoginMethods = [
-        ...(privy?.loginMethods ?? []),
-        ...allowedEcosystemApps.map((appID) => `privy:${appID}`),
-    ];
-
     let privyAppId: string, privyClientId: string;
     if (!privy) {
         // We set dummy values for the appId and clientId so that the PrivyProvider doesn't throw an error
@@ -290,7 +284,7 @@ export const VeChainKitProvider = ({
                         config={{
                             loginMethodsAndOrder: {
                                 // @ts-ignore
-                                primary: privyLoginMethods,
+                                primary: privy?.loginMethods,
                             },
                             appearance: {
                                 theme: darkMode ? 'dark' : 'light',