Spaces:

aknouce94
/

cybersleuth-prodigy

Running

App Files Files Community

aknouce94 commited on Sep 30

Commit

b304bbf

verified ·

1 Parent(s): 3cbb053

# HTS Investigation Suite - Dockerfile Frontend React

Browse files

# HIGH TECH SECURITY - Production Frontend Container

# Stage 1: Build React App
FROM node:18-alpine AS builder

# Métadonnées
LABEL maintainer="HIGH TECH SECURITY <contact@hts-investigation.com>"
LABEL version="2.1.0"
LABEL description="HTS Investigation Suite Frontend"

# Variables d'environnement de build
ENV NODE_ENV=production
ENV REACT_APP_API_URL=http://localhost:8000
ENV REACT_APP_COMPANY_NAME="HIGH TECH SECURITY"
ENV REACT_APP_COMPANY_ADDRESS="203-205 The Vale, London W3 7QS, United Kingdom"
ENV REACT_APP_COMPANY_NUMBER="7849187"
ENV REACT_APP_POLICY_NUMBER="550.232.804"
ENV REACT_APP_VERSION="2.1.0"

WORKDIR /app

# Installation dépendances
COPY package*.json ./
RUN npm ci --only=production

# Copie du code source
COPY . .

# Build optimisé pour production
RUN npm run build

# Stage 2: Production Nginx
FROM nginx:alpine

# Installation utilitaires
RUN apk add --no-cache curl

# Configuration Nginx optimisée
COPY nginx-frontend.conf /etc/nginx/conf.d/default.conf

# Copie des fichiers buildés
COPY --from=builder /app/build /usr/share/nginx/html

