@raxonltd/raxon-core 1.1.6 → 1.1.8

package/core/feature/analytic-event/analytic.event.util.ts

@@ -0,0 +1,42 @@
+export function escapeRegExp(value: string) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+export function buildProductPathPattern(productPathPrefix: string) {
+  const prefix = productPathPrefix.replace(/\/$/, '');
+  return new RegExp(`${escapeRegExp(prefix)}/([^/?#]+)`);
+}
+
+export function extractProductIdFromHref(href: string, productPathPrefix: string) {
+  if (!href) return null;
+
+  try {
+    const url = href.startsWith('http') ? new URL(href) : new URL(href, window.location.origin);
+    const match = url.pathname.match(buildProductPathPattern(productPathPrefix));
+    return match?.[1] ?? null;
+  } catch {
+    const match = href.match(buildProductPathPattern(productPathPrefix));
+    return match?.[1] ?? null;
+  }
+}
+
+export function readProductFromElement(element: Element, productPathPrefix: string) {
+  const trackedElement = element.closest('[data-raxon-product-id]');
+  if (trackedElement) {
+    const productId = trackedElement.getAttribute('data-raxon-product-id');
+    if (!productId) return null;
+
+    return {
+      productId,
+      variantId: trackedElement.getAttribute('data-raxon-variant-id'),
+    };
+  }
+
+  const link = element.closest('a[href]');
+  if (!link) return null;
+
+  const productId = extractProductIdFromHref(link.getAttribute('href') || '', productPathPrefix);
+  if (!productId) return null;
+
+  return { productId, variantId: null };
+}

package/core/feature/analytic-event/use.analytic.auto.tsx

@@ -0,0 +1,114 @@
+'use client';
+
+import { useEffect } from 'react';
+import { usePathname } from 'next/navigation';
+import { buildProductPathPattern, extractProductIdFromHref, readProductFromElement } from './analytic.event.util';
+
+interface ProductAnalyticEvent {
+  productId: string;
+  variantId?: string | null;
+}
+
+interface UseAnalyticAutoTrackOptions {
+  enabled: boolean;
+  productPathPrefix: string;
+  trackProductView: (event: ProductAnalyticEvent) => void;
+  trackProductClick: (event: ProductAnalyticEvent) => void;
+}
+
+export function useAnalyticAutoTrack({
+  enabled,
+  productPathPrefix,
+  trackProductView,
+  trackProductClick,
+}: UseAnalyticAutoTrackOptions) {
+  const pathname = usePathname();
+
+  useEffect(() => {
+    if (!enabled) return;
+
+    const productId = pathname.match(buildProductPathPattern(productPathPrefix))?.[1];
+    if (productId) {
+      trackProductView({ productId });
+    }
+  }, [enabled, pathname, productPathPrefix, trackProductView]);
+
+  useEffect(() => {
+    if (!enabled || typeof window === 'undefined') return;
+
+    const viewedElements = new WeakSet<Element>();
+
+    const trackVisibleElement = (element: Element) => {
+      if (viewedElements.has(element)) return;
+
+      const productId = element.getAttribute('data-raxon-product-id');
+      if (productId) {
+        viewedElements.add(element);
+        trackProductView({
+          productId,
+          variantId: element.getAttribute('data-raxon-variant-id'),
+        });
+        return;
+      }
+
+      if (element instanceof HTMLAnchorElement) {
+        const hrefProductId = extractProductIdFromHref(element.href, productPathPrefix);
+        if (hrefProductId) {
+          viewedElements.add(element);
+          trackProductView({ productId: hrefProductId });
+        }
+      }
+    };
+
+    const viewObserver = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            trackVisibleElement(entry.target);
+          }
+        });
+      },
+      { threshold: 0.5 }
+    );
+
+    const observeCandidates = () => {
+      document
+        .querySelectorAll('[data-raxon-product-id], a[href]')
+        .forEach((element) => {
+          if (element.hasAttribute('data-raxon-product-id')) {
+            viewObserver.observe(element);
+            return;
+          }
+
+          if (element instanceof HTMLAnchorElement) {
+            const productId = extractProductIdFromHref(element.href, productPathPrefix);
+            if (productId) {
+              viewObserver.observe(element);
+            }
+          }
+        });
+    };
+
+    const onClick = (event: MouseEvent) => {
+      const target = event.target;
+      if (!(target instanceof Element)) return;
+
+      const productEvent = readProductFromElement(target, productPathPrefix);
+      if (productEvent) {
+        trackProductClick(productEvent);
+      }
+    };
+
+    const mutationObserver = new MutationObserver(observeCandidates);
+
+    document.addEventListener('click', onClick, true);
+    mutationObserver.observe(document.body, { childList: true, subtree: true });
+    observeCandidates();
+
+    return () => {
+      document.removeEventListener('click', onClick, true);
+      viewObserver.disconnect();
+      mutationObserver.disconnect();
+    };
+  }, [enabled, productPathPrefix, trackProductClick, trackProductView]);
+}

