Skip to content

Commit 0a697a6

Browse files
amirrramirrr
committed
fully integrated celery tasks
1 parent 8971345 commit 0a697a6

File tree

12 files changed

+419
-118
lines changed

12 files changed

+419
-118
lines changed

‎client/src/App.tsx

Lines changed: 7 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,17 @@
1-
import Dashboard from './components/Builder/Dashboard'
2-
import WorkflowProvider from './context/Workflow/WorkflowProvider'
3-
import { ReactFlowProvider } from 'reactflow'
41
import { Routes, Route } from 'react-router-dom'
52
import Table from './components/View/TableView/Table'
6-
import { SocketProvider } from './context/Socket/SocketProvider'
73
import Galaxy from './pages/Login/Galaxy'
4+
import User from './pages/User/User'
85

96
function App() {
107
return (
118
<>
12-
<ReactFlowProvider>
13-
<WorkflowProvider>
14-
<SocketProvider>
15-
<Routes>
16-
<Route path='/' element={<Galaxy />} />
17-
<Route path='/login/:email/:magicLink' element={<Galaxy loggingIn={true} />} />
18-
<Route path='/table' element={<Table />} />
19-
<Route path='/dashboard' element={<Dashboard />} />
20-
</Routes>
21-
</SocketProvider>
22-
</WorkflowProvider>
23-
</ReactFlowProvider>
9+
<Routes>
10+
<Route path='/' element={<Galaxy />} />
11+
<Route path='/login/:email/:magicLink' element={<Galaxy loggingIn={true} />} />
12+
<Route path='/table' element={<Table />} />
13+
<Route path='/dashboard' element={<User />} />
14+
</Routes>
2415
</>
2516
)
2617
}

‎client/src/components/View/TableView/Table.tsx

Lines changed: 54 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ import { check_data, get_failed_data } from './hooks/mock-data'
88
type RunStatus = {
99
status: string
1010
progress: number
11+
task_id: string
12+
done: boolean
1113
}
1214

