Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-14 00:32:35 +10:00
Code Issues Packages Projects Releases Wiki Activity

Add PDF file caching

Browse Source
This commit is contained in:
Krisjanis Lejejs
2022-10-05 23:18:10 +03:00
parent 9b1f3eda05
commit 78a32961d7
9 changed files with 77 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
client/components/build/Center/ArtboardController.tsx
View File

@ -13,6 +13,7 @@ import {
} from '@mui/icons-material';
import { ButtonBase, Divider, Tooltip, useMediaQuery, useTheme } from '@mui/material';
import clsx from 'clsx';
import dayjs from 'dayjs';
import { get } from 'lodash';
import { useTranslation } from 'next-i18next';
import toast from 'react-hot-toast';
@ -67,8 +68,9 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
const slug = get(resume, 'slug');
const username = get(resume, 'user.username');
const updatedAt = get(resume, 'updatedAt');
const url = await mutateAsync({ username, slug });
const url = await mutateAsync({ username, slug, lastUpdated: dayjs(updatedAt).unix().toString() });
download(url);
};

4
client/components/build/RightSidebar/sections/Export.tsx
View File

@ -1,5 +1,6 @@
import { PictureAsPdf, Schema } from '@mui/icons-material';
import { List, ListItem, ListItemButton, ListItemText } from '@mui/material';
import dayjs from 'dayjs';
import get from 'lodash/get';
import pick from 'lodash/pick';
import { useTranslation } from 'next-i18next';
@ -45,8 +46,9 @@ const Export = () => {
const slug = get(resume, 'slug');
const username = get(resume, 'user.username');
const updatedAt = get(resume, 'updatedAt');
const url = await mutateAsync({ username, slug });
const url = await mutateAsync({ username, slug, lastUpdated: dayjs(updatedAt).unix().toString() });
download(url);
};

5
client/pages/[username]/[slug]/index.tsx
View File