package/core/feature/article/hook/use.article.tsx

@@ -0,0 +1,33 @@
+import { nexineAxios } from "@/core/util/nexine.axios";
+import { IData } from "@/core/interface/nexine.interface";
+import { Article } from "@/core/interface/prisma.interface";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+
+export const useArticle = () => {
+    
+    const queryClient = useQueryClient();
+
+    return {
+        fetch :  (params?:any) => {
+            return useQuery({
+                queryKey: ['web','article',params],
+                queryFn: async () => {
+                    var response = await nexineAxios.get<IData<Article>>('/customer/article',{
+                        params
+                    })
+                    return response.data;
+                },
+            })
+        },
+        detail : (id:string) => {
+            return useQuery({
+                queryKey: ['web','article',id],
+                queryFn: async () => {
+                    var response = await nexineAxios.get<Article>('/customer/article/'+id)
+                    return response.data;
+                },
+                enabled: Boolean(id),
+            })
+        }
+    }
+};

package/core/feature/attribute/hook/use.attribute.tsx

@@ -0,0 +1,24 @@
+import { nexineAxios } from '@/core/util/nexine.axios';
+import { IData } from '@/core/interface/nexine.interface';
+import { Attribute, Brand, Category, Faq } from '@/core/interface/prisma.interface';
+import { useQuery } from '@tanstack/react-query';
+
+export const useAttribute = () => {
+  return {
+    fetch: (params: { categoryId?: string; enabled?: boolean, productId?: string }) => {
+      return useQuery({
+        queryKey: ['attribute', 'category', params.categoryId, params.productId],
+        enabled: (params.enabled ?? true) ,
+        queryFn: async () => {
+          var response = await nexineAxios.get<IData<Attribute>>('/customer/attribute', {
+            params: {
+              categoryId: params.categoryId,
+              productId: params.productId,
+            },
+          });
+          return response.data;
+        },
+      });
+    },
+  };
+};

package/core/feature/auth/hook/use.auth.tsx

