'use client';

import { useEffect, useState } from 'react';
import { NotificationSettingsManagement } from '@/components/settings/NotificationSettings';
import { getNotificationSettings } from '@/components/settings/NotificationSettings/actions';
import { DEFAULT_NOTIFICATION_SETTINGS } from '@/components/settings/NotificationSettings/types';
import type { NotificationSettings } from '@/components/settings/NotificationSettings/types';
import { GenericPageSkeleton } from '@/components/ui/skeleton';

export default function NotificationSettingsPage() {
  const [data, setData] = useState<NotificationSettings>(DEFAULT_NOTIFICATION_SETTINGS);
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    getNotificationSettings()
      .then(result => {
        if (result.success) {
          setData(result.data);
        }
      })
      .finally(() => setIsLoading(false));
  }, []);

  if (isLoading) return <GenericPageSkeleton />;

  return <NotificationSettingsManagement initialData={data} />;
}