Persist welcome dialog visibility
The welcome dialog should remain visible until the user explicitly chooses to hide it.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
|
||||
import React from "react";
|
||||
import React, { useState } from "react";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
@@ -11,15 +11,22 @@ import {
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Separator } from "@/components/ui/separator";
|
||||
import { ArrowRight, Wallet, PieChart, LineChart } from "lucide-react";
|
||||
import { Checkbox } from "@/components/ui/checkbox";
|
||||
|
||||
interface WelcomeDialogProps {
|
||||
open: boolean;
|
||||
onClose: () => void;
|
||||
onClose: (dontShowAgain: boolean) => void;
|
||||
}
|
||||
|
||||
const WelcomeDialog: React.FC<WelcomeDialogProps> = ({ open, onClose }) => {
|
||||
const [dontShowAgain, setDontShowAgain] = useState(false);
|
||||
|
||||
const handleClose = () => {
|
||||
onClose(dontShowAgain);
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog open={open} onOpenChange={onClose}>
|
||||
<Dialog open={open} onOpenChange={() => handleClose()}>
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogHeader>
|
||||
<DialogTitle className="text-center text-2xl text-neuro-income mb-2">
|
||||
@@ -72,10 +79,24 @@ const WelcomeDialog: React.FC<WelcomeDialogProps> = ({ open, onClose }) => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-2 mt-4">
|
||||
<Checkbox
|
||||
id="dont-show-again"
|
||||
checked={dontShowAgain}
|
||||
onCheckedChange={(checked) => setDontShowAgain(checked === true)}
|
||||
/>
|
||||
<label
|
||||
htmlFor="dont-show-again"
|
||||
className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
||||
>
|
||||
더 이상 보지 않기
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<DialogFooter className="sm:justify-center">
|
||||
<Button
|
||||
className="w-full sm:w-auto bg-neuro-income text-white hover:bg-neuro-income/90 focus:outline-none focus:ring-0"
|
||||
onClick={onClose}
|
||||
onClick={handleClose}
|
||||
>
|
||||
시작하기 <ArrowRight className="ml-2 h-4 w-4" />
|
||||
</Button>
|
||||
|
||||
@@ -30,6 +30,7 @@ const Index = () => {
|
||||
// 첫 방문 여부 확인 및 데이터 초기화
|
||||
useEffect(() => {
|
||||
const hasVisitedBefore = localStorage.getItem('hasVisitedBefore');
|
||||
const dontShowWelcome = localStorage.getItem('dontShowWelcome') === 'true';
|
||||
|
||||
if (!hasVisitedBefore) {
|
||||
// 첫 로그인으로 가정하고 모든 데이터 초기화
|
||||
@@ -37,12 +38,18 @@ const Index = () => {
|
||||
setShowWelcome(true);
|
||||
// 방문 기록 저장
|
||||
localStorage.setItem('hasVisitedBefore', 'true');
|
||||
} else if (!dontShowWelcome) {
|
||||
// '더 이상 보지 않기'를 선택하지 않았다면 계속 환영 팝업 표시
|
||||
setShowWelcome(true);
|
||||
}
|
||||
}, []);
|
||||
|
||||
// 환영 팝업 닫기
|
||||
const handleCloseWelcome = () => {
|
||||
const handleCloseWelcome = (dontShowAgain: boolean) => {
|
||||
setShowWelcome(false);
|
||||
if (dontShowAgain) {
|
||||
localStorage.setItem('dontShowWelcome', 'true');
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user