@@ -0,0 +1,141 @@
+import { nexineAxios } from "@/core/util/nexine.axios";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useEffect, useState } from "react";
+import toast from "react-hot-toast";
+
+// Auth event'leri için custom eventler
+export const LOGOUT_EVENT = 'intermarkt-logout';
+export const LOGIN_SUCCESS_EVENT = 'intermarkt-login-success';
+
+export const useAuth = () => {
+    
+    const queryClient = useQueryClient();
+    
+    
+
+    return {
+
+        profile : ({isEnabled = false}) => {
+            return useQuery({
+                queryKey: ["profile"],
+                enabled: isEnabled,
+                queryFn: async () => {
+                    var response = await nexineAxios.get('/customer/profile')
+                    return response.data.data
+                }
+            })
+        },
+        token : () => {
+            return useMutation({
+                mutationFn: async () => {
+                    var response = await nexineAxios.get('/auth/token')
+                    return response.data.data
+                }
+            })
+        },
+        
+        loginEmail :  () => {
+            return useMutation({
+                mutationFn: (data: any) => {
+                    return nexineAxios.post('/auth/login/email', data)
+                },
+                onSuccess: (response: any) => {
+                    localStorage.setItem("koksal-token", response.data.token);
+                    queryClient.invalidateQueries({ queryKey: ["user"] });
+                    queryClient.invalidateQueries({ queryKey: ["profile"] });
+                    queryClient.invalidateQueries({ queryKey: ["cart"] });
+                    
+                    // Login success event'ini tetikle
+                    if (typeof window !== 'undefined') {
+                        window.dispatchEvent(new Event(LOGIN_SUCCESS_EVENT));
+                        window.dispatchEvent(new Event('koksal-token-changed'));
+                    }
+                },
+            })
+        },
+        loginGuest : () => {
+            return useMutation({
+                mutationFn: () => {
+                    return nexineAxios.post('/auth/login/guest')
+                },
+                onSuccess: (response: any) => {
+                    localStorage.setItem("koksal-token", response.data.token);
+                    queryClient.invalidateQueries({ queryKey: ["user"] });
+                    queryClient.invalidateQueries({ queryKey: ["profile"] });
+                    queryClient.invalidateQueries({ queryKey: ["cart"] });
+                    
+                    
+                    // Login success event'ini tetikle
+                    if (typeof window !== 'undefined') {
+                        window.dispatchEvent(new Event(LOGIN_SUCCESS_EVENT));
+                        window.dispatchEvent(new Event('koksal-token-changed'));
+                    }
+                },
+            })
+        },
+        loginSocial : () => {
+            return useMutation({
+                mutationFn: async (data: { platform: string, returnUrl?: string }) => {
+                    var response = await nexineAxios.get(`/auth/login/social`, { params : { platform : data.platform,returnUrl : data.returnUrl } })
+                    return response.data.url
+                },
+            })
+        },
+        register :  () => {
+            return useMutation({
+                mutationFn: (data: any) => {
+                    return nexineAxios.post('/auth/register', data)
+                },
+                onSuccess: () => {
+                    
+                }
+            })
+        },
+        // Şifremi unuttum - E-posta gönderme
+        codeSend: () => {
+            return useMutation({
+                mutationFn: (data: { email: string }) => {
+                    return nexineAxios.post('/auth/code-send', data)
+                },
+                onSuccess: () => {
+                    
+                }
+            })
+        },
+        // Doğrulama kodu kontrol etme
+        verifyCode: () => {
+            return useMutation({
+                mutationFn: (data: { email: string, code: string }) => {
+                    return nexineAxios.post('/auth/code-verify', data)
+                },
+                onSuccess: () => {
+                    
+                    
+                }
+            })
+        },
+        // Şifre sıfırlama
+        resetPassword: () => {
+            return useMutation({
+                mutationFn: (data: { email: string, code: string, password: string }) => {
+                    return nexineAxios.post('/auth/reset-password', data)
+                },
+                onSuccess: () => {
+                    
+                }
+            })
+        },
+        logout: () => {
+            localStorage.removeItem("koksal-token");
+            queryClient.invalidateQueries({ queryKey: ["user"] });
+            queryClient.invalidateQueries({ queryKey: ["profile"] });
+            
+            // Logout event'ini tetikle
+            if (typeof window !== 'undefined') {
+                window.dispatchEvent(new Event(LOGOUT_EVENT));
+                window.dispatchEvent(new Event('koksal-token-changed'));
+                window.location.reload();
+            }
+        }
+    }
+};

package/core/feature/auth/modal/modal.auth.tsx

