CloudHost/LingvAI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: replace Progress component with plain Box bar + use npm ci in Docker

Browse Source 
- DocumentTranslator: replace Chakra Progress (broken types in 2.2.1
  with fresh installs) with a simple Box-based progress bar — no type
  issues, same visual result
- Dockerfile: switch from npm install to npm ci so Docker uses exact
  locked versions from package-lock.json, preventing type discrepancies
  between local and Docker builds

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Malin
2026-03-10 10:00:04 +01:00
parent c795ef5a54
commit b0f7f30f17
2 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
Dockerfile
View File

@@ -5,7 +5,8 @@ WORKDIR /app
COPY package.json package-lock.json* ./ COPY package.json package-lock.json* ./
# Skip Cypress binary download — not needed in production # Skip Cypress binary download — not needed in production
ENV CYPRESS_INSTALL_BINARY=0 ENV CYPRESS_INSTALL_BINARY=0
RUN npm install --legacy-peer-deps # Use ci to install exact versions from package-lock.json
RUN npm ci --legacy-peer-deps
# ── Stage 2: build the Next.js app ────────────────────────────────────────── # ── Stage 2: build the Next.js app ──────────────────────────────────────────
FROM node:lts-alpine AS builder FROM node:lts-alpine AS builder

6
components/DocumentTranslator.tsx
View File

@@ -1,7 +1,7 @@
import { FC, useState, useCallback, useRef } from "react"; import { FC, useState, useCallback, useRef } from "react";
import { import {
Box, Button, VStack, HStack, Text, Input, Alert, AlertIcon, Box, Button, VStack, HStack, Text, Input, Alert, AlertIcon,
Progress, Select, Badge, Icon, useColorModeValue Select, Badge, Icon, useColorModeValue
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { FiUpload, FiDownload, FiFile } from "react-icons/fi"; import { FiUpload, FiDownload, FiFile } from "react-icons/fi";
import { languageList, LangCode } from "lingva-scraper"; import { languageList, LangCode } from "lingva-scraper";
@@ -211,7 +211,9 @@ const DocumentTranslator: FC = () => {
{/* Progress */} {/* Progress */}
{stage === "translating" && ( {stage === "translating" && (
<Box w="full"> <Box w="full">
<Progress value={progress} borderRadius="full" hasStripe isAnimated sx={{ "& > div": { background: "var(--chakra-colors-lingva-400)" } }} /> <Box w="full" h="8px" bg="gray.200" borderRadius="full" overflow="hidden">
<Box h="full" w={`${progress}%`} bg="lingva.400" borderRadius="full" transition="width 0.4s ease" />
</Box>
<Text fontSize="sm" textAlign="center" mt={1} color="gray.500"> <Text fontSize="sm" textAlign="center" mt={1} color="gray.500">
Translating… this may take a moment for large documents. Translating… this may take a moment for large documents.
</Text> </Text>