trafficlunar/tomodachi-share
1
0
Fork 0
mirror of https://github.com/trafficlunar/tomodachi-share.git synced 2026-05-13 21:27:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add close button to breach notice banner

Browse source 
also clarify in the notice
This commit is contained in:
trafficlunar 2026-05-13 17:24:15 +01:00
parent 579b6d855f
commit 15aa729e00
2 changed files with 33 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
frontend/src/components/admin/banner.tsx
View file

@ -23,6 +23,13 @@ export default function AdminBanner() {
const [message, setMessage] = useState<string | null>(null);
const [shouldShow, setShouldShow] = useState(false);
const [showBreachNotice, setShowBreachNotice] = useState(() => {
if (Date.now() >= new Date("2026-05-20T00:00:00+01:00").getTime()) return false;
const closed = localStorage.getItem("closedBreachNotice");
return closed !== "true";
});
useEffect(() => {
fetch(`${import.meta.env.VITE_API_URL}/api/admin/banner`)
.then((res) => {
@ -48,6 +55,14 @@ export default function AdminBanner() {
setShouldShow(false);
};
const handleCloseBreachNotice = (e: React.MouseEvent<HTMLButtonElement>) => {
e.preventDefault();
e.stopPropagation();
localStorage.setItem("closedBreachNotice", "true");
setShowBreachNotice(false);
};
return (
<>
{shouldShow && message && (
@ -64,19 +79,21 @@ export default function AdminBanner() {
)}
<RedirectBanner />
<a
href="/breach-notice"
className="relative w-full min-h-10 bg-orange-300 border-y-2 border-y-orange-400 mt-1 pl-2 shadow-md flex justify-center items-center text-orange-900 text-nowrap overflow-x-auto font-semibold max-sm:justify-between"
>
<div className="flex gap-2 h-full items-center w-fit">
<Icon icon="humbleicons:exclamation" className="text-2xl min-w-6" />
<span>A data breach has happened, click here for more info.</span>
</div>
{showBreachNotice && (
<a
href="/breach-notice"
className="relative w-full min-h-10 bg-orange-300 border-y-2 border-y-orange-400 mt-1 pl-2 shadow-md flex justify-center items-center text-orange-900 text-nowrap overflow-x-auto font-semibold max-sm:justify-between"
>
<div className="flex gap-2 h-full items-center w-fit">
<Icon icon="humbleicons:exclamation" className="text-2xl min-w-6" />
<span>A data breach has happened, click here for more info.</span>
</div>
{/* <button onClick={handleClose} className="sm:absolute right-2 cursor-pointer p-1.5">
<Icon icon="humbleicons:times" className="text-2xl min-w-6" />
</button> */}
</a>
<button onClick={handleCloseBreachNotice} className="sm:absolute right-2 cursor-pointer p-1.5">
<Icon icon="humbleicons:times" className="text-2xl min-w-6" />
</button>
</a>
)}
</>
);
}

5
frontend/src/pages/breach-notice.tsx
View file

@ -29,10 +29,13 @@ export default function BreachNoticePage() {
The only data that wouldn't normally be viewable is your email address (the same thing you would give to people to receive emails), everything else was
publicly viewable (such as on the profile pages). The code that caused this to happen has already been fixed.
</p>
<p>
<p className="mb-2">
As far as I'm aware, no other information have been collected. The breach has been notified to the Information Commissioner's Office. Please take care
when opening any suspicious emails. <strong>TomodachiShare does not send any emails.</strong> Please do not click on any suspicious links.
</p>
<p>
<strong>Your Discord/Google/GitHub accounts are completely unaffected by this.</strong>
</p>
</div>
);
}