@@ -0,0 +1,80 @@
+import React, { useImperativeHandle, useMemo, useState } from 'react';
+import { Modal } from 'rizzui';
+import { X } from 'lucide-react';
+import ViewLogin from '@/core/feature/auth/view/view.login';
+import ViewRegister from '@/core/feature/auth/view/view.register';
+import { useRaxon } from '@/core/raxon.context';
+import { GeneralImage } from '@/core/component/general.image';
+import { usePathname } from 'next/navigation';
+import queryString from 'query-string';
+
+export interface ModalAuthProps {}
+export interface ModalAuthRef {
+  open: (defaultTab?: 'login' | 'register', queries?: any) => void;
+  close: () => void;
+}
+
+export const ModalAuth = React.forwardRef<ModalAuthRef, ModalAuthProps>((props, ref) => {
+  const [isOpen, setIsOpen] = useState(false);
+  const [activeTab, setActiveTab] = useState<'login' | 'register'>('login');
+  const [queries, setQueries] = useState<any>({});
+  const { branch } = useRaxon();
+
+  const pathname = usePathname();
+
+  const returnUrl = useMemo(() => {
+
+    
+    return queryString.stringify(queries);
+  }, [pathname, queries]);
+
+  useImperativeHandle(ref, () => ({
+    open: (defaultTab = 'login', queries?: any) => {
+      setActiveTab(defaultTab);
+      setQueries(queries ?? {});
+      setIsOpen(true);
+    },
+    close: () => {
+      setIsOpen(false);
+    },
+  }));
+
+  const handleClose = () => {
+    setIsOpen(false);
+  };
+
+  return (
+    <Modal isOpen={isOpen} onClose={handleClose} customSize={400} overlayClassName="backdrop-blur-sm">
+      <div className="relative bg-white rounded-lg shadow-2xl">
+        {/* Close Button */}
+        <button onClick={handleClose} className="absolute top-4 right-4 p-2 text-gray-400 hover:text-gray-600 transition-colors z-10">
+          <X className="w-5 h-5" />
+        </button>
+
+        {/* Header */}
+        <div className="text-center pt-8 pb-6 px-8">
+          <div className="flex justify-center mb-4">
+            <GeneralImage quality={85} src={branch?.logoMedia?.relativePath ? `${process.env.NEXT_PUBLIC_STORAGE_URL}/${branch?.logoMedia?.relativePath}` : ''} alt="logo" width={180} height={40} className="h-8 w-auto object-contain" />
+          </div>
+          <p className="text-black/80 text-sm font-light uppercase tracking-wider">{activeTab === 'login' ? 'Hesabınıza giriş yapın' : 'Yeni hesap oluşturun'}</p>
+        </div>
+
+        {/* Tab Navigation */}
+        <div className="flex border-b border-black/10 mx-8">
+          <button onClick={() => setActiveTab('login')} className={`flex-1 py-3 text-sm font-black uppercase tracking-wider transition-colors border-b-2 ${activeTab === 'login' ? 'border-black text-black' : 'border-transparent text-black/80 hover:text-black'}`}>
+            Giriş Yap
+          </button>
+          <button onClick={() => setActiveTab('register')} className={`flex-1 py-3 text-sm font-black uppercase tracking-wider transition-colors border-b-2 ${activeTab === 'register' ? 'border-black text-black' : 'border-transparent text-black/80 hover:text-black'}`}>
+            Kayıt Ol
+          </button>
+        </div>
+
+        {/* Content */}
+        <div className="p-8">
+          {activeTab === 'login' && <ViewLogin onClose={handleClose} returnUrl={returnUrl} />}
+          {activeTab === 'register' && <ViewRegister onClose={handleClose} onSwitchToLogin={() => setActiveTab('login')} />}
+        </div>
+      </div>
+    </Modal>
+  );
+});

package/core/feature/auth/view/view.login.tsx

