diff --git a/apps/governance/src/routes/proposals/proposal/proposal-container.spec.tsx b/apps/governance/src/routes/proposals/proposal/proposal-container.spec.tsx
index 09de480a4..e05f54571 100644
--- a/apps/governance/src/routes/proposals/proposal/proposal-container.spec.tsx
+++ b/apps/governance/src/routes/proposals/proposal/proposal-container.spec.tsx
@@ -6,6 +6,11 @@ import { MockedProvider } from '@apollo/client/testing';
import { MemoryRouter, Route, Routes } from 'react-router-dom';
import { ProposalDocument } from './__generated__/Proposal';
+jest.mock('@vegaprotocol/data-provider', () => ({
+ ...jest.requireActual('@vegaprotocol/data-provider'),
+ useDataProvider: jest.fn(() => ({ data: [], loading: false })),
+}));
+
jest.mock('../components/proposal', () => ({
Proposal: () =>
,
}));
diff --git a/apps/trading/components/welcome-dialog/get-started.tsx b/apps/trading/components/welcome-dialog/get-started.tsx
index faa825cf2..1b14435e1 100644
--- a/apps/trading/components/welcome-dialog/get-started.tsx
+++ b/apps/trading/components/welcome-dialog/get-started.tsx
@@ -27,8 +27,8 @@ const GetStartedButton = ({ step }: { step: OnboardingStep }) => {
const dismiss = useOnboardingStore((store) => store.dismiss);
const setDialogOpen = useOnboardingStore((store) => store.setDialogOpen);
const marketId = useGlobalStore((store) => store.marketId);
- const openVegaWalletDialog = useVegaWalletDialogStore(
- (store) => store.openVegaWalletDialog
+ const setWalletDialogOpen = useOnboardingStore(
+ (store) => store.setWalletDialogOpen
);
const setViews = useSidebar((store) => store.setViews);
@@ -40,7 +40,7 @@ const GetStartedButton = ({ step }: { step: OnboardingStep }) => {
if (step <= OnboardingStep.ONBOARDING_CONNECT_STEP) {
return (
- openVegaWalletDialog()}>
+ setWalletDialogOpen(true)}>
{t('Connect')}
);
@@ -70,7 +70,7 @@ const GetStartedButton = ({ step }: { step: OnboardingStep }) => {
}
return (
- openVegaWalletDialog()}>
+ setWalletDialogOpen(true)}>
{t('Get started')}
);
diff --git a/apps/trading/components/welcome-dialog/use-get-onboarding-step.ts b/apps/trading/components/welcome-dialog/use-get-onboarding-step.ts
index 3f90fa82b..46ad65d8e 100644
--- a/apps/trading/components/welcome-dialog/use-get-onboarding-step.ts
+++ b/apps/trading/components/welcome-dialog/use-get-onboarding-step.ts
@@ -12,16 +12,20 @@ import { useGlobalStore } from '../../stores';
const ONBOARDING_STORAGE_KEY = 'vega_onboarding';
export const useOnboardingStore = create<{
dialogOpen: boolean;
+ walletDialogOpen: boolean;
dismissed: boolean;
dismiss: () => void;
setDialogOpen: (isOpen: boolean) => void;
+ setWalletDialogOpen: (isOpen: boolean) => void;
}>()(
persist(
(set) => ({
dialogOpen: true,
+ walletDialogOpen: false,
dismissed: false,
dismiss: () => set({ dismissed: true }),
setDialogOpen: (isOpen) => set({ dialogOpen: isOpen }),
+ setWalletDialogOpen: (isOpen) => set({ walletDialogOpen: isOpen }),
}),
{
name: ONBOARDING_STORAGE_KEY,
diff --git a/apps/trading/components/welcome-dialog/welcome-dialog.tsx b/apps/trading/components/welcome-dialog/welcome-dialog.tsx
index 0e40e7333..340bd0e7f 100644
--- a/apps/trading/components/welcome-dialog/welcome-dialog.tsx
+++ b/apps/trading/components/welcome-dialog/welcome-dialog.tsx
@@ -3,30 +3,54 @@ import { t } from '@vegaprotocol/i18n';
import { useEnvironment } from '@vegaprotocol/environment';
import { WelcomeDialogContent } from './welcome-dialog-content';
import { useOnboardingStore } from './use-get-onboarding-step';
+import { VegaConnectDialog } from '@vegaprotocol/wallet';
+import { Connectors } from '../../lib/vega-connectors';
+import { RiskMessage } from './risk-message';
export const WelcomeDialog = () => {
const { VEGA_ENV } = useEnvironment();
const dismissed = useOnboardingStore((store) => store.dismissed);
const dialogOpen = useOnboardingStore((store) => store.dialogOpen);
const dismiss = useOnboardingStore((store) => store.dismiss);
+ const walletDialogOpen = useOnboardingStore(
+ (store) => store.walletDialogOpen
+ );
+ const setWalletDialogOpen = useOnboardingStore(
+ (store) => store.setWalletDialogOpen
+ );
+
+ const content = walletDialogOpen ? (
+ }
+ onClose={() => setWalletDialogOpen(false)}
+ contentOnly
+ />
+ ) : (
+
+ );
+
+ const onClose = walletDialogOpen ? () => setWalletDialogOpen(false) : dismiss;
+
+ const title = walletDialogOpen ? null : (
+
+ {t('Console')}{' '}
+
+ {VEGA_ENV}
+
+
+ );
return (
);
};
diff --git a/libs/wallet/src/connect-dialog/connect-dialog.tsx b/libs/wallet/src/connect-dialog/connect-dialog.tsx
index ab10380ae..9fb81a5d9 100644
--- a/libs/wallet/src/connect-dialog/connect-dialog.tsx
+++ b/libs/wallet/src/connect-dialog/connect-dialog.tsx
@@ -50,11 +50,15 @@ export type WalletType = 'injected' | 'jsonRpc' | 'view' | 'snap';
export interface VegaConnectDialogProps {
connectors: Connectors;
riskMessage?: ReactNode;
+ contentOnly?: boolean;
+ onClose?: () => void;
}
export const VegaConnectDialog = ({
connectors,
riskMessage,
+ contentOnly,
+ onClose,
}: VegaConnectDialogProps) => {
const { disconnect, acknowledgeNeeded } = useVegaWallet();
const vegaWalletDialogOpen = useVegaWalletDialogStore(
@@ -80,19 +84,24 @@ export const VegaConnectDialog = ({
// This value will already be in the cache, if it failed the app wont render
const { data } = useChainIdQuery();
+ const content = data && (
+
+ );
+ if (contentOnly) {
+ return content;
+ }
return (
);
};
@@ -101,15 +110,20 @@ const ConnectDialogContainer = ({
connectors,
appChainId,
riskMessage,
+ onClose,
}: {
connectors: Connectors;
appChainId: string;
riskMessage?: ReactNode;
+ onClose?: () => void;
}) => {
const { vegaUrl, vegaWalletServiceUrl } = useVegaWallet();
- const closeDialog = useVegaWalletDialogStore(
+ const closeVegaWalletDialog = useVegaWalletDialogStore(
(store) => store.closeVegaWalletDialog
);
+ const closeDialog = useCallback(() => {
+ onClose ? onClose() : closeVegaWalletDialog();
+ }, [closeVegaWalletDialog, onClose]);
const [selectedConnector, setSelectedConnector] = useState();
const [walletUrl, setWalletUrl] = useState(vegaWalletServiceUrl);
@@ -254,7 +268,7 @@ const ConnectorList = ({
>
}
description={t(
- `Connect Vega Wallet extension
+ `Connect with Vega Wallet extension
for %s to access all features including key
management and detailed transaction views from your
browser.`,
@@ -286,8 +300,18 @@ const ConnectorList = ({
{connectors['snap'] !== undefined ? (
{snapStatus === SnapStatus.INSTALLED ? (
-
+ {t('Metamask Snap')}
+ {' '}
+ {t('quick start')}
+ >
+ }
+ description={t(
+ `Connect directly via Metamask with the Vega Snap for single key support without advanced features.`
+ )}
text={
<>
@@ -315,7 +339,7 @@ const ConnectorList = ({
>
}
description={t(
- `Connect directly via Metamask with the Vega Snap for single key support without advanced features.`
+ `Install Metamask with the Vega Snap for single key support without advanced features.`
)}
text={
<>