From a70fc4fdbf254876d80b0fc477062ce0983f58af Mon Sep 17 00:00:00 2001 From: Maxime Golfier <25312957+maxgfr@users.noreply.github.com> Date: Mon, 9 Oct 2023 15:33:07 +0200 Subject: [PATCH] feat(upload): refacto files in typescript (#1050) --- targets/frontend/package.json | 3 ++ .../pages/api/storage/{index.js => index.ts} | 19 ++++---- .../src/pages/{fichiers.js => fichiers.tsx} | 47 ++++++++++--------- yarn.lock | 30 +++++++++++- 4 files changed, 66 insertions(+), 33 deletions(-) rename targets/frontend/src/pages/api/storage/{index.js => index.ts} (80%) rename targets/frontend/src/pages/{fichiers.js => fichiers.tsx} (90%) diff --git a/targets/frontend/package.json b/targets/frontend/package.json index 6ff2c98af..343f9b1fc 100644 --- a/targets/frontend/package.json +++ b/targets/frontend/package.json @@ -84,6 +84,9 @@ "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^14.0.0", "@types/formidable": "^2.0.5", + "@types/jest": "^27.4.0", + "@types/jsonwebtoken": "^9.0.3", + "@types/lodash.get": "^4.4.7", "@types/react": "^17.0.24", "@types/react-dom": "^18.0.11", "@urql/devtools": "^2.0.3", diff --git a/targets/frontend/src/pages/api/storage/index.js b/targets/frontend/src/pages/api/storage/index.ts similarity index 80% rename from targets/frontend/src/pages/api/storage/index.js rename to targets/frontend/src/pages/api/storage/index.ts index c4533567b..b100e7f0b 100644 --- a/targets/frontend/src/pages/api/storage/index.js +++ b/targets/frontend/src/pages/api/storage/index.ts @@ -6,13 +6,14 @@ import { getContainerBlobs, uploadBlob } from "src/lib/azure"; import { isUploadFileSafe } from "src/lib/secu"; import * as stream from "stream"; import { HASURA_GRAPHQL_JWT_SECRET } from "../../../config"; +import { NextApiRequest, NextApiResponse } from "next"; const container = process.env.STORAGE_CONTAINER ?? "cdtn-dev"; const jwtSecret = JSON.parse(HASURA_GRAPHQL_JWT_SECRET); -async function endPoint(req, res) { +async function endPoint(req: NextApiRequest, res: NextApiResponse) { const apiError = createErrorFor(res); - const { token } = req.headers; + const { token }: any = req.headers; if (!token || !verify(token, jwtSecret.key, { algorithms: jwtSecret.type })) { return apiError(Boom.badRequest("wrong token")); @@ -30,12 +31,12 @@ async function endPoint(req, res) { } } -const errored = (res, err) => { +const errored = (res: NextApiResponse, err: any) => { console.error("[storage]", err); res.status(400).json({ success: false }); }; -const done = (res) => res.status(200).json({ success: true }); +const done = (res: NextApiResponse) => res.status(200).json({ success: true }); const ALLOWED_EXTENSIONS = [ "pdf", @@ -52,10 +53,10 @@ const ALLOWED_EXTENSIONS = [ "odt", ]; -const isAllowedFile = (part) => +const isAllowedFile = (part: any) => ALLOWED_EXTENSIONS.includes(part.name.toLowerCase().split(".").reverse()[0]); -function uploadFiles(req, res) { +function uploadFiles(req: NextApiRequest, res: NextApiResponse) { const form = new IncomingForm({ multiples: true }); // we need to override the onPart method to directly // stream the data to azure @@ -63,8 +64,8 @@ function uploadFiles(req, res) { form.onPart = async function (part) { try { uploadingFilesNumber++; - const streamCheckup = part.pipe(new stream.PassThrough()); - const streamUpload = part.pipe(new stream.PassThrough()); + const streamCheckup: any = part.pipe(new stream.PassThrough()); + const streamUpload: any = part.pipe(new stream.PassThrough()); streamUpload.name = part.name; streamUpload.mimetype = part.mimetype; @@ -99,7 +100,7 @@ function uploadFiles(req, res) { }); } -async function getFiles(req, res) { +async function getFiles(_req: NextApiRequest, res: NextApiResponse) { res.json(await getContainerBlobs(container)); } diff --git a/targets/frontend/src/pages/fichiers.js b/targets/frontend/src/pages/fichiers.tsx similarity index 90% rename from targets/frontend/src/pages/fichiers.js rename to targets/frontend/src/pages/fichiers.tsx index 1387d8a4f..ad21fb562 100644 --- a/targets/frontend/src/pages/fichiers.js +++ b/targets/frontend/src/pages/fichiers.tsx @@ -32,21 +32,21 @@ import { const listFiles = () => request(`/api/storage`, { headers: { token: getToken()?.jwt_token || "" }, - }); + } as any); -const uploadFiles = (formData) => +const uploadFiles = (formData: any) => request(`/api/storage`, { body: formData, headers: { token: getToken()?.jwt_token || "" }, - }); + } as any); -const deleteFile = (path) => +const deleteFile = (path: any) => request(`/api/storage/${path}`, { headers: { token: getToken()?.jwt_token || "" }, method: "DELETE", - }); + } as any); -const onDeleteClick = function (file) { +const onDeleteClick = function (file: any) { const confirmed = confirm( `Êtes-vous sûr(e) de vouloir définitivement supprimer ${file.name} ?` ); @@ -64,9 +64,9 @@ const onDeleteClick = function (file) { function FilesPage() { const { data, error, isValidating } = useSWR("files", listFiles, { initialData: undefined, - }); + } as any); const [search, setSearch, setDebouncedSearch] = useDebouncedState("", 400); - const searchInputEl = useRef(null); + const searchInputEl = useRef(null); const [isSearching, setSearching] = useState(false); const [filter, setFilter] = useState(""); const [sort, setSort] = useState("mostRecent"); @@ -101,7 +101,7 @@ function FilesPage() { }); }} /> - + @@ -180,7 +180,7 @@ function FilesPage() { {data .filter( - (file) => + (file: any) => filterCallback(filter, file) && (search ? file.name @@ -189,7 +189,7 @@ function FilesPage() { : true) ) .sort(getSortCallback(sort)) - .map((file) => { + .map((file: any) => { return ( { + onClip={(text: any) => { setCurrentClip(text); }} />