@@ -0,0 +1,199 @@
+'use client';
+import React, { useState } from 'react';
+import { Eye, EyeOff, Lock, Mail, ArrowRight } from 'lucide-react';
+import Link from 'next/link';
+import { useAuth } from '@/core/feature/auth/hook/use.auth';
+import { useForm } from 'react-hook-form';
+import { useRouter } from 'next/navigation';
+import toast from 'react-hot-toast';
+
+interface ViewLoginProps {
+  onClose?: () => void;
+  returnUrl?: string;
+}
+
+export default function ViewLogin({ onClose, returnUrl }: ViewLoginProps) {
+  const [showPassword, setShowPassword] = useState(false);
+  const { mutate: login } = useAuth().loginEmail();
+  const { mutate: loginGuest } = useAuth().loginGuest();
+  const { mutate: loginSocial } = useAuth().loginSocial();
+  const form = useForm();
+  
+
+  const handleSubmitGuest = (e: React.FormEvent) => {
+    e.preventDefault();
+    loginGuest({} as any, {
+      onSuccess: () => {
+        onClose?.();
+      },
+    });
+  };
+
+  const handleLoginSocial = (provider: string) => {
+    loginSocial({ platform: provider, returnUrl: returnUrl }, {
+      onSuccess: (url) => {
+        if (typeof window !== 'undefined') {
+          window.location.href = url;
+        }
+        
+
+        
+      },
+    });
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    form.handleSubmit(data => {
+      login(data, {
+        onSuccess: () => {
+          
+          onClose?.();
+          
+        },
+        onError: (error: any) => {
+          toast.error(error?.response?.data?.info?.title || 'Giriş başarısız');
+        }
+      });
+    })();
+  };
+
+  return (
+    <form onSubmit={handleSubmit} className="space-y-6">
+      {/* Email Field */}
+      <div>
+        <input 
+          type="email" 
+          {...form.register('email')} 
+          placeholder="E-posta adresinizi girin *"
+          className="w-full px-0 py-5 text-lg font-medium border-0 border-b-2 border-gray-300 bg-transparent focus:outline-none focus:border-black transition-colors placeholder-gray-500" 
+          required 
+        />
+      </div>
+
+      {/* Password Field */}
+      <div className="relative">
+        <input 
+          type={showPassword ? 'text' : 'password'} 
+          {...form.register('password')} 
+          placeholder="Şifre *"
+          className="w-full px-0 py-5 pr-10 text-lg font-medium border-0 border-b-2 border-gray-300 bg-transparent focus:outline-none focus:border-black transition-colors placeholder-gray-500" 
+          required 
+        />
+        <button
+          type="button"
+          className="absolute right-0 top-1/2 transform -translate-y-1/2 text-gray-400 hover:text-gray-600"
+          onClick={() => setShowPassword(!showPassword)}
+        >
+          {showPassword ? <EyeOff className="w-5 h-5" /> : <Eye className="w-5 h-5" />}
+        </button>
+      </div>
+
+      {/* Remember Me & Forgot Password */}
+      <div className="flex items-center justify-between py-4">
+        <div className="flex items-center">
+          <input 
+            id="remember" 
+            type="checkbox" 
+            {...form.register('rememberMe')} 
+            className="w-4 h-4 text-black border-gray-300 rounded focus:ring-0" 
+          />
+          <label htmlFor="remember" className="ml-2 text-base font-medium text-gray-700">Beni hatırla</label>
+        </div>
+        <button
+          type="button"
+          onClick={onClose}
+          className="text-base font-medium text-gray-600 hover:text-black transition-colors"
+        >
+          Şifrenizi mi unuttunuz?
+        </button>
+      </div>
+
+
+
+      {/* Social Login */}
+      <div className="py-6">
+        <div className="flex items-center mb-6">
+          <div className="flex-1 border-t border-gray-200"></div>
+          <span className="px-4 text-base font-medium text-gray-500">Veya sosyal hesapla devam edin</span>
+          <div className="flex-1 border-t border-gray-200"></div>
+        </div>
+        
+        <div className="flex flex-col sm:grid sm:grid-cols-2 gap-4">
+          <button 
+            type="button"
+            onClick={() => handleLoginSocial('google')} 
+            className="py-4 text-base font-medium border border-gray-200 hover:border-black transition-colors flex items-center justify-center space-x-2"
+          >
+            <svg width="20" height="20" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <g clipPath="url(#clip0_278_6045)">
+                <path d="M21.6696 9.08832L12.696 9.08789C12.2997 9.08789 11.9785 9.40904 11.9785 9.8053V12.672C11.9785 13.0681 12.2997 13.3894 12.6959 13.3894H17.7493C17.196 14.8254 16.1632 16.0281 14.8455 16.7922L17.0002 20.5223C20.4567 18.5233 22.5002 15.0158 22.5002 11.0894C22.5002 10.5303 22.459 10.1307 22.3766 9.68064C22.314 9.33874 22.0171 9.08832 21.6696 9.08832Z" fill="#167EE6"/>
+                <path d="M11.4999 17.6964C9.02689 17.6964 6.86797 16.3452 5.70846 14.3457L1.97852 16.4956C3.87666 19.7854 7.4325 22.0007 11.4999 22.0007C13.4953 22.0007 15.378 21.4635 16.9999 20.5272V20.5221L14.8452 16.792C13.8595 17.3637 12.719 17.6964 11.4999 17.6964Z" fill="#12B347"/>
+                <path d="M17 20.5262V20.5211L14.8452 16.791C13.8596 17.3626 12.7192 17.6954 11.5 17.6954V21.9997C13.4953 21.9997 15.3782 21.4625 17 20.5262Z" fill="#0F993E"/>
+                <path d="M4.80435 11.0007C4.80435 9.78177 5.13702 8.64133 5.70854 7.65576L1.9786 5.50586C1.0372 7.12264 0.5 9.00029 0.5 11.0007C0.5 13.0012 1.0372 14.8788 1.9786 16.4956L5.70854 14.3457C5.13702 13.3602 4.80435 12.2197 4.80435 11.0007Z" fill="#FFD500"/>
+                <path d="M11.4999 4.30435C13.1126 4.30435 14.5939 4.87738 15.7509 5.83056C16.0363 6.06568 16.4512 6.04871 16.7127 5.78725L18.7438 3.75611C19.0405 3.45946 19.0193 2.97387 18.7024 2.69895C16.7639 1.0172 14.2416 0 11.4999 0C7.4325 0 3.87666 2.21534 1.97852 5.50511L5.70846 7.65501C6.86797 5.65555 9.02689 4.30435 11.4999 4.30435Z" fill="#FF4B26"/>
+                <path d="M15.751 5.83056C16.0364 6.06568 16.4513 6.04871 16.7128 5.78725L18.7439 3.75611C19.0405 3.45946 19.0194 2.97387 18.7025 2.69895C16.764 1.01716 14.2417 0 11.5 0V4.30435C13.1126 4.30435 14.594 4.87738 15.751 5.83056Z" fill="#D93F21"/>
+              </g>
+            </svg>
+            <span className="text-sm sm:text-base">Google ile giriş yap</span>
+          </button>
+          
+          <button 
+            type="button"
+            onClick={() => handleLoginSocial('facebook')} 
+            className="py-4 text-base font-medium border border-gray-200 hover:border-black transition-colors flex items-center justify-center space-x-2"
+          >
+            <svg width="20" height="20" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <g clipPath="url(#clip0_278_6055)">
+                <path d="M22.5 11C22.5 16.4905 18.4773 21.0414 13.2188 21.8664V14.1797H15.7818L16.2695 11H13.2188V8.93664C13.2188 8.06652 13.645 7.21875 15.0114 7.21875H16.3984V4.51172C16.3984 4.51172 15.1395 4.29688 13.9359 4.29688C11.4235 4.29688 9.78125 5.81969 9.78125 8.57656V11H6.98828V14.1797H9.78125V21.8664C4.52273 21.0414 0.5 16.4905 0.5 11C0.5 4.92508 5.42508 0 11.5 0C17.5749 0 22.5 4.92508 22.5 11Z" fill="#1877F2"/>
+                <path d="M15.7818 14.1797L16.2695 11H13.2188V8.9366C13.2188 8.0667 13.6449 7.21875 15.0114 7.21875H16.3984V4.51172C16.3984 4.51172 15.1396 4.29688 13.9361 4.29688C11.4235 4.29688 9.78125 5.81969 9.78125 8.57656V11H6.98828V14.1797H9.78125V21.8663C10.3413 21.9542 10.9153 22 11.5 22C12.0847 22 12.6587 21.9542 13.2188 21.8663V14.1797H15.7818Z" fill="white"/>
+              </g>
+            </svg>
+            <span className="text-sm sm:text-base">Facebook ile giriş yap</span>
+          </button>
+        </div>
+      </div>
+
+      {/* Misafir Login */}
+      <button 
+        onClick={handleSubmitGuest}
+        type="button"
+        className="w-full py-4 text-base font-medium hover:text-black transition-colors"
+      >
+        Misafir Olarak Devam Et
+      </button>
+
+      {/* Login Button */}
+      <button 
+        id="btnLogin"
+        type="submit" 
+        className="w-full py-5 text-lg font-bold bg-black text-white hover:bg-gray-800 transition-colors"
+      >
+        Giriş Yap
+      </button>
+
+      {/* Terms */}
+      <div className="text-center">
+        <p className="text-sm font-medium text-gray-500 leading-relaxed">
+          Devam ederek{' '}
+          <button
+            type="button"
+            onClick={onClose}
+            className="hover:underline"
+          >
+            Kullanım Şartları
+          </button>{' '}
+          ve{' '}
+          <button
+            type="button"
+            onClick={onClose}
+            className="hover:underline"
+          >
+            Gizlilik Politikası
+          </button>
+          'nı kabul etmiş olursunuz.
+        </p>
+      </div>
+    </form>
+  );
+}