верификация проверяется перед рисовкой пдф, уменьшено превью

src/index.css

@@ -20,11 +20,14 @@ html * ::-webkit-scrollbar-track {
 }
 html * ::-webkit-scrollbar-thumb {
     width: 4px;
-    background-color: #9A9AAF;
+    background-color: #7e2aea;
-    color: #9A9AAF;
+    color: #7e2aea;
     border-radius: 5px;
 }
 
+.cnvs {
+    width: 80px;
+}
 
 /*
 ::-webkit-scrollbar — это фон самого скроллбара.

src/pages/AccountSettings/DocumentsDialog/DocumentItem.tsx

@@ -11,7 +11,7 @@ import { Document, Page } from "react-pdf";
 import { Buffer } from "buffer";
 import { downloadFileToDevice } from "@root/utils/downloadFileToDevice";
 import EditIcon from "@mui/icons-material/Edit";
-import { ChangeEvent, useRef } from "react";
+import { ChangeEvent, useEffect, useRef, useState } from "react";
 import { SendDocumentsArgs, Verification } from "@root/model/auth";
 import { updateDocument } from "@api/verification";
 import { jsonToFormdata } from "@utils/jsonToFormdata";
@@ -58,6 +58,22 @@ export default function DocumentItem({
     return;
   };
 
+	const [readyShowDocument, setReadyShowDocument] = useState(false);
+
+	useEffect(() => {
+		if (typeof documentUrl === 'string') {
+			if (!documentUrl.includes("pena.digital")) {
+				console.log(documentUrl)
+				fetch(documentUrl)
+					.then(e => {
+						console.log(e)
+						setReadyShowDocument(true)
+					})
+					.catch(e => console.log(e))
+			}
+		}
+	}, [])
+
   async function sendDocument(e: ChangeEvent<HTMLInputElement>) {
     const target = e.target as HTMLInputElement;
     const file = target?.files?.[0] || null;
@@ -76,7 +92,6 @@ export default function DocumentItem({
       enqueueSnackbar("Данные обновлены");
     }
   }
-
   return (
     <Box
       sx={{
@@ -96,7 +111,7 @@ export default function DocumentItem({
       >
         {text}
       </Typography>
-      {documentUrl && (
+      {documentUrl && readyShowDocument && (
         <>
           <Box sx={{ display: "flex", alignItems: "center" }}>
             <Typography
@@ -119,10 +134,10 @@ export default function DocumentItem({
             />
           </Box>
 
-          <Document file={documentUrl}>
+          <Document file={documentUrl} className={"cnvs"}>
             <Page
               pageNumber={1}
-              width={200}
+              width={80}
               renderTextLayer={false}
               renderAnnotationLayer={false}
             />

src/pages/AccountSettings/DocumentsDialog/DocumentUploadItem.tsx

@@ -1,4 +1,4 @@
-import { ChangeEvent, useRef } from "react"
+import { ChangeEvent, useEffect, useRef, useState } from "react"
 import axios from "axios"
 import { Document, Page, pdfjs } from "react-pdf"
 import { Box, SxProps, Theme, Typography } from "@mui/material"
@@ -13,12 +13,12 @@ import { readFile } from "@root/utils/readFile"
 import { downloadFileToDevice } from "@root/utils/downloadFileToDevice"
 
 interface Props {
-  text: string;
+	text: string;
-  document: UserDocument;
+	document: UserDocument;
-  documentUrl?: string;
+	documentUrl?: string;
-  onFileChange: (event: ChangeEvent<HTMLInputElement>) => void;
+	onFileChange: (event: ChangeEvent<HTMLInputElement>) => void;
-  sx?: SxProps<Theme>;
+	sx?: SxProps<Theme>;
-  accept?: string;
+	accept?: string;
 }
 
 pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.js`;
@@ -31,12 +31,31 @@ export default function DocumentUploadItem({
 	sx,
 	accept = "image/*",
 }: Props) {
+	const urlOrFile = document.file || documentUrl
 	const fileInputRef = useRef<HTMLInputElement>(null)
 
 	function handleChooseFileClick() {
 		fileInputRef.current?.click()
 	}
 
+	const [readyShowDocument, setReadyShowDocument] = useState(false);
+
+	useEffect(() => {
+		if (typeof urlOrFile === 'string') {
+			if (!urlOrFile.includes("pena.digital")) {
+				console.log(documentUrl)
+				fetch(documentUrl)
+					.then(e => {
+						console.log(e)
+						setReadyShowDocument(true)
+					})
+					.catch(e => console.log(e))
+			}
+		} else {
+			setReadyShowDocument(true)
+		}
+	}, [])
+
 	const downloadFile = async () => {
 		if (!document.file && documentUrl) {
 			const { data } = await axios.get<ArrayBuffer>(documentUrl, {
@@ -93,16 +112,16 @@ export default function DocumentUploadItem({
 				multiple
 				accept={accept}
 			/>
-			{(document.file || documentUrl) &&
+			{urlOrFile && readyShowDocument &&
-			<Document file={document.file || documentUrl}>
+				<Document file={urlOrFile}>
-				<Page
+					<Page
-					pageNumber={1}
+						pageNumber={1}
-					width={200}
+						width={80}
-					renderTextLayer={false}
+						renderTextLayer={false}
-					renderAnnotationLayer={false}
+						renderAnnotationLayer={false}
-					onClick={downloadFile}
+						onClick={downloadFile}
-				/>
+					/>
-			</Document>}
+				</Document>}
 		</Box>
 	)
 }

src/pages/AccountSettings/DocumentsDialog/JuridicalDocumentsDialog.tsx

@@ -13,12 +13,7 @@ import { sendDocuments, updateDocuments } from "@root/api/verification"
 import { readFile } from "@root/utils/readFile"
 import { deleteEmptyKeys } from "@root/utils/deleteEmptyKeys"
 import { verify } from "../helper"
-import {ChangeEvent, useState} from "react"
 import { theme } from "@root/utils/theme"
-import makeRequest from "@api/makeRequest"
-import {Verification} from "@root/model/auth"
-import {jsonToFormdata} from "@utils/jsonToFormdata"
-import {parseAxiosError} from "@utils/parse-error"
 
 const dialogContainerStyle = {
 	height: "100%",
@@ -174,7 +169,7 @@ export default function JuridicalDocumentsDialog() {
 			>
 				<CloseSmallIcon />
 			</IconButton>
-			<Box sx={{ p: "40px", overflowY: "scroll" }}>
+			<Box sx={{ p: "40px", pb: "70px", overflowY: "scroll" }}>
 				<Typography variant="h5" lineHeight="100%">
 					{verificationStatus === VerificationStatus.VERIFICATED
 						? "Ваши документы"

src/pages/AccountSettings/DocumentsDialog/NkoDocumentsDialog.tsx

@@ -129,6 +129,7 @@ export default function NkoDocumentsDialog() {
     			text="1. Свидетельство о регистрации НКО"
 				keyName="certificate"
     			documentUrl={documentsUrl["Свидетельство о регистрации НКО"]}
+				
     		/>
     		<DocumentItem
     			text="2. Скан ИНН организации НКО (выписка из ЕГЮРЛ)"
@@ -206,7 +207,7 @@ export default function NkoDocumentsDialog() {
 			>
 				<CloseSmallIcon />
 			</IconButton>
-			<Box sx={{ p: "40px", overflowY: "scroll" }}>
+			<Box sx={{ p: "40px", pb: "70px",  overflowY: "scroll" }}>
 				<Typography variant="h5" lineHeight="100%">
 					{verificationStatus === VerificationStatus.VERIFICATED
 						? "Ваши документы"