From 79565eb041948ccfb3f3942af09b903c7dd72f05 Mon Sep 17 00:00:00 2001 From: SrGooglo Date: Fri, 24 Feb 2023 14:30:48 +0000 Subject: [PATCH] remove creator --- .../Creator/creators/playlist/index.jsx | 296 ------------------ .../Creator/creators/playlist/index.less | 135 -------- .../Creator/creators/post/index.jsx | 17 - .../Creator/creators/video/index.jsx | 7 - packages/app/src/components/Creator/index.jsx | 81 ----- .../app/src/components/Creator/index.less | 78 ----- 6 files changed, 614 deletions(-) delete mode 100755 packages/app/src/components/Creator/creators/playlist/index.jsx delete mode 100755 packages/app/src/components/Creator/creators/playlist/index.less delete mode 100755 packages/app/src/components/Creator/creators/post/index.jsx delete mode 100755 packages/app/src/components/Creator/creators/video/index.jsx delete mode 100755 packages/app/src/components/Creator/index.jsx delete mode 100755 packages/app/src/components/Creator/index.less diff --git a/packages/app/src/components/Creator/creators/playlist/index.jsx b/packages/app/src/components/Creator/creators/playlist/index.jsx deleted file mode 100755 index da525090..00000000 --- a/packages/app/src/components/Creator/creators/playlist/index.jsx +++ /dev/null @@ -1,296 +0,0 @@ -import React from "react" -import * as antd from "antd" -import { DateTime } from "luxon" -import PostModel from "models/post" - -import { Icons } from "components/Icons" - -import "./index.less" - -const UploadHint = (props) => { - return
- -

Upload your tracks

-

Drag and drop your tracks here or click this box to start uploading files.

-
-} - -// TODO: Handle `cntr+v` to paste data from the clipboard to the post additions -// TODO: Send file deletion request to the server when user removes file from the list -// TODO: Make cover preview style more beautiful (E.G. Use the entire div as background) -// TODO: Make files list item can be dragged to change their order -// TODO: Make files can be modified (E.G. Change cover, change title, change artist, etc.) - -export default (props) => { - const api = app.api.withEndpoints("main") - - const [playlistName, setPlaylistName] = React.useState(null) - const [playlistDescription, setPlaylistDescription] = React.useState(null) - const [playlistArtist, setPlaylistArtist] = React.useState(null) - const [coverURL, setCoverURL] = React.useState(null) - const [fileList, setFileList] = React.useState([]) - - const [pending, setPending] = React.useState([]) - const [loading, setLoading] = React.useState(false) - - const handleTitleOnChange = (event) => { - const value = event.target.value - - if (value === "") { - return setPlaylistName(null) - } - - return setPlaylistName(event.target.value) - } - - const handleDescriptionOnChange = (event) => { - const value = event.target.value - - if (value === "") { - return setPlaylistDescription(null) - } - - return setPlaylistDescription(event.target.value) - } - - const handleArtistOnChange = (event) => { - const value = event.target.value - - if (value === "") { - return setPlaylistArtist(null) - } - - return setPlaylistArtist(event.target.value) - } - - const handleUploaderOnChange = (change) => { - switch (change.file.status) { - case "uploading": { - setPending([...pending, change.file.uid]) - break - } - case "done": { - const recivedFiles = [] - - // remove pending file - setPending(pending.filter(uid => uid !== change.file.uid)) - - // push to file list - if (Array.isArray(change.file.response)) { - recivedFiles.push(...change.file.response) - } else { - recivedFiles.push(change.file.response) - } - - // add uid to files - recivedFiles.forEach((file) => { - file.uid = change.file.uid - }) - - setFileList([...fileList, ...recivedFiles]) - - break - } - case "removed": { - // remove from file list - setFileList(fileList.filter(file => file.uid !== change.file.uid)) - } - - default: { - break - } - } - } - - const handleCoverUploaderOnChange = (change) => { - switch (change.file.status) { - case "uploading": { - setPending([...pending, change.file.uid]) - break - } - case "done": { - // remove pending file - setPending(pending.filter(uid => uid !== change.file.uid)) - - setCoverURL(change.file.response[0].url) - - break - } - case "removed": { - setCoverURL(null) - } - - default: { - break - } - } - } - - const handleUpload = async (req) => { - // get file data - const file = req.file - - // append to form data - const formData = new FormData() - formData.append("files", file) - - // send request - const request = await api.post.upload(formData, undefined).catch((error) => { - console.error(error) - antd.message.error(error) - req.onError(error) - - return false - }) - - if (request) { - return req.onSuccess(request) - } - } - - const checkCanSubmit = () => { - const nameValid = playlistName !== null && playlistName.length !== 0 - const filesListValid = fileList.length !== 0 - const isPending = pending.length !== 0 - - return nameValid && filesListValid && !isPending - } - - const handleSubmit = async () => { - setLoading(true) - - let RequestData = { - type: "playlist", - message: playlistDescription ?? "No description", - timestamp: DateTime.local().toISO(), - data: { - title: playlistName, - cover: coverURL, - artist: playlistArtist, - playlist: fileList.map((file) => { - return { - title: file.name, - cover: file.cover ?? coverURL, - artist: file.artist ?? "Unknown", - src: file.url, - } - }) - } - } - - const response = await PostModel.create(RequestData).catch(error => { - console.error(error) - antd.message.error(error) - - return false - }) - - setLoading(false) - - if (response) { - if (typeof props.close === "function") { - props.close() - } - } - } - - return
-
-
- - -
-
- - -
-
- - -
-
- - { - coverURL &&
- cover - { - setCoverURL(null) - }} - icon={} - shape="round" - > - Remove Cover - -
- } - { - !coverURL && - }>Upload cover - - } -
- -
- - {fileList.length === 0 ? : }> - Upload files - } - -
- -
- } - loading={loading} - onClick={handleSubmit} - > - Publish - -
- -
-

