diff --git a/index.html b/index.html index 58f8c68..0900b15 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - Q-Share + Q-Support
diff --git a/src/App.tsx b/src/App.tsx index 46a84ca..7847f76 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -26,7 +26,7 @@ function App() { } /> - } /> + } /> } /> diff --git a/src/components/EditIssue/EditIssue.tsx b/src/components/EditIssue/EditIssue.tsx index f538e58..0b137ef 100644 --- a/src/components/EditIssue/EditIssue.tsx +++ b/src/components/EditIssue/EditIssue.tsx @@ -144,7 +144,6 @@ export const EditIssue = () => { async function publishQDNResource() { try { const categoryList = categoryListRef.current?.getSelectedCategories(); - if (!title) throw new Error("Please enter a title"); if (!description) throw new Error("Please enter a description"); if (!categoryList[0]) throw new Error("Please select a category"); if (!editFileProperties) return; @@ -173,10 +172,6 @@ export const EditIssue = () => { ); return; } - let fileReferences = []; - - let listOfPublishes = []; - const fullDescription = extractTextFromHTML(description); const sanitizeTitle = title .replace(/[^a-zA-Z0-9\s-]/g, "") @@ -185,6 +180,12 @@ export const EditIssue = () => { .trim() .toLowerCase(); + if (!sanitizeTitle) throw new Error("Please enter a title"); + let fileReferences = []; + + let listOfPublishes = []; + const fullDescription = extractTextFromHTML(description); + for (const publish of files) { if (publish?.identifier) { fileReferences.push(publish); diff --git a/src/components/EditPlaylist/EditPlaylist.tsx b/src/components/EditPlaylist/EditPlaylist.tsx index aab2f93..6801795 100644 --- a/src/components/EditPlaylist/EditPlaylist.tsx +++ b/src/components/EditPlaylist/EditPlaylist.tsx @@ -219,7 +219,6 @@ export const EditPlaylist = () => { async function publishQDNResource() { try { - if (!title) throw new Error("Please enter a title"); if (!description) throw new Error("Please enter a description"); if (!coverImage) throw new Error("Please select cover image"); if (!selectedCategoryVideos) throw new Error("Please select a category"); @@ -249,6 +248,16 @@ export const EditPlaylist = () => { ); return; } + + const sanitizeTitle = title + .replace(/[^a-zA-Z0-9\s-]/g, "") + .replace(/\s+/g, "-") + .replace(/-+/g, "-") + .trim() + .toLowerCase(); + + if (!sanitizeTitle) throw new Error("Please enter a title"); + const category = selectedCategoryVideos.id; const subcategory = selectedSubCategoryVideos?.id || ""; @@ -308,12 +317,7 @@ export const EditPlaylist = () => { // Description is obtained from raw data let identifier = editVideoProperties?.id; - const sanitizeTitle = title - .replace(/[^a-zA-Z0-9\s-]/g, "") - .replace(/\s+/g, "-") - .replace(/-+/g, "-") - .trim() - .toLowerCase(); + if (isNew) { identifier = `${QSUPPORT_PLAYLIST_BASE}${sanitizeTitle.slice(0, 30)}_${id}`; } diff --git a/src/components/PublishIssue/PublishIssue.tsx b/src/components/PublishIssue/PublishIssue.tsx index 2fddf9c..f4233f9 100644 --- a/src/components/PublishIssue/PublishIssue.tsx +++ b/src/components/PublishIssue/PublishIssue.tsx @@ -128,8 +128,6 @@ export const PublishIssue = ({ editId, editContent }: NewCrowdfundProps) => { try { if (!categoryListRef.current) throw new Error("No CategoryListRef found"); if (!userAddress) throw new Error("Unable to locate user address"); - - if (!title) throw new Error("Please enter a title"); if (!description) throw new Error("Please enter a description"); if (!categoryListRef.current?.getSelectedCategories()[0]) throw new Error("Please select a category"); @@ -157,18 +155,19 @@ export const PublishIssue = ({ editId, editContent }: NewCrowdfundProps) => { return; } - let fileReferences = []; - - let listOfPublishes = []; - - const fullDescription = extractTextFromHTML(description); - const sanitizeTitle = title .replace(/[^a-zA-Z0-9\s-]/g, "") .replace(/\s+/g, "-") .replace(/-+/g, "-") .trim() .toLowerCase(); + if (!sanitizeTitle) throw new Error("Please enter a title"); + + let fileReferences = []; + + let listOfPublishes = []; + + const fullDescription = extractTextFromHTML(description); for (const publish of files) { const file = publish.file; diff --git a/src/components/common/BlockedNamesModal/BlockedNamesModal-styles.ts b/src/components/common/BlockedNamesModal/BlockedNamesModal-styles.ts index 05ebf6e..02e9382 100644 --- a/src/components/common/BlockedNamesModal/BlockedNamesModal-styles.ts +++ b/src/components/common/BlockedNamesModal/BlockedNamesModal-styles.ts @@ -1,28 +1,24 @@ -import { styled } from '@mui/system'; -import { - Box, - Modal, - Typography -} from '@mui/material'; +import { styled } from "@mui/system"; +import { Box, Modal, Typography } from "@mui/material"; export const StyledModal = styled(Modal)(({ theme }) => ({ - display: 'flex', - alignItems: 'center', - justifyContent: 'center' -})) + display: "flex", + alignItems: "center", + justifyContent: "center", +})); export const ModalContent = styled(Box)(({ theme }) => ({ - backgroundColor: theme.palette.primary.main, + backgroundColor: theme.palette.background.default, padding: theme.spacing(4), borderRadius: theme.spacing(1), - width: '40%', - '&:focus': { - outline: 'none' - } -})) + width: "40%", + "&:focus": { + outline: "none", + }, +})); export const ModalText = styled(Typography)(({ theme }) => ({ fontFamily: "Raleway", fontSize: "25px", color: theme.palette.text.primary, -})); \ No newline at end of file +})); diff --git a/src/components/common/BlockedNamesModal/BlockedNamesModal.tsx b/src/components/common/BlockedNamesModal/BlockedNamesModal.tsx index 89f60c6..8883769 100644 --- a/src/components/common/BlockedNamesModal/BlockedNamesModal.tsx +++ b/src/components/common/BlockedNamesModal/BlockedNamesModal.tsx @@ -1,18 +1,9 @@ import React, { useState } from "react"; +import { Button, List, ListItem, Typography, useTheme } from "@mui/material"; import { - Box, - Button, - Modal, - Typography, - SelectChangeEvent, - ListItem, - List, - useTheme -} from "@mui/material"; -import { - StyledModal, ModalContent, - ModalText + ModalText, + StyledModal, } from "./BlockedNamesModal-styles"; interface PostModalProps { @@ -22,7 +13,7 @@ interface PostModalProps { export const BlockedNamesModal: React.FC = ({ open, - onClose + onClose, }) => { const [blockedNames, setBlockedNames] = useState([]); const theme = useTheme(); @@ -31,7 +22,7 @@ export const BlockedNamesModal: React.FC = ({ const listName = `blockedNames`; const response = await qortalRequest({ action: "GET_LIST_ITEMS", - list_name: listName + list_name: listName, }); setBlockedNames(response); } catch (error) { @@ -48,11 +39,11 @@ export const BlockedNamesModal: React.FC = ({ const response = await qortalRequest({ action: "DELETE_LIST_ITEM", list_name: "blockedNames", - item: name + item: name, }); if (response === true) { - setBlockedNames((prev) => prev.filter((n) => n !== name)); + setBlockedNames(prev => prev.filter(n => n !== name)); } } catch (error) {} }; @@ -67,22 +58,22 @@ export const BlockedNamesModal: React.FC = ({ display: "flex", flexDirection: "column", flex: "1", - overflow: "auto" + overflow: "auto", }} > {blockedNames.map((name, index) => ( {name} diff --git a/src/components/common/ConsentModal.tsx b/src/components/common/ConsentModal.tsx index fb2f534..0210c1b 100644 --- a/src/components/common/ConsentModal.tsx +++ b/src/components/common/ConsentModal.tsx @@ -7,8 +7,9 @@ import DialogContentText from "@mui/material/DialogContentText"; import DialogTitle from "@mui/material/DialogTitle"; import localForage from "localforage"; import { useTheme } from "@mui/material"; + const generalLocal = localForage.createInstance({ - name: "q-share-general", + name: "q-support-general", }); export default function ConsentModal() { @@ -44,13 +45,15 @@ export default function ConsentModal() { Welcome - Q-Share is currently in its first version and as such there could be - some bugs. The Qortal community, along with its development team and - the creators of this application, cannot be held accountable for any - content published or displayed. Also, they are not responsible for - any loss of coin due to either bad actors or bugs in the + Q-Support is currently in its first version and as such there could + be some bugs. The Qortal community, along with its development team + and the creators of this application, cannot be held accountable for + any content published or displayed. Also, they are not responsible + for any loss of coin due to either bad actors or bugs in the application. Furthermore, they bear no responsibility for any data - loss that may occur as a result of using this application. Finally, they bear no responsibility for any of the content uploaded by users. + loss that may occur as a result of using this application. Finally, + they bear no responsibility for any of the content uploaded by + users. diff --git a/src/components/common/DownloadTaskManager.tsx b/src/components/common/DownloadTaskManager.tsx index 5089b21..69d9403 100644 --- a/src/components/common/DownloadTaskManager.tsx +++ b/src/components/common/DownloadTaskManager.tsx @@ -1,8 +1,5 @@ -import React, { useState, useEffect } from 'react' +import React, { useEffect, useState } from "react"; import { - Accordion, - AccordionDetails, - AccordionSummary, Box, Button, LinearProgress, @@ -11,30 +8,26 @@ import { ListItemIcon, Popover, Typography, - useTheme -} from '@mui/material' -import { Movie } from '@mui/icons-material' -import { useSelector } from 'react-redux' -import { RootState } from '../../state/store' -import ExpandMoreIcon from '@mui/icons-material/ExpandMore' -import { useLocation, useNavigate } from 'react-router-dom' -import { DownloadingLight } from '../../assets/svgs/DownloadingLight' -import { DownloadedLight } from '../../assets/svgs/DownloadedLight' + useTheme, +} from "@mui/material"; +import { useSelector } from "react-redux"; +import { RootState } from "../../state/store"; +import { useLocation, useNavigate } from "react-router-dom"; +import { DownloadingLight } from "../../assets/svgs/DownloadingLight"; +import { DownloadedLight } from "../../assets/svgs/DownloadedLight"; import AttachFileIcon from "@mui/icons-material/AttachFile"; export const DownloadTaskManager: React.FC = () => { - const { downloads } = useSelector((state: RootState) => state.global) - const location = useLocation() - const theme = useTheme() - const [visible, setVisible] = useState(false) - const [hidden, setHidden] = useState(true) - const navigate = useNavigate() + const { downloads } = useSelector((state: RootState) => state.global); + const location = useLocation(); + const theme = useTheme(); + const [visible, setVisible] = useState(false); + const [hidden, setHidden] = useState(true); + const navigate = useNavigate(); const [anchorEl, setAnchorEl] = useState(null); - const [openDownload, setOpenDownload] = useState(false); - const handleClick = (event?: React.MouseEvent) => { const target = event?.currentTarget as unknown as HTMLButtonElement | null; setAnchorEl(target); @@ -50,155 +43,150 @@ export const DownloadTaskManager: React.FC = () => { if (visible) { setTimeout(() => { - setHidden(true) - setVisible(false) - }, 3000) + setHidden(true); + setVisible(false); + }, 3000); } - }, [visible]) - + }, [visible]); useEffect(() => { - if (Object.keys(downloads).length === 0) return - setVisible(true) - setHidden(false) - }, [downloads]) + if (Object.keys(downloads).length === 0) return; + setVisible(true); + setHidden(false); + }, [downloads]); + if (!downloads || Object.keys(downloads).length === 0) return null; + let downloadInProgress = false; if ( - !downloads || - Object.keys(downloads).length === 0 - ) - return null - - - let downloadInProgress = false - if(Object.keys(downloads).find((key)=> (downloads[key]?.status?.status !== 'READY' && downloads[key]?.status?.status !== 'DOWNLOADED'))){ - downloadInProgress = true + Object.keys(downloads).find( + key => + downloads[key]?.status?.status !== "READY" && + downloads[key]?.status?.status !== "DOWNLOADED" + ) + ) { + downloadInProgress = true; } return ( - - - { + handleClick(e); + setOpenDownload(true); + }} + > + {downloadInProgress ? ( + + ) : ( + + )} + + + + - - {Object.keys(downloads) - .map((download: any) => { - const downloadObj = downloads[download] - const progress = downloads[download]?.status?.percentLoaded || 0 - const status = downloads[download]?.status?.status - const service = downloads[download]?.service - return ( - { - const id = downloadObj?.properties?.jsonId - if (!id) return - - navigate( - `/share/${downloadObj?.properties?.name}/${id}` - ) - }} - > - - - - - - + {Object.keys(downloads).map((download: any) => { + const downloadObj = downloads[download]; + const progress = downloads[download]?.status?.percentLoaded || 0; + const status = downloads[download]?.status?.status; + const service = downloads[download]?.service; + return ( + { + const id = downloadObj?.properties?.jsonId; + if (!id) return; - - - - - {`${progress?.toFixed(0)}%`}{' '} - {status && status === 'REFETCHING' && '- refetching'} - {status && status === 'DOWNLOADED' && '- building'} - - - + + + + + + + - {downloadObj?.identifier} - - - ) - })} - - - + /> + + + {`${progress?.toFixed(0)}%`}{" "} + {status && status === "REFETCHING" && "- refetching"} + {status && status === "DOWNLOADED" && "- building"} + + + + {downloadObj?.identifier} + + + ); + })} + + - - ) -} + ); +}; diff --git a/src/constants/Identifiers.ts b/src/constants/Identifiers.ts index 446f2b3..1201657 100644 --- a/src/constants/Identifiers.ts +++ b/src/constants/Identifiers.ts @@ -1,4 +1,4 @@ -const useTestIdentifiers = false; +const useTestIdentifiers = true; export const QSUPPORT_FILE_BASE = useTestIdentifiers ? "MYTEST_support_issue_" diff --git a/src/pages/Home/Channels.tsx b/src/pages/Home/Channels.tsx index 90bffc6..d652b13 100644 --- a/src/pages/Home/Channels.tsx +++ b/src/pages/Home/Channels.tsx @@ -1,21 +1,10 @@ -import React, { useCallback, useEffect, useRef, useState } from "react"; +import React from "react"; import { useNavigate } from "react-router-dom"; import { useSelector } from "react-redux"; import { RootState } from "../../state/store"; -import { Avatar, Box, Button, Typography, useTheme } from "@mui/material"; -import { useFetchFiles } from "../../hooks/useFetchFiles.tsx"; -import LazyLoad from "../../components/common/LazyLoad"; -import { - BottomParent, - NameContainer, - VideoCard, - VideoCardName, - VideoCardTitle, - FileContainer, - VideoUploadDate, -} from "./FileList-styles.tsx"; +import { Box, useTheme } from "@mui/material"; +import { FileContainer } from "./IssueList-styles.tsx"; import ResponsiveImage from "../../components/ResponsiveImage"; -import { formatDate, formatTimestampSeconds } from "../../utils/time"; import { ChannelCard, ChannelTitle } from "./Home-styles"; interface VideoListProps { diff --git a/src/pages/Home/FileListComponentLevel.tsx b/src/pages/Home/FileListComponentLevel.tsx index 43a5b54..b384496 100644 --- a/src/pages/Home/FileListComponentLevel.tsx +++ b/src/pages/Home/FileListComponentLevel.tsx @@ -15,7 +15,7 @@ import { VideoCardName, VideoCardTitle, VideoUploadDate, -} from "./FileList-styles.tsx"; +} from "./IssueList-styles.tsx"; import { formatDate } from "../../utils/time"; import { Video } from "../../state/features/fileSlice.ts"; import { queue } from "../../wrappers/GlobalWrapper"; @@ -149,7 +149,7 @@ export const FileListComponentLevel = ({ mode }: VideoListProps) => { <> { - navigate(`/share/${fileObj?.user}/${fileObj?.id}`); + navigate(`/issue/${fileObj?.user}/${fileObj?.id}`); }} sx={{ height: "100%", diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx index 8bb41ae..e708585 100644 --- a/src/pages/Home/Home.tsx +++ b/src/pages/Home/Home.tsx @@ -2,11 +2,11 @@ import React, { useEffect, useRef, useState } from "react"; import ReactDOM from "react-dom"; import { useDispatch, useSelector } from "react-redux"; import { RootState } from "../../state/store"; -import { FileList } from "./FileList.tsx"; +import { IssueList } from "./IssueList.tsx"; import { Box, Button, Grid, Input, useTheme } from "@mui/material"; import { useFetchFiles } from "../../hooks/useFetchFiles.tsx"; import LazyLoad from "../../components/common/LazyLoad"; -import { FiltersCol, FiltersContainer } from "./FileList-styles.tsx"; +import { FiltersCol, FiltersContainer } from "./IssueList-styles.tsx"; import { SubtitleContainer } from "./Home-styles"; import { changefilterName, @@ -315,7 +315,7 @@ export const Home = ({ mode }: HomeProps) => { maxWidth: "1400px", }} > - + ({ @@ -283,6 +283,7 @@ export const BlockIconContainer = styled(Box)({ padding: "2px", borderRadius: "3px", transition: "all 0.3s ease-in-out", + fontSize: "18px", "&:hover": { cursor: "pointer", transform: "scale(1.1)", diff --git a/src/pages/Home/FileList.tsx b/src/pages/Home/IssueList.tsx similarity index 85% rename from src/pages/Home/FileList.tsx rename to src/pages/Home/IssueList.tsx index 85d7929..37bd791 100644 --- a/src/pages/Home/FileList.tsx +++ b/src/pages/Home/IssueList.tsx @@ -1,4 +1,4 @@ -import { Avatar, Box, Skeleton, Tooltip } from "@mui/material"; +import { Avatar, Box, Skeleton } from "@mui/material"; import { BlockIconContainer, BottomParent, @@ -9,7 +9,7 @@ import { VideoCardName, VideoCardTitle, VideoUploadDate, -} from "./FileList-styles.tsx"; +} from "./IssueList-styles.tsx"; import EditIcon from "@mui/icons-material/Edit"; import { blockUser, @@ -29,7 +29,7 @@ import { getIconsFromObject } from "../../constants/Categories/CategoryFunctions interface FileListProps { files: Video[]; } -export const FileList = ({ files }: FileListProps) => { +export const IssueList = ({ files }: FileListProps) => { const hashMapFiles = useSelector( (state: RootState) => state.file.hashMapFiles ); @@ -40,7 +40,7 @@ export const FileList = ({ files }: FileListProps) => { const navigate = useNavigate(); const blockUserFunc = async (user: string) => { - if (user === "Q-Share") return; + if (user === "Q-Support") return; try { const response = await qortalRequest({ @@ -88,30 +88,30 @@ export const FileList = ({ files }: FileListProps) => { }} > {fileObj?.user === username && ( - - - { - dispatch(setEditFile(fileObj)); - }} - /> - - + { + dispatch(setEditFile(fileObj)); + }} + > + + Edit Issue + )} - - - { - blockUserFunc(fileObj?.user); - }} - /> + {fileObj?.user !== username && ( + { + blockUserFunc(fileObj?.user); + }} + > + + Block User - + )} { - navigate(`/share/${fileObj?.user}/${fileObj?.id}`); + navigate(`/issue/${fileObj?.user}/${fileObj?.id}`); }} sx={{ height: "100%",