improvement: toast component created and used every where in the app.

This commit is contained in:
2026-05-08 14:07:21 +03:30
parent dcc4b10f00
commit a0348e4079
4 changed files with 54 additions and 37 deletions

View File

@@ -14,6 +14,7 @@ import { AppointmentScheduleGrid } from '@/components/ui/appointments/Appointmen
import { AppointmentsPatientSearch } from '@/components/ui/appointments/AppointmentsPatientSearch';
import { AppointmentScheduleLegend } from '@/components/ui/appointments/AppointmentScheduleLegend';
import { ScheduleDayPicker } from '@/components/ui/common/ScheduleDayPicker';
import { Toast } from '@/components/ui/common/Toast';
import type { AppointmentPurpose } from '@/types/appointment';
import { formatApiErrorMessage } from '@/lib/formatApiError';
import { getLocalDayIsoRange, startOfLocalDay } from '@/lib/appointmentTime';
@@ -280,12 +281,6 @@ export default function AppointmentsPage() {
)}
</div>
{scheduleError && (
<div className="rounded-[var(--radius-sm)] border border-red-500/50 bg-red-500/10 px-3 py-2 text-sm text-red-300">
{scheduleError}
</div>
)}
<AppointmentScheduleGrid
day={scheduleDate}
providers={providers}
@@ -323,24 +318,13 @@ export default function AppointmentsPage() {
</div>
)}
{(toastError || toastSuccess || toastInfo) && (
<div className="fixed bottom-4 left-4 right-4 z-[70] flex justify-center pointer-events-none">
<div className="pointer-events-auto w-full max-w-lg space-y-2">
{toastError && (
<div className="rounded-[var(--radius-sm)] border border-red-500/50 bg-red-500/10 px-3 py-2 text-sm text-red-300 shadow-lg">
{toastError}
</div>
)}
{toastInfo && (
<div className="rounded-[var(--radius-sm)] border border-amber-500/45 bg-amber-500/10 px-3 py-2 text-sm text-amber-100 shadow-lg">
{toastInfo}
</div>
)}
{toastSuccess && (
<div className="rounded-[var(--radius-sm)] border border-emerald-500/50 bg-emerald-500/10 px-3 py-2 text-sm text-emerald-300 shadow-lg">
{toastSuccess}
</div>
)}
{(scheduleError || toastError || toastSuccess || toastInfo) && (
<div className="fixed bottom-4 left-0 right-0 z-[70] px-4 pointer-events-none">
<div className="pointer-events-auto w-full space-y-2">
{scheduleError && <Toast variant="danger">{scheduleError}</Toast>}
{toastError && <Toast variant="danger">{toastError}</Toast>}
{toastInfo && <Toast variant="warning">{toastInfo}</Toast>}
{toastSuccess && <Toast variant="success">{toastSuccess}</Toast>}
</div>
</div>
)}

View File

@@ -6,6 +6,7 @@ import { useRouter } from 'next/navigation';
import { useAuth } from '@/lib/hooks/useAuth';
import { authApi } from '@/lib/api/auth';
import { Button } from '@/components/ui/common/Button';
import { Toast } from '@/components/ui/common/Toast';
import type { SubscriptionAlertData } from '@/types/subscription';
const PLAN_OPTIONS = [
@@ -69,7 +70,7 @@ export default function SubscriptionsSettingsPage() {
: 'text-red-400';
return (
<div className="space-y-6">
<div className="relative space-y-6 pb-24">
<div>
<Link
href="/today"
@@ -189,13 +190,16 @@ export default function SubscriptionsSettingsPage() {
>
Start purchase process
</Button>
{purchaseNotice && (
<div className="rounded-[var(--radius-md)] border border-emerald-500/30 bg-emerald-500/10 px-4 py-3">
<p className="text-sm text-emerald-200">{purchaseNotice}</p>
</div>
)}
</div>
</div>
{purchaseNotice && (
<div className="fixed bottom-4 left-0 right-0 z-[70] px-4 pointer-events-none">
<div className="pointer-events-auto w-full">
<Toast variant="success">{purchaseNotice}</Toast>
</div>
</div>
)}
</div>
);
}