/**
 * Copyright (c) 2020, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
 *
 * WSO2 Inc. licenses this file to you under the Apache License,
 * Version 2.0 (the "License"); you may not use this file except
 * in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied. See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

import { useEffect, useRef, useState } from "react";

/**
 * Hook to notify component outside clicks.
 *
 * @param {boolean} initialValue - Initial value.
 * @return {object} - ref, isComponentVisible & setIsComponentVisible
 */
export const useClickOutside = (initialValue = false) => {

    const [ isComponentVisible, setIsComponentVisible ] = useState(initialValue);

    const ref = useRef(null);

    /**
     * Handles outside clicks.
     *
     * @param {MouseEvent} e - Mouse event.
     */
    const handleClickOutside = (e: MouseEvent) => {
        const { target } = e;

        if (ref.current && !ref.current.contains(target)) {
            setIsComponentVisible(false);
        }
    };

    useEffect(() => {
        document.addEventListener("click", handleClickOutside, true);
        return () => {
            document.removeEventListener("click", handleClickOutside, true);
        };
    });

    return { ref, isComponentVisible, setIsComponentVisible };
}