import { useTranslation } from 'react-i18next';
import { Link } from 'react-router-dom';

import { usePageActionsSlot } from './page-actions';

/** The running Dorfteich version — injected at build time (the Dockerfile
 * passes the release tag as VITE_APP_VERSION); dev builds show the dev tag. */
const APP_VERSION: string = (import.meta.env.VITE_APP_VERSION as string) || '0.0.0-dev';

/**
 * The app-wide footer (issue #82): legal links on every view — editor,
 * public pages, and auth screens all render inside AppLayout, so this one
 * spot covers them all. Since the M10 follow-ups the active page portals
 * its connection-status icon into the left half (with the instance version
 * next to it, #126); the legal links sit right.
 */
export function Footer(): React.JSX.Element {
  const { t } = useTranslation('legal');
  const { setStatusElement } = usePageActionsSlot();
  return (
    <footer className="app-footer">
      <div className="app-footer__status" ref={setStatusElement} />
      <span className="app-footer__version">{APP_VERSION}</span>
      <span className="app-footer__spacer" />
      <Link to="/legal/imprint">{t('links.imprint')}</Link>
      <span aria-hidden>·</span>
      <Link to="/legal/privacy">{t('links.privacy')}</Link>
    </footer>
  );
}