# Page d'information HTS
RUN echo '<!DOCTYPE html>
<html>
<head>
<title>HIGH TECH SECURITY - HTS Investigation Suite</title>
<meta charset="UTF-8">
<style>
body { font-family: Arial, sans-serif; margin: 40px; background: #f5f5f5; }
.container { max-width: 800px; margin: 0 auto; background: white; padding: 40px; border-radius: 10px; box-shadow: 0 0 20px rgba(0,0,0,0.1); }
.logo { text-align: center; margin-bottom: 30px; }
.logo h1 { color: #2563eb; margin: 0; font-size: 2.5em; }
.logo p { color: #666; margin: 5px 0; }
.info { background: #f8fafc; padding: 20px; border-radius: 8px; margin: 20px 0; }
.contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-top: 30px; }
.contact-item { background: #e5e7eb; padding: 15px; border-radius: 8px; }
.status { background: #dcfce7; border: 1px solid #bbf7d0; color: #166534; padding: 15px; border-radius: 8px; text-align: center; margin: 20px 0; }
</style>
</head>
<body>
<div class="container">
<div class="logo">
<h1>🛡️ HIGH TECH SECURITY</h1>
<p>HTS Investigation Suite v2.1.0</p>
<p>Solutions Anti-Fraude pour Administrations</p>
</div>

<div class="status">
<strong>✅ Système opérationnel</strong> - Tous les services sont en ligne
</div>

<div class="info">
<h3>À propos</h3>
<p>HTS Investigation Suite est une solution complète d\'investigation et de détection de fraudes développée par HIGH TECH SECURITY pour les administrations publiques.</p>
<p><strong>Fonctionnalités principales :</strong></p>
<ul>
<li>🧠 Analyse IA DarkBERT (BERT/ALBERT/RoBERTa)</li>
<li>🔍 Investigation modules spécialisés</li>
<li>🛡️ Sécurité maximale et chiffrement E2E</li>
<li>📊 Monitoring temps réel</li>
<li>⚖️ Conformité RGPD et ISO 27001</li>
</ul>
</div>

<div class="contact">
<div class="contact-item">
<h4>🏢 Siège Social</h4>
<p><strong>HIGH TECH SECURITY</strong><br>
203-205 The Vale<br>
London W3 7QS<br>
United Kingdom</p>
</div>

<div class="contact-item">
<h4>📞 Contacts</h4>
<p><strong>UK:</strong> +44 7591 665201<br>
<strong>Espagne:</strong> +34 673 075445<br>
<strong>USA:</strong> +1 302 579 0159<br>
<strong>Email:</strong> contact@hts-investigation.com</p>
</div>

<div class="contact-item">
<h4>📋 Informations Légales</h4>
<p><strong>Company Number:</strong> 7849187<br>
<strong>Policy Number:</strong> 550.232.804<br>
<strong>Certifications:</strong> ISO 27001<br>
<strong>Conformité:</strong> RGPD</p>
</div>
</div>

<div class="info" style="text-align: center; margin-top: 30px;">
<p><strong>Accès sécurisé réservé aux administrations autorisées</strong></p>
<p>Support technique 24/7 disponible</p>
</div>
</div>
</body>
</html>' > /usr/share/nginx/html/info.html

# Health check
HEALTHCHECK --interval=30s --timeout=10s --start-period=5s --retries=3 \
CMD curl -f http://localhost/ || exit 1

# Exposition du port
EXPOSE 80

# Démarrage Nginx
CMD ["nginx", "-g", "daemon off;"]

Files changed (3) hide show

darkbert.html +150 -0
index.html +11 -11
investigations.html +88 -0

darkbert.html ADDED Viewed

	@@ -0,0 +1,150 @@

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>DarkBERT Analysis | HTS Investigation Suite</title>
+    <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://unpkg.com/feather-icons"></script>
+    <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Rubik:wght@300;400;500;600;700&display=swap');
+        body {
+            font-family: 'Rubik', sans-serif;
+        }
+        .code-font {
+            font-family: 'JetBrains Mono', monospace;
+        }
+        .vanta-canvas {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            z-index: 0;
+            opacity: 0.15;
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <div id="vanta-bg" class="vanta-canvas"></div>
+    <!-- Header -->
+    <header class="relative z-10 bg-white shadow-lg border-b border-gray-200">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center space-x-4">
+                    <div class="bg-blue-600 p-2 rounded-lg">
+                        <i data-feather="shield" class="text-white w-6 h-6"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-2xl font-bold text-gray-900">HIGH TECH SECURITY</h1>
+                        <p class="text-sm text-gray-600">HTS Investigation Suite v2.1</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex items-center space-x-6">
+                    <div class="text-right">
+                        <div class="text-gray-600">203-205 The Vale, London W3 7QS</div>
+                        <div class="text-gray-600">UK: +44 7591 665201 | Company: 7849187</div>
+                    </div>
+                    <div class="flex items-center space-x-2">
+                        <i data-feather="lock" class="w-5 h-5 text-green-500"></i>
+                        <span class="text-sm text-green-600 font-medium">Sécurisé</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </header>
+    <!-- Navigation -->
+    <nav class="relative z-10 bg-gray-800 text-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex space-x-1 overflow-x-auto py-2 hide-scrollbar">
+                <a href="/" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="trending-up" class="w-4 h-4"></i>
+                    <span>Dashboard</span>
+                </a>
+                <a href="/darkbert" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-blue-400 text-blue-400 transition-colors">
+                    <i data-feather="brain" class="w-4 h-4"></i>
+                    <span>DarkBERT Analysis</span>
+                </a>
+                <a href="/investigations" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="search" class="w-4 h-4"></i>
+                    <span>Investigations</span>
+                </a>
+                <a href="/monitoring" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="eye" class="w-4 h-4"></i>
+                    <span>Monitoring</span>
+                </a>
+            </div>
+        </div>
+    </nav>
+    <!-- Main Content -->
+    <main class="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+        <div class="bg-white rounded-xl shadow-lg p-6 mb-8">
+            <h2 class="text-2xl font-bold text-gray-900 mb-6">DarkBERT Secure Analysis</h2>
+            <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                <div class="space-y-4">
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 mb-2">Client Type</label>
+                        <select class="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
+                            <option value="police">Police Forces</option>
+                            <option value="fiscal">Tax Administration</option>
+                            <option value="customs">Customs Services</option>
+                            <option value="court">Courts</option>
+                        </select>
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 mb-2">Investigation Title</label>
+                        <input type="text" placeholder="Ex: Criminal Network Investigation 2025" class="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
+                    </div>
+                    <div>
+                        <label class="block text-sm font-medium text-gray-700 mb-2">AI Model</label>
+                        <select class="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
+                            <option value="bert">BERT (Fast - 94.2%)</option>
+                            <option value="albert">ALBERT (Very Fast - 91.8%)</option>
+                            <option value="roberta">RoBERTa (Accurate - 96.1%)</option>
+                        </select>
+                    </div>
+                </div>
+                <div>
+                    <label class="block text-sm font-medium text-gray-700 mb-2">Documents to Analyze (one per line)</label>
+                    <textarea placeholder="Insert your documents here, one per line..." class="w-full h-40 p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 font-mono text-sm"></textarea>
+                    <p class="text-xs text-gray-500 mt-1">0 documents | Minimum 3 documents required</p>
+                </div>
+            </div>
+            <div class="mt-6 flex gap-4">
+                <button class="flex-1 bg-blue-600 hover:bg-blue-700 text-white font-semibold py-3 px-6 rounded-lg transition-colors flex items-center justify-center gap-2">
+                    <i data-feather="brain" class="w-5 h-5"></i>
+                    Run DarkBERT Analysis
+                </button>
+            </div>
+        </div>
+    </main>
+    <script>
+        feather.replace();
+        VANTA.GLOBE({
+            el: "#vanta-bg",
+            mouseControls: true,
+            touchControls: true,
+            gyroControls: false,
+            minHeight: 200.00,
+            minWidth: 200.00,
+            scale: 1.00,
+            scaleMobile: 1.00,
+            color: 0x3b82f6,
+            backgroundColor: 0xf8fafc,
+            size: 0.8
+        });
+    </script>
+</body>
+</html>

index.html CHANGED Viewed

@@ -84,19 +84,19 @@
     <nav class="relative z-10 bg-gray-800 text-white">
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex space-x-1 overflow-x-auto py-2 hide-scrollbar">
-                <a href="#" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-blue-400 text-blue-400 transition-colors">
                     <i data-feather="trending-up" class="w-4 h-4"></i>
                     <span>Dashboard</span>
                 </a>
-                <a href="#" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="brain" class="w-4 h-4"></i>
                     <span>DarkBERT Analysis</span>
                 </a>
-                <a href="#" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="search" class="w-4 h-4"></i>
                     <span>Investigations</span>
                 </a>
-                <a href="#" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="eye" class="w-4 h-4"></i>
                     <span>Monitoring</span>
                 </a>
@@ -231,19 +231,19 @@
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
                 <h3 class="text-lg font-semibold text-gray-900 mb-4">Start New Analysis</h3>
                 <p class="text-sm text-gray-600 mb-4">Initiate DarkBERT analysis with documents or text input</p>
-                <button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg flex items-center justify-center space-x-2">
                     <i data-feather="brain" class="w-4 h-4"></i>
                     <span>Launch DarkBERT Analysis</span>
-                </button>
 </div>
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
                 <h3 class="text-lg font-semibold text-gray-900 mb-4">Recent Investigations</h3>
                 <div class="space-y-2">
-                    <a href="#" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Operation Midnight</a>
-                    <a href="#" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Sigma Protocol</a>
-                    <a href="#" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Phoenix Network</a>
-                </div>
             </div>
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
@@ -265,9 +265,9 @@
             </div>
         </div>
     </main>
     <script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
     <script>
 feather.replace();
         VANTA.GLOBE({
             el: "#vanta-bg",

     <nav class="relative z-10 bg-gray-800 text-white">
         <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
             <div class="flex space-x-1 overflow-x-auto py-2 hide-scrollbar">
+                <a href="/" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-blue-400 text-blue-400 transition-colors">
                     <i data-feather="trending-up" class="w-4 h-4"></i>
                     <span>Dashboard</span>
                 </a>
+                <a href="/darkbert" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="brain" class="w-4 h-4"></i>
                     <span>DarkBERT Analysis</span>
                 </a>
+                <a href="/investigations" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="search" class="w-4 h-4"></i>
                     <span>Investigations</span>
                 </a>
+                <a href="/monitoring" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
                     <i data-feather="eye" class="w-4 h-4"></i>
                     <span>Monitoring</span>
                 </a>
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
                 <h3 class="text-lg font-semibold text-gray-900 mb-4">Start New Analysis</h3>
                 <p class="text-sm text-gray-600 mb-4">Initiate DarkBERT analysis with documents or text input</p>
+                <a href="/darkbert" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg flex items-center justify-center space-x-2">
                     <i data-feather="brain" class="w-4 h-4"></i>
                     <span>Launch DarkBERT Analysis</span>
+                </a>
 </div>
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
                 <h3 class="text-lg font-semibold text-gray-900 mb-4">Recent Investigations</h3>
                 <div class="space-y-2">
+                    <a href="/investigations/operation-midnight" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Operation Midnight</a>
+                    <a href="/investigations/sigma-protocol" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Sigma Protocol</a>
+                    <a href="/investigations/phoenix-network" class="block p-2 hover:bg-gray-50 rounded-lg text-sm">Phoenix Network</a>
+</div>
             </div>
             <div class="bg-white rounded-xl shadow-lg p-6 border border-gray-200">
             </div>
         </div>
     </main>
     <script src="https://cdn.jsdelivr.net/npm/animejs@3.2.1/lib/anime.min.js"></script>
     <script>
+        // Initialize Vanta.js globe effect
 feather.replace();
         VANTA.GLOBE({
             el: "#vanta-bg",

investigations.html ADDED Viewed

	@@ -0,0 +1,88 @@

+```html
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Investigations | HTS Investigation Suite</title>
+    <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://unpkg.com/feather-icons"></script>
+    <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Rubik:wght@300;400;500;600;700&display=swap');
+        body {
+            font-family: 'Rubik', sans-serif;
+        }
+        .vanta-canvas {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            z-index: 0;
+            opacity: 0.15;
+        }
+    </style>
+</head>
+<body class="bg-gray-50">
+    <div id="vanta-bg" class="vanta-canvas"></div>
+    <!-- Header -->
+    <header class="relative z-10 bg-white shadow-lg border-b border-gray-200">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
+            <div class="flex items-center justify-between">
+                <div class="flex items-center space-x-4">
+                    <div class="bg-blue-600 p-2 rounded-lg">
+                        <i data-feather="shield" class="text-white w-6 h-6"></i>
+                    </div>
+                    <div>
+                        <h1 class="text-2xl font-bold text-gray-900">HIGH TECH SECURITY</h1>
+                        <p class="text-sm text-gray-600">HTS Investigation Suite v2.1</p>
+                    </div>
+                </div>
+                <div class="hidden md:flex items-center space-x-6">
+                    <div class="text-right">
+                        <div class="text-gray-600">203-205 The Vale, London W3 7QS</div>
+                        <div class="text-gray-600">UK: +44 7591 665201 | Company: 7849187</div>
+                    </div>
+                    <div class="flex items-center space-x-2">
+                        <i data-feather="lock" class="w-5 h-5 text-green-500"></i>
+                        <span class="text-sm text-green-600 font-medium">Sécurisé</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </header>
+    <!-- Navigation -->
+    <nav class="relative z-10 bg-gray-800 text-white">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex space-x-1 overflow-x-auto py-2 hide-scrollbar">
+                <a href="/" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="trending-up" class="w-4 h-4"></i>
+                    <span>Dashboard</span>
+                </a>
+                <a href="/darkbert" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="brain" class="w-4 h-4"></i>
+                    <span>DarkBERT Analysis</span>
+                </a>
+                <a href="/investigations" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-blue-400 text-blue-400 transition-colors">
+                    <i data-feather="search" class="w-4 h-4"></i>
+                    <span>Investigations</span>
+                </a>
+                <a href="/monitoring" class="flex items-center space-x-2 px-4 py-3 border-b-2 border-transparent hover:border-gray-600 transition-colors">
+                    <i data-feather="eye" class="w-4 h-4"></i>
+                    <span>Monitoring</span>
+                </a>
+            </div>
+        </div>
+    </nav>
+    <!-- Main Content -->
+    <main class="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
+        <div class="bg-white rounded-xl shadow-lg p-6 mb-8">
+            <div class="flex items-center justify-between mb-6">
+                <h2 class="text-2xl font-bold text-gray-900">Active Investigations</h2>
+                <button class="bg-blue-600 hover:bg-blue-700