Files
psychartherapie-v2/components/layout/footer/footer.tsx
2023-09-18 16:58:06 +02:00

180 lines
6.4 KiB
TypeScript

import React from "react";
import { Container } from "../../util/container";
import { ObjectField } from "@tinacms/schema-tools/dist/types";
import facebookImage from "../../../assets/img/facebook.svg";
import instagramImage from "../../../assets/img/instagram.svg";
import { tinaField } from "tinacms/dist/react";
import { TinaMarkdown } from "tinacms/dist/rich-text";
export const Footer = ({ data, rawData }) => {
return (
<footer>
<Container className="relative" size="small">
<div className={ "flex flex-row justify-between" }>
<div>
<p>
<span data-tina-field={ tinaField(data?.contact, "label") }>
{ data?.contact?.label }
</span>
<br/>
<a href={ `mailto:${ data?.contact?.mail }` }
onClick={ () => { /* window.dataLayer.push({ event: "mail-click" });*/ } }
data-tina-field={ tinaField(data?.contact, "mail") }>
{ data?.contact?.mail }
</a>
<br/>
<b data-tina-field={ tinaField(data?.contact, "phone") }>
{ data?.contact?.phone }
</b>
</p>
<p>
SIRET <span data-tina-field={ tinaField(data?.legals, "siret") }>
{ data?.legals?.siret }
</span>
<br/>
<a href={ data?.legals?.link?.url }
data-tina-field={ tinaField(data?.legals, "link") }>
{ data?.legals?.link?.label }
</a>
</p>
<div id="socials"
className="flex flex-row"
data-tina-field={ tinaField(data, "social") }>
{ data?.social?.facebook &&
<a href={ data?.social?.facebook }
onClick={ () => { /* window.dataLayer.push({ socials: "fb-click" });*/ } }
className="py-2 me-2">
<img src={ facebookImage } alt="Facebook"/>
</a> }
{ data?.social?.instagram &&
<a href={ data?.social?.instagram }
onClick={ () => { /* window.dataLayer.push({ socials: "insta-click" });*/ } }
className="py-2">
<img src={ instagramImage } alt="Instagram"/>
</a> }
</div>
</div>
<div>
<p data-tina-field={ tinaField(data, "copyright") }>
&copy; { data?.copyright?.year }
{ data?.copyright?.subtext?.children?.length > 0 &&
<> &#8211;<div className={ "ml-1 float-right" }>
<TinaMarkdown content={ data.copyright?.subtext } />
</div>
</> }
</p>
</div>
</div>
</Container>
</footer>
);
};
export const footerSchema: ObjectField = {
type: "object",
label: "Footer",
name: "footer",
fields: [
{
type: "object",
label: "Contact",
name: "contact",
defaultItem: {
label: "Contact :",
mail: "mail@example.com",
phone: "00 00 00 00 00"
},
fields: [
{
type: "string",
label: "Label Contact",
name: "label"
},
{
type: "string",
label: "Mail",
name: "mail"
},
{
type: "string",
label: "Téléphone",
name: "phone"
}
]
},
{
type: "object",
label: "Legal",
name: "legals",
defaultItem: {
siret: "000 000 000 00000",
link: {
label: "Mentions légales",
url: "/"
}
},
fields: [
{
type: "string",
label: "SIRET",
name: "siret"
},
{
type: "object",
label: "Lien Mentions Légales",
name: "link",
fields: [
{
type: "string",
label: "Texte",
name: "label"
},
{
type: "string",
label: "Url",
name: "url"
}
]
}
]
},
{
type: "object",
label: "Copyright",
name: "copyright",
defaultItem: {
year: "0000",
subtext: "El text"
},
fields: [
{
type: "string",
label: "Année",
name: "year"
},
{
type: "rich-text",
label: "Sous-texte",
name: "subtext"
}
]
},
{
type: "object",
label: "Social Links",
name: "social",
fields: [
{
type: "string",
label: "Facebook",
name: "facebook"
},
{
type: "string",
label: "Instagram",
name: "instagram"
}
]
}]
};