add translate and colors for matched status

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "no-copy-frontend",
-	"version": "0.71.0",
+	"version": "0.72.0",
 	"private": true,
 	"scripts": {
 		"dev": "next dev -p 2999",

src/app/styles/pages-styles.scss

@@ -4474,11 +4474,25 @@
 				font-size: 11px;
 				font-weight: 600;
 				white-space: nowrap;
-				margin-left: 10px;
+				margin-bottom: 5px;
 
-				&.new {
+				&.new,
-					background: #fef2f2;
+				&.created {
-					color: #dc2626;
+					background: v.$status-new;
+				}
+
+				&.showed {
+					background-color: v.$b-color-1;
+				}
+
+				&.legal_in_work,
+				&.complaint_in_work {
+					background: v.$status-in-work;
+					color: v.$white;
+				}
+
+				&.authorized_use {
+					background: v.$authorized-use;
 				}
 			}
 
@@ -4614,7 +4628,7 @@
 				}
 			}
 
-/* 			.btn-warning {
+			/* 			.btn-warning {
 				background: linear-gradient(135deg, #f59e0b, #d97706);
 				color: white;
 			}

src/app/styles/variable.scss

@@ -21,6 +21,11 @@ $color-video: #2f9e44;
 $color-audio: #1971c2;
 $color-document: #a561e6;
 
+$status-new: #fab005;
+$status-showed: #5a6e8a;
+$status-in-work: #3b82f6;
+$authorized-use: #2ecc71;
+
 :root {
 	--side-bar-width: 280px;
 

src/app/ui/file-page/violation-table/file-page-violations-list.tsx

@@ -17,6 +17,7 @@ export default function FilePageViolationsList({
 	fileId: string
 }) {
 	const t = useTranslations('Global');
+	const tStatus = useTranslations('Match-status');
 	const router = useRouter();
 	const pathname = usePathname();
 	const [selectedViolation, setSelectedViolation] = useState<ViolationFileDetail | null>(null);
@@ -104,9 +105,20 @@ export default function FilePageViolationsList({
 								<div
 									className="source-header-right"
 								>
-									<span className="source-status new">
+									{item.status === "COMPLAINT_AND_LEGAL_IN_WORK" ? (
-										{item.status}
+										<>
-									</span>
+											<span className="source-status legal_in_work">
+												{t('legal_in_work')}
+											</span>
+											<span className="source-status complaint_in_work">
+												{t('complaint_in_work')}
+											</span>
+										</>
+									) : (
+										<span className={`source-status ${item.status.toLowerCase()}`}>
+											{tStatus(item.status)}
+										</span>
+									)}
 
 									<div className="source-actions">
 										<Link

src/i18n/messages/en.json

@@ -470,5 +470,14 @@
 		"NONE": "Without monitoring",
 		"the-file-is monitored": "Monitoring is set for the \"{fileName}\" file",
 		"failed-to-establish-monitoring": "Failed to establish monitoring"
+	},
+	"Match-status": {
+		"NEW": "New",
+		"SHOWED": "Viewed",
+		"LEGAL_IN_WORK": "Legal in work",
+		"COMPLAINT_IN_WORK": "Complaint in work",
+		"COMPLAINT_AND_LEGAL_IN_WORK": "Complaint and legal in work",
+		"AUTHORIZED_USE": "Authorized use",
+		"CREATED": "New"
 	}
 }

src/i18n/messages/ru.json

@@ -470,5 +470,14 @@
 		"NONE": "Без мониторинга",
 		"the-file-is monitored": "Для файла \"{fileName}\" установлен мониторинг",
 		"failed-to-establish-monitoring": "Не удалось установить мониторинг"
+	},
+	"Match-status": {
+		"NEW": "Новый",
+		"SHOWED": "Просмотрен",
+		"LEGAL_IN_WORK": "Дело в работе",
+		"COMPLAINT_IN_WORK": "Жалоба в работе",
+		"COMPLAINT_AND_LEGAL_IN_WORK": "Дело и жалоба в работе",
+		"AUTHORIZED_USE": "Разрешенное использование",
+		"CREATED": "Новый"
 	}
 }