saleor-apps-redis_apl/apps/emails-and-messages/src/modules/app-configuration/ui/instructions.tsx
2023-03-07 22:03:58 +01:00

42 lines
1,001 B
TypeScript

import { Link, Paper, Typography } from "@material-ui/core";
import { actions, useAppBridge } from "@saleor/app-sdk/app-bridge";
import { makeStyles } from "@saleor/macaw-ui";
const useStyles = makeStyles((theme) => {
return {
instructionsContainer: {
padding: 15,
},
};
});
export const Instructions = () => {
const styles = useStyles();
const { appBridge } = useAppBridge();
return (
<Paper elevation={0} className={styles.instructionsContainer}>
<Typography paragraph variant="h4">
Usage instructions
</Typography>
<Typography paragraph>
Example of the external link to the documentation{" "}
<Link
href="#"
onClick={() => {
appBridge?.dispatch(
actions.Redirect({
to: "https://saleor.io/",
newContext: true,
})
);
}}
>
here
</Link>
.
</Typography>
</Paper>
);
};