104 lines
3.8 KiB
JavaScript
104 lines
3.8 KiB
JavaScript
// File Path: web/frontend/src/components/UIX/GDPRFooter/GDPRFooter.jsx
|
|
// GDPRFooter Component - Reusable footer with security features and GDPR information
|
|
|
|
import React, { memo, useMemo } from "react";
|
|
import { useUIXTheme } from "../themes/useUIXTheme.jsx";
|
|
import {
|
|
ShieldCheckIcon,
|
|
ServerIcon,
|
|
GlobeAltIcon,
|
|
HeartIcon,
|
|
} from "@heroicons/react/24/outline";
|
|
|
|
/**
|
|
* GDPRFooter Component
|
|
* Displays security features and GDPR compliance information
|
|
*
|
|
* @param {string} className - Additional CSS classes
|
|
* @param {string} containerClassName - Additional classes for the outer container
|
|
*/
|
|
const GDPRFooter = memo(function GDPRFooter({
|
|
className = "",
|
|
containerClassName = ""
|
|
}) {
|
|
const { getThemeClasses } = useUIXTheme();
|
|
|
|
// Memoize theme classes
|
|
const themeClasses = useMemo(
|
|
() => ({
|
|
borderSecondary: getThemeClasses("border-secondary"),
|
|
bgCard: getThemeClasses("bg-card"),
|
|
}),
|
|
[getThemeClasses],
|
|
);
|
|
|
|
return (
|
|
<div className={`flex-shrink-0 border-t ${themeClasses.borderSecondary} ${themeClasses.bgCard}/50 backdrop-blur-sm relative z-10 ${containerClassName}`}>
|
|
<div className={`max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 ${className}`}>
|
|
{/* Security Features */}
|
|
<div className="flex flex-col sm:flex-row items-center justify-center space-y-4 sm:space-y-0 sm:space-x-8 text-sm">
|
|
<div className="flex items-center space-x-2">
|
|
<ShieldCheckIcon className={`h-4 w-4 ${getThemeClasses("icon-success")}`} />
|
|
<span className={getThemeClasses("text-secondary")}>
|
|
ChaCha20-Poly1305 Encryption
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center space-x-2">
|
|
<ServerIcon className={`h-4 w-4 ${getThemeClasses("icon-info")}`} />
|
|
<span className={getThemeClasses("text-secondary")}>Canadian Hosted</span>
|
|
</div>
|
|
<div className="flex items-center space-x-2">
|
|
<GlobeAltIcon className={`h-4 w-4 ${getThemeClasses("icon-privacy")}`} />
|
|
<span className={getThemeClasses("text-secondary")}>Privacy First</span>
|
|
</div>
|
|
<div className="flex items-center space-x-2">
|
|
<HeartIcon className={`h-4 w-4 ${getThemeClasses("icon-featured")}`} />
|
|
<span className={getThemeClasses("text-secondary")}>Made in Canada</span>
|
|
</div>
|
|
</div>
|
|
|
|
{/* GDPR Information */}
|
|
<div className={`mt-4 text-center text-xs ${getThemeClasses("text-secondary")} space-y-2`}>
|
|
<p>
|
|
<strong>Data Controller:</strong> Maple Open Tech Inc. |{" "}
|
|
<strong>Location:</strong> Canada (Adequate protection under GDPR Art. 45)
|
|
</p>
|
|
<p>
|
|
<strong>Your GDPR Rights:</strong> Access, rectify, erase, restrict processing, data portability, object to processing, withdraw consent, and lodge a complaint with your supervisory authority.
|
|
</p>
|
|
<p>
|
|
<a
|
|
href="/privacy-policy"
|
|
className={`${getThemeClasses("link-primary")} underline`}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Privacy Policy
|
|
</a>
|
|
{" | "}
|
|
<a
|
|
href="/terms-of-service"
|
|
className={`${getThemeClasses("link-primary")} underline`}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Terms of Service
|
|
</a>
|
|
{" | "}
|
|
<strong>Contact DPO:</strong>{" "}
|
|
<a
|
|
href="mailto:privacy@mapleopentech.ca"
|
|
className={`${getThemeClasses("link-primary")} underline`}
|
|
>
|
|
privacy@mapleopentech.ca
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
});
|
|
|
|
GDPRFooter.displayName = "GDPRFooter";
|
|
|
|
export default GDPRFooter;
|