algorithm/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2025-07-29 21:23:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

[resumes][feat] upload pdf file into file storage (#321)

Browse Source 
* [resumes][feat] upload pdf file into file storage

* [resumes][fix] fix file upload failure

* [resumes][chore] update .env.local.example

* [resumes][fix] process file transfer over next.js

* [resumes][feat] file upload

* [resumes][chore] cleanup

* [resumes][feat] add GET method for file-storage API

* [portal[chore] Update env.example file

* [resumes][chore] cleanup

* [portal][chore] update yarn lock file
This commit is contained in:
Keane Chan
2022-10-09 10:40:22 +08:00
committed by GitHub
parent fbf1517901
commit 384981716d
10 changed files with 2198 additions and 1878 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
apps/portal/src/components/resumes/ResumePdf.tsx
View File

@ -1,9 +1,12 @@
import { useState } from 'react';
import axios from 'axios';
import { useEffect, useState } from 'react';
import { Document, Page, pdfjs } from 'react-pdf';
import type { PDFDocumentProxy } from 'react-pdf/node_modules/pdfjs-dist';
import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/20/solid';
import { Button, Spinner } from '@tih/ui';
import { RESUME_STORAGE_KEY } from '~/constants/file-storage-keys';
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.min.js`;
type Props = Readonly<{
@ -13,16 +16,30 @@ type Props = Readonly<{
export default function ResumePdf({ url }: Props) {
const [numPages, setNumPages] = useState(0);
const [pageNumber] = useState(1);
const [file, setFile] = useState<File>();
const onPdfLoadSuccess = (pdf: PDFDocumentProxy) => {
setNumPages(pdf.numPages);
};
useEffect(() => {
async function fetchData() {
await axios
.get(`/api/file-storage?key=${RESUME_STORAGE_KEY}&url=${url}`, {
responseType: 'blob',
})
.then((res) => {
setFile(res.data);
});
}
fetchData();
}, [url]);
return (
<div>
<Document
className="h-[calc(100vh-17rem)] overflow-scroll"
file={url}
file={file}
loading={<Spinner display="block" label="" size="lg" />}
onLoadSuccess={onPdfLoadSuccess}>
<Page pageNumber={pageNumber} />