change selected files translate and add count

src/app/components/tanstak-table/SelectedFilesActions.tsx

@@ -26,23 +26,32 @@ export function SelectedFilesAction({ filesId, callBack }: { filesId: Set<string
 		<div
 			className="selected-files-wrapper"
 		>
+			<div
+				className="selected-files-count"
+			>
+				{t('selected-files')}: {filesId.size}
+			</div>
 
-			<button
-				className="btn btn-primary"
-				onClick={() => {
-					downloadHandler();
-				}}
+			<div
+				className="selected-files-action"
 			>
-				{t('download')}
-			</button>
-			<button
-				className="btn btn-primary"
-				onClick={() => {
-					clearHandler();
-				}}
-			>
-				{t('cancel')}
-			</button>
+				<button
+					className="btn btn-primary"
+					onClick={() => {
+						downloadHandler();
+					}}
+				>
+					{t('download-all')}
+				</button>
+				<button
+					className="btn btn-primary"
+					onClick={() => {
+						clearHandler();
+					}}
+				>
+					{t('deselect')}
+				</button>
+			</div>
 		</div>
 	)
 }

src/app/styles/pages-styles.scss

@@ -788,6 +788,7 @@
 
 				&:has(.table-item-checkbox) {
 					padding: 0;
+					cursor: pointer;
 
 					.column {
 						padding: 15px 16px;
@@ -855,6 +856,7 @@
 
 				&:has(.table-item-checkbox) {
 					padding: 0;
+					cursor: pointer;
 
 					.table-item {
 						padding: 15px 16px;
@@ -5088,15 +5090,24 @@
 	left: calc(50% + (var(--side-bar-width) / 2));
 	transform: translateX(-50%);
 
-	display: flex;
-	gap: 10px;
-
 	background: v.$white;
 	border-radius: 20px;
 	padding: 20px 25px;
 	box-shadow: 0 4px 20px v.$shadow-1;
 	border: 1px solid v.$b-color-1;
 
+	.selected-files-action {
+		display: flex;
+		gap: 10px;
+	}
+
+	.selected-files-count {
+		text-align: center;
+		margin-bottom: 10px;
+		font-size: 18px;
+		font-weight: 600;
+	}
+
 	.btn-primary {
 		background: #2b7fff;
 		padding: 10px 16px;