import { Alert } from '@/components/ui/alert-dialog';
import { useEffect } from 'react';
import { browserName } from 'react-device-detect';

// "Chrome"
// "Firefox"
// "Safari"
// "Edge"
// "Opera"
// "Internet Explorer"
// "IE" (sometimes used interchangeably with Internet Explorer)
// "Samsung Internet"
// "Unknown" (if the browser cannot be identified)

const useSamsungBrowserWarning = () => {
  useEffect(() => {
    const storedItem = localStorage.getItem('samsungBrowser_warning');
    if (browserName === 'Samsung Internet' && !storedItem) {
      Alert.fire({
        html: '<p class="text-base">به نظر می‌رسد شما از مرورگر سامسونگ استفاده می‌کنید. این مرورگر ممکن است باعث بروز مشکلاتی مانند زوم خودکار یا فعال‌سازی ناخواسته دارک مود در اپلیکیشن شود. برای رفع این مشکلات و تجربه بهتر، پیشنهاد می‌کنیم از مرورگرهای دیگر مانند کروم، فایرفاکس یا مایکروسافت اج استفاده نمایید. این مرورگرها با استانداردهای وب سازگارتر هستند و عملکرد بهتری ارائه می‌دهند.</p>',
        showCancelButton: false,
        icon: 'warning',
        footer: `<label for="dontShowSamsungBrowserWarning" class="flex items-center justify-center gap-2 select-none"><input class="size-4" type="checkbox" id="dontShowSamsungBrowserWarning"/><p>این پیام را نمایش نده</p></label>`,
        willClose: () => {
          const checkbox = document.getElementById(
            'dontShowSamsungBrowserWarning',
          ) as HTMLInputElement;
          if (checkbox?.checked) {
            localStorage.setItem('samsungBrowser_warning', 'true');
          }
        },
      });
    }
  }, []);
};

export default useSamsungBrowserWarning;
