66 lines
2 KiB
TypeScript
66 lines
2 KiB
TypeScript
import { appsListUrl } from "@dashboard/apps/urls";
|
|
import { TopNavLink, TopNavWrapper } from "@dashboard/components/AppLayout";
|
|
import { LinkState } from "@dashboard/components/Link";
|
|
import { AppAvatar } from "@dashboard/new-apps/components/AppAvatar/AppAvatar";
|
|
import { Box, Button, Text } from "@saleor/macaw-ui/next";
|
|
import React from "react";
|
|
import { FormattedMessage } from "react-intl";
|
|
import { useLocation } from "react-router";
|
|
|
|
interface AppPageNavProps {
|
|
name: string | undefined | null;
|
|
supportUrl: string | undefined | null;
|
|
homepageUrl: string | undefined | null;
|
|
}
|
|
|
|
export const AppPageNav: React.FC<AppPageNavProps> = ({
|
|
name,
|
|
supportUrl,
|
|
homepageUrl,
|
|
}) => {
|
|
const location = useLocation<LinkState>();
|
|
const goBackLink = location.state?.from ?? appsListUrl();
|
|
|
|
return (
|
|
<TopNavWrapper>
|
|
<Box
|
|
display="flex"
|
|
alignItems="center"
|
|
justifyContent="space-between"
|
|
width="100%"
|
|
>
|
|
<Box display="flex" gap={7} alignItems="center">
|
|
<TopNavLink to={goBackLink} variant="tertiary" />
|
|
<Box display="flex" gap={5} alignItems="center">
|
|
<AppAvatar />
|
|
<Text variant="heading">{name}</Text>
|
|
</Box>
|
|
</Box>
|
|
<Box display="flex" gap={4}>
|
|
{supportUrl && (
|
|
<Button
|
|
variant="secondary"
|
|
size="medium"
|
|
onClick={() => {
|
|
window.open(supportUrl, "_blank");
|
|
}}
|
|
>
|
|
<FormattedMessage defaultMessage="Support" id="HqRNN8" />
|
|
</Button>
|
|
)}
|
|
{homepageUrl && (
|
|
<Button
|
|
variant="secondary"
|
|
size="medium"
|
|
onClick={() => {
|
|
window.open(homepageUrl, "_blank");
|
|
}}
|
|
>
|
|
<FormattedMessage defaultMessage="Homepage" id="rxNddi" />
|
|
</Button>
|
|
)}
|
|
</Box>
|
|
</Box>
|
|
</TopNavWrapper>
|
|
);
|
|
};
|