Skip to content

feat: notifications for new features #361

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
antoncoding merged 5 commits into from
Feb 2, 2026
Merged

feat: notifications for new features #361

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
a3b7a92
feat: add notifications for position history & custom tags
starksama Feb 2, 2026
b384bd5
fix: make position history description more general
starksama Feb 2, 2026
419150b
fix: add z-index to close button, improve notification copy
starksama Feb 2, 2026
fcb69ad
fix: remove action buttons for cleaner look
starksama Feb 2, 2026
3b50b5a
chore: fix
antoncoding Feb 2, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 7 additions & 5 deletions src/components/layout/notification-banner.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import Link from 'next/link';
import { Cross2Icon } from '@radix-ui/react-icons';
import { useActiveNotifications } from '@/hooks/useActiveNotifications';
import { useNotificationStore } from '@/stores/useNotificationStore';
import { GridAccent } from '@/components/landing';

export function NotificationBanner() {
const { currentNotification, totalCount, isLoading } = useActiveNotifications();
Expand All @@ -21,11 +22,12 @@ export function NotificationBanner() {
const action = currentNotification.action;

return (
<div className="relative w-full bg-primary">
<div className="relative w-full bg-primary overflow-hidden">
{/* Grid background overlay */}
<div
className="pointer-events-none absolute inset-0 bg-dot-grid opacity-30"
aria-hidden="true"
<GridAccent
position="top-strip"
variant="dots"
className="opacity-40"
/>

{/* Content container - same height as header */}
Expand Down Expand Up @@ -67,7 +69,7 @@ export function NotificationBanner() {
<button
type="button"
onClick={handleDismiss}
className="absolute right-4 p-1 text-primary-foreground/80 transition-colors hover:text-primary-foreground sm:right-6 md:right-8"
className="absolute right-4 z-10 p-1 text-primary-foreground/80 transition-colors hover:text-primary-foreground sm:right-6 md:right-8"
aria-label="Dismiss notification"
>
<Cross2Icon className="h-5 w-5" />
Expand Down
26 changes: 14 additions & 12 deletions src/config/notifications.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,16 +35,18 @@ export type NotificationConfig = {
* Personalized notifications require a conditionId that maps to useNotificationConditions.
*/
export const NOTIFICATIONS: NotificationConfig[] = [
// Example global notification (uncomment to test):
// {
// id: 'autovault-launch-2026',
// message: 'AutoVault is now live! Deploy your own automated lending vault.',
// type: 'info',
// category: 'global',
// action: {
// label: 'Try AutoVault',
// href: '/autovault',
// },
// expiresAt: new Date('2026-01-04'),
// },
{
id: 'position-history-chart-2026-02-01',
message: '💎 New feature: Position History Graph — analyze any account\'s allocation changes over time!',
type: 'info',
category: 'global',
expiresAt: new Date('2026-02-10'),
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot Feb 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Date mismatch with PR description.

PR says banners expire Feb 16, but code has Feb 10. Which is correct?

🤖 Prompt for AI Agents 
In `@src/config/notifications.ts` at line 43, The expiresAt date in the
notification/banner configuration (property expiresAt in
src/config/notifications.ts) is set to 2026-02-10 but the PR description
specifies 2026-02-16; update the expiresAt value to match the PR (set expiresAt
to new Date('2026-02-16')) so the banner expiration aligns with the PR intention
and any related tests/docs.

},
{
id: 'custom-tags-2026-02',
message: '💎 New feature: Custom Tags — create your own tags on market flow metrics! Try it in Settings → Experimental',
type: 'info',
category: 'global',
expiresAt: new Date('2026-02-10'),
},
];
2 changes: 1 addition & 1 deletion src/features/home/home-view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ function HomePage() {
/>

{/* Main hero content */}
<div className="flex-1 flex items-center">
<div className="flex-1 flex items-center relative z-10">
<div className="container mx-auto px-6 sm:px-8 md:px-12 lg:px-16">
{/* Two-column grid */}
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center">
Expand Down
6 changes: 3 additions & 3 deletions src/hooks/useActiveNotifications.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ export type ActiveNotificationsResult = {
* ```
*/
export const useActiveNotifications = (): ActiveNotificationsResult => {
const isDismissed = useNotificationStore((s) => s.isDismissed);
const dismissedIds = useNotificationStore((s) => s.dismissedIds);
const conditions = useNotificationConditions();

const { activeNotifications, isLoading } = useMemo(() => {
Expand All @@ -49,7 +49,7 @@ export const useActiveNotifications = (): ActiveNotificationsResult => {
}

// Check if dismissed
if (isDismissed(notification.id)) {
if (dismissedIds.includes(notification.id)) {
return false;
}

Expand Down Expand Up @@ -81,7 +81,7 @@ export const useActiveNotifications = (): ActiveNotificationsResult => {
activeNotifications: active,
isLoading: hasLoadingCondition,
};
}, [isDismissed, conditions]);
}, [dismissedIds, conditions]);

const currentNotification = activeNotifications[0] ?? null;
const totalCount = activeNotifications.length;
Expand Down