- Uploading files that are not permitted by our app.setLocation("/terms")}>Terms of Service may result in your account being suspended. -

-
-
-
-} \ No newline at end of file diff --git a/packages/app/src/components/Creator/creators/playlist/index.less b/packages/app/src/components/Creator/creators/playlist/index.less deleted file mode 100755 index 5afe1963..00000000 --- a/packages/app/src/components/Creator/creators/playlist/index.less +++ /dev/null @@ -1,135 +0,0 @@ -.playlistCreator { - display: flex; - flex-direction: column; - - align-items: center; - justify-content: center; - - width: 100%; - - .inputField { - display: inline-flex; - flex-direction: row; - - align-self: start; - align-items: center; - justify-content: flex-start; - - width: 100%; - - margin-bottom: 20px; - - font-size: 2rem; - - color: var(--text-color); - - h1, - h2, - h3, - h4, - h5, - h6, - p, - span { - color: var(--text-color); - } - - .inputText { - width: 100%; - color: var(--text-color); - } - - .coverUploader { - width: 100px; - } - - .coverPreview { - height: 5vh; - - img { - height: 100%; - border-radius: 10px; - margin-right: 10px; - } - - svg { - margin: 0 !important; - } - } - } - - .files { - display: flex; - flex-direction: column; - - align-items: center; - justify-content: center; - - border: 1px solid var(--border-color); - border-radius: 8px; - - width: 100%; - height: 100%; - - padding: 10px; - margin-bottom: 20px; - - .uploader, - .ant-upload { - display: flex; - flex-direction: column; - - align-items: center; - justify-content: center; - - width: 100%; - } - - .ant-upload-list, - .ant-upload-list-picture-container { - width: 100%; - } - - .ant-upload-list-item-thumbnail { - display: inline-flex; - flex-direction: row; - align-items: center; - justify-content: center; - } - - .ant-upload-list-item { - display: inline-flex; - flex-direction: row; - - align-items: center; - justify-content: space-between; - - width: 100%; - } - } - - .uploadHint { - display: flex; - flex-direction: column; - - align-self: center; - align-items: center; - justify-content: center; - - width: 100%; - height: 100%; - - svg { - font-size: 3rem; - } - - h3 { - font-size: 1.5rem; - } - } - - .footer { - position: relative; - padding: 10px; - } -} \ No newline at end of file diff --git a/packages/app/src/components/Creator/creators/post/index.jsx b/packages/app/src/components/Creator/creators/post/index.jsx deleted file mode 100755 index dc5d8570..00000000 --- a/packages/app/src/components/Creator/creators/post/index.jsx +++ /dev/null @@ -1,17 +0,0 @@ -import React from "react" - -import { PostCreator } from "components" - -export default (props) => { - const handleOnPost = () => { - if (typeof props.close === "function") { - return props.close() - } else { - console.error("No close function provided") - } - } - - return
- -
-} diff --git a/packages/app/src/components/Creator/creators/video/index.jsx b/packages/app/src/components/Creator/creators/video/index.jsx deleted file mode 100755 index 3fc9daf8..00000000 --- a/packages/app/src/components/Creator/creators/video/index.jsx +++ /dev/null @@ -1,7 +0,0 @@ -import React from "react" - -export default (props) => { - return
-

Video Creator

-
-} \ No newline at end of file diff --git a/packages/app/src/components/Creator/index.jsx b/packages/app/src/components/Creator/index.jsx deleted file mode 100755 index 21e12799..00000000 --- a/packages/app/src/components/Creator/index.jsx +++ /dev/null @@ -1,81 +0,0 @@ -import React from "react" -import { Button } from "antd" -import { Icons, createIconRender } from "components/Icons" - -import PostCreator from "./creators/post" -import PlaylistCreator from "./creators/playlist" -import VideoCreator from "./creators/video" - -import "./index.less" - -const CreatorsTypes = { - post: { - label: "Text Post", - icon: "FileText", - component: PostCreator - }, - playlist: { - label: "Playlist", - icon: "Music", - component: PlaylistCreator - }, - video: { - label: "Video", - icon: "Video", - component: VideoCreator, - disabled: true - } -} - -export default class Creator extends React.Component { - state = { - type: null - } - - handleCreatorType = (type) => { - this.setState({ type }) - } - - renderCreator = (...props) => { - if (!this.state.type) { - return
- {Object.keys(CreatorsTypes).map((type) => { - const { label, icon = "PlusCircle" } = CreatorsTypes[type] - - return - })} -
- } - - if (!CreatorsTypes[this.state.type]) { - return
-

Creator not found

-
- } - - return React.createElement(CreatorsTypes[this.state.type].component, this.props) - } - - render() { - return
-
-

Creator

- {!this.state.type ?

Select an type to start creating...

:
- -
} -
- - {this.renderCreator()} -
- } -} \ No newline at end of file diff --git a/packages/app/src/components/Creator/index.less b/packages/app/src/components/Creator/index.less deleted file mode 100755 index e92f7efb..00000000 --- a/packages/app/src/components/Creator/index.less +++ /dev/null @@ -1,78 +0,0 @@ -.creator { - display: flex; - - flex-direction: column; - - color: var(--text-color); - - h1 { - font-size: 2.5rem; - } - - h1, - h2, - h3, - h4, - h5, - h6, - p, - span { - color: var(--text-color); - margin: 0; - } - - .header { - display: flex; - flex-direction: row; - - justify-content: space-between; - align-items: center; - - margin-bottom: 20px; - } - - .typeSelector { - display: flex; - flex-direction: row; - - flex-wrap: wrap; - - align-items: center; - justify-content: center; - - .typeButton { - display: flex; - flex-direction: column; - - align-items: center; - justify-content: center; - - height: 100px; - width: 100px; - - padding: 20px; - margin: 0 10px; - - font-size: 1.2rem; - - svg { - font-size: 3rem; - margin: 0 0 5px 0 !important; - } - - span { - font-size: 1rem; - } - - border-radius: 8px; - } - } - - .content { - display: flex; - flex-direction: column; - - align-items: center; - justify-content: center; - } -} \ No newline at end of file