diff --git a/packages/app/src/features/student/hooks/useStudent.tsx b/packages/app/src/features/student/hooks/useStudent.tsx
index f24017d8..b8685e61 100644
--- a/packages/app/src/features/student/hooks/useStudent.tsx
+++ b/packages/app/src/features/student/hooks/useStudent.tsx
@@ -15,11 +15,12 @@ interface StudentsParams extends StudentParam {
const useStudent = () => {
const dispatch = useDispatch()
const { addToast } = useToast()
- const { studentParam, studentList, totalSize } = useSelector(
+ const { studentParam, studentList, totalSize, nextStop } = useSelector(
(state: RootState) => ({
studentParam: state.studentParam,
studentList: state.studentList.studentList,
totalSize: state.studentList.totalSize,
+ nextStop: state.studentParam.nextStop,
})
)
@@ -50,10 +51,8 @@ const useStudent = () => {
totalSize?: number,
last?: boolean
) => {
- if (!students || !totalSize || !last) return
-
dispatch(actions.resetStudents())
- dispatch(actions.addStudents(students))
+ dispatch(actions.addStudents(students || []))
dispatch(actions.setTotoalSize(totalSize))
if (last) dispatch(actions.nextStop())
}
@@ -63,6 +62,7 @@ const useStudent = () => {
totalSize,
refetchStudents,
setStudentList,
+ nextStop,
}
}
diff --git a/packages/app/src/features/student/molecules/StudentList/index.tsx b/packages/app/src/features/student/molecules/StudentList/index.tsx
index c8204ad4..0225cebb 100644
--- a/packages/app/src/features/student/molecules/StudentList/index.tsx
+++ b/packages/app/src/features/student/molecules/StudentList/index.tsx
@@ -8,7 +8,7 @@ import * as S from './style'
const StudentList = () => {
const router = useRouter()
- const { studentList, totalSize } = useStudent()
+ const { studentList, totalSize, nextStop } = useStudent()
const { observe } = useScrollObserver()
const { onShow } = useModal()
@@ -24,16 +24,17 @@ const StudentList = () => {
- {!studentList.length &&
- Array(...Array(20)).map((_, idx) => (
-
- ))}
{studentList?.map((i) => (
onClick(i.id)} />
))}
-
-
+ {!nextStop &&
+ Array(...Array(10)).map((_, idx) => (
+
+
+
+ ))}
+
)
}
diff --git a/packages/app/src/features/student/stores/studentListSlice.ts b/packages/app/src/features/student/stores/studentListSlice.ts
index c3a4ce2c..f000ac18 100644
--- a/packages/app/src/features/student/stores/studentListSlice.ts
+++ b/packages/app/src/features/student/stores/studentListSlice.ts
@@ -3,11 +3,12 @@ import { PayloadAction, createSlice } from '@reduxjs/toolkit'
interface InitialState {
studentList: StudentType[]
- totalSize?: number
+ totalSize: number
}
const initialState: InitialState = {
studentList: [],
+ totalSize: 0,
}
const studentListSlice = createSlice({
@@ -20,8 +21,8 @@ const studentListSlice = createSlice({
resetStudents: (state) => {
state.studentList = []
},
- setTotoalSize: (state, { payload }: PayloadAction) => {
- state.totalSize = payload
+ setTotoalSize: (state, { payload }: PayloadAction) => {
+ state.totalSize = payload || 0
},
},
})
diff --git a/packages/app/src/features/student/stores/studentParamSlice.ts b/packages/app/src/features/student/stores/studentParamSlice.ts
index a68cd4d0..cad46ee0 100644
--- a/packages/app/src/features/student/stores/studentParamSlice.ts
+++ b/packages/app/src/features/student/stores/studentParamSlice.ts
@@ -19,7 +19,7 @@ const initialState: InitialState = {
techStacks: [],
formOfEmployment: [],
},
- page: 1,
+ page: 2,
size: 20,
isLoading: false,
isReady: false,
diff --git a/packages/shared/src/atoms/Skeleton/index.tsx b/packages/shared/src/atoms/Skeleton/index.tsx
index ffe89452..0dca5fd7 100644
--- a/packages/shared/src/atoms/Skeleton/index.tsx
+++ b/packages/shared/src/atoms/Skeleton/index.tsx
@@ -27,7 +27,7 @@ interface TextProps {
}
export const SkeletonText = ({
- width,
+ width = '100%',
height = '1em',
marginRight,
marginBottom,
diff --git a/packages/shared/src/atoms/StudentCard/style.ts b/packages/shared/src/atoms/StudentCard/style.ts
index a697de1d..f1f25345 100644
--- a/packages/shared/src/atoms/StudentCard/style.ts
+++ b/packages/shared/src/atoms/StudentCard/style.ts
@@ -78,6 +78,7 @@ export const UserInfo = styled.div`
flex-direction: column;
gap: 1rem;
overflow: hidden;
+ width: 100%;
@media (max-width: 41.5rem) {
gap: 1.25rem;