diff --git a/src/pages/filelist/index.tsx b/src/pages/filelist/index.tsx
index 3d108ba..234d43d 100644
--- a/src/pages/filelist/index.tsx
+++ b/src/pages/filelist/index.tsx
@@ -12,6 +12,7 @@ import * as S from './styled';
export const FileListPage: React.FC = () => {
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
+ const [listZero, setListZero] = useState(false); //test: true
const SkeletonUIRandomWidth = ['50', '55', '60', '65', '70', '75', '80'];
const dispatch = useDispatch();
const { SetDownloadFileProps } = bindActionCreators(actionCreators, dispatch);
@@ -23,6 +24,9 @@ export const FileListPage: React.FC = () => {
})
.then((res) => {
setFileList(res.data.list); //파일리스트 요소 갯수에 따른 핸들링 추가예정
+ if (res.data.numberOfList === 0) {
+ setListZero(true);
+ }
setTimeout(() => {
setLoading(true); //loading 확인하고싶으면 false로 바꿔주세요.
}, 1000);
@@ -39,28 +43,34 @@ export const FileListPage: React.FC = () => {
{loading ? (
<>
- {fileList?.map((item, index) => (
- {
- if (item.isEncrypted) {
- navigate(`/checkpw/${item.fileId}`);
- } else {
- SetDownloadFileProps({
- fileId: item.fileId,
- isEncrypted: item.isEncrypted,
- token: null,
- });
- navigate(`/download/${item.fileId}`);
- }
- }}
- />
- ))}
+ {!listZero ? (
+ <>
+ {fileList?.map((item, index) => (
+ {
+ if (item.isEncrypted) {
+ navigate(`/checkpw/${item.fileId}`);
+ } else {
+ SetDownloadFileProps({
+ fileId: item.fileId,
+ isEncrypted: item.isEncrypted,
+ token: null,
+ });
+ navigate(`/download/${item.fileId}`);
+ }
+ }}
+ />
+ ))}
+ >
+ ) : (
+ 업로드된 파일이 없습니다.
+ )}
>
diff --git a/src/pages/filelist/styled.ts b/src/pages/filelist/styled.ts
index 2d99b87..33509d8 100644
--- a/src/pages/filelist/styled.ts
+++ b/src/pages/filelist/styled.ts
@@ -18,3 +18,9 @@ export const FileListPageBoxShoadow = styled.div`
top: -2.5rem; //-25px
background: linear-gradient(180deg, rgba(40, 42, 58, 0) 0%, #282a3a 45.31%);
`;
+
+export const FileListZero = styled.div`
+ font-size: 3rem;
+ font-weight: 700;
+ margin: 5rem;
+`;