import { useEffect, useState } from "react";
import { Link } from "@tanstack/react-router";
import { buttonClass } from "~/ui/Button";
import { TONE_SURFACE } from "~/ui/tones";
import type { Tone } from "~/ui/tones";
import { cn } from "~/utils/cn";
const DAY_MS = 24 * 60 * 60 * 1000;
const PREFIX = "gitfor:nag:";
type Action = { label: string; to: string } | { label: string; onClick: () => void };
type Props = {
/** Stable id; snoozing is remembered per id in this browser. */
id: string;
tone?: Tone;
title: React.ReactNode;
children?: React.ReactNode;
action?: Action;
secondary?: Action;
/** Days "Remind me later" hides it for; 0 hides the button and keeps the banner until resolved. */
snoozeDays?: number;
};
function snoozedUntil(id: string): number {
try {
return Number(localStorage.getItem(PREFIX + id) ?? 0);
} catch {
return 0;
}
}
function ActionButton({ action, primary }: { action: Action; primary: boolean }) {
const className = buttonClass(primary ? "primary" : "secondary", "sm");
if ("to" in action) {
return (
<Link to={action.to} className={className}>
{action.label}
</Link>
);