import React, { createContext, useRef, useContext } from 'react';
import { ToastComponent, type ToastModel } from '@syncfusion/ej2-react-notifications';

const ToastContext = createContext<{ show: (opts: ToastModel) => void }>({ show: () => {} });

export const useToast = () => useContext(ToastContext);

export const ToastProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
  const toastRef = useRef<ToastComponent>(null);

  const show = (opts: ToastModel) => toastRef.current?.show(opts);

  return (
    <ToastContext.Provider value={{ show }}>
      {children}
      <ToastComponent
        ref={toastRef}
        position={{ X: 'Right', Y: 'Top' }}
        timeOut={5000} // Standard: 5 Sekunden
        showCloseButton={false}
      />
    </ToastContext.Provider>
  );
};
