// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React, { useCallback, useEffect, useMemo } from 'react';
import { useIsParticularSidePaneOpen } from './SidePaneProvider';
import { SidePaneHeader } from '../../../common/SidePaneHeader';
import { MeetingPhoneInfoPaneContent } from '../../../common/MeetingPhoneInfoPaneContent';
import { useLocale } from '../../../localization';
const SIDE_PANE_ID = 'Meeting Phone Info';
/** @private */
export const useMeetingPhoneInfoPane = (props) => {
    const { updateSidePaneRenderer, mobileView, conferencePhoneInfo } = props;
    const closePane = useCallback(() => {
        updateSidePaneRenderer(undefined);
    }, [updateSidePaneRenderer]);
    const localeStrings = useLocale().component.strings.meetingConferencePhoneInfo;
    const callStrings = useLocale().strings.call;
    const onRenderHeader = useCallback(() => React.createElement(SidePaneHeader, { onClose: closePane, headingText: localeStrings.meetingConferencePhoneInfoModalTitle, dismissSidePaneButtonAriaLabel: callStrings.dismissSidePaneButtonLabel, mobileView: mobileView !== null && mobileView !== void 0 ? mobileView : false }), [mobileView, closePane, localeStrings, callStrings]);
    const onRenderContent = useCallback(() => {
        return React.createElement(MeetingPhoneInfoPaneContent, { mobileView: mobileView, conferencePhoneInfoList: conferencePhoneInfo });
    }, [mobileView, conferencePhoneInfo]);
    const sidePaneRenderer = useMemo(() => ({
        headerRenderer: onRenderHeader,
        contentRenderer: onRenderContent,
        id: SIDE_PANE_ID
    }), [onRenderContent, onRenderHeader]);
    const openPane = useCallback(() => {
        updateSidePaneRenderer(sidePaneRenderer);
    }, [sidePaneRenderer, updateSidePaneRenderer]);
    const isOpen = useIsParticularSidePaneOpen(SIDE_PANE_ID);
    // Update pane renderer if it is open and the openPane dep changes
    useEffect(() => {
        if (isOpen) {
            openPane();
        }
    }, [isOpen, openPane]);
    return {
        openMeetingPhoneInfoPane: openPane,
        closeMeetingPhoneInfoPane: closePane,
        isMeetingPhoneInfoPaneOpen: isOpen
    };
};
//# sourceMappingURL=useMeetingPhoneInfo.js.map