Skip to content

Commit

Permalink
may download document with translation (#1220)
Browse files Browse the repository at this point in the history
  • Loading branch information
an-lee authored Dec 2, 2024
1 parent 1ea4d33 commit 6cdf602
Show file tree
Hide file tree
Showing 9 changed files with 187 additions and 46 deletions.
14 changes: 7 additions & 7 deletions enjoy/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@
"@types/mark.js": "^8.11.12",
"@types/mime-types": "^2.1.4",
"@types/mustache": "^4.2.5",
"@types/node": "^22.10.0",
"@types/node": "^22.10.1",
"@types/prop-types": "^15.7.13",
"@types/rails__actioncable": "^6.1.11",
"@types/react": "^18.3.12",
Expand All @@ -106,13 +106,13 @@
"axios": "^1.7.8",
"camelcase": "^8.0.0",
"camelcase-keys": "^9.1.3",
"chart.js": "^4.4.6",
"chart.js": "^4.4.7",
"cheerio": "^1.0.0",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"cmdk": "^1.0.4",
"command-exists": "^1.2.9",
"compromise": "^14.14.2",
"compromise": "^14.14.3",
"compromise-paragraphs": "^0.1.0",
"compromise-stats": "^0.1.0",
"dayjs": "^1.11.13",
Expand All @@ -127,7 +127,7 @@
"electron-playwright-helpers": "^1.7.1",
"electron-squirrel-startup": "^1.0.1",
"electron-unhandled": "^5.0.0",
"eslint": "^9.15.0",
"eslint": "^9.16.0",
"eslint-import-resolver-typescript": "^3.6.3",
"eslint-plugin-import": "^2.31.0",
"flora-colossus": "^2.0.0",
Expand All @@ -136,7 +136,7 @@
"https-proxy-agent": "^7.0.5",
"i18next": "^24.0.2",
"input-otp": "^1.4.1",
"intl-tel-input": "^24.7.0",
"intl-tel-input": "^24.8.1",
"js-md5": "^0.8.3",
"langchain": "^0.3.6",
"lodash": "^4.17.21",
Expand Down Expand Up @@ -164,7 +164,7 @@
"react-frame-component": "^5.2.7",
"react-hook-form": "^7.53.2",
"react-hotkeys-hook": "^4.6.1",
"react-i18next": "^15.1.2",
"react-i18next": "^15.1.3",
"react-markdown": "^9.0.1",
"react-resizable-panels": "^2.1.7",
"react-router-dom": "^7.0.1",
Expand All @@ -189,7 +189,7 @@
"wavesurfer.js": "^7.8.9",
"zod": "^3.23.8",
"zod-to-json-schema": "^3.23.5",
"zx": "^8.2.2"
"zx": "^8.2.4"
},
"dependencies": {
"@andrkrn/ffprobe-static": "^5.2.0",
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import {
Button,
DropdownMenu,
DropdownMenuItem,
DropdownMenuContent,
DropdownMenuTrigger,
toast,
} from "@renderer/components/ui";
import { MoreVerticalIcon } from "lucide-react";
import { t } from "i18next";
import { useContext } from "react";
import {
AppSettingsProviderContext,
DocumentProviderContext,
} from "@renderer/context";
import template from "./document.template.html?raw";

export const DocumentActionsButton = (props: { document: DocumentEType }) => {
const { document } = props;
const { EnjoyApp } = useContext(AppSettingsProviderContext);
const { ref, section } = useContext(DocumentProviderContext);

const handlePrint = async () => {
if (!ref.current) return;

const content = template.replace("$title", document.title).replace(
"$content",
Array.from(ref.current.querySelectorAll(".segment, .translation"))
.map((segment) => {
const tagName = segment.tagName.toLowerCase();
if (segment.classList.contains("translation")) {
return `<${tagName}>${segment.textContent}</${tagName}>`;
}
return `<${tagName}>${
segment.querySelector(".segment-content")?.textContent
}</${tagName}>`;
})
.join("")
);

try {
const savePath = await EnjoyApp.dialog.showSaveDialog({
title: t("print"),
defaultPath: `${document.title}(S${section}).pdf`,
});

if (!savePath) return;

await EnjoyApp.download.printAsPdf(content, savePath);

toast.success(t("downloadedSuccessfully"));
} catch (err) {
toast.error(`${t("downloadFailed")}: ${err.message}`);
}
};

return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="w-6 h-6">
<MoreVerticalIcon className="size-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent side="bottom" align="start">
<DropdownMenuItem onClick={handlePrint}>{t("print")}</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
);
};
13 changes: 10 additions & 3 deletions enjoy/src/renderer/components/documents/document-epub-renderer.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { useCallback, useContext, useEffect, useState } from "react";
import {
DocumentActionsButton,
DocumentConfigButton,
LoaderSpin,
MarkdownWrapper,
Expand All @@ -16,7 +17,12 @@ import {
Button,
toast,
} from "@renderer/components/ui";
import { ChevronLeftIcon, ChevronRightIcon, MenuIcon } from "lucide-react";
import {
ChevronLeftIcon,
ChevronRightIcon,
MenuIcon,
TableOfContentsIcon,
} from "lucide-react";
import {
AppSettingsProviderContext,
DocumentProviderContext,
Expand Down Expand Up @@ -145,7 +151,7 @@ export const DocumentEpubRenderer = () => {
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" size="icon" className="w-6 h-6">
<MenuIcon className="size-4" />
<TableOfContentsIcon className="size-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
Expand Down Expand Up @@ -176,6 +182,7 @@ export const DocumentEpubRenderer = () => {
</DropdownMenuContent>
</DropdownMenu>
<DocumentConfigButton document={document} />
<DocumentActionsButton document={document} />
</div>
<div className="text-xs text-muted-foreground truncate">{title}</div>
<div className="flex items-center gap-2">
Expand All @@ -202,7 +209,7 @@ export const DocumentEpubRenderer = () => {
<LoaderSpin />
) : (
<MarkdownWrapper
className="mx-auto max-w-full"
className="mx-auto max-w-full document-renderer"
onLinkClick={handleLinkClick}
onSegmentVisible={onSegmentVisible}
autoTranslate={document.config.autoTranslate}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { Readability } from "@mozilla/readability";
import { useContext, useEffect, useState } from "react";
import {
DocumentActionsButton,
DocumentConfigButton,
LoaderSpin,
MarkdownWrapper,
Expand Down Expand Up @@ -51,6 +52,7 @@ export const DocumentHtmlRenderer = () => {
<div className="flex items-center justify-between space-x-2 sticky top-0 z-10 bg-background py-2">
<div className="flex items-center gap-2">
<DocumentConfigButton document={document} />
<DocumentActionsButton document={document} />
</div>
<div className="text-xs text-muted-foreground max-w-full truncate">
{title}
Expand All @@ -71,7 +73,7 @@ export const DocumentHtmlRenderer = () => {
</div>
</div>
<MarkdownWrapper
className="mx-auto max-w-full"
className="mx-auto max-w-full document-renderer"
autoTranslate={document.config.autoTranslate}
onSpeech={onSpeech}
onSegmentVisible={onSegmentVisible}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { useContext, useEffect } from "react";
import {
DocumentActionsButton,
DocumentConfigButton,
LoaderSpin,
MarkdownWrapper,
Expand Down Expand Up @@ -33,6 +34,7 @@ export const DocumentTextRenderer = () => {
<div className="flex items-center justify-between space-x-2 sticky top-0 z-10 bg-background py-2">
<div className="flex items-center gap-2">
<DocumentConfigButton document={document} />
<DocumentActionsButton document={document} />
</div>
<div className="text-xs text-muted-foreground max-w-full truncate">
{document.title}
Expand All @@ -53,7 +55,7 @@ export const DocumentTextRenderer = () => {
</div>
</div>
<MarkdownWrapper
className="mx-auto max-w-full"
className="mx-auto max-w-full document-renderer"
autoTranslate={document.config.autoTranslate}
onSpeech={onSpeech}
onSegmentVisible={onSegmentVisible}
Expand Down
40 changes: 40 additions & 0 deletions enjoy/src/renderer/components/documents/document.template.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width initial-scale=1.0" />
<title>$title</title>
<style>
body {
font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}

h1 {
font-size: 24px;
font-weight: 600;
text-align: center;
margin-bottom: 24px;
}

h2 {
font-size: 20px;
font-weight: 600;
margin-bottom: 16px;
}

h3 {
font-size: 18px;
font-weight: 600;
margin-bottom: 16px;
}

p {
font-size: 16px;
margin-bottom: 16px;
}
</style>
</head>
<body>
<div class="content">$content</div>
</body>
</html>
1 change: 1 addition & 0 deletions enjoy/src/renderer/components/documents/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,3 +7,4 @@ export * from "./document-config-form";
export * from "./document-add-button";
export * from "./document-config-button";
export * from "./documents-segment";
export * from "./document-actions-button";
2 changes: 1 addition & 1 deletion enjoy/src/renderer/components/misc/markdown-wrapper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ const Segment = memo(
<span className="segment-content">{children}</span>
</Tag>
{translation && (
<Tag id={`translation-${index}`}>
<Tag id={`translation-${index}`} className="translation">
{translation}
<Button
variant="ghost"
Expand Down
Loading

0 comments on commit 6cdf602

Please sign in to comment.