@raxonltd/raxon-core 1.1.7 → 1.1.13

package/core/feature/analytic-event/analytic.event.context.tsx

@@ -0,0 +1,180 @@
+'use client';
+
+import React, { createContext, useCallback, useContext, useEffect, useRef } from 'react';
+import { useSearchParams, useRouter } from 'next/navigation';
+import { AnalyticEventType } from '@/core/interface/prisma.interface';
+import { sendAnalyticEvents } from './analytic.event.api';
+import { useAnalyticAutoTrack } from './use.analytic.auto';
+
+interface ProductAnalyticEvent {
+  productId: string;
+  variantId?: string | null;
+}
+
+interface EmailClickedEvent {
+  tcx: string;
+}
+
+interface AnalyticEventContextType {
+  trackProductView: (event: ProductAnalyticEvent) => void;
+  trackProductClick: (event: ProductAnalyticEvent) => void;
+  trackEmailClicked: (event: EmailClickedEvent) => void;
+}
+
+const AnalyticEventContext = createContext<AnalyticEventContextType | undefined>(undefined);
+
+export interface AnalyticEventProviderProps {
+  children: React.ReactNode;
+  productPathPrefix?: string;
+  autoTrack?: boolean;
+}
+
+export const AnalyticEventProvider = ({
+  children,
+  productPathPrefix = '/urunler',
+  autoTrack = true,
+}: AnalyticEventProviderProps) => {
+  const bufferRef = useRef<ProductAnalyticEvent[]>([]);
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const searchParams = useSearchParams();
+  const router = useRouter();
+  const tcxProcessedRef = useRef(false);
+
+  const flush = useCallback(async () => {
+    const events = [...bufferRef.current];
+    if (events.length === 0) return;
+
+    bufferRef.current = [];
+
+    try {
+      await sendAnalyticEvents(
+        events.map((event) => ({
+          productId: event.productId,
+          variantId: event.variantId,
+          eventType: AnalyticEventType.VIEW,
+        }))
+      );
+    } catch (error) {
+      console.error('Failed to send product view events', error);
+    }
+  }, []);
+
+  const trackProductView = useCallback(
+    (event: ProductAnalyticEvent) => {
+      if (!event.productId) return;
+
+      const exists = bufferRef.current.some(
+        (item) => item.productId === event.productId && item.variantId === event.variantId
+      );
+      if (!exists) {
+        bufferRef.current.push(event);
+      }
+
+      if (!timeoutRef.current) {
+        timeoutRef.current = setTimeout(() => {
+          flush();
+          timeoutRef.current = null;
+        }, 2000);
+      }
+    },
+    [flush]
+  );
+
+  const trackProductClick = useCallback((event: ProductAnalyticEvent) => {
+    if (!event.productId) return;
+
+    sendAnalyticEvents([
+      {
+        productId: event.productId,
+        variantId: event.variantId,
+        eventType: AnalyticEventType.CLICKED,
+      },
+    ]).catch((error) => {
+      console.error('Failed to send product click event', error);
+    });
+  }, []);
+
+  const removeTcxFromUrl = useCallback(() => {
+    const currentUrl = new URL(window.location.href);
+    if (!currentUrl.searchParams.has('tcx')) return;
+
+    currentUrl.searchParams.delete('tcx');
+    router.replace(currentUrl.pathname + currentUrl.search, { scroll: false });
+  }, [router]);
+
+  const trackEmailClicked = useCallback(
+    (event: EmailClickedEvent) => {
+      if (!event.tcx) return;
+
+      sendAnalyticEvents([
+        {
+          trackingCode: event.tcx,
+          eventType: AnalyticEventType.EMAIL_CLICKED,
+        },
+      ])
+        .then(() => removeTcxFromUrl())
+        .catch((error) => {
+          console.error('Failed to send email clicked event', error);
+        });
+    },
+    [removeTcxFromUrl]
+  );
+
+  useAnalyticAutoTrack({
+    enabled: autoTrack,
+    productPathPrefix,
+    trackProductView,
+    trackProductClick,
+  });
+
+  useEffect(() => {
+    if (tcxProcessedRef.current) return;
+
+    const tcx = searchParams.get('tcx');
+    if (!tcx) return;
+
+    tcxProcessedRef.current = true;
+    trackEmailClicked({ tcx });
+  }, [searchParams, trackEmailClicked]);
+
+  useEffect(() => {
+    const handleUnload = () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+        timeoutRef.current = null;
+      }
+      flush();
+    };
+
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === 'hidden') {
+        handleUnload();
+      }
+    };
+
+    window.addEventListener('beforeunload', handleUnload);
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+
+    return () => {
+      window.removeEventListener('beforeunload', handleUnload);
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, [flush]);
+
+  return (
+    <AnalyticEventContext.Provider value={{ trackProductView, trackProductClick, trackEmailClicked }}>
+      {children}
+    </AnalyticEventContext.Provider>
+  );
+};
+
+export const useAnalyticEvent = () => {
+  const context = useContext(AnalyticEventContext);
+  if (!context) {
+    throw new Error('useAnalyticEvent must be used within an AnalyticEventProvider');
+  }
+  return context;
+};

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>
+  );
+});