Skip to content

Commit 1005e7c

Browse files
piotrostrpiotrostr
committed
onboarding
1 parent ffc1a54 commit 1005e7c

5 files changed

Lines changed: 89 additions & 15 deletions

File tree

‎listen-interface/src/components/PanelSelector.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export function PanelSelector() {
5656

5757
if (activePanel === "screener") {
5858
return (
59-
<div className="h-full bg-[#17181D]">
59+
<div className="h-full bg-black">
6060
<MobileHeader>
6161
<PriceUpdatesHeader />
6262
</MobileHeader>
@@ -67,7 +67,7 @@ export function PanelSelector() {
6767

6868
if (activePanel === "pipelines") {
6969
return (
70-
<div className="h-full bg-[#17181D]">
70+
<div className="h-full bg-black">
7171
<MobileHeader>
7272
<PipelinesHeader
7373
statusFilter={statusFilter}
@@ -81,7 +81,7 @@ export function PanelSelector() {
8181

8282
if (activePanel === "chat") {
8383
return (
84-
<div className="h-full bg-[#17181D]">
84+
<div className="h-full bg-black">
8585
<MobileHeader>
8686
<div className="text-white font-medium">{t("layout.chat")}</div>
8787
</MobileHeader>
@@ -92,7 +92,7 @@ export function PanelSelector() {
9292

9393
if (activePanel === "portfolio") {
9494
return (
95-
<div className="h-full bg-[#17181D]">
95+
<div className="h-full bg-black">
9696
<MobileHeader>
9797
<PortfolioHeader onRefresh={refreshPortfolio} />
9898
</MobileHeader>
@@ -103,7 +103,7 @@ export function PanelSelector() {
103103

104104
if (activePanel === "settings") {
105105
return (
106-
<div className="h-full bg-[#17181D]">
106+
<div className="h-full bg-black">
107107
<MobileHeader>
108108
<div className="text-white font-medium">{t("layout.settings")}</div>
109109
</MobileHeader>

‎listen-interface/src/components/Portfolio.tsx‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -124,8 +124,8 @@ export function Portfolio() {
124124

125125
console.log({ isListenWallet, hasWallet, len: assets.length });
126126

127-
// Show zero state if we have a wallet but no assets
128-
if (isListenWallet && !isLoading && assets.length === 0) {
127+
// Show PortfolioZeroState only if there's no Listen wallet at all
128+
if (!solanaAddress && !evmAddress && !isLoading) {
129129
return (
130130
<div
131131
className={`h-full font-mono overflow-y-auto scrollbar-thin scrollbar-thumb-[#2D2D2D] scrollbar-track-transparent scrollable-container pb-16 md:pb-0 ${
@@ -138,6 +138,27 @@ export function Portfolio() {
138138
);
139139
}
140140

141+
// Show empty portfolio if we have a wallet but no assets
142+
if (hasWallet && !isLoading && assets.length === 0) {
143+
return (
144+
<div
145+
className={`h-full font-mono overflow-y-auto scrollbar-thin scrollbar-thumb-[#2D2D2D] scrollbar-track-transparent scrollable-container pb-16 md:pb-0 ${
146+
isMobile ? "p-0" : "p-4"
147+
}`}
148+
>
149+
<WalletSwitcher />
150+
{activeWallet === "eoaEvm" && <EoaEvmWalletSelector />}
151+
<PortfolioSummary
152+
totalBalance={0}
153+
portfolioPnL={0}
154+
/>
155+
<div className="flex-1 flex items-center justify-center">
156+
<p className="text-gray-400 text-center">No assets in this wallet</p>
157+
</div>
158+
</div>
159+
);
160+
}
161+
141162
return (
142163
<div
143164
className={`h-full font-mono overflow-y-auto scrollbar-thin scrollbar-thumb-[#2D2D2D] scrollbar-track-transparent scrollable-container pb-16 md:pb-0 ${

‎listen-interface/src/components/PortfolioZeroState.tsx‎

Lines changed: 55 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,33 @@
1+
import { useNavigate } from "@tanstack/react-router";
2+
import { usePanel } from "../contexts/PanelContext";
3+
import { useMobile } from "../contexts/MobileContext";
4+
15
export function PortfolioZeroState() {
6+
const navigate = useNavigate();
7+
const { setActivePanel } = usePanel();
8+
const { isMobile } = useMobile();
9+
10+
const handleGetStarted = () => {
11+
const onboardingPrompt = "Hey Listen, let's get me onboarded with Solana and EVM wallets creation, also give me a brief rundown of the things we can do afterwards!";
12+
13+
// Navigate to chat with the onboarding message
14+
navigate({
15+
to: "/",
16+
search: {
17+
message: onboardingPrompt,
18+
new: true,
19+
},
20+
});
21+
22+
// On mobile, close the portfolio panel to show chat
23+
if (isMobile) {
24+
setActivePanel(null);
25+
}
26+
};
27+
228
return (
3-
<div className="flex flex-col items-center justify-center h-full px-6 text-center">
4-
<div className="mb-8">
29+
<div className="flex flex-col items-center h-full px-6 text-center">
30+
<div className="mb-8 my-[40%]">
531
<img
632
src="/listen-galaxy.png"
733
alt="Listen Galaxy Illustration"
@@ -37,6 +63,33 @@ export function PortfolioZeroState() {
3763
onboarding!
3864
</p>
3965
</div>
66+
67+
{/* Action button */}
68+
<div className="w-full max-w-sm">
69+
<button
70+
className="text-white font-semibold transition-colors hover:opacity-90"
71+
style={{
72+
display: "flex",
73+
flexDirection: "row",
74+
justifyContent: "center",
75+
alignItems: "center",
76+
padding: "14px 16px",
77+
gap: "6px",
78+
margin: "0 auto",
79+
width: "100%",
80+
maxWidth: "358px",
81+
height: "56px",
82+
background:
83+
"linear-gradient(44.8deg, #FD98A2 -6.27%, #FB2671 36.3%, #A42CCD 84.95%, #7F4AFB 128.87%)",
84+
borderRadius: "9999px",
85+
border: "none",
86+
cursor: "pointer",
87+
}}
88+
onClick={handleGetStarted}
89+
>
90+
Get Started
91+
</button>
92+
</div>
4093
</div>
4194
);
4295
}

‎listen-interface/src/components/SolanaWalletCreation.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -60,23 +60,23 @@ export const SolanaWalletCreation = ({ error }: SolanaWalletCreationProps) => {
6060

6161
// Find Solana embedded wallet to delegate
6262
const solanaWalletToDelegate = solanaWallets.find(
63-
(wallet) => wallet.walletClientType === "privy"
63+
(wallet) => wallet.walletClientType === "privy",
6464
);
6565

6666
// Check delegation status for Solana
6767
const isSolanaDelegated = user?.linkedAccounts.some(
6868
(account): account is WalletWithMetadata =>
6969
account.type === "wallet" &&
7070
account.delegated &&
71-
account.chainType === "solana"
71+
account.chainType === "solana",
7272
);
7373

7474
if (solanaReady && !solanaWalletToDelegate) {
7575
return (
7676
<button
7777
disabled={!solanaReady || isCreating}
7878
onClick={onCreateWallet}
79-
className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm hover:bg-[#2D2D2D]"
79+
className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm hover:bg-[#2D2D2D] mt-3"
8080
>
8181
{isCreating ? (
8282
<span>Creating Solana wallet...</span>
@@ -101,15 +101,15 @@ export const SolanaWalletCreation = ({ error }: SolanaWalletCreationProps) => {
101101
console.error("Error delegating Solana wallet:", error);
102102
}
103103
}}
104-
className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm hover:bg-[#2D2D2D]"
104+
className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm hover:bg-[#2D2D2D] mt-3"
105105
>
106106
Delegate Solana
107107
</button>
108108
);
109109
}
110110

111111
return (
112-
<div className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm">
112+
<div className="p-2 border-2 border-[#2D2D2D] rounded-lg bg-black/40 backdrop-blur-sm flex items-center px-3 text-sm mt-3">
113113
{error ? (
114114
<span className="text-red-500">Error: {error}</span>
115115
) : isSolanaDelegated ? (

‎listen-interface/src/prompts/system.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export function systemPrompt(
3939
if (!hasWallet || isGuest) {
4040
prompt += `## Onboarding Required (Solana)\n${onboarding(hasWallet, isGuest)}\n\n`;
4141
}
42-
if (hasWallet && !hasEvmWallet) {
42+
if (!hasEvmWallet) {
4343
prompt += `## Onboarding Required (EVM)\n${onboardingEvm(hasWallet, isGuest)}\n\n`;
4444
}
4545

0 commit comments

Comments
 (0)