From 9107774fae9ae18a86947a74d99de10467e2bc7e Mon Sep 17 00:00:00 2001 From: Sachin Shetty <26170834+sachinsshetty@users.noreply.github.com> Date: Tue, 19 Nov 2024 22:38:20 +0100 Subject: [PATCH] data flow app 1 (#6) * fix- url path * load data * connect to data --------- Co-authored-by: sachin <{ID}+{username}@users.noreply.github.com> --- src/components/Doctor/DoctorApp.tsx | 22 ++++++------- src/components/Home.tsx | 20 ++++++------ src/components/User/UserApp.tsx | 22 +++++++++---- src/redux/reducer/DoctorDataReducer.ts | 45 ++++++++++++++------------ src/redux/reducer/UserDataReducer.ts | 20 ++++++------ src/redux/store.ts | 4 ++- 6 files changed, 74 insertions(+), 59 deletions(-) diff --git a/src/components/Doctor/DoctorApp.tsx b/src/components/Doctor/DoctorApp.tsx index 0f97880..c679c92 100644 --- a/src/components/Doctor/DoctorApp.tsx +++ b/src/components/Doctor/DoctorApp.tsx @@ -14,7 +14,7 @@ interface Message { id: bigint; appointment_day: string; appointment_time: string; - doctor_name: string; + patient_name: string; status: string; observations: string; } @@ -34,8 +34,8 @@ const columns: GridColDef[] = [ editable: false, }, { - field: 'doctor_name', - headerName: 'Doctor', + field: 'patient_name', + headerName: 'Patient', width: 150, editable: false, }, @@ -90,10 +90,10 @@ const DoctorApp: React.FC = () => { const today = new Date(); const nextSevenDays = new Date(today.getTime() + (7 * 24 * 60 * 60 * 1000)).toISOString().slice(0, 10); - const userId = 10001; + const doctorId = 10001; - const userDataList = useSelector((state: RootState) => - state.userDataList.userData); + const doctorDataList = useSelector((state: RootState) => + state.doctorDataList.doctorData); useEffect(() => { dispatch( @@ -101,23 +101,23 @@ const DoctorApp: React.FC = () => { page: 1, appointment_day_after: todayDate, appointment_day_before: nextSevenDays, - user_id: userId, + doctor_id: doctorId, rejectValue: 'Failed to fetch Appointment.', }) ); -}, [dispatch, todayDate, nextSevenDays, userId]); +}, [dispatch, todayDate, nextSevenDays, doctorId]); useEffect(() => { if (startDate && endDate) { - const filteredData = userDataList.filter((item:any) => { + const filteredData = doctorDataList.filter((item:any) => { const itemDate = dayjs(item.appointment_day); return itemDate.isAfter(startDate) && itemDate.isBefore(endDate); }); setTimerows(filteredData); } else { - setTimerows(userDataList); + setTimerows(doctorDataList); } - }, [userDataList, startDate, endDate]); + }, [doctorDataList, startDate, endDate]); return ( diff --git a/src/components/Home.tsx b/src/components/Home.tsx index 8d3f7de..facf29a 100644 --- a/src/components/Home.tsx +++ b/src/components/Home.tsx @@ -26,17 +26,9 @@ class Home extends Component { Sanjeevini - AI Health App - - Why Sanjeevini ? -
    -
  • A family member underwent emergency angioplasty after a previous Heart attack (Myocardial Infarction) was undetected.
    • -
  • Breathelessness led to a Hospital visit, after an IV drip and diagnosis of Gastric/Acidity, they were sent home.
    • -
  • A general physician recommended a cardiologist after observing abnormality in EEG/ECG diagnostics.
    • -
  • Cardiologist asked for prior Heart check reports which were unavailable instantly.
    • -
- What will Sanjeevini do ? +
  • Connect with Ayushman Bharat Digital Mission and provide Medical history to Doctor's during Consultation.
  • Provide data management facility to Doctor's with Open Source development.
    • @@ -47,14 +39,22 @@ class Home extends Component {
- What will Sanjeevini not do ? +
  • Fix health issues
  • Provide medical advice
+ + Why Sanjeevini ? +
    +
  • A family member underwent emergency angioplasty after a previous Heart attack (Myocardial Infraction) was undetected.
    • +
  • The cardiologist requested prior health check reports, but these were unavailable instantly.
    • +
  • Incomplete reporting can lead to misdiagnosis and underestimate the seriousness of health concerns.
    • +
  • This can result in delayed or inappropriate treatment, which can further compromise health outcomes.
    • +
diff --git a/src/components/User/UserApp.tsx b/src/components/User/UserApp.tsx index 8e6a6bd..d23cdb4 100644 --- a/src/components/User/UserApp.tsx +++ b/src/components/User/UserApp.tsx @@ -81,21 +81,28 @@ function CustomToolbar() { ); } +const todayDate = new Date().toISOString().slice(0, 10); +const today = new Date(); +const nextSevenDays = new Date(today.getTime() + + (7 * 24 * 60 * 60 * 1000)).toISOString().slice(0, 10); + const UserApp: React.FC = () => { const [timerows, setTimerows] = useState>([]); + const [loading, setLoading] = useState(true); // add loading state + const dispatch = useDispatch(); const [startDate, setStartDate] = useState(null); const [endDate, setEndDate] = useState(null); - const todayDate = new Date().toISOString().slice(0, 10); - const today = new Date(); - const nextSevenDays = new Date(today.getTime() + - (7 * 24 * 60 * 60 * 1000)).toISOString().slice(0, 10); - const userId = 10001; + + const userId = 1; const userDataList = useSelector((state: RootState) => state.userDataList.userData); + //console.log(userDataList); + useEffect(() => { + if (loading) { dispatch( fetchUserAppData({ page: 1, @@ -104,8 +111,9 @@ const UserApp: React.FC = () => { user_id: userId, rejectValue: 'Failed to fetch Appointment.', }) - ); -}, [dispatch, todayDate, nextSevenDays, userId]); + ).then(() => setLoading(false)); +} +}, [dispatch, todayDate, nextSevenDays, userId, loading]); useEffect(() => { if (startDate && endDate) { diff --git a/src/redux/reducer/DoctorDataReducer.ts b/src/redux/reducer/DoctorDataReducer.ts index 535e0da..8694491 100644 --- a/src/redux/reducer/DoctorDataReducer.ts +++ b/src/redux/reducer/DoctorDataReducer.ts @@ -1,19 +1,19 @@ -import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit'; +import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'; const API_URL = import.meta.env.VITE_SANJEEVINI_BACKEND_APP_API_URL; export const fetchDoctorAppData = createAsyncThunk< -Doctor[], +string[], { page?: number; appointment_day_after?: string; appointment_day_before?: string; - user_id?: number; + doctor_id?: number; } & { rejectValue: string }, { rejectValue: string }>( - 'pathfinderMission/fetchDoctorAppData', + 'sanjeeviniApp/fetchDoctorAppData', async (args:any, thunkAPI:any) => { try { - let url = API_URL + 'user/?page='; + let url = API_URL + 'doctorapp/?page='; if (args.page) { url += args.page; } @@ -23,24 +23,27 @@ Doctor[], if (args.appointment_day_before) { url += `&appointment_day_before=${args.appointment_day_before}`; } - if (args.norad_id) { - url += `&user_id=${args.user_id}`; + if (args.doctor_id) { + url += `&doctor_id=${args.doctor_id}`; } const response = await fetch(url); if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } const data = await response.json(); - const userData = data.results.map((rawDoctor: any) => ({ + const doctorData = data.results.map((rawDoctor: any) => ({ id: rawDoctor.id, appointment_day: rawDoctor.appointment_day, - appointment_time: new Date(rawDoctor.appointment_time).toISOString().slice(11, 19), - + //appointment_time: new Date(rawDoctor.appointment_time).toISOString().slice(11, 19), + + patient_name: rawDoctor.patient_name, + status: rawDoctor.status, + observations: rawDoctor.observations // map other properties as needed })); - return userData; + return doctorData; } catch (error) { - return thunkAPI.rejectWithValue('Failed to fetch user.'); + return thunkAPI.rejectWithValue('Failed to fetch doctor.'); } } ); @@ -48,26 +51,26 @@ interface Doctor { id: bigint; appointment_day: string; appointment_time: string; - doctor_name: string; + patient_name: string; status: string; observations: string; } interface DoctorState { - userData: Doctor[]; + doctorData: Doctor[]; loading: boolean; error: string | null; page: number; totalPages: number; } const initialState: DoctorState = { - userData: [], + doctorData: [], loading: false, error: null, page: 1, totalPages: 0, }; -export const userSlice = createSlice({ - name: 'user', +export const doctorSlice = createSlice({ + name: 'doctor', initialState, reducers: {}, extraReducers: (builder:any) => { @@ -76,10 +79,10 @@ export const userSlice = createSlice({ state.loading = true; state.error = null; }) - .addCase(fetchDoctorAppData.fulfilled, (state:any, action:PayloadAction) => { + .addCase(fetchDoctorAppData.fulfilled, (state:any, action:any) => { state.loading = false; - state.userData.push(...action.payload); - //state.totalPages = action.meta.arg.total_pages; + state.doctorData.push(...action.payload); + state.totalPages = action.meta.arg.total_pages; }) .addCase(fetchDoctorAppData.rejected, (state:any, action:any) => { state.loading = false; @@ -87,4 +90,4 @@ export const userSlice = createSlice({ }); }, }); -export default userSlice.reducer; +export default doctorSlice.reducer; diff --git a/src/redux/reducer/UserDataReducer.ts b/src/redux/reducer/UserDataReducer.ts index 9b27a6a..8b34191 100644 --- a/src/redux/reducer/UserDataReducer.ts +++ b/src/redux/reducer/UserDataReducer.ts @@ -1,19 +1,19 @@ -import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit'; +import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'; const API_URL = import.meta.env.VITE_SANJEEVINI_BACKEND_APP_API_URL; export const fetchUserAppData = createAsyncThunk< -User[], +string[], { page?: number; appointment_day_after?: string; appointment_day_before?: string; user_id?: number; } & { rejectValue: string }, { rejectValue: string }>( - 'pathfinderMission/fetchUserAppData', + 'sanjeeviniApp/fetchUserAppData', async (args:any, thunkAPI:any) => { try { - let url = API_URL + 'user/?page='; + let url = API_URL + 'userapp/?page='; if (args.page) { url += args.page; } @@ -23,7 +23,7 @@ User[], if (args.appointment_day_before) { url += `&appointment_day_before=${args.appointment_day_before}`; } - if (args.norad_id) { + if (args.user_id) { url += `&user_id=${args.user_id}`; } const response = await fetch(url); @@ -34,8 +34,10 @@ User[], const userData = data.results.map((rawUser: any) => ({ id: rawUser.id, appointment_day: rawUser.appointment_day, - appointment_time: new Date(rawUser.appointment_time).toISOString().slice(11, 19), - + //appointment_time: new Date(rawUser.appointment_time).toISOString().slice(11, 19), + doctor_name: rawUser.doctor_name, + status: rawUser.status, + observations: rawUser.observations // map other properties as needed })); return userData; @@ -76,10 +78,10 @@ export const userSlice = createSlice({ state.loading = true; state.error = null; }) - .addCase(fetchUserAppData.fulfilled, (state:any, action:PayloadAction) => { + .addCase(fetchUserAppData.fulfilled, (state:any, action:any) => { state.loading = false; state.userData.push(...action.payload); - //state.totalPages = action.meta.arg.total_pages; + state.totalPages = action.meta.arg.total_pages; }) .addCase(fetchUserAppData.rejected, (state:any, action:any) => { state.loading = false; diff --git a/src/redux/store.ts b/src/redux/store.ts index 7d630ef..25b7b1b 100644 --- a/src/redux/store.ts +++ b/src/redux/store.ts @@ -2,10 +2,12 @@ import {configureStore} from '@reduxjs/toolkit'; import {useDispatch} from 'react-redux'; import {combineReducers} from 'redux'; import UserDataReducer from './reducer/UserDataReducer'; +import DoctorDataReducer from './reducer/DoctorDataReducer'; const reducer = combineReducers({ - userDataList: UserDataReducer, + userDataList: UserDataReducer, + doctorDataList: DoctorDataReducer }); export const store = configureStore({