1315
const Table: React.FC = () => {
@@ -16,7 +18,12 @@ const Table: React.FC = () => {
1618

1719
const [data, setData] = useState<Result[]>([check_data])
1820

19-
const [status, setStatus] = useState<RunStatus>({ status: '', progress: 0 })
21+
const [status, setStatus] = useState<RunStatus>({
22+
status: '',
23+
progress: 0,
24+
task_id: '',
25+
done: false,
26+
})
2027
const [pathLength, setPathLength] = useState(0)
2128

2229
const handleDragOver = (e: DragEvent<HTMLDivElement>) => {
@@ -32,9 +39,24 @@ const Table: React.FC = () => {
3239

3340
const socket = useSocket()
3441

35-
const onMessage = useCallback((data: { status: string; progress: number }) => {
36-
setStatus({ status: data.status, progress: Number(data.progress) })
37-
}, [])
42+
const onMessage = useCallback(
43+
(data: { status: string; progress: number; task_id: string; done: boolean }) => {
44+
console.log(data)
45+
setStatus({
46+
status: data.status,
47+
progress: Number(data.progress),
48+
task_id: data.task_id,
49+
done: data.done,
50+
})
51+
52+
if (data.done) {
53+
getResults(data.task_id).then(() => {
54+
setIsUploading(false)
55+
})
56+
}
57+
},
58+
[],
59+
)
3860

3961
useEffect(() => {
4062
if (!socket) {
@@ -61,6 +83,32 @@ const Table: React.FC = () => {
6183
return pathLength - (pathLength * status.progress) / 100
6284
}
6385

86+
const getResults = async (task_id: string) => {
87+
const response = await fetch(
88+
`${API_URL}/run_assistant?task_id=${task_id}
89+
`,
90+
{
91+
method: 'GET',
92+
headers: {
93+
Accept: 'application/json',
94+
'Content-Type': 'application/json',
95+
},
96+
},
97+
)
98+
if (response.ok) {
99+
const new_data = await response.json()
100+
try {
101+
flattenData([new_data], true, true, true)
102+
setData((prev) => [...prev, new_data])
103+
} catch (error) {
104+
setData((prev) => [...prev, get_failed_data(task_id)])
105+
console.error('Error parsing data:', error)
106+
}
107+
} else {
108+
console.error('Error fetching results')
109+
}
110+
}
111+
64112
const handleBackend = async (file: File) => {
65113
setIsUploading(true)
66114

@@ -77,22 +125,15 @@ const Table: React.FC = () => {
77125
})
78126
if (response.ok) {
79127
const new_data = await response.json()
80-
try {
81-
flattenData([new_data], true, true, true)
82-
setData((prev) => [...prev, new_data])
83-
} catch (error) {
84-
setData((prev) => [...prev, get_failed_data(file.name)])
85-
console.error('Error parsing data:', error)
86-
}
128+
console.log(`Task ID: ${new_data.task_id}`)
87129
} else {
88130
setData((prev) => [...prev, get_failed_data(file.name)])
89131
console.error('Upload failed')
90132
}
91133
} catch (error) {
92134
console.error('Error uploading file:', error)
93135
} finally {
94-
setIsUploading(false)
95-
setStatus({ status: '', progress: 0 })
136+
setStatus({ status: '', progress: 0, task_id: '', done: false })
96137
}
97138
}
98139

‎client/src/main.tsx

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,21 @@ import ReactDOM from 'react-dom/client'
22
import { BrowserRouter as Router } from 'react-router-dom'
33
import App from './App.tsx'
44
import './index.css'
5+
import React from 'react'
6+
import { ReactFlowProvider } from 'reactflow'
7+
import WorkflowProvider from './context/Workflow/WorkflowProvider.tsx'
8+
import { SocketProvider } from './context/Socket/SocketProvider.tsx'
59

610
ReactDOM.createRoot(document.getElementById('root')!).render(
7-
// <React.StrictMode>
8-
<Router>
9-
<App />
10-
</Router>,
11-
// </React.StrictMode>
11+
<React.StrictMode>
12+
<Router>
13+
<ReactFlowProvider>
14+
<WorkflowProvider>
15+
<SocketProvider>
16+
<App />
17+
</SocketProvider>
18+
</WorkflowProvider>
19+
</ReactFlowProvider>
20+
</Router>
21+
</React.StrictMode>,
1222
)

‎client/src/pages/User/User.tsx

Lines changed: 152 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,152 @@
1+
const User = () => {
2+
return (
3+
<div className='bg-gray-100 dark:bg-gray-900 p-4 min-h-screen'>
4+
{/* <!-- User Info Section --> */}
5+
<div className='bg-white dark:bg-gray-800 shadow-md rounded p-4 mb-6'>
6+
<div className='flex justify-between items-center'>
7+
<div>
8+
<h2 className='text-xl font-bold dark:text-white'>User: [email protected]</h2>
9+
<p className='dark:text-gray-300'>Tokens used: 50 | Tokens available: 150</p>
10+
<p className='dark:text-gray-300'>Projects: 3 | Papers: 10</p>
11+
<p className='dark:text-gray-300'>
12+
Papers status: <span className='text-green-500 dark:text-green-400'>Done</span> (5),
13+
<span className='text-blue-500 dark:text-blue-400'> In Progress</span> (3),
14+
<span className='text-orange-500 dark:text-orange-400'> Not Started</span> (2)
15+
</p>
16+
</div>
17+
</div>
18+
</div>
19+
20+
{/* <!-- Projects Section --> */}
21+
<div className='bg-white dark:bg-gray-800 shadow-md rounded p-4 mb-6'>
22+
<h2 className='text-2xl font-bold mb-4 dark:text-white'>Projects</h2>
23+
<div className='overflow-x-auto'>
24+
<table className='min-w-full bg-white dark:bg-gray-800 text-left'>
25+
<thead>
26+
<tr>
27+
<th
28+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
29+
title='Project Name'
30+
>
31+
Project Name
32+
</th>
33+
<th
34+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
35+
title='Project ID'
36+
>
37+
Project ID
38+
</th>
39+
<th
40+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
41+
title='Status of the project (In Progress, Done, Not Started)'
42+
>
43+
Status
44+
</th>
45+
<th className='py-2 px-4 border-b dark:border-gray-700'></th>
46+
</tr>
47+
</thead>
48+
<tbody>
49+
<tr>
50+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
51+
Project Alpha
52+
</td>
53+
<td className='py-2 px-4 border-b dark:border-gray-700 text-blue-500'>
54+
<a
55+
href='https://atlas.seas.upenn.edu/projects/12345'
56+
target='_blank'
57+
rel='noreferrer'
58+
>
59+
12345
60+
</a>
61+
</td>
62+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
63+
In Progress
64+
</td>
65+
<td className='py-2 px-4 border-b dark:border-gray-700 text-right'>
66+
<button className='bg-blue-500 text-white px-4 py-2 rounded'>
67+
Add Ground Truth
68+
</button>
69+
</td>
70+
</tr>
71+
{/* Add more project rows as needed */}
72+
</tbody>
73+
</table>
74+
</div>
75+
</div>
76+
77+
{/* <!-- Papers Section --> */}
78+
<div className='bg-white dark:bg-gray-800 shadow-md rounded p-4'>
79+
<h2 className='text-2xl font-bold mb-4 dark:text-white'>Uploaded Papers</h2>
80+
<div className='overflow-x-auto'>
81+
<table className='min-w-full bg-white dark:bg-gray-800 text-left'>
82+
<thead>
83+
<tr>
84+
<th
85+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
86+
title='File Name'
87+
>
88+
File Name
89+
</th>
90+
<th
91+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
92+
title='Title of the paper from GPT agent'
93+
>
94+
Title
95+
</th>
96+
<th
97+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
98+
title='Digital Object Identifier from crossref'
99+
>
100+
DOI
101+
</th>
102+
<th
103+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
104+
title='Authors of the paper'
105+
>
106+
Authors
107+
</th>
108+
<th
109+
className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'
110+
title='Status of the paper (Done, In Progress, Not Started)'
111+
>
112+
Status
113+
</th>
114+
</tr>
115+
</thead>
116+
<tbody>
117+
<tr>
118+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
119+
paper1.pdf
120+
</td>
121+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
122+
Exploring AI
123+
</td>
124+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
125+
10.1234/ai.2024
126+
</td>
127+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>
128+
John Doe, Jane Smith
129+
</td>
130+
<td className='py-2 px-4 border-b dark:border-gray-700 dark:text-gray-300'>Done</td>
131+
</tr>
132+
{/* Add more paper rows as needed */}
133+
</tbody>
134+
</table>
135+
</div>
136+
137+
{/* <!-- Pagination --> */}
138+
<div className='flex justify-between items-center mt-4'>
139+
<button className='bg-gray-300 dark:bg-gray-700 dark:text-gray-300 text-gray-700 px-4 py-2 rounded'>
140+
Previous
141+
</button>
142+
<span className='dark:text-gray-300'>Page 1 of 1</span>
143+
<button className='bg-gray-300 dark:bg-gray-700 dark:text-gray-300 text-gray-700 px-4 py-2 rounded'>
144+
Next
145+
</button>
146+
</div>
147+
</div>
148+
</div>
149+
)
150+
}
151+
152+
export default User

‎client/src/service/api.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export const API_URL = process.env.NODE_ENV === 'production' ? '/api' : 'http://localhost:8000/api'
1+
export const API_URL = process.env.NODE_ENV === 'production' ? '/api' : 'http://localhost:3000/api'

‎client/src/service/socket.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
// "undefined" means the URL will be computed from the `window.location` object
2-
export const URL = process.env.NODE_ENV === 'production' ? '/home' : 'http://localhost:8000/home'
2+
export const URL = process.env.NODE_ENV === 'production' ? '/home' : 'http://localhost:3000/home'

0 commit comments

Comments
 (0)