@ -2,6 +2,7 @@ import { Download, Downloading } from '@mui/icons-material';
import { ButtonBase } from '@mui/material';
import { Resume } from '@reactive-resume/schema';
import clsx from 'clsx';
import dayjs from 'dayjs';
import download from 'downloadjs';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
@ -96,7 +97,9 @@ const Preview: NextPage<Props> = ({ username, slug, resume: initialData }) => {
const handleDownload = async () => {
try {
const url = await mutateAsync({ username, slug });
const updatedAt = get(resume, 'updatedAt');
const url = await mutateAsync({ username, slug, lastUpdated: dayjs(updatedAt).unix().toString() });
download(url);
} catch {

3
client/pages/r/[shortId].tsx
View File

@ -2,6 +2,7 @@ import { Download, Downloading } from '@mui/icons-material';
import { ButtonBase } from '@mui/material';
import { Resume } from '@reactive-resume/schema';
import clsx from 'clsx';
import dayjs from 'dayjs';
import download from 'downloadjs';
import get from 'lodash/get';
import isEmpty from 'lodash/isEmpty';
@ -69,7 +70,7 @@ const Preview: NextPage<Props> = ({ shortId }) => {
const handleDownload = async () => {
try {
const url = await mutateAsync({ username: resume.user.username, slug: resume.slug });
const url = await mutateAsync({ username: resume.user.username, slug: resume.slug, lastUpdated: dayjs(resume.updatedAt).unix().toString() });
download(url);
} catch {

4
client/services/printer.ts
View File

@ -3,7 +3,9 @@ import axios from './axios';
export type PrintResumeAsPdfParams = {
username: string;
slug: string;
lastUpdated: string;
};
export const printResumeAsPdf = (printResumeAsPdfParams: PrintResumeAsPdfParams): Promise<string> =>
axios.get(`/printer/${printResumeAsPdfParams.username}/${printResumeAsPdfParams.slug}`).then((res) => res.data);
axios.get(`/printer/${printResumeAsPdfParams.username}/${printResumeAsPdfParams.slug}?lastUpdated=${printResumeAsPdfParams.lastUpdated}`)
.then((res) => res.data);

2
client/store/index.ts
View File

@ -34,7 +34,7 @@ const store = configureStore({
},
});
sagaMiddleware.run(syncSaga);
sagaMiddleware.run(() => syncSaga(store.dispatch));
export const persistor = persistStore(store);

13
client/store/sagas/sync.ts
View File

@ -3,7 +3,7 @@ import debounce from 'lodash/debounce';
import { select, takeLatest } from 'redux-saga/effects';
import { updateResume } from '@/services/resume';
import { RootState } from '@/store/index';
import { AppDispatch, RootState } from '@/store/index';
import {
addItem,
@ -12,23 +12,24 @@ import {
deleteSection,
duplicateItem,
editItem,
setResume,
setResumeState,
} from '../resume/resumeSlice';
const DEBOUNCE_WAIT = 1000;
const debouncedSync = debounce((resume: Resume) => updateResume(resume), DEBOUNCE_WAIT);
const debouncedSync = debounce((resume: Resume, dispatch: AppDispatch) => updateResume(resume).then((resume) => dispatch(setResume(resume))), DEBOUNCE_WAIT);
function* handleSync() {
function* handleSync(dispatch: AppDispatch) {
const resume: Resume = yield select((state: RootState) => state.resume.present);
debouncedSync(resume);
debouncedSync(resume, dispatch);
}
function* syncSaga() {
function* syncSaga(dispatch: AppDispatch) {
yield takeLatest(
[setResumeState, addItem, editItem, duplicateItem, deleteItem, addSection, deleteSection],
handleSync
() => handleSync(dispatch)
);
}

6
server/src/printer/printer.controller.ts
View File

@ -1,4 +1,4 @@
import { Controller, Get, Param } from '@nestjs/common';
import { Controller, Get, Param, Query } from '@nestjs/common';
import { PrinterService } from './printer.service';
@ -7,7 +7,7 @@ export class PrinterController {
constructor(private readonly printerService: PrinterService) {}
@Get('/:username/:slug')
printAsPdf(@Param('username') username: string, @Param('slug') slug: string): Promise<string> {
return this.printerService.printAsPdf(username, slug);
printAsPdf(@Param('username') username: string, @Param('slug') slug: string, @Query('lastUpdated') lastUpdated: string): Promise<string> {
return this.printerService.printAsPdf(username, slug, lastUpdated);
}
}

42
server/src/printer/printer.service.ts
View File

@ -1,9 +1,7 @@
import { Injectable, OnModuleDestroy, OnModuleInit } from '@nestjs/common';
import { ConfigService } from '@nestjs/config';
import { SchedulerRegistry } from '@nestjs/schedule';
import { PageConfig } from '@reactive-resume/schema';
import { mkdir, unlink, writeFile } from 'fs/promises';
import { nanoid } from 'nanoid';
import { access, mkdir, readdir, unlink, writeFile } from 'fs/promises';
import { join } from 'path';
import { PDFDocument } from 'pdf-lib';
import { Browser, chromium } from 'playwright-chromium';
@ -14,7 +12,7 @@ export const DELETION_TIME = 10 * 1000; // 10 seconds
export class PrinterService implements OnModuleInit, OnModuleDestroy {
private browser: Browser;
constructor(private readonly schedulerRegistry: SchedulerRegistry, private readonly configService: ConfigService) {}
constructor(private readonly configService: ConfigService) {}
async onModuleInit() {
this.browser = await chromium.launch({
@ -26,9 +24,26 @@ export class PrinterService implements OnModuleInit, OnModuleDestroy {
await this.browser.close();
}
async printAsPdf(username: string, slug: string): Promise<string> {
const url = this.configService.get<string>('app.url');
async printAsPdf(username: string, slug: string, lastUpdated: string): Promise<string> {
const serverUrl = this.configService.get<string>('app.serverUrl');
const directory = join(__dirname, '..', 'assets/exports');
const filename = `RxResume_PDFExport_${username}_${slug}_${lastUpdated}.pdf`;
const publicUrl = `${serverUrl}/assets/exports/${filename}`;
try { // check if file already exists
await access(join(directory, filename));
} catch { // create file as it doesn't exist
// delete old files
await readdir(directory).then(async (files) => {
await Promise.all(files.map(async (file) => {
if (file.startsWith(`RxResume_PDFExport_${username}_${slug}`)) {
await unlink(join(directory, file));
}
}));
});
const url = this.configService.get<string>('app.url');
const secretKey = this.configService.get<string>('app.secretKey');
const page = await this.browser.newPage();
@ -50,9 +65,6 @@ export class PrinterService implements OnModuleInit, OnModuleDestroy {
);
const pdf = await PDFDocument.create();
const directory = join(__dirname, '..', 'assets/exports');
const filename = `RxResume_PDFExport_${nanoid()}.pdf`;
const publicUrl = `${serverUrl}/assets/exports/${filename}`;
for (let index = 0; index < resumePages.length; index++) {
await page.evaluate((page) => (document.body.innerHTML = page.innerHTML), resumePages[index]);
@ -75,19 +87,7 @@ export class PrinterService implements OnModuleInit, OnModuleDestroy {
await mkdir(directory, { recursive: true });
await writeFile(join(directory, filename), pdfBytes);
// Delete PDF artifacts after DELETION_TIME ms
const timeout = setTimeout(async () => {
try {
await unlink(join(directory, filename));
this.schedulerRegistry.deleteTimeout(`delete-${filename}`);
} catch {
// pass through
}
}, DELETION_TIME);
this.schedulerRegistry.addTimeout(`delete-${filename}`, timeout);
return publicUrl;
}