feat(footer): add availability status pill to footer bottom bar
This commit is contained in:
@@ -59,7 +59,14 @@ export default async function RootLayout({
|
|||||||
<LanguageSlugsProvider>
|
<LanguageSlugsProvider>
|
||||||
<Header navItems={headerNavItems} />
|
<Header navItems={headerNavItems} />
|
||||||
<main className="min-h-screen pt-24">{children}</main>
|
<main className="min-h-screen pt-24">{children}</main>
|
||||||
<Footer navItems={footerNavItems} companyInfo={companyData} association={footerData.association} copyright={footerData.copyright} creator={footerData.creator} />
|
<Footer
|
||||||
|
navItems={footerNavItems}
|
||||||
|
companyInfo={companyData}
|
||||||
|
association={footerData.association}
|
||||||
|
copyright={footerData.copyright}
|
||||||
|
creator={footerData.creator}
|
||||||
|
availability={footerData.availabilityStatus}
|
||||||
|
/>
|
||||||
|
|
||||||
{/* Floating WhatsApp Button */}
|
{/* Floating WhatsApp Button */}
|
||||||
<a
|
<a
|
||||||
|
|||||||
@@ -12,12 +12,14 @@ export function Footer({
|
|||||||
association = {},
|
association = {},
|
||||||
copyright,
|
copyright,
|
||||||
creator,
|
creator,
|
||||||
|
availability,
|
||||||
}: {
|
}: {
|
||||||
navItems?: any[];
|
navItems?: any[];
|
||||||
companyInfo?: any;
|
companyInfo?: any;
|
||||||
association?: any;
|
association?: any;
|
||||||
copyright?: any;
|
copyright?: any;
|
||||||
creator?: any;
|
creator?: any;
|
||||||
|
availability?: any;
|
||||||
}) {
|
}) {
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
|
|
||||||
@@ -48,6 +50,11 @@ export function Footer({
|
|||||||
const creatorName = creator?.name;
|
const creatorName = creator?.name;
|
||||||
const creatorUrl = creator?.url;
|
const creatorUrl = creator?.url;
|
||||||
|
|
||||||
|
const currentAvailability = availability?.[currentLocaleCode] || availability?.pl || availability || {};
|
||||||
|
const defaultAvailText = currentLocaleCode === 'de' ? 'Ich nehme derzeit neue Mandanten an' : 'Przyjmuję obecnie nowych klientów';
|
||||||
|
const availText = currentAvailability?.text || defaultAvailText;
|
||||||
|
const isAvailable = currentAvailability?.available !== false;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<footer className="bg-card py-16 md:py-24 mt-auto">
|
<footer className="bg-card py-16 md:py-24 mt-auto">
|
||||||
<div className="container-premium grid grid-cols-1 md:grid-cols-3 gap-16 md:gap-12">
|
<div className="container-premium grid grid-cols-1 md:grid-cols-3 gap-16 md:gap-12">
|
||||||
@@ -150,7 +157,15 @@ export function Footer({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="container-premium mt-16 pt-8 border-t border-border flex flex-col md:flex-row justify-between items-center gap-6 text-sm text-foreground/50">
|
<div className="container-premium mt-16 pt-8 border-t border-border flex flex-col md:flex-row justify-between items-center gap-6 text-sm text-foreground/50">
|
||||||
<p>{copyrightText}</p>
|
<div className="flex flex-col sm:flex-row items-center gap-4 sm:gap-6">
|
||||||
|
{availText && (
|
||||||
|
<div className="inline-flex items-center gap-2 rounded-full border border-border bg-card px-3 py-1.5 text-xs font-medium text-foreground/80 shadow-xs">
|
||||||
|
<span className={`w-2 h-2 rounded-full shrink-0 ${isAvailable ? 'bg-green-500' : 'bg-foreground/40'}`} />
|
||||||
|
<span>{availText}</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<p>{copyrightText}</p>
|
||||||
|
</div>
|
||||||
{(creatorName || creatorLabel) && (
|
{(creatorName || creatorLabel) && (
|
||||||
<p className="flex items-center gap-2 font-medium">
|
<p className="flex items-center gap-2 font-medium">
|
||||||
{creatorLabel && <span>{creatorLabel}</span>}
|
{creatorLabel && <span>{creatorLabel}</span>}
|
||||||
|
|||||||
@@ -18,6 +18,24 @@ export const Footer: GlobalConfig = {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'availabilityStatus',
|
||||||
|
type: 'group',
|
||||||
|
localized: true,
|
||||||
|
fields: [
|
||||||
|
{
|
||||||
|
name: 'text',
|
||||||
|
type: 'text',
|
||||||
|
required: true,
|
||||||
|
defaultValue: 'Przyjmuję obecnie nowych klientów',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'available',
|
||||||
|
type: 'checkbox',
|
||||||
|
defaultValue: true,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: 'association',
|
name: 'association',
|
||||||
type: 'group',
|
type: 'group',
|
||||||
|
|||||||
@@ -915,6 +915,10 @@ export interface Footer {
|
|||||||
id?: string | null;
|
id?: string | null;
|
||||||
}[]
|
}[]
|
||||||
| null;
|
| null;
|
||||||
|
availabilityStatus: {
|
||||||
|
text: string;
|
||||||
|
available?: boolean | null;
|
||||||
|
};
|
||||||
association?: {
|
association?: {
|
||||||
title?: string | null;
|
title?: string | null;
|
||||||
logo?: (number | null) | Media;
|
logo?: (number | null) | Media;
|
||||||
@@ -1138,6 +1142,12 @@ export interface FooterSelect<T extends boolean = true> {
|
|||||||
page?: T;
|
page?: T;
|
||||||
id?: T;
|
id?: T;
|
||||||
};
|
};
|
||||||
|
availabilityStatus?:
|
||||||
|
| T
|
||||||
|
| {
|
||||||
|
text?: T;
|
||||||
|
available?: T;
|
||||||
|
};
|
||||||
association?:
|
association?:
|
||||||
| T
|
| T
|
||||||
| {
|
| {
|
||||||
|
|||||||
Reference in New Issue
Block a user