+
-
{getPageTitle('Starter Page')}
+
{getPageTitle('AI Cybersecurity Assistant')}
+
-
-
- {contentType === 'image' && contentPosition !== 'background'
- ? imageBlock(illustrationImage)
- : null}
- {contentType === 'video' && contentPosition !== 'background'
- ? videoBlock(illustrationVideo)
- : null}
-
-
-
-
© 2026 {title} . All rights reserved
-
- Privacy Policy
+
+
+
+
+
+
+
+
+
+
+ Local-first threat intelligence
+
+
+ Explainable AI for phishing and malware defense.
+
+
+ A modern cybersecurity assistant for individuals, schools, businesses, and public-sector teams: submit a suspicious message,
+ link, file signal, or network behavior and get a saved risk verdict with clear reasons.
+
+
+
+
+
+ 0
+ external AI calls
+
+
+ 100
+ risk scale
+
+
+ SHA-256
+ fingerprinting
+
+
+
+
+
+
+
+
+
Live workflow
+
Threat Analyzer
+
+
High
+
+
+
Suspicious invoice request
+
“Urgent — verify your password within 24 hours. Open the attachment and enable macros.”
+
+
+
+ Risk score
+ 81/100
+
+
+
+
+ {['Credential request', 'Urgent pressure', 'Macro lure', 'Brand impersonation'].map((item) => (
+
+ {item}
+
+ ))}
+
+
+
+
+
+
+
+
+
MVP slice implemented
+
A complete first workflow, not just a dashboard.
+
+ Sign in to use the protected analyzer, create a detection, see the verdict, review explanations, and reopen recent analysis history.
+
+
+
+ {capabilities.map((item) => (
+
+
+
+
{item.title}
+
{item.text}
+
+ ))}
+
+
+
+
+
+ © 2026 SentinelAI. Built for ethical, explainable, privacy-aware cybersecurity workflows.{' '}
+
- );
+ )
}
Starter.getLayout = function getLayout(page: ReactElement) {
- return
{page} ;
-};
+ return
{page}
+}
+export default Starter
diff --git a/frontend/src/pages/search.tsx b/frontend/src/pages/search.tsx
index 00f5168..005eb07 100644
--- a/frontend/src/pages/search.tsx
+++ b/frontend/src/pages/search.tsx
@@ -1,9 +1,7 @@
import React, { ReactElement, useEffect, useState } from 'react';
import Head from 'next/head';
import 'react-datepicker/dist/react-datepicker.css';
-import { useAppDispatch } from '../stores/hooks';
-
-import { useAppSelector } from '../stores/hooks';
+import { useAppDispatch, useAppSelector } from '../stores/hooks';
import { useRouter } from 'next/router';
import LayoutAuthenticated from '../layouts/Authenticated';
diff --git a/frontend/src/pages/threat-analyzer.tsx b/frontend/src/pages/threat-analyzer.tsx
new file mode 100644
index 0000000..74ac008
--- /dev/null
+++ b/frontend/src/pages/threat-analyzer.tsx
@@ -0,0 +1,400 @@
+import { mdiBrain, mdiRadar, mdiShieldAlert } from '@mdi/js'
+import Head from 'next/head'
+import React, { FormEvent, ReactElement, useEffect, useMemo, useState } from 'react'
+import axios from 'axios'
+import BaseButton from '../components/BaseButton'
+import CardBox from '../components/CardBox'
+import LayoutAuthenticated from '../layouts/Authenticated'
+import SectionMain from '../components/SectionMain'
+import SectionTitleLineWithButton from '../components/SectionTitleLineWithButton'
+import BaseIcon from '../components/BaseIcon'
+import { getPageTitle } from '../config'
+
+type SubmissionType = 'email' | 'message' | 'url' | 'file' | 'network_traffic'
+
+type Indicator = {
+ label: string
+ weight: number
+}
+
+type Detection = {
+ id: string
+ threat_type: string
+ severity: string
+ risk_score: number | string
+ verdict: string
+ summary: string
+ detected_at?: string
+ submission?: {
+ title?: string
+ submission_type?: string
+ processing_location?: string
+ sha256?: string
+ }
+ explanations_detection?: Array<{
+ explanation_text?: string
+ top_indicators?: string
+ confidence?: number | string
+ }>
+}
+
+type AnalysisResponse = {
+ detection: Detection
+ indicators: Indicator[]
+ explanation: {
+ explanation_text?: string
+ confidence?: number | string
+ }
+ privacy: {
+ mode: string
+ sha256: string
+ }
+}
+
+const typeOptions: Array<{ value: SubmissionType; label: string; helper: string }> = [
+ { value: 'email', label: 'Email', helper: 'Paste headers or body text.' },
+ { value: 'message', label: 'Message', helper: 'Analyze SMS, chat, or DM copy.' },
+ { value: 'url', label: 'Website / URL', helper: 'Inspect a suspicious link.' },
+ { value: 'file', label: 'File metadata', helper: 'Use name, hash, and observed behavior.' },
+ { value: 'network_traffic', label: 'Network activity', helper: 'Summarize ports, domains, and process behavior.' },
+]
+
+const severityStyles: Record
= {
+ critical: 'bg-red-600 text-white ring-red-300',
+ high: 'bg-orange-500 text-white ring-orange-300',
+ medium: 'bg-amber-400 text-slate-950 ring-amber-200',
+ low: 'bg-sky-500 text-white ring-sky-200',
+ info: 'bg-emerald-500 text-white ring-emerald-200',
+}
+
+const getIndicatorList = (detection?: Detection, fallback: Indicator[] = []) => {
+ if (fallback.length) return fallback
+ const raw = detection?.explanations_detection?.[0]?.top_indicators
+ if (!raw) return []
+
+ try {
+ const parsed = JSON.parse(raw)
+ return Array.isArray(parsed) ? parsed : []
+ } catch (error) {
+ console.error('Failed to parse threat indicators:', error)
+ return []
+ }
+}
+
+const ThreatAnalyzerPage = () => {
+ const [submissionType, setSubmissionType] = useState('email')
+ const [title, setTitle] = useState('Suspicious invoice request')
+ const [content, setContent] = useState(
+ 'Urgent: verify your Microsoft password within 24 hours or your account will be closed. Open the attachment and enable macros.',
+ )
+ const [url, setUrl] = useState('')
+ const [fileName, setFileName] = useState('')
+ const [sha256, setSha256] = useState('')
+ const [networkActivity, setNetworkActivity] = useState('')
+ const [privacyMode, setPrivacyMode] = useState(true)
+ const [isSubmitting, setIsSubmitting] = useState(false)
+ const [errorMessage, setErrorMessage] = useState('')
+ const [result, setResult] = useState(null)
+ const [recent, setRecent] = useState([])
+ const [selectedDetection, setSelectedDetection] = useState(null)
+
+ const activeHelper = useMemo(
+ () => typeOptions.find((item) => item.value === submissionType)?.helper,
+ [submissionType],
+ )
+
+ const loadRecent = async () => {
+ const response = await axios.get('/threat_detections/assistant/recent?limit=8')
+ setRecent(Array.isArray(response.data?.rows) ? response.data.rows : [])
+ }
+
+ useEffect(() => {
+ loadRecent().catch((error) => {
+ console.error('Failed to load recent detections:', error)
+ })
+ }, [])
+
+ const selectedOrResult = selectedDetection || result?.detection || null
+ const indicators = getIndicatorList(selectedDetection || undefined, selectedDetection ? [] : result?.indicators || [])
+ const riskScore = selectedOrResult ? Number(selectedOrResult.risk_score || 0) : 0
+
+ const handleSubmit = async (event: FormEvent) => {
+ event.preventDefault()
+ setErrorMessage('')
+ setSelectedDetection(null)
+ setIsSubmitting(true)
+
+ try {
+ const response = await axios.post('/threat_detections/analyze', {
+ data: {
+ submission_type: submissionType,
+ title,
+ content_text: content,
+ url,
+ fileName,
+ sha256,
+ network_activity: networkActivity,
+ privacy_mode: privacyMode,
+ },
+ })
+ setResult(response.data)
+ await loadRecent()
+ } catch (error) {
+ console.error('Threat analysis failed:', error)
+ if (axios.isAxiosError(error)) {
+ setErrorMessage(error.response?.data?.message || 'Analysis failed. Please check the input and try again.')
+ } else {
+ setErrorMessage('Analysis failed. Please check the input and try again.')
+ }
+ } finally {
+ setIsSubmitting(false)
+ }
+ }
+
+ return (
+ <>
+
+ {getPageTitle('Threat Analyzer')}
+
+
+
+
+
+
+
+
+
+
+
+
Local-first triage
+
Analyze suspicious content
+
+ Submit an email, link, file signal, or network observation. The assistant creates a saved detection,
+ risk score, verdict, and explanation without calling an external AI provider.
+
+
+
+
+
+
Indicators are stored with every result for review and tuning.
+
+
+
+