add search animation

src/app/actions/fileEntity.ts

@@ -85,7 +85,7 @@ export async function searchUserFiles(fileId: string) {
 	const token = await getSessionData('token');
 
 	try {
-		const response = await fetch(`${API_BASE_URL}/api/v1/files/${fileId}/similar?auth_token=${token}`, {
+		const response = await fetch(`${API_BASE_URL}/api/v1/files/${fileId}/similar?similarityLevels=DUPLICATE,SIMILARITY&auth_token=${token}`, {
 			method: 'GET'
 		});
 

src/app/styles/pages-styles.scss

@@ -2948,6 +2948,11 @@
 			position: relative;
 			overflow: hidden;
 
+			&:disabled {
+				opacity: 0.5;
+				cursor: default;
+			}
+
 			&:hover:not(:disabled) {
 				transform: translateY(-2px);
 				box-shadow: 0 12px 35px rgba(102, 126, 234, 0.4);
@@ -2962,6 +2967,10 @@
 			border-radius: 16px;
 			margin: 20px 0;
 
+			&.show {
+				display: block;
+			}
+
 			.global-spinner {
 				width: 50px;
 				height: 50px;

src/app/ui/search/file-search-panel.tsx

@@ -2,12 +2,14 @@ import { SearchedUserFilesList } from '@/app/ui/search/searched-user-files-list'
 import { SearchedGlobalFilesList } from '@/app/ui/search/searched-global-files-list';
 import { useCallback, useState, useImperativeHandle } from 'react';
 import { searchUserFiles, searchGlobalFiles } from '@/app/actions/fileEntity';
+import { fa } from 'zod/v4/locales';
 
 export function FileSearchPanel({ fileId, ref }: { fileId: string | null, ref: any }) {
 	const [searchedUserFiles, setSearchedUserFiles] = useState<string[]>([]);
 	const [searchedUserFilesShowNull, setSearchedUserFilesShowNull] = useState<boolean>(false);
 	const [searchedGlobalFiles, setSearchedGlobalFiles] = useState<string[]>([]);
 	const [searchedGlobalFilesShowNull, setSearchedGlobalFilesShowNull] = useState<boolean>(false);
+	const [loading, setLoading] = useState<boolean>(false);
 
 	useImperativeHandle(ref, () => ({
 		clearList: () => {
@@ -36,6 +38,10 @@ export function FileSearchPanel({ fileId, ref }: { fileId: string | null, ref: a
 	}, [fileId])
 
 	const handlerSearchGlobalFile = useCallback(async (fileId: string): Promise<void> => {
+		setLoading(true);
+		setSearchedGlobalFilesShowNull(false);
+		setSearchedGlobalFiles([]);
+
 
 		try {
 			let result = await searchGlobalFiles(fileId);
@@ -46,6 +52,8 @@ export function FileSearchPanel({ fileId, ref }: { fileId: string | null, ref: a
 			}
 		} catch (error) {
 
+		} finally {
+			setLoading(false);
 		}
 
 	}, [fileId])
@@ -144,6 +152,7 @@ export function FileSearchPanel({ fileId, ref }: { fileId: string | null, ref: a
 						type="button"
 						className="global-search-btn"
 						id="global-search-btn"
+						disabled={loading ? true : false}
 						onClick={() => {
 							if (fileId) {
 								handlerSearchGlobalFile(fileId)
@@ -153,7 +162,7 @@ export function FileSearchPanel({ fileId, ref }: { fileId: string | null, ref: a
 						Найти в интернете
 					</button>
 
-					<div className="global-loading" id="global-loading">
+					<div className={`global-loading ${loading ? 'show' : ''}`} id="global-loading">
 						<div className="global-spinner"></div>
 						<div className="global-loading-text" id="global-loading-text">
 							Поиск изображений в интернете...