diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index a39a0a1..b4d053a 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -21,7 +21,7 @@ function App() { } /> } /> } /> - } /> + } /> ); diff --git a/frontend/src/components/AppLayout.tsx b/frontend/src/components/AppLayout.tsx index 272539c..2a0c2e0 100644 --- a/frontend/src/components/AppLayout.tsx +++ b/frontend/src/components/AppLayout.tsx @@ -3,12 +3,13 @@ import axios from "axios"; import { Outlet, useLocation, useNavigate } from "react-router-dom"; import StatsStyling from "../styles/stats_styling"; +const API_BASE_URL = import.meta.env.VITE_BACKEND_URL + type ProfileResponse = { user?: Record; }; const styles = StatsStyling; -const API_BASE_URL = "http://localhost:5000"; const getUserLabel = (user: Record | null) => { if (!user) { diff --git a/frontend/src/pages/DatasetStatus.tsx b/frontend/src/pages/DatasetStatus.tsx index 04837ca..8421125 100644 --- a/frontend/src/pages/DatasetStatus.tsx +++ b/frontend/src/pages/DatasetStatus.tsx @@ -3,6 +3,8 @@ import axios from "axios"; import { useNavigate, useParams } from "react-router-dom"; import StatsStyling from "../styles/stats_styling"; +const API_BASE_URL = import.meta.env.VITE_BACKEND_URL + type DatasetStatusResponse = { status?: "processing" | "complete" | "error"; status_message?: string | null; @@ -10,7 +12,6 @@ type DatasetStatusResponse = { }; const styles = StatsStyling; -const API_BASE_URL = "http://localhost:5000"; const DatasetStatusPage = () => { const navigate = useNavigate(); @@ -43,7 +44,7 @@ const DatasetStatusPage = () => { if (nextStatus === "complete") { window.setTimeout(() => { - navigate("/stats", { replace: true }); + navigate(`/dataset/${parsedDatasetId}/stats`, { replace: true }); }, 800); } } catch (error: unknown) { diff --git a/frontend/src/pages/Login.tsx b/frontend/src/pages/Login.tsx index 4916eee..65ff0c6 100644 --- a/frontend/src/pages/Login.tsx +++ b/frontend/src/pages/Login.tsx @@ -3,8 +3,9 @@ import axios from "axios"; import { useNavigate } from "react-router-dom"; import StatsStyling from "../styles/stats_styling"; +const API_BASE_URL = import.meta.env.VITE_BACKEND_URL + const styles = StatsStyling; -const API_BASE_URL = "http://localhost:5000"; const controlStyle = { width: "100%", maxWidth: "100%", diff --git a/frontend/src/pages/Stats.tsx b/frontend/src/pages/Stats.tsx index b8a68b5..cd46a7a 100644 --- a/frontend/src/pages/Stats.tsx +++ b/frontend/src/pages/Stats.tsx @@ -1,5 +1,6 @@ import { useEffect, useState, useRef } from "react"; import axios from "axios"; +import { useParams } from "react-router-dom"; import StatsStyling from "../styles/stats_styling"; import SummaryStats from "../components/SummaryStats"; import EmotionalStats from "../components/EmotionalStats"; @@ -12,9 +13,11 @@ import { type ContentAnalysisResponse } from '../types/ApiTypes' +const API_BASE_URL = import.meta.env.VITE_BACKEND_URL const styles = StatsStyling; const StatPage = () => { + const { datasetId: routeDatasetId } = useParams<{ datasetId: string }>(); const [error, setError] = useState(''); const [loading, setLoading] = useState(false); const [activeView, setActiveView] = useState<"summary" | "emotional" | "interaction">("summary"); @@ -29,15 +32,73 @@ const StatPage = () => { const beforeDateRef = useRef(null); const afterDateRef = useRef(null); - const getStats = () => { + const parsedDatasetId = Number(routeDatasetId ?? ""); + const datasetId = Number.isInteger(parsedDatasetId) && parsedDatasetId > 0 ? parsedDatasetId : null; + + const getFilterParams = () => { + const params: Record = {}; + const query = (searchInputRef.current?.value ?? "").trim(); + const start = (afterDateRef.current?.value ?? "").trim(); + const end = (beforeDateRef.current?.value ?? "").trim(); + + if (query) { + params.search_query = query; + } + + if (start) { + params.start_date = start; + } + + if (end) { + params.end_date = end; + } + + return params; + }; + + const getAuthHeaders = () => { + const token = localStorage.getItem("access_token"); + if (!token) { + return null; + } + + return { + Authorization: `Bearer ${token}`, + }; + }; + + const getStats = (params: Record = {}) => { + if (!datasetId) { + setError("Missing dataset id. Open /dataset//stats."); + return; + } + + const authHeaders = getAuthHeaders(); + if (!authHeaders) { + setError("You must be signed in to load stats."); + return; + } + setError(""); setLoading(true); Promise.all([ - axios.get("http://localhost:5000/stats/time"), - axios.get("http://localhost:5000/stats/user"), - axios.get("http://localhost:5000/stats/content"), - axios.get(`http://localhost:5000/stats/summary`), + axios.get(`${API_BASE_URL}/dataset/${datasetId}/time`, { + params, + headers: authHeaders, + }), + axios.get(`${API_BASE_URL}/dataset/${datasetId}/user`, { + params, + headers: authHeaders, + }), + axios.get(`${API_BASE_URL}/dataset/${datasetId}/content`, { + params, + headers: authHeaders, + }), + axios.get(`${API_BASE_URL}/dataset/${datasetId}/summary`, { + params, + headers: authHeaders, + }), ]) .then(([timeRes, userRes, contentRes, summaryRes]) => { setUserData(userRes.data || null); @@ -50,35 +111,30 @@ const StatPage = () => { }; const onSubmitFilters = () => { - const query = searchInputRef.current?.value ?? ""; - - Promise.all([ - axios.post("http://localhost:5000/filter/search", { - query: query - }), - ]) - .then(() => { - getStats(); - }) - .catch(e => { - setError("Failed to load filters: " + e.response); - }) + getStats(getFilterParams()); }; const resetFilters = () => { - axios.get("http://localhost:5000/filter/reset") - .then(() => { - getStats(); - }) - .catch(e => { - setError(e); - }) + if (searchInputRef.current) { + searchInputRef.current.value = ""; + } + if (beforeDateRef.current) { + beforeDateRef.current.value = ""; + } + if (afterDateRef.current) { + afterDateRef.current.value = ""; + } + getStats(); }; useEffect(() => { setError(""); + if (!datasetId) { + setError("Missing dataset id. Open /dataset//stats."); + return; + } getStats(); - }, []) + }, [datasetId]) if (loading) return

Loading insights…

; if (error) return

{error}

; @@ -118,8 +174,9 @@ return ( -
Analytics Dashboard
- +
Analytics Dashboard
+
Dataset #{datasetId ?? "-"}
+