49 lines
1.6 KiB
TypeScript
49 lines
1.6 KiB
TypeScript
import React from "react";
|
|
import { Container } from "../util/container";
|
|
import { Section } from "../util/section";
|
|
import type { Template } from "tinacms";
|
|
import { PageBlockFunction } from "../blocks-renderer";
|
|
import { PageBlocksFacebookPageTimeline } from "../../tina/__generated__/types";
|
|
|
|
export const FacebookPageTimeline: PageBlockFunction<PageBlocksFacebookPageTimeline> = ({ data }) => {
|
|
return (
|
|
<Section>
|
|
<Container
|
|
className={ "mt-2 flex justify-center" }
|
|
size="custom"
|
|
width="large"
|
|
>
|
|
{ data.page &&
|
|
<iframe
|
|
src={ `https://www.facebook.com/plugins/page.php?href=${
|
|
encodeURIComponent(data.page)
|
|
}&tabs=timeline&width=500&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId` }
|
|
width="500"
|
|
height="500"
|
|
style={ { border: "none", overflow: "hidden" } }
|
|
scrolling="no"
|
|
frameBorder="0"
|
|
allowFullScreen={ true }
|
|
allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"/> }
|
|
</Container>
|
|
</Section>
|
|
);
|
|
};
|
|
|
|
export const facebookPageTimelineBlockSchema: Template = {
|
|
name: "facebookPageTimeline",
|
|
label: "Plugin page facebook",
|
|
ui: {
|
|
defaultItem: {
|
|
page: ""
|
|
}
|
|
},
|
|
fields: [
|
|
{
|
|
type: "string",
|
|
label: "URL Page",
|
|
name: "page"
|
|
}
|
|
]
|
|
};
|