Files
LingvAI/components/Header.tsx
Malin 0799101da3 feat: add admin panel, Replicate AI translation, and document translation
- Admin panel (/admin) with JWT auth: configure Replicate API token,
  JigsawStack API key, model version, enable/disable AI translation,
  change admin password. Settings persisted in data/settings.json.

- Replicate AI translation: POST /api/translate/replicate uses
  JigsawStack text-translate model via Replicate API. Main page
  switches to client-side AI translation when enabled.

- Document translation tab: supports PDF, DOCX, XLSX, XLS, CSV.
  Excel/Word formatting fully preserved (SheetJS + JSZip XML manipulation).
  PDF uses pdf-parse extraction + pdf-lib reconstruction.
  Column selector UI for tabular data (per-sheet, All/None toggles).

- Updated README with full implementation documentation.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-10 07:43:54 +01:00

68 lines
2.1 KiB
TypeScript

import { FC } from "react";
import Head from "next/head";
import NextLink from "next/link";
import { Flex, HStack, IconButton, Link, useColorModeValue } from "@chakra-ui/react";
import { FaGithub } from "react-icons/fa";
import { FiSettings } from "react-icons/fi";
import Image from "next/image";
import { ColorModeToggler } from ".";
type Props = {
[key: string]: any
};
const Header: FC<Props> = (props) => (
<>
<Head>
<link rel="prefetch" href="/banner_light.svg" />
<link rel="prefetch" href="/banner_dark.svg" />
</Head>
<Flex
as="header"
px={1}
py={3}
justify="space-around"
align="center"
w="full"
{...props}
>
<NextLink href="/" passHref={true}>
<Link display="flex">
<Image
src={useColorModeValue("/banner_light.svg", "/banner_dark.svg")}
alt="Logo"
width={110}
height={64}
/>
</Link>
</NextLink>
<HStack spacing={3}>
<ColorModeToggler
variant={useColorModeValue("outline", "solid")}
/>
<NextLink href="/admin" passHref={true}>
<IconButton
as={Link}
aria-label="Admin settings"
icon={<FiSettings />}
colorScheme="lingva"
variant={useColorModeValue("outline", "solid")}
/>
</NextLink>
<IconButton
as={Link}
href="https://github.com/thedaviddelta/lingva-translate"
isExternal={true}
aria-label="GitHub"
icon={<FaGithub />}
colorScheme="lingva"
variant={useColorModeValue("outline", "solid")}
/>
</HStack>
</Flex>
</>
);
export default Header;