diff --git a/src/components/EditIssue/Upload-styles.tsx b/src/components/EditIssue/EditIssue-styles.tsx similarity index 100% rename from src/components/EditIssue/Upload-styles.tsx rename to src/components/EditIssue/EditIssue-styles.tsx diff --git a/src/components/EditIssue/EditIssue.tsx b/src/components/EditIssue/EditIssue.tsx index cd6c556..bfcdd44 100644 --- a/src/components/EditIssue/EditIssue.tsx +++ b/src/components/EditIssue/EditIssue.tsx @@ -5,7 +5,7 @@ import { CustomInputField, ModalBody, NewCrowdfundTitle, -} from "./Upload-styles"; +} from "./EditIssue-styles.tsx"; import { Box, Modal, Typography, useTheme } from "@mui/material"; import RemoveIcon from "@mui/icons-material/Remove"; diff --git a/src/components/PlaylistListEdit/PlaylistListEdit.tsx b/src/components/PlaylistListEdit/PlaylistListEdit.tsx index 7a9c208..19d42e7 100644 --- a/src/components/PlaylistListEdit/PlaylistListEdit.tsx +++ b/src/components/PlaylistListEdit/PlaylistListEdit.tsx @@ -3,7 +3,7 @@ import { CardContentContainerComment } from "../common/Comments/Comments-styles" import { CrowdfundSubTitle, CrowdfundSubTitleRow, -} from "../PublishIssue/Upload-styles.tsx"; +} from "../PublishIssue/PublishIssue-styles.tsx"; import { Box, Button, Input, Typography, useTheme } from "@mui/material"; import { useNavigate } from "react-router-dom"; import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline"; diff --git a/src/components/Playlists/Playlists.tsx b/src/components/Playlists/Playlists.tsx index 0ac3c6f..555a5e1 100644 --- a/src/components/Playlists/Playlists.tsx +++ b/src/components/Playlists/Playlists.tsx @@ -3,7 +3,7 @@ import { CardContentContainerComment } from "../common/Comments/Comments-styles" import { CrowdfundSubTitle, CrowdfundSubTitleRow, -} from "../PublishIssue/Upload-styles.tsx"; +} from "../PublishIssue/PublishIssue-styles.tsx"; import { Box, Typography, useTheme } from "@mui/material"; import { useNavigate } from "react-router-dom"; diff --git a/src/components/PublishIssue/Upload-styles.tsx b/src/components/PublishIssue/PublishIssue-styles.tsx similarity index 100% rename from src/components/PublishIssue/Upload-styles.tsx rename to src/components/PublishIssue/PublishIssue-styles.tsx diff --git a/src/components/PublishIssue/PublishIssue.tsx b/src/components/PublishIssue/PublishIssue.tsx index cec10c8..eb6d79b 100644 --- a/src/components/PublishIssue/PublishIssue.tsx +++ b/src/components/PublishIssue/PublishIssue.tsx @@ -6,7 +6,7 @@ import { ModalBody, NewCrowdfundTitle, StyledButton, -} from "./Upload-styles"; +} from "./PublishIssue-styles.tsx"; import { Box, Modal, Typography, useTheme } from "@mui/material"; import RemoveIcon from "@mui/icons-material/Remove"; import ShortUniqueId from "short-unique-id"; @@ -74,8 +74,6 @@ export const PublishIssue = ({ editId, editContent }: NewCrowdfundProps) => { useState(null); const [playlistTitle, setPlaylistTitle] = useState(""); const [playlistDescription, setPlaylistDescription] = useState(""); - const [selectedCategory, setSelectedCategory] = useState(null); - const [selectedSubCategory, setSelectedSubCategory] = useState(null); const [playlistSetting, setPlaylistSetting] = useState(null); const [publishes, setPublishes] = useState(null); @@ -479,12 +477,13 @@ export const PublishIssue = ({ editId, editContent }: NewCrowdfundProps) => { setFiles([]); setStep("videos"); setPlaylistCoverImage(null); + setTitle(""); setPlaylistTitle(""); setPlaylistDescription(""); - setSelectedCategory(null); - setSelectedSubCategory(null); + setDescription(""); setPlaylistSetting(null); categoryListRef.current?.clearCategories(); + imagePublisherRef.current?.setImageArray([]); dispatch( setNotification({ msg: "Issue published", diff --git a/src/components/StatsData.tsx b/src/components/StatsData.tsx index cf25422..a28ba3d 100644 --- a/src/components/StatsData.tsx +++ b/src/components/StatsData.tsx @@ -3,7 +3,7 @@ import { styled } from "@mui/system"; import { Grid } from "@mui/material"; import { useSelector } from "react-redux"; import { RootState } from "../state/store.ts"; -import { useFetchFiles } from "../hooks/useFetchFiles.tsx"; +import { useFetchIssues } from "../hooks/useFetchIssues.tsx"; export const StatsData = () => { const StatsCol = styled(Grid)(({ theme }) => ({ @@ -23,7 +23,7 @@ export const StatsData = () => { checkNewFiles, getFilesFiltered, getFilesCount, - } = useFetchFiles(); + } = useFetchIssues(); const totalIssuesPublished = useSelector( (state: RootState) => state.global.totalFilesPublished diff --git a/src/components/common/Comments/CommentSection.tsx b/src/components/common/Comments/CommentSection.tsx index 8f350bf..5c37cd8 100644 --- a/src/components/common/Comments/CommentSection.tsx +++ b/src/components/common/Comments/CommentSection.tsx @@ -18,7 +18,7 @@ import { QSUPPORT_COMMENT_BASE } from "../../../constants/Identifiers.ts"; import { CrowdfundSubTitle, CrowdfundSubTitleRow, -} from "../../PublishIssue/Upload-styles.tsx"; +} from "../../PublishIssue/PublishIssue-styles.tsx"; interface CommentSectionProps { postId: string; diff --git a/src/components/common/ImagePublisher/ImagePublisher.tsx b/src/components/common/ImagePublisher/ImagePublisher.tsx index 5358b71..07a2494 100644 --- a/src/components/common/ImagePublisher/ImagePublisher.tsx +++ b/src/components/common/ImagePublisher/ImagePublisher.tsx @@ -11,6 +11,7 @@ import { useTheme } from "@mui/material"; export type ImagePublisherRef = { getImageArray: () => string[]; + setImageArray: (imageArray: string[]) => void; }; interface ImagePublisherProps { @@ -27,6 +28,9 @@ export const ImagePublisher = React.forwardRef< getImageArray: () => { return imageArray; }, + setImageArray: (imageArray: string[]) => { + setImageArray(imageArray); + }, })); return ( diff --git a/src/hooks/useFetchFiles.tsx b/src/hooks/useFetchIssues.tsx similarity index 92% rename from src/hooks/useFetchFiles.tsx rename to src/hooks/useFetchIssues.tsx index d9d8dd9..8c1336d 100644 --- a/src/hooks/useFetchFiles.tsx +++ b/src/hooks/useFetchIssues.tsx @@ -3,30 +3,30 @@ import { useDispatch, useSelector } from "react-redux"; import { addFiles, addToHashMap, + removeFromHashMap, setCountNewFiles, upsertFiles, upsertFilesBeginning, - Video, upsertFilteredFiles, + Video, } from "../state/features/fileSlice.ts"; import { + setFilesPerNamePublished, setIsLoadingGlobal, - setUserAvatarHash, setTotalFilesPublished, setTotalNamesPublished, - setFilesPerNamePublished, + setUserAvatarHash, } from "../state/features/globalSlice"; import { RootState } from "../state/store"; -import { fetchAndEvaluateVideos } from "../utils/fetchVideos"; +import { fetchAndEvaluateIssues } from "../utils/fetchVideos"; import { - QSUPPORT_PLAYLIST_BASE, QSUPPORT_FILE_BASE, + QSUPPORT_PLAYLIST_BASE, } from "../constants/Identifiers.ts"; -import { RequestQueue } from "../utils/queue"; import { queue } from "../wrappers/GlobalWrapper"; import { getCategoriesFetchString } from "../components/common/CategoryList/CategoryList.tsx"; -export const useFetchFiles = () => { +export const useFetchIssues = () => { const dispatch = useDispatch(); const hashMapFiles = useSelector( (state: RootState) => state.file.hashMapFiles @@ -49,7 +49,7 @@ export const useFetchFiles = () => { (state: RootState) => state.global.filesPerNamePublished ); - const checkAndUpdateFile = React.useCallback( + const checkAndUpdateIssue = React.useCallback( (video: Video) => { const existingVideo = hashMapFiles[video.id]; if (!existingVideo) { @@ -85,27 +85,29 @@ export const useFetchFiles = () => { } catch (error) {} }, []); - const getFile = async ( + const getIssue = async ( user: string, - videoId: string, + issueID: string, content: any, retries: number = 0 ) => { try { - const res = await fetchAndEvaluateVideos({ + const res = await fetchAndEvaluateIssues({ user, - videoId, + videoId: issueID, content, }); - - dispatch(addToHashMap(res)); + console.log("response is: ", res); + res?.isValid + ? dispatch(addToHashMap(res)) + : dispatch(removeFromHashMap(issueID)); } catch (error) { retries = retries + 1; if (retries < 2) { // 3 is the maximum number of retries here, you can adjust it to your needs - queue.push(() => getFile(user, videoId, content, retries + 1)); + queue.push(() => getIssue(user, issueID, content, retries + 1)); } else { - console.error("Failed to get video after 3 attempts", error); + console.error("Failed to get issue after 3 attempts", error); } } }; @@ -172,9 +174,9 @@ export const useFetchFiles = () => { }, 1000); for (const content of structureData) { if (content.user && content.id) { - const res = checkAndUpdateFile(content); + const res = checkAndUpdateIssue(content); if (res) { - queue.push(() => getFile(content.user, content.id, content)); + queue.push(() => getIssue(content.user, content.id, content)); } } } @@ -269,9 +271,9 @@ export const useFetchFiles = () => { } for (const content of structureData) { if (content.user && content.id) { - const res = checkAndUpdateFile(content); + const res = checkAndUpdateIssue(content); if (res) { - queue.push(() => getFile(content.user, content.id, content)); + queue.push(() => getIssue(content.user, content.id, content)); } } } @@ -330,9 +332,9 @@ export const useFetchFiles = () => { for (const content of structureData) { if (content.user && content.id) { - const res = checkAndUpdateFile(content); + const res = checkAndUpdateIssue(content); if (res) { - queue.push(() => getFile(content.user, content.id, content)); + queue.push(() => getIssue(content.user, content.id, content)); } } } @@ -410,8 +412,8 @@ export const useFetchFiles = () => { return { getFiles, - checkAndUpdateFile, - getFile, + checkAndUpdateFile: checkAndUpdateIssue, + getFile: getIssue, hashMapFiles, getNewFiles, checkNewFiles, diff --git a/src/pages/Home/FileListComponentLevel.tsx b/src/pages/Home/FileListComponentLevel.tsx index b384496..e6cb40d 100644 --- a/src/pages/Home/FileListComponentLevel.tsx +++ b/src/pages/Home/FileListComponentLevel.tsx @@ -5,7 +5,7 @@ import { RootState } from "../../state/store"; import AttachFileIcon from "@mui/icons-material/AttachFile"; import { Avatar, Box, Skeleton, useTheme } from "@mui/material"; -import { useFetchFiles } from "../../hooks/useFetchFiles.tsx"; +import { useFetchIssues } from "../../hooks/useFetchIssues.tsx"; import LazyLoad from "../../components/common/LazyLoad"; import { BottomParent, @@ -41,7 +41,7 @@ export const FileListComponentLevel = ({ mode }: VideoListProps) => { const navigate = useNavigate(); const { getFile, getNewFiles, checkNewFiles, checkAndUpdateFile } = - useFetchFiles(); + useFetchIssues(); const getVideos = React.useCallback(async () => { try { diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx index 3380c1a..4d5ce1c 100644 --- a/src/pages/Home/Home.tsx +++ b/src/pages/Home/Home.tsx @@ -4,7 +4,7 @@ import { useDispatch, useSelector } from "react-redux"; import { RootState } from "../../state/store"; import { IssueList } from "./IssueList.tsx"; import { Box, Grid, Input, useTheme } from "@mui/material"; -import { useFetchFiles } from "../../hooks/useFetchFiles.tsx"; +import { useFetchIssues } from "../../hooks/useFetchIssues.tsx"; import LazyLoad from "../../components/common/LazyLoad"; import { FiltersCol, FiltersContainer } from "./IssueList-styles.tsx"; import { SubtitleContainer, ThemeButton } from "./Home-styles"; @@ -87,7 +87,7 @@ export const Home = ({ mode }: HomeProps) => { checkNewFiles, getFilesFiltered, getFilesCount, - } = useFetchFiles(); + } = useFetchIssues(); const getFilesHandler = React.useCallback( async (reset?: boolean, resetFilers?: boolean) => { @@ -314,7 +314,7 @@ export const Home = ({ mode }: HomeProps) => { maxWidth: "1400px", }} > - + { - const hashMapFiles = useSelector( +export const IssueList = ({ issues }: FileListProps) => { + const hashMapIssues = useSelector( (state: RootState) => state.file.hashMapFiles ); @@ -55,10 +55,14 @@ export const IssueList = ({ files }: FileListProps) => { } catch (error) {} }; + const filteredIssues = useMemo(() => { + return issues.filter((issue: any) => hashMapIssues[issue.id]?.isValid); + }, [issues, hashMapIssues]); + return ( - {files.map((file: any, index: number) => { - const existingFile = hashMapFiles[file?.id]; + {filteredIssues.map((file: any, index: number) => { + const existingFile = hashMapIssues[file?.id]; let hasHash = false; let fileObj = file; if (existingFile) { diff --git a/src/pages/IssueContent/IssueContent.tsx b/src/pages/IssueContent/IssueContent.tsx index 6209d69..7601a89 100644 --- a/src/pages/IssueContent/IssueContent.tsx +++ b/src/pages/IssueContent/IssueContent.tsx @@ -412,9 +412,13 @@ export const IssueContent = () => { return ( ); })} @@ -422,7 +426,7 @@ export const IssueContent = () => { { +export const fetchAndEvaluateIssues = async (data: any) => { const getVideo = async () => { - const { user, videoId, content } = data + const { user, videoId, content } = data; let obj: any = { ...content, - isValid: false - } + isValid: false, + }; - if (!user || !videoId) return obj + if (!user || !videoId) return obj; try { - const responseData = await qortalRequest({ - action: 'FETCH_QDN_RESOURCE', + action: "FETCH_QDN_RESOURCE", name: user, - service: content?.service || 'DOCUMENT', - identifier: videoId - }) + service: content?.service || "DOCUMENT", + identifier: videoId, + }); if (checkStructure(responseData)) { obj = { ...content, ...responseData, - isValid: true - } + isValid: true, + }; } - return obj + return obj; } catch (error: any) { - throw new Error(error?.message || 'error') + throw new Error(error?.message || "error"); } - } + }; - const res = await getVideo() - return res -} + const res = await getVideo(); + return res; +};