// 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
 * @param {boolean} showSecurityFeatures - Whether to show the security features section (default: true)
 */
const GDPRFooter = memo(function GDPRFooter({
  className = "",
  containerClassName = "",
  showSecurityFeatures = true,
}) {
  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 */}
        {showSecurityFeatures && (
          <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={`${showSecurityFeatures ? '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;
