Files
static-front/components/DevelopmentNotice.tsx

51 lines
1.4 KiB
TypeScript

'use client';
import {useEffect, useState} from 'react';
import {Button, Modal} from 'antd';
import {ToolOutlined} from '@ant-design/icons';
import {useLanguage} from '@/app/context/LanguageContext';
import {commerceCopy} from '@/data/commerce';
const STORAGE_KEY = 'rm-development-notice-seen';
export default function DevelopmentNotice() {
const [open, setOpen] = useState(false);
const {locale} = useLanguage();
const copy = commerceCopy[locale];
useEffect(() => {
try {
setOpen(localStorage.getItem(STORAGE_KEY) !== 'true');
} catch {
// Show the notice even when browser storage is unavailable.
setOpen(true);
}
}, []);
const dismiss = () => {
setOpen(false);
try {
localStorage.setItem(STORAGE_KEY, 'true');
} catch {
// Dismissing the notice must not depend on storage access.
}
};
return (
<Modal
open={open}
centered
title={copy.developmentTitle}
onCancel={dismiss}
footer={
<Button type="primary" onClick={dismiss}>
{copy.acknowledge}
</Button>
}
>
<ToolOutlined className="text-brand-400 text-3xl my-4" />
<p className="text-secondary leading-8">{copy.developmentMessage}</p>
</Modal>
);
}