diff --git a/src/apps/components/AppFrame/AppFrame.tsx b/src/apps/components/AppFrame/AppFrame.tsx index bd45917ae..570c8da31 100644 --- a/src/apps/components/AppFrame/AppFrame.tsx +++ b/src/apps/components/AppFrame/AppFrame.tsx @@ -1,15 +1,14 @@ import { useAppDashboardUpdates } from "@dashboard/apps/components/AppFrame/useAppDashboardUpdates"; import { AppDetailsUrlQueryParams, - AppUrls, prepareFeatureFlagsList, } from "@dashboard/apps/urls"; import { useAllFlags } from "@dashboard/hooks/useFlags"; import { CircularProgress } from "@material-ui/core"; -import { useTheme } from "@saleor/macaw-ui"; import clsx from "clsx"; -import React from "react"; +import React, { useCallback, useMemo } from "react"; +import { AppIFrame } from "./AppIFrame"; import { useStyles } from "./styles"; import { useAppActions } from "./useAppActions"; import useTokenRefresh from "./useTokenRefresh"; @@ -21,7 +20,6 @@ interface Props { className?: string; params?: AppDetailsUrlQueryParams; refetch?: () => void; - onLoad?(): void; onError?(): void; } @@ -32,13 +30,11 @@ export const AppFrame: React.FC = ({ appToken, appId, className, - params = {}, - onLoad, + params, onError, refetch, }) => { const frameRef = React.useRef(null); - const { themeType } = useTheme(); const classes = useStyles(); const appOrigin = getOrigin(src); const flags = useAllFlags(); @@ -60,7 +56,7 @@ export const AppFrame: React.FC = ({ useTokenRefresh(appToken, refetch); - const handleLoad = () => { + const handleLoad = useCallback(() => { /** * @deprecated * @@ -76,11 +72,9 @@ export const AppFrame: React.FC = ({ }); setHandshakeDone(true); + }, [appToken, postToExtension, setHandshakeDone]); - if (onLoad) { - onLoad(); - } - }; + const featureFlags = useMemo(() => prepareFeatureFlagsList(flags), [flags]); return ( <> @@ -89,19 +83,17 @@ export const AppFrame: React.FC = ({ )} -