continue: change local check button design

This commit is contained in:
smanylov
2026-03-23 14:07:44 +07:00
parent c5c4687063
commit b5ec4ccbcd
4 changed files with 73 additions and 19 deletions
+35
View File
@@ -3911,6 +3911,7 @@
display: flex;
align-self: center;
gap: 5px;
&.image {
svg {
color: v.$color-image;
@@ -4881,4 +4882,38 @@
.local-file-check-result {
cursor: pointer;
}
.btn-check-file {
color: v.$p-color;
cursor: pointer;
background: v.$white;
border: 2px solid v.$p-color;
border-radius: 20px;
align-items: center;
gap: 6px;
min-width: 110px;
padding: 8px 12px;
font-size: 12px;
font-weight: 600;
transition: all .3s;
display: flex;
box-shadow: 0 10px 40px v.$shadow-1;
opacity: 0.8;
&:hover {
box-shadow: 0 5px 5px v.$shadow-1;
opacity: 1;
}
}
.local-file-check-link {
color: v.$p-color;
font-weight: 600;
margin-left: 5px;
&:hover {
text-decoration: underline;
}
}
}
+30 -17
View File
@@ -8,6 +8,7 @@ import { fileUpload, chunkUpload, checkChunkStatus } from '@/app/actions/fileUpl
import { getFileType } from '@/app/lib/getFileType';
import { searchUserFiles } from '@/app/actions/searchActions';
import { toast } from 'sonner';
import Link from 'next/link';
interface SelectedFile {
file: File;
@@ -35,6 +36,7 @@ export default function LocalFileCheck() {
const [fileId, setFileId] = useState<string | null>(null);
const [searchResult, setSearchResult] = useState<string | null>(null);
const isCancelledRef = useRef(false);
const [fileLink, setFileLink] = useState<string | null>(null);
const childRef = useRef(null);
@@ -212,6 +214,7 @@ export default function LocalFileCheck() {
const handlerSearchUserFile = useCallback(async (fileId: string, fileName: string): Promise<void> => {
setFileLink(null);
try {
let result = await searchUserFiles(fileId);
@@ -221,25 +224,22 @@ export default function LocalFileCheck() {
}
if (result?.content?.length) {
result.content.some((e: any) => {
result.content.some((e: {
status: string,
fileId: string
}) => {
if (e.status === 'PROTECTED') {
toast.success(t('file-file-name-already-exists', {
fileName: fileName
}));
setSearchResult(t('file-file-name-already-exists', {
fileName: fileName
}));
console.log(e);
toast.success(t('file-is-protected'));
setSearchResult(t('file-is-protected'));
setFileLink(e.fileId);
return true;
}
return false;
});
} else {
toast.warning(t('file-file-name-does-not-exist', {
fileName: fileName
}));
setSearchResult(t('file-file-name-does-not-exist', {
fileName: fileName
}));
toast.warning(t('no-similar-files-title'));
setSearchResult(t('no-similar-files-title'));
}
} catch (error) {
@@ -250,7 +250,9 @@ export default function LocalFileCheck() {
}
}
}, [fileId])
}, [fileId]);
/* fileLink, setFileLink */
return (
<div
@@ -262,16 +264,18 @@ export default function LocalFileCheck() {
accept={acceptString}
style={{ display: 'none' }}
onChange={handleFileInputChange}
aria-label="Выбор файла для защиты"
aria-label=""
/>
<button
className="btn btn-primary"
className="btn btn-check-file"
onClick={handleButtonClick}
type="button"
disabled={uploadProgress && uploadProgress !== 100 ? true : false}
style={{ minWidth: '140px' }}
>
<span>Проверка файла</span>
<span>
{t('file-verification')}
</span>
{(uploadProgress !== 0 && uploadProgress !== 100) && (
<div className="loading-animation">
<span className="global-spinner"></span>
@@ -282,10 +286,19 @@ export default function LocalFileCheck() {
className="local-file-check-result"
onClick={() => {
setSearchResult(null);
setFileLink(null);
setIsFileUploaded(false);
}}
>
{searchResult}
{fileLink && (
<Link
href={`/pages/violations/${fileLink}`}
className="local-file-check-link"
>
{t('read-more')}
</Link>
)}
</div>
</div>
)
+4 -1
View File
@@ -355,7 +355,10 @@
"request-payment": "Request payment",
"amount-to-be-withdrawn": "Amount to be withdrawn",
"payment-method": "Payment method",
"payment-history": "Payment history"
"payment-history": "Payment history",
"file-verification": "File verification",
"file-is-protected": "The file is protected.",
"read-more": "Read more"
},
"Login-register-form": {
"and": "and",
+4 -1
View File
@@ -355,7 +355,10 @@
"request-payment": "Запросить выплату",
"amount-to-be-withdrawn": "Сумма к выводу",
"payment-method": "Способ выплаты",
"payment-history": "История выплат"
"payment-history": "История выплат",
"file-verification": "Проверка файла",
"file-is-protected": "Файл защищен.",
"read-more": "Подробнее"
},
"Login-register-form": {
"and": "и",