yoginth.com
Hey is a decentralized and permissionless social media app built with Lens Protocol 🌿
refactor: enhance notification and balance components with validation checks and key improvements
+40
-23
+6
-2
apps/web/src/components/Notification/List.tsx
+6
-2
apps/web/src/components/Notification/List.tsx
···
108
108
return (
109
109
<Card className="virtual-divider-list-window">
110
110
<WindowVirtualizer>
111
-
{notifications.map((notification, index) => {
111
+
{notifications.map((notification) => {
112
+
if (!("id" in notification)) {
113
+
return null;
114
+
}
115
+
112
116
const Component =
113
117
notificationComponentMap[
114
118
notification.__typename as keyof typeof notificationComponentMap
···
119
123
className={cn({
120
124
"p-5": notification.__typename !== "FollowNotification"
121
125
})}
122
-
key={index}
126
+
key={notification.id}
123
127
>
124
128
{Component && <Component notification={notification as never} />}
125
129
</div>
+25
-14
apps/web/src/components/Settings/Funds/Balances.tsx
+25
-14
apps/web/src/components/Settings/Funds/Balances.tsx
···
83
83
84
84
return (
85
85
<div className="m-5 space-y-7">
86
-
{data?.balancesBulk.map((balance, index) => (
87
-
<div key={index}>
88
-
{balance.__typename === "NativeAmount" && (
89
-
<TokenBalance symbol={NATIVE_TOKEN_SYMBOL} value={balance.value} />
90
-
)}
91
-
{balance.__typename === "Erc20Amount" && (
92
-
<TokenBalance
93
-
currency={balance.asset.contract.address}
94
-
symbol={balance.asset.symbol}
95
-
value={balance.value}
96
-
/>
97
-
)}
98
-
</div>
99
-
))}
86
+
{data?.balancesBulk.map((balance) => {
87
+
if (!("asset" in balance)) {
88
+
return null;
89
+
}
90
+
91
+
const address = balance.asset.contract.address;
92
+
93
+
return (
94
+
<div key={address}>
95
+
{balance.__typename === "NativeAmount" && (
96
+
<TokenBalance
97
+
symbol={NATIVE_TOKEN_SYMBOL}
98
+
value={balance.value}
99
+
/>
100
+
)}
101
+
{balance.__typename === "Erc20Amount" && (
102
+
<TokenBalance
103
+
currency={balance.asset.contract.address}
104
+
symbol={balance.asset.symbol}
105
+
value={balance.value}
106
+
/>
107
+
)}
108
+
</div>
109
+
);
110
+
})}
100
111
</div>
101
112
);
102
113
};