mirror of
https://github.com/makeplane/plane.git
synced 2025-12-25 16:19:43 +01:00
3436c4f1f5
* [WEB-5501] refactor: optimize component structures and improve hooks - Updated type definitions in AppProvider to use React.ReactNode for children. - Enhanced HomePeekOverviewsRoot by using MobX observer and integrating issue detail hook. - Optimized ContentOverflowWrapper to prevent unnecessary re-renders by adjusting useEffect dependencies. - Updated DashboardQuickLinks to include necessary dependencies in useCallback. - Refactored GlobalShortcutsProvider to utilize refs for context and handler management, improving performance. - Changed useCurrentTime to update every minute instead of every second. - Refactored outside click hooks to use useCallback for better performance. - Improved IntercomProvider and PostHogProvider to prevent multiple initializations using refs. * refactor: simplify conditional rendering in HomePeekOverviewsRoot component * refactor: improve outside click detection in sidebar and peek overview hooks * refactor: enhance IntercomProvider and PostHogProvider with hydration state management
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import React, { useEffect, useRef, useState } from "react";
|
|
import { Intercom, show, hide, onHide } from "@intercom/messenger-js-sdk";
|
|
import { observer } from "mobx-react";
|
|
// store hooks
|
|
import { useInstance } from "@/hooks/store/use-instance";
|
|
import { useTransient } from "@/hooks/store/use-transient";
|
|
import { useUser } from "@/hooks/store/user";
|
|
|
|
export type IntercomProviderProps = {
|
|
children: React.ReactNode;
|
|
};
|
|
|
|
const IntercomProvider = observer(function IntercomProvider(props: IntercomProviderProps) {
|
|
const { children } = props;
|
|
// hooks
|
|
const { data: user } = useUser();
|
|
const { config } = useInstance();
|
|
const { isIntercomToggle, toggleIntercom } = useTransient();
|
|
// refs
|
|
const isInitializedRef = useRef(false);
|
|
// states
|
|
const [hydrated, setHydrated] = useState(false);
|
|
// derived values
|
|
const isIntercomEnabled = user && config && config.is_intercom_enabled && config.intercom_app_id;
|
|
|
|
useEffect(() => {
|
|
if (!hydrated) return;
|
|
if (isIntercomToggle) show();
|
|
else hide();
|
|
}, [hydrated, isIntercomToggle]);
|
|
|
|
useEffect(() => {
|
|
if (!hydrated) return;
|
|
onHide(() => {
|
|
toggleIntercom(false);
|
|
});
|
|
}, [hydrated, toggleIntercom]);
|
|
|
|
useEffect(() => {
|
|
if (!isIntercomEnabled || isInitializedRef.current) return; // prevent multiple initializations
|
|
Intercom({
|
|
app_id: config.intercom_app_id || "",
|
|
user_id: user.id,
|
|
name: `${user.first_name} ${user.last_name}`,
|
|
email: user.email,
|
|
hide_default_launcher: true,
|
|
});
|
|
isInitializedRef.current = true;
|
|
setHydrated(true);
|
|
}, [isIntercomEnabled, config, user]);
|
|
|
|
return <>{children}</>;
|
|
});
|
|
|
|
export default IntercomProvider;
|