Skip to content

Commit

Permalink
feat: 디스커션 목록에 해당하는 부분에 대해서만 suspense 적용
Browse files Browse the repository at this point in the history
  • Loading branch information
Parkhanyoung committed Oct 24, 2024
1 parent 5532b0a commit d517831
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 13 deletions.
22 changes: 19 additions & 3 deletions frontend/src/components/DiscussionList/DiscussionListContent.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,29 @@ import * as S from './DiscussionList.styled';
import DiscussionListItem from './DiscussionListItem';
import { Link } from 'react-router-dom';
import NoContentWithoutButton from '../common/NoContent/NoContentWithoutButton';
import type { Discussion } from '@/types';
import useDiscussions from '@/hooks/useDiscussions';
import { HASHTAGS } from '@/constants/hashTags';

interface DiscussionListContentProps {
discussions: Discussion[];
selectedMission?: string;
selectedHashTag?: string;
page: number;
onPageInfoUpdate?: (totalPage: number) => void;
}

export default function DiscussionListContent({ discussions }: DiscussionListContentProps) {
export default function DiscussionListContent({
selectedMission,
selectedHashTag,
page,
onPageInfoUpdate,
}: DiscussionListContentProps) {
const { discussions } = useDiscussions({
mission: selectedMission ?? HASHTAGS.all,
hashTag: selectedHashTag ?? HASHTAGS.all,
page,
onPageInfoUpdate,
});

return (
<S.ContentContainer>
{discussions.length ? (
Expand Down
18 changes: 8 additions & 10 deletions frontend/src/pages/DiscussionListPage/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import type { SelectedMissionType } from '@/types/mission';
import { usePagination } from '@/hooks/usePagination';
import { HASHTAGS } from '@/constants/hashTags';
import PageButtons from '@/components/common/PageButtons';
import useDiscussions from '@/hooks/useDiscussions';
import SpinnerSuspense from '@/components/common/SpinnerSuspense';

export default function DiscussionListPage() {
Expand Down Expand Up @@ -41,14 +40,6 @@ export default function DiscussionListPage() {
prevHashTagRef.current = selectedHashTag;
}, [selectedMission, selectedHashTag, handleInitializePage]);

const { discussions } = useDiscussions({
mission: selectedMission?.title ?? HASHTAGS.all,
hashTag: selectedHashTag?.name ?? HASHTAGS.all,
page: currentPage,
onPageInfoUpdate: (totalPagesFromServer: number) => {
setTotalPages(totalPagesFromServer);
},
});
const { data: allHashTags } = useHashTags();

const { missions } = useMissions();
Expand All @@ -72,7 +63,14 @@ export default function DiscussionListPage() {
/>
</S.TagListWrapper>
<SpinnerSuspense>
<DiscussionListContent discussions={discussions} />
<DiscussionListContent
selectedMission={selectedMission?.title ?? HASHTAGS.all}
selectedHashTag={selectedHashTag?.name ?? HASHTAGS.all}
page={currentPage}
onPageInfoUpdate={(totalPagesFromServer: number) => {
setTotalPages(totalPagesFromServer);
}}
/>
</SpinnerSuspense>
{totalPages > 0 && (
<PageButtons
Expand Down

0 comments on commit d517831

Please sign in to comment.