// GlobalModal.tsx

import React from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { View, Text, Button } from '@tarojs/components';
import { hideModal } from '@/store/modal';
import './GlobalModal.scss'


const GlobalModal: React.FC = () => {
  const modal = useSelector((state: any) => state.modal);
  const dispatch = useDispatch();

  const handleClose = () => {
    dispatch(hideModal());
  };

  if (!modal.isOpen) {
    return null;
  }

  return (
    <View className="modal">
      <View className="modal-content">
        <Text className="modal-title">{modal.title}</Text>
        <Text className="modal-content">{modal.content}</Text>
        <Button className="modal-close" onClick={handleClose}>
          Close
        </Button>
      </View>
    </View>
  );
};

export default GlobalModal;