diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 92889fe..b7b1726 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,50 +1,14 @@
-import axios from 'axios'
-import './App.css'
-import { useState } from 'react'
+import { Routes, Route } from "react-router-dom";
+import UploadPage from "./pages/Upload";
+import StatPage from "./pages/Stats";
function App() {
- let postFile: File | undefined
- let commentFile: File | undefined
- const [returnMessage, setReturnMessage] = useState('')
-
- const uploadFiles = async () => {
- if (!postFile || !commentFile) {
- alert('Please select both files before uploading.')
- return
- }
-
- const formData = new FormData()
- formData.append('posts', postFile)
- formData.append('comments', commentFile)
-
- try {
- const response = await axios.post('http://localhost:5000/upload', formData, {
- headers: {
- 'Content-Type': 'multipart/form-data',
- },
- })
- console.log('Files uploaded successfully:', response.data)
- setReturnMessage(`Upload successful! Posts: ${response.data.posts_count}, Comments: ${response.data.comments_count}`)
- } catch (error) {
- console.error('Error uploading files:', error)
- setReturnMessage('Error uploading files. Error details: ' + error)
- }
- }
return (
-
-
-
Posts File
- postFile = e.target.files?.[0]}>
-
-
-
Comments File
- commentFile = e.target.files?.[0]}>
-
-
-
-
{returnMessage}
-
- )
+
+ } />
+ } />
+
+ );
}
-export default App
+export default App;
diff --git a/frontend/src/pages/Stats.tsx b/frontend/src/pages/Stats.tsx
new file mode 100644
index 0000000..ef4d445
--- /dev/null
+++ b/frontend/src/pages/Stats.tsx
@@ -0,0 +1,5 @@
+const StatPage = () => {
+ return Stats Page
;
+};
+
+export default StatPage;
\ No newline at end of file
diff --git a/frontend/src/pages/Upload.tsx b/frontend/src/pages/Upload.tsx
new file mode 100644
index 0000000..d72f9f0
--- /dev/null
+++ b/frontend/src/pages/Upload.tsx
@@ -0,0 +1,53 @@
+import axios from 'axios'
+import './../App.css'
+import { useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+
+const UploadPage = () => {
+ let postFile: File | undefined
+ let commentFile: File | undefined
+ const [returnMessage, setReturnMessage] = useState('')
+ const navigate = useNavigate()
+
+ const uploadFiles = async () => {
+ if (!postFile || !commentFile) {
+ alert('Please select both files before uploading.')
+ return
+ }
+
+ const formData = new FormData()
+ formData.append('posts', postFile)
+ formData.append('comments', commentFile)
+
+ try {
+ const response = await axios.post('http://localhost:5000/upload', formData, {
+ headers: {
+ 'Content-Type': 'multipart/form-data',
+ },
+ })
+ console.log('Files uploaded successfully:', response.data)
+ setReturnMessage(`Upload successful! Posts: ${response.data.posts_count}, Comments: ${response.data.comments_count}`)
+ navigate('/stats')
+ } catch (error) {
+ console.error('Error uploading files:', error)
+ setReturnMessage('Error uploading files. Error details: ' + error)
+ }
+ }
+ return (
+
+
+
Posts File
+ postFile = e.target.files?.[0]}>
+
+
+
Comments File
+ commentFile = e.target.files?.[0]}>
+
+
+
+
{returnMessage}
+
+ )
+}
+
+export default UploadPage;