55 lines
1.4 KiB
TypeScript
55 lines
1.4 KiB
TypeScript
import {
|
|
borderHeight,
|
|
topBarHeight,
|
|
} from "@dashboard/components/AppLayout/consts";
|
|
import { DetailPageLayout } from "@dashboard/components/Layouts";
|
|
import { AppQuery } from "@dashboard/graphql";
|
|
import { Box } from "@saleor/macaw-ui/next";
|
|
import React from "react";
|
|
|
|
import { AppFrame } from "../AppFrame";
|
|
import { AppPageNav } from "./AppPageNav";
|
|
|
|
export interface AppPageProps {
|
|
data: AppQuery["app"];
|
|
url: string;
|
|
onError: () => void;
|
|
refetch?: () => void;
|
|
}
|
|
|
|
export const AppPage: React.FC<AppPageProps> = ({
|
|
data,
|
|
url,
|
|
onError,
|
|
refetch,
|
|
}) => (
|
|
<DetailPageLayout gridTemplateColumns={1} withSavebar={false}>
|
|
<AppPageNav
|
|
name={data?.name}
|
|
supportUrl={data?.supportUrl}
|
|
homepageUrl={data?.homepageUrl}
|
|
/>
|
|
<DetailPageLayout.Content>
|
|
<Box
|
|
position="relative"
|
|
// It removes extra space between iframe and container
|
|
__lineHeight={0}
|
|
height="100%"
|
|
__minHeight={`calc(100vh - ${borderHeight} - ${topBarHeight})`}
|
|
>
|
|
{url && data?.id && data?.accessToken && (
|
|
<AppFrame
|
|
src={url}
|
|
appToken={data?.accessToken ?? ""}
|
|
onError={onError}
|
|
appId={data?.id ?? ""}
|
|
refetch={refetch}
|
|
/>
|
|
)}
|
|
</Box>
|
|
</DetailPageLayout.Content>
|
|
</DetailPageLayout>
|
|
);
|
|
|
|
AppPage.displayName = "AppPage";
|
|
export default AppPage;
|