From 9acbe7d9aff9f5cd375f8874321b65999be0f28a Mon Sep 17 00:00:00 2001 From: emmanuelokoye Date: Sun, 7 Nov 2021 07:40:42 +0100 Subject: [PATCH 01/28] fix for the like song by user endpoint. --- server/music/serializers.py | 5 ++--- server/music/views.py | 17 ++++++++++------- 2 files changed, 12 insertions(+), 10 deletions(-) diff --git a/server/music/serializers.py b/server/music/serializers.py index d0de61b1..c7f53a6b 100644 --- a/server/music/serializers.py +++ b/server/music/serializers.py @@ -42,9 +42,8 @@ def __str__(self): class LikeSongSerializer(serializers.Serializer): song_id = serializers.CharField(max_length=100, required=False) - memberId = serializers.ListField( - child=serializers.CharField(max_length=100), allow_empty=False - ) + memberId = serializers.CharField(max_length=100, required=False) + class SongLikeCountSerializer(serializers.Serializer): diff --git a/server/music/views.py b/server/music/views.py index adb54d11..97ece87c 100644 --- a/server/music/views.py +++ b/server/music/views.py @@ -346,7 +346,7 @@ class LikeSongView(APIView): description="user likes song", methods=["POST"], ) - def post(self, request, org_id, song_id): + def post(self, request, *args, **kwargs): helper = DataStorage() helper.organization_id = org_id serializer = LikeSongSerializer(data=request.data) @@ -356,21 +356,24 @@ def post(self, request, org_id, song_id): member_ids = data["memberId"] song_data = helper.read("songs", {"_id": song_id}) if song_data and song_data.get("status_code", None) is None: - users_id = song_data.get("memberId") - new_songs = list(set(member_ids).difference(set(users_id))) - list(map(lambda x: users_id.append(x), new_songs)) - if new_songs: - response = helper.update("songs", song_id, {"memberId": users_id}) + users_id = song_data.get("likedBy") + if member_ids not in users_id: + users_id.append(member_ids) + if users_id: + response = helper.update("songs", song_id, {"likedBy": users_id}) if response.get("status") == 200: response_output = { "event": "like_song", "message": response.get("message"), "data": { "song_id": data["song_id"], - "new_ids": new_songs, + "new_ids": member_ids, "action": "song liked successfully", }, } + return Response( + response_output, status=status.HTTP_424_FAILED_DEPENDENCY + ) return Response( "Song not liked", status=status.HTTP_424_FAILED_DEPENDENCY ) From 6dbc57253a8ef7169878bb893571350abcd0a636 Mon Sep 17 00:00:00 2001 From: pauline-banye Date: Sun, 7 Nov 2021 09:37:59 +0100 Subject: [PATCH 02/28] updated readme.md links --- server/config/settings.py | 5 ++++- server/music/urls.py | 2 ++ server/music/views.py | 1 + 3 files changed, 7 insertions(+), 1 deletion(-) diff --git a/server/config/settings.py b/server/config/settings.py index 48f7b93c..941b3c29 100644 --- a/server/config/settings.py +++ b/server/config/settings.py @@ -22,7 +22,10 @@ SYSTEM_ENV = env("SYSTEM_ENV") # switches DEBUG to true or false based on the Environment variable -DEBUG = SYSTEM_ENV == "Development" +if SYSTEM_ENV == "Development": + DEBUG = True +else: + DEBUG = False print(DEBUG) ALLOWED_HOSTS = [ diff --git a/server/music/urls.py b/server/music/urls.py index 21d03568..d60d0060 100644 --- a/server/music/urls.py +++ b/server/music/urls.py @@ -102,3 +102,5 @@ name="adduser", ), # add user ] + + diff --git a/server/music/views.py b/server/music/views.py index adb54d11..06ffe5ec 100644 --- a/server/music/views.py +++ b/server/music/views.py @@ -262,6 +262,7 @@ class songLikeCountView(APIView): description="song likes/unlikes count", methods=["POST"], ) + def post(self, request, *args, **kwargs): serializer = SongLikeCountSerializer(data=request.data) x = DataStorage() From 0e6b3c21cfcd973a9638b24cc0b82bf31088e1e1 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Mon, 8 Nov 2021 11:38:38 +0100 Subject: [PATCH 03/28] now controlling chat modal --- root/src/index.ejs | 4 ++-- root/src/zuri-root-config.ts | 4 +++- server/client/src/components/musicRoom.tsx | 6 ++++-- server/client/src/components/playlist.tsx | 2 +- 4 files changed, 10 insertions(+), 6 deletions(-) diff --git a/root/src/index.ejs b/root/src/index.ejs index 13bc36b9..6a869672 100644 --- a/root/src/index.ejs +++ b/root/src/index.ejs @@ -66,8 +66,8 @@ diff --git a/root/src/zuri-root-config.ts b/root/src/zuri-root-config.ts index 76ad47a8..2a3589b3 100644 --- a/root/src/zuri-root-config.ts +++ b/root/src/zuri-root-config.ts @@ -37,7 +37,9 @@ function customRegister(env: "dev" | "prod") { registerApplication({ name: "@zuri/zuri-plugin-music", app: () => - System.import("https://music.zuri.chat/static/zuri-music-plugin.js"), + System.import( + "https://staging.zuri.chat/music/static/zuri-music-plugin.js" + ), activeWhen: ["/"] }); } diff --git a/server/client/src/components/musicRoom.tsx b/server/client/src/components/musicRoom.tsx index 48dcb521..a52c9a30 100644 --- a/server/client/src/components/musicRoom.tsx +++ b/server/client/src/components/musicRoom.tsx @@ -86,8 +86,8 @@ function MusicRoom() {
- - {/* */} + {/* */} +
); @@ -117,7 +117,9 @@ const Wrapper = styled.div<{ overflowMain: boolean }>` } .room-chat-container { + position: relative; margin-top: 5px; + width: 500px; } .room-main::-webkit-scrollbar, diff --git a/server/client/src/components/playlist.tsx b/server/client/src/components/playlist.tsx index ce841034..4380429e 100644 --- a/server/client/src/components/playlist.tsx +++ b/server/client/src/components/playlist.tsx @@ -17,7 +17,7 @@ function Playlist() { return ( - + {/* */} {songs.length === 0 && } From 89d7ef69b2dadf85baf2796abd6a8747fc62b36d Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Mon, 8 Nov 2021 11:39:25 +0100 Subject: [PATCH 04/28] still controlling chat modal width --- server/client/src/components/playlist.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/server/client/src/components/playlist.tsx b/server/client/src/components/playlist.tsx index 4380429e..ce841034 100644 --- a/server/client/src/components/playlist.tsx +++ b/server/client/src/components/playlist.tsx @@ -17,7 +17,7 @@ function Playlist() { return ( - {/* */} + {songs.length === 0 && } From fc270a843239b61ef7c5f565f32138eb7293eab9 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Mon, 8 Nov 2021 12:01:51 +0100 Subject: [PATCH 05/28] added chat type and clean-up --- server/client/src/components/musicRoom.tsx | 6 +----- server/client/src/types.tsx | 20 ++++++++++++++++++++ 2 files changed, 21 insertions(+), 5 deletions(-) diff --git a/server/client/src/components/musicRoom.tsx b/server/client/src/components/musicRoom.tsx index a52c9a30..763e255c 100644 --- a/server/client/src/components/musicRoom.tsx +++ b/server/client/src/components/musicRoom.tsx @@ -3,9 +3,7 @@ import { ToastContainer } from "react-toastify"; import Parcel from "single-spa-react/parcel"; import { pluginHeader, headerConfig } from "../utils/config"; import { MessageBoard } from "@zuri/zuri-ui"; -// import RoomHeader from "./roomHeader"; import Playlist from "./playlist"; -import Chat from "./chat"; import PasteUrl from "./common/pasteUrl"; import EnterRoomModal from "./modals/enterRoom"; import { useAppDispatch, useAppSelector } from "../app/hooks"; @@ -45,6 +43,7 @@ function MusicRoom() { username: "Aleey", imageUrl: "" }, + messages: chatData(), showChatSideBar: true, @@ -80,13 +79,10 @@ function MusicRoom() { /> - {/* */} -
- {/* */}
diff --git a/server/client/src/types.tsx b/server/client/src/types.tsx index 2f52f75a..643c8c30 100644 --- a/server/client/src/types.tsx +++ b/server/client/src/types.tsx @@ -46,6 +46,26 @@ declare global { avatar: string; } + interface ChatN { + username: string; + id: number; + time: string; + imageUrl: string; + emojies: { name: string; count: number; emoji: string }[]; + richUiData: { + blocks: { + data: {}; + depth: number; + entityRanges: []; + inlineStyleRanges: []; + key: string; + text: string; + type: string; + }[]; + entityMap: {}; + }; + } + interface User { id: string; name: string; From fd2006c1bcf9b8dd4d8167bc929f1075e68ee923 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Tue, 9 Nov 2021 23:29:12 +0100 Subject: [PATCH 06/28] fix: deleted all unnecessary .d.ts files --- server/client/src/App.d.ts | 7 -- server/client/src/app/chatsSlice.d.ts | 9 -- server/client/src/app/deleteSongSlice.d.ts | 7 -- server/client/src/app/hooks.d.ts | 56 ------------- server/client/src/app/playerSlice.d.ts | 16 ---- server/client/src/app/reducer.d.ts | 28 ------- server/client/src/app/songsSlice.d.ts | 17 ---- server/client/src/app/store.d.ts | 84 ------------------- server/client/src/app/uiSlice.d.ts | 21 ----- server/client/src/app/usersSlice.d.ts | 20 ----- server/client/src/components/chat.d.ts | 3 - server/client/src/components/common/Home.d.ts | 3 - .../client/src/components/common/button.d.ts | 8 -- .../src/components/common/chatHeader.d.ts | 3 - .../src/components/common/chatInput.d.ts | 3 - .../src/components/common/chatItem.d.ts | 15 ---- .../src/components/common/emptyScreen.d.ts | 3 - server/client/src/components/common/exit.d.ts | 3 - .../src/components/common/filterBar.d.ts | 3 - .../client/src/components/common/footer.d.ts | 3 - .../client/src/components/common/header.d.ts | 3 - server/client/src/components/common/like.d.ts | 8 -- .../components/common/likeOptionCount.d.ts | 3 - .../src/components/common/maintenance.d.ts | 1 - .../src/components/common/memberItem.d.ts | 9 -- .../src/components/common/optionMenu.d.ts | 9 -- .../src/components/common/pasteUrl.d.ts | 6 -- .../src/components/common/playlistHeader.d.ts | 3 - .../src/components/common/playlistItem.d.ts | 7 -- .../src/components/common/playlistItems.d.ts | 6 -- .../src/components/common/searchBar.d.ts | 3 - .../client/src/components/common/sortBar.d.ts | 3 - server/client/src/components/deleteModal.d.ts | 3 - server/client/src/components/landingPage.d.ts | 3 - server/client/src/components/memberList.d.ts | 6 -- .../src/components/modals/enterRoom.d.ts | 6 -- server/client/src/components/musicRoom.d.ts | 3 - server/client/src/components/player.d.ts | 4 - server/client/src/components/playlist.d.ts | 3 - server/client/src/components/roomHeader.d.ts | 3 - .../client/src/components/searchFilter.d.ts | 3 - server/client/src/root.component.d.ts | 2 - server/client/src/services/authService.d.ts | 1 - server/client/src/services/chatService.d.ts | 11 --- server/client/src/services/eventService.d.ts | 4 - server/client/src/services/httpService.d.ts | 40 --------- server/client/src/services/logService.d.ts | 7 -- server/client/src/services/songService.d.ts | 7 -- server/client/src/services/userService.d.ts | 15 ---- server/client/src/tests/App.test.d.ts | 1 - server/client/src/tests/player.test.d.ts | 1 - .../client/src/tests/root.component.test.d.ts | 1 - server/client/src/types.d.ts | 48 ----------- server/client/src/utils/chatMedia.d.ts | 1 - server/client/src/utils/config.d.ts | 17 ---- server/client/src/utils/idGenerator.d.ts | 2 - server/client/src/utils/metadata.d.ts | 1 - server/client/src/utils/mockdata.d.ts | 23 ----- server/client/src/utils/sanitizer.d.ts | 1 - server/client/src/utils/song.d.ts | 1 - server/client/src/utils/syncArray.d.ts | 1 - server/client/src/zuri-music-plugin.d.ts | 2 - 62 files changed, 594 deletions(-) delete mode 100644 server/client/src/App.d.ts delete mode 100644 server/client/src/app/chatsSlice.d.ts delete mode 100644 server/client/src/app/deleteSongSlice.d.ts delete mode 100644 server/client/src/app/hooks.d.ts delete mode 100644 server/client/src/app/playerSlice.d.ts delete mode 100644 server/client/src/app/reducer.d.ts delete mode 100644 server/client/src/app/songsSlice.d.ts delete mode 100644 server/client/src/app/store.d.ts delete mode 100644 server/client/src/app/uiSlice.d.ts delete mode 100644 server/client/src/app/usersSlice.d.ts delete mode 100644 server/client/src/components/chat.d.ts delete mode 100644 server/client/src/components/common/Home.d.ts delete mode 100644 server/client/src/components/common/button.d.ts delete mode 100644 server/client/src/components/common/chatHeader.d.ts delete mode 100644 server/client/src/components/common/chatInput.d.ts delete mode 100644 server/client/src/components/common/chatItem.d.ts delete mode 100644 server/client/src/components/common/emptyScreen.d.ts delete mode 100644 server/client/src/components/common/exit.d.ts delete mode 100644 server/client/src/components/common/filterBar.d.ts delete mode 100644 server/client/src/components/common/footer.d.ts delete mode 100644 server/client/src/components/common/header.d.ts delete mode 100644 server/client/src/components/common/like.d.ts delete mode 100644 server/client/src/components/common/likeOptionCount.d.ts delete mode 100644 server/client/src/components/common/maintenance.d.ts delete mode 100644 server/client/src/components/common/memberItem.d.ts delete mode 100644 server/client/src/components/common/optionMenu.d.ts delete mode 100644 server/client/src/components/common/pasteUrl.d.ts delete mode 100644 server/client/src/components/common/playlistHeader.d.ts delete mode 100644 server/client/src/components/common/playlistItem.d.ts delete mode 100644 server/client/src/components/common/playlistItems.d.ts delete mode 100644 server/client/src/components/common/searchBar.d.ts delete mode 100644 server/client/src/components/common/sortBar.d.ts delete mode 100644 server/client/src/components/deleteModal.d.ts delete mode 100644 server/client/src/components/landingPage.d.ts delete mode 100644 server/client/src/components/memberList.d.ts delete mode 100644 server/client/src/components/modals/enterRoom.d.ts delete mode 100644 server/client/src/components/musicRoom.d.ts delete mode 100644 server/client/src/components/player.d.ts delete mode 100644 server/client/src/components/playlist.d.ts delete mode 100644 server/client/src/components/roomHeader.d.ts delete mode 100644 server/client/src/components/searchFilter.d.ts delete mode 100644 server/client/src/root.component.d.ts delete mode 100644 server/client/src/services/authService.d.ts delete mode 100644 server/client/src/services/chatService.d.ts delete mode 100644 server/client/src/services/eventService.d.ts delete mode 100644 server/client/src/services/httpService.d.ts delete mode 100644 server/client/src/services/logService.d.ts delete mode 100644 server/client/src/services/songService.d.ts delete mode 100644 server/client/src/services/userService.d.ts delete mode 100644 server/client/src/tests/App.test.d.ts delete mode 100644 server/client/src/tests/player.test.d.ts delete mode 100644 server/client/src/tests/root.component.test.d.ts delete mode 100644 server/client/src/types.d.ts delete mode 100644 server/client/src/utils/chatMedia.d.ts delete mode 100644 server/client/src/utils/config.d.ts delete mode 100644 server/client/src/utils/idGenerator.d.ts delete mode 100644 server/client/src/utils/metadata.d.ts delete mode 100644 server/client/src/utils/mockdata.d.ts delete mode 100644 server/client/src/utils/sanitizer.d.ts delete mode 100644 server/client/src/utils/song.d.ts delete mode 100644 server/client/src/utils/syncArray.d.ts delete mode 100644 server/client/src/zuri-music-plugin.d.ts diff --git a/server/client/src/App.d.ts b/server/client/src/App.d.ts deleted file mode 100644 index 05a35b14..00000000 --- a/server/client/src/App.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -/// -import "moment-timezone"; -import "react-toastify/dist/ReactToastify.css"; -import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; -import "./App.css"; -declare function App(): JSX.Element; -export default App; diff --git a/server/client/src/app/chatsSlice.d.ts b/server/client/src/app/chatsSlice.d.ts deleted file mode 100644 index 6bcbdf43..00000000 --- a/server/client/src/app/chatsSlice.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { RootState } from "./store"; -export declare const addedChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setChats: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, failChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removeChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, sentChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectChats: (state: RootState) => Chat[]; -export declare const selectChatById: (id: string) => (state: RootState) => Chat; -export declare const selectLastChat: (state: RootState) => Chat; -declare const _default: import("redux").Reducer; -export default _default; diff --git a/server/client/src/app/deleteSongSlice.d.ts b/server/client/src/app/deleteSongSlice.d.ts deleted file mode 100644 index fce0da98..00000000 --- a/server/client/src/app/deleteSongSlice.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { RootState } from "./store"; -export declare const updatedSongId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectUpdateId: (state: RootState) => string; -declare const _default: import("redux").Reducer<{ - updateId: string; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/hooks.d.ts b/server/client/src/app/hooks.d.ts deleted file mode 100644 index e3d57645..00000000 --- a/server/client/src/app/hooks.d.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { TypedUseSelectorHook } from "react-redux"; -import type { RootState } from "./store"; -export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, null, import("redux").AnyAction> & import("redux-thunk").ThunkDispatch<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, undefined, import("redux").AnyAction> & import("redux").Dispatch; -export declare const useAppSelector: TypedUseSelectorHook; diff --git a/server/client/src/app/playerSlice.d.ts b/server/client/src/app/playerSlice.d.ts deleted file mode 100644 index 8a6595a9..00000000 --- a/server/client/src/app/playerSlice.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { RootState } from "./store"; -export declare const changedPlaying: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedPlayer: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, changedCurrentSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>; -export declare const getPlayerState: (state: RootState) => { - playing: boolean; - show: boolean; - currentSongId: string; -}; -export declare const selectCurrentSong: (state: RootState) => Song; -declare const _default: import("redux").Reducer<{ - playing: boolean; - show: boolean; - currentSongId: string; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/reducer.d.ts b/server/client/src/app/reducer.d.ts deleted file mode 100644 index 6472195d..00000000 --- a/server/client/src/app/reducer.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -declare const reducer: { - users: import("redux").Reducer<{ - currentUser: User; - isMember: boolean; - users: User[]; - }, import("redux").AnyAction>; - chats: import("redux").Reducer; - songs: import("redux").Reducer; - ui: import("redux").Reducer<{ - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }, import("redux").AnyAction>; - player: import("redux").Reducer<{ - playing: boolean; - show: boolean; - currentSongId: string; - }, import("redux").AnyAction>; - delete: import("redux").Reducer<{ - updateId: string; - }, import("redux").AnyAction>; -}; -export default reducer; diff --git a/server/client/src/app/songsSlice.d.ts b/server/client/src/app/songsSlice.d.ts deleted file mode 100644 index 8ad971d2..00000000 --- a/server/client/src/app/songsSlice.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { RootState } from "./store"; -export declare const addedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, likedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, initializedSongs: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectSongs: (state: RootState) => Song[]; -export declare const selectSongById: (songId: string) => (state: RootState) => Song; -export declare const selectSongByUrl: (url: string) => (state: RootState) => Song; -export declare const selectFirstSong: (state: RootState) => Song; -export declare const selectLikeCount: ({ songId, userId }: { - songId: string; - userId: string; -}) => (state: RootState) => { - count: number; - liked: boolean; -}; -declare const _default: import("redux").Reducer; -export default _default; diff --git a/server/client/src/app/store.d.ts b/server/client/src/app/store.d.ts deleted file mode 100644 index 7a8e140f..00000000 --- a/server/client/src/app/store.d.ts +++ /dev/null @@ -1,84 +0,0 @@ -import { ThunkAction, Action } from "@reduxjs/toolkit"; -declare const store: import("@reduxjs/toolkit").EnhancedStore<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, [import("redux-thunk").ThunkMiddleware<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, null> | import("redux-thunk").ThunkMiddleware<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, undefined>]>; -export declare type AppDispatch = typeof store.dispatch; -export declare type RootState = ReturnType; -export declare type AppThunk = ThunkAction>; -export default store; diff --git a/server/client/src/app/uiSlice.d.ts b/server/client/src/app/uiSlice.d.ts deleted file mode 100644 index a0ed40e7..00000000 --- a/server/client/src/app/uiSlice.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { RootState } from "./store"; -export declare const loaded: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedPasteUrl: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, exitedModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedMemberList: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedDeleteModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setEnterModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectShowChat: (state: RootState) => boolean; -export declare const selectShowPasteUrl: (state: RootState) => boolean; -export declare const selectIsLoading: (state: RootState) => boolean; -export declare const selectShowModal: (state: RootState) => boolean; -export declare const selectShowExitModal: (state: RootState) => boolean; -export declare const selectShowMemberList: (state: RootState) => boolean; -export declare const selectShowDeleteModal: (state: RootState) => boolean; -export declare const selectEnterModal: (state: RootState) => boolean; -declare const _default: import("redux").Reducer<{ - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/usersSlice.d.ts b/server/client/src/app/usersSlice.d.ts deleted file mode 100644 index ff79d643..00000000 --- a/server/client/src/app/usersSlice.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { RootState } from "./store"; -export declare const setCurrentUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, addedUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setUsers: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removedUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, setMembership: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectCurrentUser: (state: RootState) => User; -export declare const selectUserList: (state: RootState) => User[]; -export declare const selectUserById: (id: string) => (state: RootState) => User; -export declare const selectUserCount: (state: RootState) => number; -export declare const selectIsMember: (state: RootState) => boolean; -export declare const selectAllUsers: (state: RootState) => { - currentUser: User; - isMember: boolean; - users: User[]; -}; -declare const _default: import("redux").Reducer<{ - currentUser: User; - isMember: boolean; - users: User[]; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/components/chat.d.ts b/server/client/src/components/chat.d.ts deleted file mode 100644 index 34145db0..00000000 --- a/server/client/src/components/chat.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Chat(props: any): JSX.Element; -export default Chat; diff --git a/server/client/src/components/common/Home.d.ts b/server/client/src/components/common/Home.d.ts deleted file mode 100644 index 013f8033..00000000 --- a/server/client/src/components/common/Home.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Home(): JSX.Element; -export default Home; diff --git a/server/client/src/components/common/button.d.ts b/server/client/src/components/common/button.d.ts deleted file mode 100644 index a6dfb84e..00000000 --- a/server/client/src/components/common/button.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -import React from "react"; -interface Props { - color?: "primary" | "secondary" | "disabled"; - className?: string; - onClick: () => void; -} -declare const Button: React.FC; -export default Button; diff --git a/server/client/src/components/common/chatHeader.d.ts b/server/client/src/components/common/chatHeader.d.ts deleted file mode 100644 index f2441e1f..00000000 --- a/server/client/src/components/common/chatHeader.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function ChatHeader(): JSX.Element; -export default ChatHeader; diff --git a/server/client/src/components/common/chatInput.d.ts b/server/client/src/components/common/chatInput.d.ts deleted file mode 100644 index 0c1f765f..00000000 --- a/server/client/src/components/common/chatInput.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function ChatInput(props: any): JSX.Element; -export default ChatInput; diff --git a/server/client/src/components/common/chatItem.d.ts b/server/client/src/components/common/chatItem.d.ts deleted file mode 100644 index 7d1433cf..00000000 --- a/server/client/src/components/common/chatItem.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -/// -declare function ChatItem({ onCancel, onResend, id, name, avatar, time, message, userId, notSent, failed, users }: { - onCancel: any; - onResend: any; - id: any; - name: any; - avatar: any; - time: any; - message: any; - userId: any; - notSent?: boolean; - failed?: boolean; - users: any; -}): JSX.Element; -export default ChatItem; diff --git a/server/client/src/components/common/emptyScreen.d.ts b/server/client/src/components/common/emptyScreen.d.ts deleted file mode 100644 index 80fd69ec..00000000 --- a/server/client/src/components/common/emptyScreen.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const EmptyScreen: () => JSX.Element; -export default EmptyScreen; diff --git a/server/client/src/components/common/exit.d.ts b/server/client/src/components/common/exit.d.ts deleted file mode 100644 index c854c023..00000000 --- a/server/client/src/components/common/exit.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const Exit: () => JSX.Element; -export default Exit; diff --git a/server/client/src/components/common/filterBar.d.ts b/server/client/src/components/common/filterBar.d.ts deleted file mode 100644 index fd594148..00000000 --- a/server/client/src/components/common/filterBar.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Filterbar(): JSX.Element; -export default Filterbar; diff --git a/server/client/src/components/common/footer.d.ts b/server/client/src/components/common/footer.d.ts deleted file mode 100644 index aa1b7595..00000000 --- a/server/client/src/components/common/footer.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Footer(): JSX.Element; -export default Footer; diff --git a/server/client/src/components/common/header.d.ts b/server/client/src/components/common/header.d.ts deleted file mode 100644 index c7a52af5..00000000 --- a/server/client/src/components/common/header.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Header(): JSX.Element; -export default Header; diff --git a/server/client/src/components/common/like.d.ts b/server/client/src/components/common/like.d.ts deleted file mode 100644 index 0a90650f..00000000 --- a/server/client/src/components/common/like.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -/// -interface Props { - liked: boolean; - onLike: () => void; - className?: string; -} -declare function Like({ liked, onLike, className }: Props): JSX.Element; -export default Like; diff --git a/server/client/src/components/common/likeOptionCount.d.ts b/server/client/src/components/common/likeOptionCount.d.ts deleted file mode 100644 index 94e7871c..00000000 --- a/server/client/src/components/common/likeOptionCount.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function LikeOptionCount(props: any): JSX.Element; -export default LikeOptionCount; diff --git a/server/client/src/components/common/maintenance.d.ts b/server/client/src/components/common/maintenance.d.ts deleted file mode 100644 index cb0ff5c3..00000000 --- a/server/client/src/components/common/maintenance.d.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/server/client/src/components/common/memberItem.d.ts b/server/client/src/components/common/memberItem.d.ts deleted file mode 100644 index ad5c37f7..00000000 --- a/server/client/src/components/common/memberItem.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -/// -interface Props { - status: boolean; - name: string; - desc: string; - avatar: string; -} -declare const MemberItem: ({ name, status, desc, avatar }: Props) => JSX.Element; -export default MemberItem; diff --git a/server/client/src/components/common/optionMenu.d.ts b/server/client/src/components/common/optionMenu.d.ts deleted file mode 100644 index 781a4897..00000000 --- a/server/client/src/components/common/optionMenu.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -/// -declare const OptionMenu: ({ toggleOption, option, url, songId, userId }: { - toggleOption: any; - option: any; - url: any; - songId: any; - userId: any; -}) => JSX.Element; -export default OptionMenu; diff --git a/server/client/src/components/common/pasteUrl.d.ts b/server/client/src/components/common/pasteUrl.d.ts deleted file mode 100644 index 7a7cd376..00000000 --- a/server/client/src/components/common/pasteUrl.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -/// -interface Props { - getSongByUrl: (url: string) => Song; -} -declare const _default: import("react-redux").ConnectedComponent<(props: Props) => JSX.Element, import("react-redux").Omit>; -export default _default; diff --git a/server/client/src/components/common/playlistHeader.d.ts b/server/client/src/components/common/playlistHeader.d.ts deleted file mode 100644 index 8f535040..00000000 --- a/server/client/src/components/common/playlistHeader.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const PlaylistHeader: () => JSX.Element; -export default PlaylistHeader; diff --git a/server/client/src/components/common/playlistItem.d.ts b/server/client/src/components/common/playlistItem.d.ts deleted file mode 100644 index 40280fbe..00000000 --- a/server/client/src/components/common/playlistItem.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -/// -interface Props { - song: Song; - users: User[]; -} -declare function PlaylistItem(props: Props): JSX.Element; -export default PlaylistItem; diff --git a/server/client/src/components/common/playlistItems.d.ts b/server/client/src/components/common/playlistItems.d.ts deleted file mode 100644 index f7ff9bee..00000000 --- a/server/client/src/components/common/playlistItems.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -/// -interface Props { - songs: Song[]; -} -declare function PlaylistItems({ songs }: Props): JSX.Element; -export default PlaylistItems; diff --git a/server/client/src/components/common/searchBar.d.ts b/server/client/src/components/common/searchBar.d.ts deleted file mode 100644 index 7a274335..00000000 --- a/server/client/src/components/common/searchBar.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function SearchBar(): JSX.Element; -export default SearchBar; diff --git a/server/client/src/components/common/sortBar.d.ts b/server/client/src/components/common/sortBar.d.ts deleted file mode 100644 index 4cc53ca7..00000000 --- a/server/client/src/components/common/sortBar.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Sortdiv(): JSX.Element; -export default Sortdiv; diff --git a/server/client/src/components/deleteModal.d.ts b/server/client/src/components/deleteModal.d.ts deleted file mode 100644 index 47befc1c..00000000 --- a/server/client/src/components/deleteModal.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const DeleteModal: () => JSX.Element; -export default DeleteModal; diff --git a/server/client/src/components/landingPage.d.ts b/server/client/src/components/landingPage.d.ts deleted file mode 100644 index e6c15160..00000000 --- a/server/client/src/components/landingPage.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function LandingPage(): JSX.Element; -export default LandingPage; diff --git a/server/client/src/components/memberList.d.ts b/server/client/src/components/memberList.d.ts deleted file mode 100644 index 658840fa..00000000 --- a/server/client/src/components/memberList.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -/// -interface Props { - members: User[]; -} -declare const MemberList: ({ members }: Props) => JSX.Element; -export default MemberList; diff --git a/server/client/src/components/modals/enterRoom.d.ts b/server/client/src/components/modals/enterRoom.d.ts deleted file mode 100644 index 713286d9..00000000 --- a/server/client/src/components/modals/enterRoom.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -/// -interface Props { - isMember: boolean; -} -declare function EnterRoom(props: Props): JSX.Element; -export default EnterRoom; diff --git a/server/client/src/components/musicRoom.d.ts b/server/client/src/components/musicRoom.d.ts deleted file mode 100644 index fff35a6d..00000000 --- a/server/client/src/components/musicRoom.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function MusicRoom(): JSX.Element; -export default MusicRoom; diff --git a/server/client/src/components/player.d.ts b/server/client/src/components/player.d.ts deleted file mode 100644 index 2b914c5c..00000000 --- a/server/client/src/components/player.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -/// -declare function Player(): JSX.Element; -declare const _default: import("react-redux").ConnectedComponent>; -export default _default; diff --git a/server/client/src/components/playlist.d.ts b/server/client/src/components/playlist.d.ts deleted file mode 100644 index 628f0211..00000000 --- a/server/client/src/components/playlist.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Playlist(): JSX.Element; -export default Playlist; diff --git a/server/client/src/components/roomHeader.d.ts b/server/client/src/components/roomHeader.d.ts deleted file mode 100644 index b43e9d9d..00000000 --- a/server/client/src/components/roomHeader.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const roomHeader: () => JSX.Element; -export default roomHeader; diff --git a/server/client/src/components/searchFilter.d.ts b/server/client/src/components/searchFilter.d.ts deleted file mode 100644 index aef89a3d..00000000 --- a/server/client/src/components/searchFilter.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare const SearchFilter: () => JSX.Element; -export default SearchFilter; diff --git a/server/client/src/root.component.d.ts b/server/client/src/root.component.d.ts deleted file mode 100644 index 4d5847ea..00000000 --- a/server/client/src/root.component.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -/// -export default function Root(props: any): JSX.Element; diff --git a/server/client/src/services/authService.d.ts b/server/client/src/services/authService.d.ts deleted file mode 100644 index cb0ff5c3..00000000 --- a/server/client/src/services/authService.d.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/server/client/src/services/chatService.d.ts b/server/client/src/services/chatService.d.ts deleted file mode 100644 index 3b2f53e1..00000000 --- a/server/client/src/services/chatService.d.ts +++ /dev/null @@ -1,11 +0,0 @@ -declare const chatService: { - addChat: (chat: Chat) => Promise; - getChats: () => Promise; - deleteChat: (id: string) => Promise; -}; -export default chatService; diff --git a/server/client/src/services/eventService.d.ts b/server/client/src/services/eventService.d.ts deleted file mode 100644 index 565b7fc8..00000000 --- a/server/client/src/services/eventService.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -declare const _default: { - connect: () => void; -}; -export default _default; diff --git a/server/client/src/services/httpService.d.ts b/server/client/src/services/httpService.d.ts deleted file mode 100644 index ec526d53..00000000 --- a/server/client/src/services/httpService.d.ts +++ /dev/null @@ -1,40 +0,0 @@ -export declare const endpoints: { - songs: string; - currentsong: string; - deletesong: string; - songsearch: string; - likesong: string; - comments: string; - deletecomment: string; - updatecomment: string; - roomdetail: string; - deleteroom: string; - members: string; - adduser: string; - removeuser: string; - usercount: string; -}; -declare const httpService: { - get: >(url: string, config?: import("axios").AxiosRequestConfig) => Promise; - post: >(url: string, data?: any, config?: import("axios").AxiosRequestConfig) => Promise; - put: >(url: string, data?: any, config?: import("axios").AxiosRequestConfig) => Promise; - room_id: string; - org_id: string; - endpoints: { - songs: string; - currentsong: string; - deletesong: string; - songsearch: string; - likesong: string; - comments: string; - deletecomment: string; - updatecomment: string; - roomdetail: string; - deleteroom: string; - members: string; - adduser: string; - removeuser: string; - usercount: string; - }; -}; -export default httpService; diff --git a/server/client/src/services/logService.d.ts b/server/client/src/services/logService.d.ts deleted file mode 100644 index 9738fda9..00000000 --- a/server/client/src/services/logService.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -export declare const success: (message: string) => void; -export declare const error: (message: string) => void; -declare const log: { - success: (message: string) => void; - error: (message: string) => void; -}; -export default log; diff --git a/server/client/src/services/songService.d.ts b/server/client/src/services/songService.d.ts deleted file mode 100644 index c647179e..00000000 --- a/server/client/src/services/songService.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -declare const songService: { - getSongs: () => void; - addSong: (song: SongToAdd) => Promise; - likeSong: (like: LikeSong) => Promise; - deleteSong: (id: string) => Promise>; -}; -export default songService; diff --git a/server/client/src/services/userService.d.ts b/server/client/src/services/userService.d.ts deleted file mode 100644 index 93e78259..00000000 --- a/server/client/src/services/userService.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -declare function getCurrentUser(): Promise; -declare function getWorkspaceUsers(): Promise; -declare function addMember(ids?: string[]): Promise>; -declare function removeMember(id: string, name?: string): Promise; -declare function getMembers(workspaceUsers?: User[]): Promise; -declare function isMember(): Promise; -declare const userService: { - addMember: typeof addMember; - removeMember: typeof removeMember; - getCurrentUser: typeof getCurrentUser; - getMembers: typeof getMembers; - getWorkspaceUsers: typeof getWorkspaceUsers; - isMember: typeof isMember; -}; -export default userService; diff --git a/server/client/src/tests/App.test.d.ts b/server/client/src/tests/App.test.d.ts deleted file mode 100644 index cb0ff5c3..00000000 --- a/server/client/src/tests/App.test.d.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/server/client/src/tests/player.test.d.ts b/server/client/src/tests/player.test.d.ts deleted file mode 100644 index cb0ff5c3..00000000 --- a/server/client/src/tests/player.test.d.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/server/client/src/tests/root.component.test.d.ts b/server/client/src/tests/root.component.test.d.ts deleted file mode 100644 index cb0ff5c3..00000000 --- a/server/client/src/tests/root.component.test.d.ts +++ /dev/null @@ -1 +0,0 @@ -export {}; diff --git a/server/client/src/types.d.ts b/server/client/src/types.d.ts deleted file mode 100644 index fb31e222..00000000 --- a/server/client/src/types.d.ts +++ /dev/null @@ -1,48 +0,0 @@ -export declare const d = 3; -declare global { - interface Song extends SongToAdd { - id: string; - title: string; - duration: string; - albumCover: string; - } - export interface SongToAdd { - url: string; - addedBy: string; - userId: string; - likedBy: string[]; - time: string; - } - interface SongMetadata { - id: string; - duration: string; - title: string; - albumCover: string; - url: string; - } - interface AddSong { - url: string; - username: string; - } - interface LikeSong { - userId: string; - songId: string; - like?: boolean; - } - interface Chat { - id: string; - message: string; - userId: string; - time: number; - name: string; - notSent?: boolean; - failed?: boolean; - avatar: string; - } - interface User { - id: string; - name: string; - avatar: string; - email: string; - } -} diff --git a/server/client/src/utils/chatMedia.d.ts b/server/client/src/utils/chatMedia.d.ts deleted file mode 100644 index 45c34e4a..00000000 --- a/server/client/src/utils/chatMedia.d.ts +++ /dev/null @@ -1 +0,0 @@ -export default function chatMediaQuery(): void; diff --git a/server/client/src/utils/config.d.ts b/server/client/src/utils/config.d.ts deleted file mode 100644 index 5f147dc1..00000000 --- a/server/client/src/utils/config.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { pluginHeader } from "@zuri/plugin-header"; -export { pluginHeader }; -export declare const headerConfig: (members: User[], cb: any) => { - name: string; - icon: string; - userCount: number; - thumbnailUrl: string[]; - hasThumbnail: boolean; - roomInfo: { - membersList: { - _id: string; - email: string; - }[]; - addmembersevent: (values: any) => void; - removememberevent: (id: any) => void; - }; -}; diff --git a/server/client/src/utils/idGenerator.d.ts b/server/client/src/utils/idGenerator.d.ts deleted file mode 100644 index 60cda7d0..00000000 --- a/server/client/src/utils/idGenerator.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -export declare function getUUID(): string; -export declare function getSongIdFromYouTubeUrl(url: string): string; diff --git a/server/client/src/utils/metadata.d.ts b/server/client/src/utils/metadata.d.ts deleted file mode 100644 index 259b904a..00000000 --- a/server/client/src/utils/metadata.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare function getSongMetadat(url: any): Promise; diff --git a/server/client/src/utils/mockdata.d.ts b/server/client/src/utils/mockdata.d.ts deleted file mode 100644 index 0229f9fe..00000000 --- a/server/client/src/utils/mockdata.d.ts +++ /dev/null @@ -1,23 +0,0 @@ -export declare function chatData(): { - username: string; - id: number; - time: string; - imageUrl: string; - emojis: { - name: string; - count: number; - emoji: string; - }[]; - richUiData: { - blocks: { - data: {}; - depth: number; - entityRanges: any[]; - inlineStyleRanges: any[]; - key: string; - text: string; - type: string; - }[]; - entityMap: {}; - }; -}[]; diff --git a/server/client/src/utils/sanitizer.d.ts b/server/client/src/utils/sanitizer.d.ts deleted file mode 100644 index a105dcc6..00000000 --- a/server/client/src/utils/sanitizer.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare const sanitize: (item: any) => any; diff --git a/server/client/src/utils/song.d.ts b/server/client/src/utils/song.d.ts deleted file mode 100644 index 8183ca90..00000000 --- a/server/client/src/utils/song.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare const totalDuration: (songs: Song[]) => string; diff --git a/server/client/src/utils/syncArray.d.ts b/server/client/src/utils/syncArray.d.ts deleted file mode 100644 index f46f8b32..00000000 --- a/server/client/src/utils/syncArray.d.ts +++ /dev/null @@ -1 +0,0 @@ -export declare const syncArray: (old: any, incoming: any) => any[]; diff --git a/server/client/src/zuri-music-plugin.d.ts b/server/client/src/zuri-music-plugin.d.ts deleted file mode 100644 index e92f2302..00000000 --- a/server/client/src/zuri-music-plugin.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -/// -export declare const bootstrap: import("single-spa").LifeCycleFn, mount: import("single-spa").LifeCycleFn, unmount: import("single-spa").LifeCycleFn; From 58dfbc6402403ad91bf3bafb6427c6f7d97e62ad Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Tue, 9 Nov 2021 23:40:30 +0100 Subject: [PATCH 07/28] renamed --- server/client/src/{types.tsx => types.d.ts} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename server/client/src/{types.tsx => types.d.ts} (100%) diff --git a/server/client/src/types.tsx b/server/client/src/types.d.ts similarity index 100% rename from server/client/src/types.tsx rename to server/client/src/types.d.ts From dc7978ae495e6116e014a23e8efd07552c5d76b6 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 00:45:04 +0100 Subject: [PATCH 08/28] fixes --- server/client/src/App.tsx | 2 +- .../client/src/components/common/likeOptionCount.tsx | 3 +-- server/client/src/components/common/playlistItem.tsx | 1 - server/client/src/components/musicRoom.tsx | 11 +++++------ server/client/src/components/playlist.tsx | 2 +- 5 files changed, 8 insertions(+), 11 deletions(-) diff --git a/server/client/src/App.tsx b/server/client/src/App.tsx index c89bf7b6..e6a77639 100644 --- a/server/client/src/App.tsx +++ b/server/client/src/App.tsx @@ -15,7 +15,7 @@ import "./App.css"; function App() { useEffect(() => { - eventService.connect(); + // eventService.connect(); chatMediaQuery(); // toggle chat display based on screen size. }, []); diff --git a/server/client/src/components/common/likeOptionCount.tsx b/server/client/src/components/common/likeOptionCount.tsx index c6ff67c5..22947b71 100644 --- a/server/client/src/components/common/likeOptionCount.tsx +++ b/server/client/src/components/common/likeOptionCount.tsx @@ -22,8 +22,7 @@ function LikeOptionCount(props) { const { length: count } = likedBy; const liked = likedBy.some(id => id === userId); - const countText = - count === 0 ? "" : count === 1 ? `1 like` : `${count} likes`; + const countText = `${count} ${count > 1 ? "likes" : "like"}`; const countClasses = duration ? "like-count" : "like-count-player"; diff --git a/server/client/src/components/common/playlistItem.tsx b/server/client/src/components/common/playlistItem.tsx index 1c5aa59c..4cf36ba8 100644 --- a/server/client/src/components/common/playlistItem.tsx +++ b/server/client/src/components/common/playlistItem.tsx @@ -1,5 +1,4 @@ import styled from "styled-components"; - import { changedCurrentSong, changedPlaying, diff --git a/server/client/src/components/musicRoom.tsx b/server/client/src/components/musicRoom.tsx index 763e255c..9f2ad4df 100644 --- a/server/client/src/components/musicRoom.tsx +++ b/server/client/src/components/musicRoom.tsx @@ -37,7 +37,7 @@ function MusicRoom() { const chatSidebarConfig = useMemo( () => ({ sendChatMessageHandler: msg => { - // dispatch(); + console.log(msg, "here"); }, currentUserData: { username: "Aleey", @@ -83,7 +83,7 @@ function MusicRoom() {
- +
); @@ -100,6 +100,7 @@ const Wrapper = styled.div<{ overflowMain: boolean }>` .plugin-header { position: sticky; + position: relative; top: 0px; z-index: 100; } @@ -114,6 +115,7 @@ const Wrapper = styled.div<{ overflowMain: boolean }>` .room-chat-container { position: relative; + background-color: white !important; margin-top: 5px; width: 500px; } @@ -172,11 +174,8 @@ const Wrapper = styled.div<{ overflowMain: boolean }>` .room-chat-container { position: fixed; top: 40px; - // background: rgb(240, 240, 240); - background: none; + display: none; flex-basis: 40%; - display: flex; - justify-content: center; z-index: 111; max-height: 400px; } diff --git a/server/client/src/components/playlist.tsx b/server/client/src/components/playlist.tsx index ce841034..4380429e 100644 --- a/server/client/src/components/playlist.tsx +++ b/server/client/src/components/playlist.tsx @@ -17,7 +17,7 @@ function Playlist() { return ( - + {/* */} {songs.length === 0 && } From caad3d44d01379c272bb1d44b59b1b4e317fe73b Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 00:45:59 +0100 Subject: [PATCH 09/28] clean-up --- .../src/components/common/playlistitem.css | 241 ------------------ 1 file changed, 241 deletions(-) delete mode 100644 server/client/src/components/common/playlistitem.css diff --git a/server/client/src/components/common/playlistitem.css b/server/client/src/components/common/playlistitem.css deleted file mode 100644 index 94c60442..00000000 --- a/server/client/src/components/common/playlistitem.css +++ /dev/null @@ -1,241 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300&display=swap'); -* { - padding: 0; - margin: 0; - box-sizing: border-box; - text-decoration: none; - font-family: lato; -} -.container{ - margin-top: 3em !important; - display: grid; - grid-template-columns:14% 52% 20% 20%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); - -} -.para{ - display: none; -} -.container-one{ - display: grid; - grid-template-columns:14% 52% 20% 20%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); -} -.playlistclass{ - padding-bottom: 1em; -} -.playlistclass h3{ - - font-family: 'Lato'; - font-size: 12px; -font-style: normal; -font-weight: 700; - -letter-spacing: 0px; -text-align: left; - - - -} -.playlistclass p{ - font-size: 8px; - line-height: 2em; - font-weight: 400; - - font-family: 'Lato'; -font-size: 10px; -font-style: normal; -font-weight: 500; -line-height: 20px; -letter-spacing: 0px; -text-align: left; - - - -} -.img{ - width: 40px; -padding-bottom: 1em; - -} -.paragraph p{ - font-size: 9px; - padding-right: 3em; - padding-bottom: 1em !important; - -} -.vector1{ - padding-right: 2em; - padding-bottom: 1em; -width: 43px; -} -.vector2{ - padding-bottom: 1em; - -} -.vector11{ - width: 10px; - -} -@media(min-width: 768px){ - body{ - width: 50%; - margin: auto; - } - .para{ - display: none; - } - -} -@media(min-width: 1024px){ - body{ - width: 75%; - margin: auto; - } - - .playlistclass h3{ - font-size: 14px; - - } - .playlistclass p{ - font-size: 12px; - line-height: 2.5em; - - } - .para{ - display: block; - } - .para p{ - padding-bottom: 1em ; - font-size: 14px; - - } - .paragraph p{ - font-size: 12px; - } - .container{ - margin-top: 3em !important; - display: grid; - grid-template-columns:10% 45% 15% 15% 40%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); - - } - .container-one{ - display: grid; - grid-template-columns: 10% 45% 15% 15% 40%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); - } - .img{ - width: 60px; - - - } - .vector1{ - padding-right: 2em; - padding-bottom: 1em; - width: 50px; - } - .vector2{ - padding-bottom: 1em; - width: 20px; - padding-right: 0.5em; - } - -} -@media(min-width: 1440px){ - body{ - width: 70%; - margin: auto; - } - .playlistclass h3{ - font-size: 20px; - - } - .playlistclass p{ - font-size: 15px; - line-height: 2.5em; - - - } - .para{ - display: block; - } - .para p{ - - padding-bottom: 1em; - font-size: 16px; - } - .paragraph p{ - font-size: 16px; - } - .container{ - margin-top: 3em !important; - display: grid; - grid-template-columns:8% 45% 15% 15% 40%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); - - } - .container-one{ - display: grid; - grid-template-columns: 8% 45% 15% 15% 40%; - align-items: center; - padding-right: 1em; - padding-left: 1em; - padding-top: 2em; - width: 100%; - margin: auto; - box-sizing: border-box; - box-shadow: 0 5px 10px rgba(0, 0, 0,0.2); - } - .img{ - width: 60px; - - - } - .vector1{ - padding-right: 2em; - padding-bottom: 1em; - width: 50px; - } - .vector2{ - padding-bottom: 1em; - width: 20px; - padding-right: 0.5em; - } - -} From 716049ab55a3b85f7f3f3b7350a7de6a751cc99b Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 01:10:52 +0100 Subject: [PATCH 10/28] fixes --- server/client/src/App.tsx | 2 +- server/client/src/services/eventService.ts | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/server/client/src/App.tsx b/server/client/src/App.tsx index e6a77639..c89bf7b6 100644 --- a/server/client/src/App.tsx +++ b/server/client/src/App.tsx @@ -15,7 +15,7 @@ import "./App.css"; function App() { useEffect(() => { - // eventService.connect(); + eventService.connect(); chatMediaQuery(); // toggle chat display based on screen size. }, []); diff --git a/server/client/src/services/eventService.ts b/server/client/src/services/eventService.ts index 126189ae..1697c067 100644 --- a/server/client/src/services/eventService.ts +++ b/server/client/src/services/eventService.ts @@ -28,7 +28,7 @@ type PublishedMessage = { const connect = () => { // initialize store songService.getSongs(); - chatService.getChats(); + // chatService.getChats(); SubscribeToChannel(httpService.room_id, (message: PublishedMessage) => { const { @@ -36,7 +36,7 @@ const connect = () => { data: { data } } = message.data; - console.log({ event, data }); + console.log({ event, data }, "event"); if (!data) return null; From e68626df975387b67e50e0acfd86a0b8a0cf8355 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 01:48:52 +0100 Subject: [PATCH 11/28] refactored song service --- .../src/components/common/likeOptionCount.tsx | 9 +++- .../client/src/components/common/pasteUrl.tsx | 14 +++--- server/client/src/components/deleteModal.tsx | 17 ++++--- server/client/src/services/logService.ts | 20 --------- server/client/src/services/songService.ts | 44 ++++++++++++------- server/client/src/types.d.ts | 5 +++ 6 files changed, 57 insertions(+), 52 deletions(-) delete mode 100644 server/client/src/services/logService.ts diff --git a/server/client/src/components/common/likeOptionCount.tsx b/server/client/src/components/common/likeOptionCount.tsx index 22947b71..19f7f99c 100644 --- a/server/client/src/components/common/likeOptionCount.tsx +++ b/server/client/src/components/common/likeOptionCount.tsx @@ -6,6 +6,8 @@ import { selectCurrentUser } from "../../app/usersSlice"; import Like from "./like"; import option from "../../media/option.svg"; +import { useAppDispatch } from "../../app/hooks"; +import { likedSong } from "../../app/songsSlice"; // interface Props { // duration?: string; @@ -15,6 +17,7 @@ import option from "../../media/option.svg"; // } function LikeOptionCount(props) { + const dispatch = useAppDispatch(); const { duration, likedBy = [], songId, handleOption } = props; const { id: userId } = useSelector(selectCurrentUser); @@ -27,7 +30,11 @@ function LikeOptionCount(props) { const countClasses = duration ? "like-count" : "like-count-player"; const handleLike = () => { - songService.likeSong({ songId, userId, like: !liked }); + const likedObj = { songId, userId, like: !liked }; + + songService.likeSong(likedObj, { + success: () => dispatch(likedSong(likedObj)) + }); }; const formatDuration = (duration: string) => { diff --git a/server/client/src/components/common/pasteUrl.tsx b/server/client/src/components/common/pasteUrl.tsx index f0aac8f6..491434dd 100644 --- a/server/client/src/components/common/pasteUrl.tsx +++ b/server/client/src/components/common/pasteUrl.tsx @@ -48,18 +48,22 @@ const PasteUrl = (props: Props) => { try { getSongIdFromYouTubeUrl(url); - await songService.addSong({ + const song: SongToAdd = { url, addedBy, userId, likedBy: [], time: `${Date.now()}` - }); + }; - dispatch(showedPasteUrl(false)); + songService.addSong(song, { + success: () => { + dispatch(showedPasteUrl(false)); - toast.success("Added Successfully"); - setUrl(""); + toast.success("Added Successfully"); + setUrl(""); + } + }); } catch (e) { toast.error(`Error: ${e.message}`); } diff --git a/server/client/src/components/deleteModal.tsx b/server/client/src/components/deleteModal.tsx index 142e98ec..004e1617 100644 --- a/server/client/src/components/deleteModal.tsx +++ b/server/client/src/components/deleteModal.tsx @@ -7,6 +7,7 @@ import { selectUpdateId, updatedSongId } from "../app/deleteSongSlice"; import { selectShowDeleteModal, showedDeleteModal } from "../app/uiSlice"; import songService from "../services/songService"; import { useAppDispatch, useAppSelector } from "../app/hooks"; +import { removedSong } from "../app/songsSlice"; const DeleteModal = () => { const dispatch = useAppDispatch(); @@ -24,16 +25,14 @@ const DeleteModal = () => { function handleDelete() { dispatch(showedDeleteModal(false)); - songService - .deleteSong(id) - .then(res => { - if (res.status === 200) toast.success("Deleted successfully"); + + songService.deleteSong(id, { + success: () => { + toast.success("Deleted successfully"); + dispatch(removedSong({ id })); dispatch(updatedSongId("")); - }) - .catch(err => { - toast.error(`${err.message}`); - console.log(err.message); - }); + } + }); } function handleEscape(e) { diff --git a/server/client/src/services/logService.ts b/server/client/src/services/logService.ts deleted file mode 100644 index 1fdb0305..00000000 --- a/server/client/src/services/logService.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { toast } from "react-toastify"; - -export const success = (message: string) => { - // toast.success(message, { - // style: { - // background: "hsla(160, 100%, 36%, 1)", - // }, - // }); -}; - -export const error = (message: string) => { - // toast.error(message); -}; - -const log = { - success, - error, -}; - -export default log; diff --git a/server/client/src/services/songService.ts b/server/client/src/services/songService.ts index 7c6f7dd7..0b7ccacf 100644 --- a/server/client/src/services/songService.ts +++ b/server/client/src/services/songService.ts @@ -1,14 +1,13 @@ -import { initializedSongs, likedSong, removedSong } from "../app/songsSlice"; +import { initializedSongs } from "../app/songsSlice"; import httpService, { endpoints } from "./httpService"; import store from "../app/store"; - -const dispatch = store.dispatch; +import { toast } from "react-toastify"; const getSongs = () => { httpService.get(httpService.endpoints.songs).then( result => { const data = result.data.data ?? []; - dispatch(initializedSongs(data.filter(song => song.url))); + store.dispatch(initializedSongs(data.filter(song => song.url))); return result; }, @@ -19,29 +18,40 @@ const getSongs = () => { ); }; -const addSong = async (song: SongToAdd) => { - console.log("adding song", song); - - return httpService.post(httpService.endpoints.songs, song).then(() => { +const addSong = async (song: SongToAdd, cb: Callback) => { + try { + await httpService.post(httpService.endpoints.songs, song); const { songs } = store.getState(); songs.slice(6).forEach(({ id }) => deleteSong(id)); - }); -}; -const deleteSong = async (id: string) => { - return httpService.post(endpoints.deletesong, { id }).then(res => { - dispatch(removedSong({ id })); - return res; - }); + cb?.success && cb.success(); + } catch (error) { + toast.error(error.message); + console.log(error.message); + cb?.error && cb.error(); + } }; -const likeSong = async (like: LikeSong) => { - dispatch(likedSong(like)); +const deleteSong = async (id: string, cb?: Callback) => { + try { + await httpService.post(endpoints.deletesong, { id }); + cb?.success && cb.success(); + } catch (error) { + console.log(error.message); + toast.error(error.message); + cb?.error && cb.error(); + } +}; + +const likeSong = async (like: LikeSong, cb: Callback) => { try { await httpService.post(httpService.endpoints.likesong, like); + + cb?.success && cb.success(); } catch (error) { console.log(error.message); + cb?.error && cb.error(); } }; diff --git a/server/client/src/types.d.ts b/server/client/src/types.d.ts index 643c8c30..cd577eb1 100644 --- a/server/client/src/types.d.ts +++ b/server/client/src/types.d.ts @@ -72,4 +72,9 @@ declare global { avatar: string; email: string; } + + interface Callback { + success?: () => void; + error?: () => void; + } } From 084a745e534acb05a6d6c18dfd319e8d229d6aa1 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 01:54:39 +0100 Subject: [PATCH 12/28] fix --- server/client/src/components/common/exit.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/server/client/src/components/common/exit.tsx b/server/client/src/components/common/exit.tsx index 7b1f8b1f..e6109ff1 100644 --- a/server/client/src/components/common/exit.tsx +++ b/server/client/src/components/common/exit.tsx @@ -9,7 +9,6 @@ import search from "../../media/search.svg"; import beat from "../../media/beat.svg"; import close from "../../media/close-popup.svg"; -import log from "../../services/logService"; import userService from "../../services/userService"; const Exit = () => { @@ -18,8 +17,6 @@ const Exit = () => { const [change, setChange] = useState("about"); const handleLeaveRoom = () => { - log.success("Goodbye user"); - userService.removeMember(""); dispatch(exitedModal(false)); dispatch(loaded(true)); From 0fa99c15defa4e86381a8c60de37731a3a923261 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 02:00:38 +0100 Subject: [PATCH 13/28] toast on error --- server/client/src/services/songService.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/server/client/src/services/songService.ts b/server/client/src/services/songService.ts index 0b7ccacf..8138d09f 100644 --- a/server/client/src/services/songService.ts +++ b/server/client/src/services/songService.ts @@ -51,6 +51,7 @@ const likeSong = async (like: LikeSong, cb: Callback) => { cb?.success && cb.success(); } catch (error) { console.log(error.message); + toast.error(error.message); cb?.error && cb.error(); } }; From a887f268987cba267e36d1aa99814d57e46f5865 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 10:08:40 +0100 Subject: [PATCH 14/28] changed import url --- root/src/index.ejs | 4 ++-- root/src/zuri-root-config.ts | 4 +--- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/root/src/index.ejs b/root/src/index.ejs index 6a869672..13bc36b9 100644 --- a/root/src/index.ejs +++ b/root/src/index.ejs @@ -66,8 +66,8 @@ diff --git a/root/src/zuri-root-config.ts b/root/src/zuri-root-config.ts index 2a3589b3..76ad47a8 100644 --- a/root/src/zuri-root-config.ts +++ b/root/src/zuri-root-config.ts @@ -37,9 +37,7 @@ function customRegister(env: "dev" | "prod") { registerApplication({ name: "@zuri/zuri-plugin-music", app: () => - System.import( - "https://staging.zuri.chat/music/static/zuri-music-plugin.js" - ), + System.import("https://music.zuri.chat/static/zuri-music-plugin.js"), activeWhen: ["/"] }); } From e567528da7e2df6093064ba9f609892b45d53489 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Wed, 10 Nov 2021 10:50:39 +0100 Subject: [PATCH 15/28] updated readme --- README.md | 177 +++++++++++++++++++++++++++++------------------------- 1 file changed, 94 insertions(+), 83 deletions(-) diff --git a/README.md b/README.md index 96329265..4543e65e 100644 --- a/README.md +++ b/README.md @@ -1,40 +1,45 @@ # YouTube Music-Video Plugin > ## Table of contents -* [Overview](#overview) -* [Project Features](#project-features) -* [Technologies](#technologies) -* [Repo Setup](#repo-setup) -* [Setting up the project](#setting-up-the-project) - * [Frontend](#frontend) - * [Build the client](#build-the-client) - * [Build the single-spa root](#build-the-single-spa-root) - * [Start the client](#start-the-client) - * [Start the single-spa root](#start-the-single-spa-root) - * [Lint the Frontend](#lint-the-frontend) - * [Backend](#backend) - * [Run the Django Server](#run-the-django-server) - * [Pre-commit and lint the Backend](#pre-commit-and-lint-the-backend) -* [Links to the project](#links-to-the-project) -* [Status](#status) -* [Contributing to the project](#contributing-to-the-project) + +- [Overview](#overview) +- [Project Features](#project-features) +- [Technologies](#technologies) +- [Repo Setup](#repo-setup) +- [Setting up the project](#setting-up-the-project) + - [Frontend](#frontend) + - [Build the client](#build-the-client) + - [Build the single-spa root](#build-the-single-spa-root) + - [Start the client](#start-the-client) + - [Start the single-spa root](#start-the-single-spa-root) + - [Lint the Frontend](#lint-the-frontend) + - [Backend](#backend) + - [Run the Django Server](#run-the-django-server) + - [Pre-commit and lint the Backend](#pre-commit-and-lint-the-backend) +- [Links to the project](#links-to-the-project) +- [Status](#status) +- [Contributing to the project](#contributing-to-the-project) # ->## Overview + +> ## Overview +

-ZuriChat is an open source slack clone that provides the opportunity for people to network, collaborate, educate and learn remotely. It allows people to take their classroom everywhere, make learning fun, stay engaged and inspired with the virtual lounge and games. +ZuriChat is an open source workspace app that provides the opportunity for people to network, collaborate, educate and learn remotely. It allows people to take their classroom everywhere, make learning fun, stay engaged and inspired with the virtual lounge and games. -One of its unique features are the variety of plugins designed to add features such as tracking company expenses, sending information fast and smoothly, managing files and integrating tools all with ZuriChat. +One of its unique features are the variety of plugins designed to add functionalities such as tracking company expenses, sending information fast and smoothly, managing files and integrating tools all with ZuriChat. This project is focused on the ZuriChat music plugin. +

![site image](https://drive.google.com/uc?export=view&id=1OinCY56dOGcG6DvliWAhznSj4d7gA4_H) # -> ## Project Features -The YouTube music plugin allows the users in the organization to add and play Youtube links.You can also chat in real time with other members of the organization. +> ## Project Features +> +> The YouTube music plugin allows the users in the organization to add and play Youtube links.You can also chat in real time with other members of the organization. - Add and Play Youtube music and videos. @@ -45,21 +50,22 @@ The YouTube music plugin allows the users in the organization to add and play Yo

# + > ## Technologies

*Note: This project was setup and developed on a system running Windows 10. The stacks used for the project include:

- -| Stack | Usage | -| :--- | :--- | -| **`Python 3.9`** | Programming language. | -| **`React JS`** | Frontend | -| **`MongoDB`** | External Database | -| **` Django Rest framework`** | APIs. | +| Stack | Usage | +| :--------------------------- | :-------------------- | +| **`Python 3.9`** | Programming language. | +| **`React JS`** | Frontend | +| **`MongoDB`** | External Database | +| **` Django Rest framework`** | APIs. | # + > ## Repo Setup

@@ -74,9 +80,10 @@ Change directory to the cloned repo and set the original Zurichat repository as $ git remote add upstream git@github.com:zurichat/zc_plugin_youtube_music_video.git - # + > ## Setting up the project +

The first step requires the download and installation of Python 3.9 and a check to confirm that pip and the necessary dependencies are properly installed.

@@ -85,134 +92,138 @@ The first step requires the download and installation of Python 3.9 and a check After the installation of the Python program, setup the project environment with pip and virtualenv in the command prompt, powershell or gitbash terminal. Virtualenv helps to create an isolated Python environment containing all the packages necessary for the project.

-*Note: +\*Note: -* This project was setup using the gitbash terminal. Some of the commands used do not work with command prompt or powershell. +- This project was setup using the gitbash terminal. Some of the commands used do not work with command prompt or powershell. -- If a "pip command not found error" is encountered, download get-pip.py and run `phython get-pip.py` to install it. +* If a "pip command not found error" is encountered, download get-pip.py and run `phython get-pip.py` to install it. ### - $ pip install virtualenv + $ pip install virtualenv Navigate to the cloned local project folder. Create a virtual environment folder and activate the environment by running the following commands in the gitbash terminal. - ### + $ python -m venv venv $ source venv/scripts/activate -

Once the virtual environment is active, the next step is the Django installation. Django is an open source Python web application framework thats helps with the rapid development of secure websites.

### - $ (venv) pip install django + $ (venv) pip install django

After installing Django, install Django REST framework in the gitbash terminal. The Django REST framework is a flexible toolkit for building Web based APIs. The REST framework was used for the creation of APIs, serialization and the authentication process for this project.

### - $ (venv) pip install djangorestframework + $ (venv) pip install djangorestframework Install all the necessary dependencies for the project. A few of them are listed below. -| Modules | Usage | -| :--- | :--- | +| Modules | Usage | +| :------------------------ | :---------------------------- | | **`django-cors-headers`** | Cross Origin Resource Sharing | -| **`gunicorn`** | WSGI HTTP server | -| **`whitenoise`** | Static files | -| **`Markdown`** | Markup language | -| **`django-environ`** | Environment configuration | - - -An exhaustive list can be found in the requirements.txt file included in this project. The modules can be 'batch installed' using the `pip install -r requirements.txt` command. +| **`gunicorn`** | WSGI HTTP server | +| **`whitenoise`** | Static files | +| **`Markdown`** | Markup language | +| **`django-environ`** | Environment configuration | +An exhaustive list can be found in the requirements.txt file included in this project. The modules can be 'batch installed' using the `pip install -r requirements.txt` command. ### Frontend -- #### Build the client +- #### Build the client - $ cd server/client - $ yarn - $ yarn build + $ cd server/client + $ yarn + $ yarn build -- #### Build the single-spa root +- #### Build the single-spa root - $ cd root - $ yarn - $ yarn build + $ cd root + $ yarn + $ yarn build -- #### Start the client +- #### Start the client - $ cd server/client - $ yarn - $ yarn start + $ cd server/client + $ yarn + $ yarn start -- #### Start the single-spa root +- #### Start the single-spa root - $ cd root - $ yarn - $ yarn start + $ cd root + $ yarn + $ yarn start - - Frontend devs: You don't need to start django server. Only start the client and single-spa root to view your edits. + - Frontend devs: You don't need to start django server. Only start the client and single-spa root to view your edits. -- #### Lint the Frontend +- #### Lint the Frontend - - cd into the frontend folder (server/client) + - cd into the frontend folder (server/client) - $ yarn lint --fix (or yarn lint --fix . to fix all files) + $ yarn lint --fix (or yarn lint --fix . to fix all files) # + ### Backend -- #### Run the Django Server - $ cd server +- #### Run the Django Server + + $ cd server - - Create .env file in config and put variables for Secret Key as created in sample.env file + - Create .env file in config and put variables for Secret Key as created in sample.env file - $ python manage.py runserver + $ python manage.py runserver -- #### Pre-commit and lint the Backend +- #### Pre-commit and lint the Backend - $ cd server - $ pre-commit run (or pre-commit run --all-files to check all files) + $ cd server + $ pre-commit run (or pre-commit run --all-files to check all files) - - Backend devs: You don't need to run yarn start to test your endpoints. + - Backend devs: You don't need to run yarn start to test your endpoints. # + ### Note to the DevOps -- Build first before starting django server +- Build first before starting django server # + > ## Links to the project -Local server: http://localhost:22672/music +> +> Local server: http://localhost:22672/music Live site: http://staging.zuri.chat/music API root: http://localhost::22672/music/api/v1 # -> ## Status -This project is a work in progress and is currently under development. +> ## Status +> +> This project is a work in progress and is currently under development. # + > ## Contributing to the project If you find something worth contributing, please fork the repo, make a pull request and add valid and well-reasoned explanations about your changes or comments. Before adding a pull request, please note: -- It should be inviting and clear. -- Any additions should be relevant. -- It should be easy to contribute to. -- Urls marked **\*** are temporarily unavailable. Don't delete it without confirming that it has permanently expired. +- It should be inviting and clear. +- Any additions should be relevant. +- It should be easy to contribute to. +- Urls marked **\*** are temporarily unavailable. Don't delete it without confirming that it has permanently expired. This repository is not meant to contain everything. Only good quality verified information. From 241116430199d50d7757ddc9622602701bbf2cee Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Thu, 11 Nov 2021 06:05:25 +0100 Subject: [PATCH 16/28] integrated endpoints for liking, deleting and adding a song --- server/client/src/App.tsx | 2 +- server/client/src/app/playerSlice.ts | 2 +- server/client/src/app/songsSlice.ts | 31 ++- .../src/components/common/filterBar.tsx | 192 ++++++++------- .../src/components/common/likeOptionCount.tsx | 4 +- .../client/src/components/common/pasteUrl.tsx | 7 +- .../src/components/common/searchBar.tsx | 107 ++++---- .../client/src/components/common/sortBar.tsx | 233 +++++++++--------- .../components/{ => modals}/deleteModal.tsx | 25 +- server/client/src/components/playlist.tsx | 4 +- .../{common => }/playlistHeader.tsx | 19 +- server/client/src/components/searchFilter.tsx | 66 ++--- server/client/src/services/eventService.ts | 6 +- server/client/src/services/httpService.ts | 2 +- server/client/src/services/logService.ts | 11 + server/client/src/services/songService.ts | 44 ++-- server/client/src/types.d.ts | 2 +- 17 files changed, 401 insertions(+), 356 deletions(-) rename server/client/src/components/{ => modals}/deleteModal.tsx (83%) rename server/client/src/components/{common => }/playlistHeader.tsx (89%) create mode 100644 server/client/src/services/logService.ts diff --git a/server/client/src/App.tsx b/server/client/src/App.tsx index c89bf7b6..9acc8969 100644 --- a/server/client/src/App.tsx +++ b/server/client/src/App.tsx @@ -2,7 +2,7 @@ import { useEffect } from "react"; import styled from "styled-components"; import MusicRoom from "./components/musicRoom"; -import DeleteModal from "./components/deleteModal"; +import DeleteModal from "./components/modals/deleteModal"; import chatMediaQuery from "./utils/chatMedia"; diff --git a/server/client/src/app/playerSlice.ts b/server/client/src/app/playerSlice.ts index 2ba4d5cf..52924e03 100644 --- a/server/client/src/app/playerSlice.ts +++ b/server/client/src/app/playerSlice.ts @@ -31,6 +31,6 @@ export const { changedPlaying, showedPlayer, changedCurrentSong } = export const getPlayerState = (state: RootState) => state.player; export const selectCurrentSong = (state: RootState) => - state.songs.find(s => s.id === state.player.currentSongId); + state.songs.list.find(s => s.id === state.player.currentSongId); export default slice.reducer; diff --git a/server/client/src/app/songsSlice.ts b/server/client/src/app/songsSlice.ts index 0fc9a9a5..d99bc351 100644 --- a/server/client/src/app/songsSlice.ts +++ b/server/client/src/app/songsSlice.ts @@ -6,34 +6,41 @@ import { sanitize } from "../utils/sanitizer"; const songsSlice = createSlice({ name: "songs", - initialState: [] as Song[], + initialState: { + searchQuery: "", + list: [] as Song[] + }, reducers: { initializedSongs: (state, { payload }: PayloadAction) => { - return payload.map(sanitize); + state.list = payload.map(sanitize); }, addedSong: (state, { payload }: PayloadAction) => { - state.unshift(sanitize(payload)); + state.list.unshift(sanitize(payload)); }, removedSong: (state, { payload }: PayloadAction<{ id: string }>) => { - state = state.filter(song => song.id !== payload.id); + state.list = state.list.filter(song => song.id !== payload.id); }, likedSong: (state, { payload }: PayloadAction) => { const { like, songId, userId } = payload; - const index = state.findIndex(song => song.id === songId); + const index = state.list.findIndex(song => song.id === songId); if (index === -1) return state; - const song = state[index]; + const song = state.list[index]; if (like) song.likedBy.push(userId); else song.likedBy = song.likedBy.filter(id => id !== userId); - state[index] = song; + state.list[index] = song; + }, + + queryChanged: (state, { payload }: PayloadAction) => { + state.searchQuery = payload; } } }); @@ -59,14 +66,14 @@ export const { addedSong, removedSong, likedSong, initializedSongs } = // } // }; -export const selectSongs = (state: RootState) => state.songs; +export const selectSongs = (state: RootState) => state.songs.list; export const selectSongById = (songId: string) => (state: RootState) => { - return state.songs.find(song => song.id === songId); + return state.songs.list.find(song => song.id === songId); }; export const selectSongByUrl = (url: string) => (state: RootState) => { - return state.songs.find(song => song.url === url); + return state.songs.list.find(song => song.url === url); }; export const selectFirstSong = (state: RootState) => state.songs[0]; @@ -74,7 +81,7 @@ export const selectFirstSong = (state: RootState) => state.songs[0]; export const selectLikeCount = ({ songId, userId }: { songId: string; userId: string }) => (state: RootState) => { - const song = state.songs.find(song => song.id === songId); + const song = state.songs.list.find(song => song.id === songId); if (!song) return { count: 0, liked: false }; @@ -84,4 +91,6 @@ export const selectLikeCount = }; }; +export const selectSearchQuery = (state: RootState) => state.songs.searchQuery; + export default songsSlice.reducer; diff --git a/server/client/src/components/common/filterBar.tsx b/server/client/src/components/common/filterBar.tsx index 424f1dcc..1d39007f 100644 --- a/server/client/src/components/common/filterBar.tsx +++ b/server/client/src/components/common/filterBar.tsx @@ -1,105 +1,115 @@ -import styled from 'styled-components' +import styled from "styled-components"; function Filterbar() { - return ( - -
-

- - Filter -

-
- - -
-
- - ); + return ( + + + + ); } -const Filterstyled = styled.div - ` - .filterBar{ - display: flex; - width: 17rem; - justify-content: space-between; - box-sizing: border-box; - font-size: 1rem; - font-family: Lato sans-serif; - } +const Filterstyled = styled.div` + .filterBar { + display: flex; + width: 17rem; + justify-content: space-between; + box-sizing: border-box; + font-size: 1rem; + font-family: Lato sans-serif; + } - button.accordion { - background-color: #FFFFFF; - color: #1D1C1D; - cursor: pointer; - padding: 1.5rem 1rem; - width: 200px; - height: 3rem; - text-align: left; - border: none; - border-radius: 8px; - outline: none; - transition: 0.3s; - display: flex; - align-items: center; - justify-content: space-between; - } + button.accordion { + background-color: #ffffff; + color: #1d1c1d; + cursor: pointer; + padding: 1.5rem 1rem; + width: 200px; + height: 3rem; + text-align: left; + border: none; + border-radius: 8px; + outline: none; + transition: 0.3s; + display: flex; + align-items: center; + justify-content: space-between; + } - button.accordion.active, button.accordion:hover { - background-color: #F6F6F6; - border-radius: 8px 8px 0 0; - } + button.accordion.active, + button.accordion:hover { + background-color: #f6f6f6; + border-radius: 8px 8px 0 0; + } - .panel.show { - display: block !important; - } + .panel.show { + display: block !important; + } - .panel { - padding: 0 .75rem; - background-color: white; - max-height: 0; - overflow: hidden; - transition: 0.3s ease-in-out; - opacity: 0; - width: 176px; - } + .panel { + padding: 0 0.75rem; + background-color: white; + max-height: 0; + overflow: hidden; + transition: 0.3s ease-in-out; + opacity: 0; + width: 176px; + } - .panel.show { - opacity: 1; - max-height: 800px; - box-shadow: 0px 2px 10px #D7D7D7; - border-radius: 0 0 4px 4px; - } + .panel.show { + opacity: 1; + max-height: 800px; + box-shadow: 0px 2px 10px #d7d7d7; + border-radius: 0 0 4px 4px; + } - .panel p{ - color: #1D1C1D; - padding: 0 .5rem; - height: 3rem; - background-color: #fff; - display: grid; - align-items: center; - } + .panel p { + color: #1d1c1d; + padding: 0 0.5rem; + height: 3rem; + background-color: #fff; + display: grid; + align-items: center; + } - .panel p:hover{ - background-color: #F6F6F6; - } + .panel p:hover { + background-color: #f6f6f6; + } - .panel a{ - text-decoration: none; - cursor: pointer; - } + .panel a { + text-decoration: none; + cursor: pointer; + } - button.accordion:after { - color: #F6F6F6; - } - ` + button.accordion:after { + color: #f6f6f6; + } +`; export default Filterbar; diff --git a/server/client/src/components/common/likeOptionCount.tsx b/server/client/src/components/common/likeOptionCount.tsx index 19f7f99c..771dc828 100644 --- a/server/client/src/components/common/likeOptionCount.tsx +++ b/server/client/src/components/common/likeOptionCount.tsx @@ -32,8 +32,10 @@ function LikeOptionCount(props) { const handleLike = () => { const likedObj = { songId, userId, like: !liked }; + dispatch(likedSong(likedObj)); + songService.likeSong(likedObj, { - success: () => dispatch(likedSong(likedObj)) + error: () => dispatch(likedSong({ ...likedObj, like: !liked })) }); }; diff --git a/server/client/src/components/common/pasteUrl.tsx b/server/client/src/components/common/pasteUrl.tsx index 491434dd..6875cff7 100644 --- a/server/client/src/components/common/pasteUrl.tsx +++ b/server/client/src/components/common/pasteUrl.tsx @@ -16,6 +16,7 @@ import songService from "../../services/songService"; import { getSongIdFromYouTubeUrl } from "../../utils/idGenerator"; import { selectCurrentUser } from "../../app/usersSlice"; import { useAppDispatch, useAppSelector } from "../../app/hooks"; +import { addedSong } from "../../app/songsSlice"; interface Props { getSongByUrl: (url: string) => Song; @@ -57,9 +58,9 @@ const PasteUrl = (props: Props) => { }; songService.addSong(song, { - success: () => { + success: (song: Song) => { dispatch(showedPasteUrl(false)); - + dispatch(addedSong(song)); toast.success("Added Successfully"); setUrl(""); } @@ -186,7 +187,7 @@ const Wrapper = styled.div` `; const mapStateToProps = (state: RootState) => ({ - getSongByUrl: url => state.songs.find(song => song.url === url) + getSongByUrl: url => state.songs.list.find(song => song.url === url) }); export default connect(mapStateToProps)(PasteUrl); diff --git a/server/client/src/components/common/searchBar.tsx b/server/client/src/components/common/searchBar.tsx index c7baaea1..ffc42060 100644 --- a/server/client/src/components/common/searchBar.tsx +++ b/server/client/src/components/common/searchBar.tsx @@ -1,56 +1,59 @@ -import styled from 'styled-components' +import styled from "styled-components"; function SearchBar() { - - return ( - -
- -
- - ); - } - - -const SearchStyled = styled.div - ` - .songsTab{ - width: 100%; - display: flex; - justify-content: space-evenly; - margin: 2rem 0; - } - - input { - padding-left: 10px; - border: 0; - width: 20rem; - height: 48px; - font-size: 1rem; - color: #141414; - background: #FFFFFF; - border: 1px solid #F6F6F6; - box-sizing: border-box; - border-radius: 8px; - } - - input:focus - { outline: 0; } - - input:focus { - width: 20rem; - -webkit-transition: all 0.075s ease; - transition: all 0.075s ease; - } - - input::placeholder{ - font-size: 15px; - color: #A5ABB6; - } - - input { - width: 20rem; - } - ` + return ( + +
+ +
+ + ); +} + +const SearchStyled = styled.div` + .songsTab { + width: 100%; + display: flex; + justify-content: space-evenly; + margin: 2rem 0; + } + + input { + padding-left: 10px; + border: 0; + width: 20rem; + height: 48px; + font-size: 1rem; + color: #141414; + background: #ffffff; + border: 1px solid #f6f6f6; + box-sizing: border-box; + border-radius: 8px; + } + + input:focus { + outline: 0; + } + + input:focus { + width: 20rem; + -webkit-transition: all 0.075s ease; + transition: all 0.075s ease; + } + + input::placeholder { + font-size: 15px; + color: #a5abb6; + } + + input { + width: 20rem; + } +`; export default SearchBar; diff --git a/server/client/src/components/common/sortBar.tsx b/server/client/src/components/common/sortBar.tsx index 762c2a1a..42aee438 100644 --- a/server/client/src/components/common/sortBar.tsx +++ b/server/client/src/components/common/sortBar.tsx @@ -1,117 +1,124 @@ -import styled from 'styled-components'; - - -function Sortdiv () { - return ( - - - - - ); - +import styled from "styled-components"; + +function Sortdiv() { + return ( + + + + ); } - const SortStyled = styled.div - ` - .sortBar{ - display: flex; - width: 19rem; - justify-content: space-between; - box-sizing: border-box; - font-size: 1rem; - font-family: Lato sans-serif; - } - - button.accordion { - background-color: #FFFFFF; - color: #1D1C1D; - cursor: pointer; - padding: 1.5rem 1rem; - width: 200px; - height: 3rem; - text-align: left; - border: none; - border-radius: 8px; - outline: none; - transition: 0.3s; - display: flex; - align-items: center; - justify-content: space-between; - } - - .sortBar button.accordion{ - width: 239px; - } - - .sortBar .panel { - width: 215px; - } - - button.accordion.active, button.accordion:hover { - background-color: #F6F6F6; - border-radius: 8px 8px 0 0; - } - - .panel.show { - display: block !important; - } - - .panel { - padding: 0 .75rem; - background-color: white; - max-height: 0; - overflow: hidden; - transition: 0.3s ease-in-out; - opacity: 0; - width: 176px; - } - - .panel.show { - opacity: 1; - max-height: 800px; - box-shadow: 0px 2px 10px #D7D7D7; - border-radius: 0 0 4px 4px; - } - - .panel p{ - color: #1D1C1D; - padding: 0 .5rem; - height: 3rem; - background-color: #fff; - display: grid; - align-items: center; - } - - .panel p:hover{ - background-color: #F6F6F6; - } - - .panel a{ - text-decoration: none; - cursor: pointer; - } - - button.accordion:after { - color: #F6F6F6; - } - ` +const SortStyled = styled.div` + .sortBar { + display: flex; + width: 19rem; + justify-content: space-between; + box-sizing: border-box; + font-size: 1rem; + font-family: Lato sans-serif; + } + + button.accordion { + background-color: #ffffff; + color: #1d1c1d; + cursor: pointer; + padding: 1.5rem 1rem; + width: 200px; + height: 3rem; + text-align: left; + border: none; + border-radius: 8px; + outline: none; + transition: 0.3s; + display: flex; + align-items: center; + justify-content: space-between; + } + + .sortBar button.accordion { + width: 239px; + } + + .sortBar .panel { + width: 215px; + } + + button.accordion.active, + button.accordion:hover { + background-color: #f6f6f6; + border-radius: 8px 8px 0 0; + } + + .panel.show { + display: block !important; + } + + .panel { + padding: 0 0.75rem; + background-color: white; + max-height: 0; + overflow: hidden; + transition: 0.3s ease-in-out; + opacity: 0; + width: 176px; + } + + .panel.show { + opacity: 1; + max-height: 800px; + box-shadow: 0px 2px 10px #d7d7d7; + border-radius: 0 0 4px 4px; + } + + .panel p { + color: #1d1c1d; + padding: 0 0.5rem; + height: 3rem; + background-color: #fff; + display: grid; + align-items: center; + } + + .panel p:hover { + background-color: #f6f6f6; + } + + .panel a { + text-decoration: none; + cursor: pointer; + } + + button.accordion:after { + color: #f6f6f6; + } +`; export default Sortdiv; diff --git a/server/client/src/components/deleteModal.tsx b/server/client/src/components/modals/deleteModal.tsx similarity index 83% rename from server/client/src/components/deleteModal.tsx rename to server/client/src/components/modals/deleteModal.tsx index 004e1617..1daab08e 100644 --- a/server/client/src/components/deleteModal.tsx +++ b/server/client/src/components/modals/deleteModal.tsx @@ -1,16 +1,17 @@ import { useEffect } from "react"; import { useSelector } from "react-redux"; -import { toast } from "react-toastify"; import styled from "styled-components"; -import Close from "../media/close-black.svg"; -import { selectUpdateId, updatedSongId } from "../app/deleteSongSlice"; -import { selectShowDeleteModal, showedDeleteModal } from "../app/uiSlice"; -import songService from "../services/songService"; -import { useAppDispatch, useAppSelector } from "../app/hooks"; -import { removedSong } from "../app/songsSlice"; +import Close from "../../media/close-black.svg"; +import { selectUpdateId, updatedSongId } from "../../app/deleteSongSlice"; +import { selectShowDeleteModal, showedDeleteModal } from "../../app/uiSlice"; +import songService from "../../services/songService"; +import { useAppDispatch, useAppSelector } from "../../app/hooks"; +import { addedSong, removedSong, selectSongs } from "../../app/songsSlice"; const DeleteModal = () => { const dispatch = useAppDispatch(); + + const songs = useAppSelector(selectSongs); const showDeleteModal = useAppSelector(selectShowDeleteModal); useEffect(() => { @@ -26,12 +27,12 @@ const DeleteModal = () => { function handleDelete() { dispatch(showedDeleteModal(false)); + const song = songs.find(s => s.id === id); + dispatch(removedSong({ id })); + songService.deleteSong(id, { - success: () => { - toast.success("Deleted successfully"); - dispatch(removedSong({ id })); - dispatch(updatedSongId("")); - } + success: () => dispatch(updatedSongId("")), + error: () => dispatch(addedSong(song)) }); } diff --git a/server/client/src/components/playlist.tsx b/server/client/src/components/playlist.tsx index 4380429e..62a5f9fc 100644 --- a/server/client/src/components/playlist.tsx +++ b/server/client/src/components/playlist.tsx @@ -5,10 +5,9 @@ import { selectSongs } from "../app/songsSlice"; import { getPlayerState } from "../app/playerSlice"; import Player from "./player"; -import PlaylistHeader from "./common/playlistHeader"; +import PlaylistHeader from "./playlistHeader"; import PlaylistItems from "./common/playlistItems"; import EmptyScreen from "./common/emptyScreen"; -import SearchFilter from "./searchFilter"; function Playlist() { const songs = useSelector(selectSongs); @@ -17,7 +16,6 @@ function Playlist() { return ( - {/* */} {songs.length === 0 && } diff --git a/server/client/src/components/common/playlistHeader.tsx b/server/client/src/components/playlistHeader.tsx similarity index 89% rename from server/client/src/components/common/playlistHeader.tsx rename to server/client/src/components/playlistHeader.tsx index a7110846..88628991 100644 --- a/server/client/src/components/common/playlistHeader.tsx +++ b/server/client/src/components/playlistHeader.tsx @@ -1,22 +1,17 @@ import { useEffect, useState } from "react"; import styled from "styled-components"; -import { useAppDispatch, useAppSelector } from "../../app/hooks"; - -// Store +import { useAppDispatch, useAppSelector } from "../app/hooks"; import { changedCurrentSong, changedPlaying, getPlayerState, showedPlayer -} from "../../app/playerSlice"; -import { showedPasteUrl } from "../../app/uiSlice"; - -// Components -import Button from "./button"; - -import Headset from "../../media/playlistIcon.svg"; -import { selectFirstSong, selectSongs } from "../../app/songsSlice"; -import { totalDuration } from "../../utils/song"; +} from "../app/playerSlice"; +import { showedPasteUrl } from "../app/uiSlice"; +import Button from "./common/button"; +import Headset from "../media/playlistIcon.svg"; +import { selectFirstSong, selectSongs } from "../app/songsSlice"; +import { totalDuration } from "../utils/song"; const PlaylistHeader = () => { const dispatch = useAppDispatch(); diff --git a/server/client/src/components/searchFilter.tsx b/server/client/src/components/searchFilter.tsx index f87346ef..307e8a62 100644 --- a/server/client/src/components/searchFilter.tsx +++ b/server/client/src/components/searchFilter.tsx @@ -14,6 +14,7 @@ const SearchFilter = () => { filter: "All songs", sort: "Default" }); + // const sortList = [ // "Default", // "Ascending order A - Z", @@ -216,7 +217,7 @@ const SearchFilter = () => { position: "absolute" }} src={ArrowIcon} - alt="" + alt="k" /> @@ -232,12 +233,12 @@ const Wrapper = styled.div` form { position: relative; - width: 100%; - max-width: -webkit-fill-available; + width: 100%; + max-width: -webkit-fill-available; input { font-style: normal; - width: -webkit-fill-available; + width: -webkit-fill-available; font-weight: normal; font-size: 15px; line-height: 18px; @@ -269,20 +270,20 @@ const Wrapper = styled.div` .title { display: flex; align-items: center; - padding-right: 8px; + padding-right: 8px; span { padding-bottom: 0; } } } .menu { - position: absolute; - top: 48px; - left: 0px; - width: 100%; - box-shadow: 0px 2px 10px #D7D7D7; - border-radius: 4px; - z-index: 5; + position: absolute; + top: 48px; + left: 0px; + width: 100%; + box-shadow: 0px 2px 10px #d7d7d7; + border-radius: 4px; + z-index: 5; button { border: none; @@ -295,51 +296,52 @@ const Wrapper = styled.div` font-size: 14px; line-height: 170%; color: #1d1c1d; - &:hover, &:focus { + &:hover, + &:focus { background: #f6f6f6; - cursor: pointer; + cursor: pointer; } } } - .filter__container, .sort__container { - display: flex; - } + .filter__container, + .sort__container { + display: flex; + } - .sort__container { - .select__container { - width: 240px; - } - } + .sort__container { + .select__container { + width: 240px; + } + } .filter__container { margin: 0 24px 0 40px; } .select__container { - align-items: center; + align-items: center; position: relative; - padding: 0 24px 0 16px; + padding: 0 24px 0 16px; height: 48px; border: 1px solid #f6f6f6; border-radius: 8px; - display: flex; - width: 200px; - cursor: pointer; + display: flex; + width: 200px; + cursor: pointer; - span { - margin: 0; + span { + margin: 0; width: calc(100% - 20px); padding-bottom: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - } + } img { - top: 12px; + top: 12px; right: 24px; position: aboslute; } - } } `; diff --git a/server/client/src/services/eventService.ts b/server/client/src/services/eventService.ts index 1697c067..e5ea29f8 100644 --- a/server/client/src/services/eventService.ts +++ b/server/client/src/services/eventService.ts @@ -7,6 +7,7 @@ import { addedSong, initializedSongs } from "../app/songsSlice"; import { setChats, addedChat } from "../app/chatsSlice"; import store from "../app/store"; import httpService from "./httpService"; +import { sanitize } from "../utils/sanitizer"; const dispatch = store.dispatch; @@ -27,9 +28,12 @@ type PublishedMessage = { const connect = () => { // initialize store - songService.getSongs(); + const songs = songService.getSongs(); // chatService.getChats(); + console.log(songs); + store.dispatch(initializedSongs(sanitize(songs))); + SubscribeToChannel(httpService.room_id, (message: PublishedMessage) => { const { event, diff --git a/server/client/src/services/httpService.ts b/server/client/src/services/httpService.ts index 7b326fbe..7e86e542 100644 --- a/server/client/src/services/httpService.ts +++ b/server/client/src/services/httpService.ts @@ -13,7 +13,7 @@ export const endpoints = { currentsong: "songs/current", deletesong: "songs/delete", songsearch: "songsearch", - likesong: "songs/like", + likesong: "songs/likecount", // Comments endpoints comments: "comments", diff --git a/server/client/src/services/logService.ts b/server/client/src/services/logService.ts new file mode 100644 index 00000000..973db698 --- /dev/null +++ b/server/client/src/services/logService.ts @@ -0,0 +1,11 @@ +import { toast } from "react-toastify"; + +const log = { + error: error => { + const m = typeof error === "object" ? error.message : error; + toast.error(m); + console.log(m); + } +}; + +export default log; diff --git a/server/client/src/services/songService.ts b/server/client/src/services/songService.ts index 8138d09f..ae704ed8 100644 --- a/server/client/src/services/songService.ts +++ b/server/client/src/services/songService.ts @@ -1,57 +1,59 @@ -import { initializedSongs } from "../app/songsSlice"; -import httpService, { endpoints } from "./httpService"; -import store from "../app/store"; -import { toast } from "react-toastify"; +import httpService from "./httpService"; +import log from "./logService"; const getSongs = () => { - httpService.get(httpService.endpoints.songs).then( + return httpService.get(httpService.endpoints.songs).then( result => { const data = result.data.data ?? []; - store.dispatch(initializedSongs(data.filter(song => song.url))); - return result; + return data as Song[]; }, error => { - console.log(error.message); - return []; + log.error(error); + return [] as Song[]; } ); }; const addSong = async (song: SongToAdd, cb: Callback) => { try { - await httpService.post(httpService.endpoints.songs, song); - const { songs } = store.getState(); - songs.slice(6).forEach(({ id }) => deleteSong(id)); + const { post, endpoints } = httpService; - cb?.success && cb.success(); + const { data } = await post(endpoints.songs, song); + + cb?.success && cb.success(data); } catch (error) { - toast.error(error.message); - console.log(error.message); + log.error(error); cb?.error && cb.error(); } }; const deleteSong = async (id: string, cb?: Callback) => { try { - await httpService.post(endpoints.deletesong, { id }); + const { post, endpoints } = httpService; + + await post(endpoints.deletesong, { _id: id }); cb?.success && cb.success(); } catch (error) { - console.log(error.message); - toast.error(error.message); + log.error(error); cb?.error && cb.error(); } }; const likeSong = async (like: LikeSong, cb: Callback) => { try { - await httpService.post(httpService.endpoints.likesong, like); + const { post, endpoints } = httpService; + + const { songId, userId } = like; + await post(endpoints.likesong, { + songId, + userId + }); cb?.success && cb.success(); } catch (error) { - console.log(error.message); - toast.error(error.message); + log.error(error); cb?.error && cb.error(); } }; diff --git a/server/client/src/types.d.ts b/server/client/src/types.d.ts index cd577eb1..b682c069 100644 --- a/server/client/src/types.d.ts +++ b/server/client/src/types.d.ts @@ -74,7 +74,7 @@ declare global { } interface Callback { - success?: () => void; + success?: (value?: any) => void; error?: () => void; } } From c53fc7976a24d4f8224353115784db4fdcefdf68 Mon Sep 17 00:00:00 2001 From: Sherlock-HolmesJM Date: Thu, 11 Nov 2021 06:10:47 +0100 Subject: [PATCH 17/28] refactored getSong --- server/client/src/services/eventService.ts | 7 +++---- server/client/src/services/songService.ts | 6 +----- 2 files changed, 4 insertions(+), 9 deletions(-) diff --git a/server/client/src/services/eventService.ts b/server/client/src/services/eventService.ts index e5ea29f8..ad51db82 100644 --- a/server/client/src/services/eventService.ts +++ b/server/client/src/services/eventService.ts @@ -28,12 +28,11 @@ type PublishedMessage = { const connect = () => { // initialize store - const songs = songService.getSongs(); + songService.getSongs().then(songs => { + store.dispatch(initializedSongs(songs.map(sanitize))); + }); // chatService.getChats(); - console.log(songs); - store.dispatch(initializedSongs(sanitize(songs))); - SubscribeToChannel(httpService.room_id, (message: PublishedMessage) => { const { event, diff --git a/server/client/src/services/songService.ts b/server/client/src/services/songService.ts index ae704ed8..5963795d 100644 --- a/server/client/src/services/songService.ts +++ b/server/client/src/services/songService.ts @@ -3,11 +3,7 @@ import log from "./logService"; const getSongs = () => { return httpService.get(httpService.endpoints.songs).then( - result => { - const data = result.data.data ?? []; - return data as Song[]; - }, - + result => (result.data.data ?? []) as Song[], error => { log.error(error); return [] as Song[]; From 00a0600e5bd720b6f9f7b98c6a551ee9bc23acf0 Mon Sep 17 00:00:00 2001 From: pauline-banye Date: Thu, 11 Nov 2021 16:11:50 +0100 Subject: [PATCH 18/28] removed client --- README.md | 8 +- server/.pre-commit-config.yaml | 12 +- server/client/.eslintrc.js | 24 - server/client/babel.config.json | 30 - server/client/jest.config.js | 28 - server/client/package.json | 89 - server/client/src/App.css | 25 - server/client/src/App.d.ts | 7 - server/client/src/App.tsx | 56 - server/client/src/app/chatsSlice.d.ts | 9 - server/client/src/app/chatsSlice.ts | 59 - server/client/src/app/deleteSongSlice.d.ts | 7 - server/client/src/app/deleteSongSlice.ts | 22 - server/client/src/app/hooks.d.ts | 56 - server/client/src/app/hooks.ts | 6 - server/client/src/app/playerSlice.d.ts | 16 - server/client/src/app/playerSlice.ts | 36 - server/client/src/app/reducer.d.ts | 28 - server/client/src/app/reducer.ts | 17 - server/client/src/app/songsSlice.d.ts | 17 - server/client/src/app/songsSlice.ts | 87 - server/client/src/app/store.d.ts | 84 - server/client/src/app/store.ts | 17 - server/client/src/app/uiSlice.d.ts | 21 - server/client/src/app/uiSlice.ts | 82 - server/client/src/app/usersSlice.d.ts | 20 - server/client/src/app/usersSlice.ts | 69 - server/client/src/components/chat.d.ts | 3 - server/client/src/components/chat.tsx | 167 - server/client/src/components/common/Home.d.ts | 3 - server/client/src/components/common/Home.tsx | 1131 --- server/client/src/components/common/alert.css | 122 - .../client/src/components/common/button.d.ts | 8 - .../client/src/components/common/button.tsx | 79 - .../src/components/common/chatHeader.d.ts | 3 - .../src/components/common/chatHeader.tsx | 110 - .../src/components/common/chatInput.d.ts | 3 - .../src/components/common/chatInput.tsx | 403 - .../src/components/common/chatItem.d.ts | 15 - .../client/src/components/common/chatItem.tsx | 167 - .../src/components/common/emptyScreen.d.ts | 3 - .../src/components/common/emptyScreen.tsx | 108 - server/client/src/components/common/exit.d.ts | 3 - server/client/src/components/common/exit.tsx | 245 - .../src/components/common/filterBar.d.ts | 3 - .../src/components/common/filterBar.tsx | 105 - .../client/src/components/common/footer.d.ts | 3 - .../client/src/components/common/footer.tsx | 205 - .../client/src/components/common/header.d.ts | 3 - .../client/src/components/common/header.tsx | 61 - .../src/components/common/landingscript.js | 69 - server/client/src/components/common/like.d.ts | 8 - server/client/src/components/common/like.tsx | 29 - .../components/common/likeOptionCount.d.ts | 3 - .../src/components/common/likeOptionCount.tsx | 121 - .../src/components/common/maintenance.d.ts | 1 - .../src/components/common/maintenance.tsx | 15 - .../src/components/common/memberItem.d.ts | 9 - .../src/components/common/memberItem.tsx | 88 - .../src/components/common/optionMenu.d.ts | 9 - .../src/components/common/optionMenu.tsx | 110 - .../src/components/common/pasteUrl.d.ts | 6 - .../client/src/components/common/pasteUrl.tsx | 188 - .../src/components/common/playlistHeader.d.ts | 3 - .../src/components/common/playlistHeader.tsx | 169 - .../src/components/common/playlistItem.d.ts | 7 - .../src/components/common/playlistItem.tsx | 169 - .../src/components/common/playlistItems.d.ts | 6 - .../src/components/common/playlistItems.tsx | 31 - .../src/components/common/playlistitem.css | 241 - .../src/components/common/searchBar.d.ts | 3 - .../src/components/common/searchBar.tsx | 56 - .../client/src/components/common/sortBar.d.ts | 3 - .../client/src/components/common/sortBar.tsx | 117 - server/client/src/components/deleteModal.d.ts | 3 - server/client/src/components/deleteModal.tsx | 184 - server/client/src/components/landingPage.d.ts | 3 - server/client/src/components/landingPage.tsx | 15 - server/client/src/components/memberList.d.ts | 6 - server/client/src/components/memberList.tsx | 206 - .../src/components/modals/enterRoom.d.ts | 6 - .../src/components/modals/enterRoom.tsx | 82 - server/client/src/components/musicRoom.d.ts | 3 - server/client/src/components/musicRoom.tsx | 188 - server/client/src/components/player.d.ts | 4 - server/client/src/components/player.tsx | 171 - server/client/src/components/playlist.d.ts | 3 - server/client/src/components/playlist.tsx | 56 - server/client/src/components/roomHeader.d.ts | 3 - server/client/src/components/roomHeader.tsx | 276 - .../client/src/components/searchFilter.d.ts | 3 - server/client/src/components/searchFilter.tsx | 346 - server/client/src/declarations.d.ts | 47 - server/client/src/media/Frame8866.svg | 7 - server/client/src/media/Rectangle158.svg | 9 - server/client/src/media/Rectangle159.svg | 22 - server/client/src/media/Rectangle160.svg | 22 - server/client/src/media/Rectangle161.svg | 22 - server/client/src/media/Rectangle163.svg | 10 - server/client/src/media/arrow-down.svg | 3 - server/client/src/media/arrowdown.svg | 12 - server/client/src/media/at.svg | 0 server/client/src/media/attach.svg | 15 - server/client/src/media/avatar-1.svg | 10 - server/client/src/media/avatar-2.svg | 10 - server/client/src/media/avatar-3.svg | 10 - server/client/src/media/beat.svg | 5 - server/client/src/media/bold.svg | 20 - server/client/src/media/chat-green.svg | 3 - server/client/src/media/chat.svg | 3 - server/client/src/media/chatEmoji.svg | 6 - server/client/src/media/chatGif.svg | 3 - server/client/src/media/chatItem.svg | 10 - server/client/src/media/chatSend.svg | 3 - server/client/src/media/check.svg | 3 - server/client/src/media/close-black.svg | 4 - server/client/src/media/close-popup.svg | 3 - server/client/src/media/close.svg | 4 - server/client/src/media/copy-icon.svg | 4 - server/client/src/media/customCover.svg | 9 - server/client/src/media/delete-icon.svg | 6 - server/client/src/media/emptyScreen.svg | 129 - server/client/src/media/energy.svg | 14 - server/client/src/media/filter-icon.svg | 3 - server/client/src/media/header-avatar.svg | 32 - server/client/src/media/header-group-icon.svg | 6 - server/client/src/media/italics.svg | 26 - server/client/src/media/like-filled.svg | 3 - server/client/src/media/like.svg | 3 - server/client/src/media/line.svg | 9 - server/client/src/media/link.svg | 20 - server/client/src/media/listAlbumCover.svg | 9 - server/client/src/media/member-list-icon.svg | 5 - server/client/src/media/menu-select.svg | 0 server/client/src/media/menu.svg | 5 - server/client/src/media/message.svg | 3 - server/client/src/media/musicRoomIcon.svg | 5 - server/client/src/media/option.svg | 3 - server/client/src/media/playlistIcon.svg | 9 - server/client/src/media/search-icon.svg | 10 - server/client/src/media/search.svg | 3 - server/client/src/media/send.svg | 14 - server/client/src/media/sort-icon.svg | 6 - server/client/src/media/user.jpeg | Bin 1691 -> 0 bytes server/client/src/root.component.d.ts | 2 - server/client/src/root.component.tsx | 13 - server/client/src/services/authService.d.ts | 1 - server/client/src/services/authService.ts | 12 - server/client/src/services/chatService.d.ts | 11 - server/client/src/services/chatService.ts | 63 - server/client/src/services/eventService.d.ts | 4 - server/client/src/services/eventService.ts | 75 - server/client/src/services/httpService.d.ts | 40 - server/client/src/services/httpService.ts | 43 - server/client/src/services/logService.d.ts | 7 - server/client/src/services/logService.ts | 20 - server/client/src/services/songService.d.ts | 7 - server/client/src/services/songService.ts | 50 - server/client/src/services/userService.d.ts | 15 - server/client/src/services/userService.ts | 131 - server/client/src/tests/App.test.d.ts | 1 - server/client/src/tests/App.test.tsx | 9 - server/client/src/tests/player.test.d.ts | 1 - server/client/src/tests/player.test.tsx | 18 - .../client/src/tests/root.component.test.d.ts | 1 - .../client/src/tests/root.component.test.tsx | 9 - server/client/src/tests/setupTests.js | 0 server/client/src/tests/svgTransform.js | 9 - server/client/src/types.d.ts | 48 - server/client/src/types.tsx | 55 - server/client/src/utils/chatMedia.d.ts | 1 - server/client/src/utils/chatMedia.ts | 16 - server/client/src/utils/config.d.ts | 17 - server/client/src/utils/config.ts | 29 - server/client/src/utils/formatTime.js | 29 - server/client/src/utils/idGenerator.d.ts | 2 - server/client/src/utils/idGenerator.ts | 19 - server/client/src/utils/metadata.d.ts | 1 - server/client/src/utils/metadata.ts | 23 - server/client/src/utils/mockdata.d.ts | 23 - server/client/src/utils/mockdata.ts | 76 - server/client/src/utils/sanitizer.d.ts | 1 - server/client/src/utils/sanitizer.ts | 12 - server/client/src/utils/song.d.ts | 1 - server/client/src/utils/song.ts | 15 - server/client/src/utils/syncArray.d.ts | 1 - server/client/src/utils/syncArray.ts | 18 - server/client/src/zuri-music-plugin.d.ts | 2 - server/client/src/zuri-music-plugin.tsx | 16 - server/client/tsconfig.json | 10 - server/client/webpack.config.js | 17 - server/client/yarn.lock | 7945 ----------------- server/config/settings.py | 13 +- server/music/api.py | 103 +- server/music/serializers.py | 1 - server/music/views.py | 10 +- 196 files changed, 28 insertions(+), 16524 deletions(-) delete mode 100644 server/client/.eslintrc.js delete mode 100644 server/client/babel.config.json delete mode 100644 server/client/jest.config.js delete mode 100644 server/client/package.json delete mode 100644 server/client/src/App.css delete mode 100644 server/client/src/App.d.ts delete mode 100644 server/client/src/App.tsx delete mode 100644 server/client/src/app/chatsSlice.d.ts delete mode 100644 server/client/src/app/chatsSlice.ts delete mode 100644 server/client/src/app/deleteSongSlice.d.ts delete mode 100644 server/client/src/app/deleteSongSlice.ts delete mode 100644 server/client/src/app/hooks.d.ts delete mode 100644 server/client/src/app/hooks.ts delete mode 100644 server/client/src/app/playerSlice.d.ts delete mode 100644 server/client/src/app/playerSlice.ts delete mode 100644 server/client/src/app/reducer.d.ts delete mode 100644 server/client/src/app/reducer.ts delete mode 100644 server/client/src/app/songsSlice.d.ts delete mode 100644 server/client/src/app/songsSlice.ts delete mode 100644 server/client/src/app/store.d.ts delete mode 100644 server/client/src/app/store.ts delete mode 100644 server/client/src/app/uiSlice.d.ts delete mode 100644 server/client/src/app/uiSlice.ts delete mode 100644 server/client/src/app/usersSlice.d.ts delete mode 100644 server/client/src/app/usersSlice.ts delete mode 100644 server/client/src/components/chat.d.ts delete mode 100644 server/client/src/components/chat.tsx delete mode 100644 server/client/src/components/common/Home.d.ts delete mode 100644 server/client/src/components/common/Home.tsx delete mode 100644 server/client/src/components/common/alert.css delete mode 100644 server/client/src/components/common/button.d.ts delete mode 100644 server/client/src/components/common/button.tsx delete mode 100644 server/client/src/components/common/chatHeader.d.ts delete mode 100644 server/client/src/components/common/chatHeader.tsx delete mode 100644 server/client/src/components/common/chatInput.d.ts delete mode 100644 server/client/src/components/common/chatInput.tsx delete mode 100644 server/client/src/components/common/chatItem.d.ts delete mode 100644 server/client/src/components/common/chatItem.tsx delete mode 100644 server/client/src/components/common/emptyScreen.d.ts delete mode 100644 server/client/src/components/common/emptyScreen.tsx delete mode 100644 server/client/src/components/common/exit.d.ts delete mode 100644 server/client/src/components/common/exit.tsx delete mode 100644 server/client/src/components/common/filterBar.d.ts delete mode 100644 server/client/src/components/common/filterBar.tsx delete mode 100644 server/client/src/components/common/footer.d.ts delete mode 100644 server/client/src/components/common/footer.tsx delete mode 100644 server/client/src/components/common/header.d.ts delete mode 100644 server/client/src/components/common/header.tsx delete mode 100644 server/client/src/components/common/landingscript.js delete mode 100644 server/client/src/components/common/like.d.ts delete mode 100644 server/client/src/components/common/like.tsx delete mode 100644 server/client/src/components/common/likeOptionCount.d.ts delete mode 100644 server/client/src/components/common/likeOptionCount.tsx delete mode 100644 server/client/src/components/common/maintenance.d.ts delete mode 100644 server/client/src/components/common/maintenance.tsx delete mode 100644 server/client/src/components/common/memberItem.d.ts delete mode 100644 server/client/src/components/common/memberItem.tsx delete mode 100644 server/client/src/components/common/optionMenu.d.ts delete mode 100644 server/client/src/components/common/optionMenu.tsx delete mode 100644 server/client/src/components/common/pasteUrl.d.ts delete mode 100644 server/client/src/components/common/pasteUrl.tsx delete mode 100644 server/client/src/components/common/playlistHeader.d.ts delete mode 100644 server/client/src/components/common/playlistHeader.tsx delete mode 100644 server/client/src/components/common/playlistItem.d.ts delete mode 100644 server/client/src/components/common/playlistItem.tsx delete mode 100644 server/client/src/components/common/playlistItems.d.ts delete mode 100644 server/client/src/components/common/playlistItems.tsx delete mode 100644 server/client/src/components/common/playlistitem.css delete mode 100644 server/client/src/components/common/searchBar.d.ts delete mode 100644 server/client/src/components/common/searchBar.tsx delete mode 100644 server/client/src/components/common/sortBar.d.ts delete mode 100644 server/client/src/components/common/sortBar.tsx delete mode 100644 server/client/src/components/deleteModal.d.ts delete mode 100644 server/client/src/components/deleteModal.tsx delete mode 100644 server/client/src/components/landingPage.d.ts delete mode 100644 server/client/src/components/landingPage.tsx delete mode 100644 server/client/src/components/memberList.d.ts delete mode 100644 server/client/src/components/memberList.tsx delete mode 100644 server/client/src/components/modals/enterRoom.d.ts delete mode 100644 server/client/src/components/modals/enterRoom.tsx delete mode 100644 server/client/src/components/musicRoom.d.ts delete mode 100644 server/client/src/components/musicRoom.tsx delete mode 100644 server/client/src/components/player.d.ts delete mode 100644 server/client/src/components/player.tsx delete mode 100644 server/client/src/components/playlist.d.ts delete mode 100644 server/client/src/components/playlist.tsx delete mode 100644 server/client/src/components/roomHeader.d.ts delete mode 100644 server/client/src/components/roomHeader.tsx delete mode 100644 server/client/src/components/searchFilter.d.ts delete mode 100644 server/client/src/components/searchFilter.tsx delete mode 100644 server/client/src/declarations.d.ts delete mode 100644 server/client/src/media/Frame8866.svg delete mode 100644 server/client/src/media/Rectangle158.svg delete mode 100644 server/client/src/media/Rectangle159.svg delete mode 100644 server/client/src/media/Rectangle160.svg delete mode 100644 server/client/src/media/Rectangle161.svg delete mode 100644 server/client/src/media/Rectangle163.svg delete mode 100644 server/client/src/media/arrow-down.svg delete mode 100644 server/client/src/media/arrowdown.svg delete mode 100644 server/client/src/media/at.svg delete mode 100644 server/client/src/media/attach.svg delete mode 100644 server/client/src/media/avatar-1.svg delete mode 100644 server/client/src/media/avatar-2.svg delete mode 100644 server/client/src/media/avatar-3.svg delete mode 100644 server/client/src/media/beat.svg delete mode 100644 server/client/src/media/bold.svg delete mode 100644 server/client/src/media/chat-green.svg delete mode 100644 server/client/src/media/chat.svg delete mode 100644 server/client/src/media/chatEmoji.svg delete mode 100644 server/client/src/media/chatGif.svg delete mode 100644 server/client/src/media/chatItem.svg delete mode 100644 server/client/src/media/chatSend.svg delete mode 100644 server/client/src/media/check.svg delete mode 100644 server/client/src/media/close-black.svg delete mode 100644 server/client/src/media/close-popup.svg delete mode 100644 server/client/src/media/close.svg delete mode 100644 server/client/src/media/copy-icon.svg delete mode 100644 server/client/src/media/customCover.svg delete mode 100644 server/client/src/media/delete-icon.svg delete mode 100644 server/client/src/media/emptyScreen.svg delete mode 100644 server/client/src/media/energy.svg delete mode 100644 server/client/src/media/filter-icon.svg delete mode 100644 server/client/src/media/header-avatar.svg delete mode 100644 server/client/src/media/header-group-icon.svg delete mode 100644 server/client/src/media/italics.svg delete mode 100644 server/client/src/media/like-filled.svg delete mode 100644 server/client/src/media/like.svg delete mode 100644 server/client/src/media/line.svg delete mode 100644 server/client/src/media/link.svg delete mode 100644 server/client/src/media/listAlbumCover.svg delete mode 100644 server/client/src/media/member-list-icon.svg delete mode 100644 server/client/src/media/menu-select.svg delete mode 100644 server/client/src/media/menu.svg delete mode 100644 server/client/src/media/message.svg delete mode 100644 server/client/src/media/musicRoomIcon.svg delete mode 100644 server/client/src/media/option.svg delete mode 100644 server/client/src/media/playlistIcon.svg delete mode 100644 server/client/src/media/search-icon.svg delete mode 100644 server/client/src/media/search.svg delete mode 100644 server/client/src/media/send.svg delete mode 100644 server/client/src/media/sort-icon.svg delete mode 100644 server/client/src/media/user.jpeg delete mode 100644 server/client/src/root.component.d.ts delete mode 100644 server/client/src/root.component.tsx delete mode 100644 server/client/src/services/authService.d.ts delete mode 100644 server/client/src/services/authService.ts delete mode 100644 server/client/src/services/chatService.d.ts delete mode 100644 server/client/src/services/chatService.ts delete mode 100644 server/client/src/services/eventService.d.ts delete mode 100644 server/client/src/services/eventService.ts delete mode 100644 server/client/src/services/httpService.d.ts delete mode 100644 server/client/src/services/httpService.ts delete mode 100644 server/client/src/services/logService.d.ts delete mode 100644 server/client/src/services/logService.ts delete mode 100644 server/client/src/services/songService.d.ts delete mode 100644 server/client/src/services/songService.ts delete mode 100644 server/client/src/services/userService.d.ts delete mode 100644 server/client/src/services/userService.ts delete mode 100644 server/client/src/tests/App.test.d.ts delete mode 100644 server/client/src/tests/App.test.tsx delete mode 100644 server/client/src/tests/player.test.d.ts delete mode 100644 server/client/src/tests/player.test.tsx delete mode 100644 server/client/src/tests/root.component.test.d.ts delete mode 100644 server/client/src/tests/root.component.test.tsx delete mode 100644 server/client/src/tests/setupTests.js delete mode 100644 server/client/src/tests/svgTransform.js delete mode 100644 server/client/src/types.d.ts delete mode 100644 server/client/src/types.tsx delete mode 100644 server/client/src/utils/chatMedia.d.ts delete mode 100644 server/client/src/utils/chatMedia.ts delete mode 100644 server/client/src/utils/config.d.ts delete mode 100644 server/client/src/utils/config.ts delete mode 100644 server/client/src/utils/formatTime.js delete mode 100644 server/client/src/utils/idGenerator.d.ts delete mode 100644 server/client/src/utils/idGenerator.ts delete mode 100644 server/client/src/utils/metadata.d.ts delete mode 100644 server/client/src/utils/metadata.ts delete mode 100644 server/client/src/utils/mockdata.d.ts delete mode 100644 server/client/src/utils/mockdata.ts delete mode 100644 server/client/src/utils/sanitizer.d.ts delete mode 100644 server/client/src/utils/sanitizer.ts delete mode 100644 server/client/src/utils/song.d.ts delete mode 100644 server/client/src/utils/song.ts delete mode 100644 server/client/src/utils/syncArray.d.ts delete mode 100644 server/client/src/utils/syncArray.ts delete mode 100644 server/client/src/zuri-music-plugin.d.ts delete mode 100644 server/client/src/zuri-music-plugin.tsx delete mode 100644 server/client/tsconfig.json delete mode 100644 server/client/webpack.config.js delete mode 100644 server/client/yarn.lock diff --git a/README.md b/README.md index 96329265..bd8746f4 100644 --- a/README.md +++ b/README.md @@ -22,7 +22,7 @@ # >## Overview

-ZuriChat is an open source slack clone that provides the opportunity for people to network, collaborate, educate and learn remotely. It allows people to take their classroom everywhere, make learning fun, stay engaged and inspired with the virtual lounge and games. +ZuriChat is an open source web app that provides the opportunity for people to network, collaborate, educate and learn remotely. It allows people to take their classroom everywhere, make learning fun, stay engaged and inspired with the virtual lounge and games. One of its unique features are the variety of plugins designed to add features such as tracking company expenses, sending information fast and smoothly, managing files and integrating tools all with ZuriChat. @@ -193,7 +193,11 @@ An exhaustive list can be found in the requirements.txt file included in this pr > ## Links to the project Local server: http://localhost:22672/music -Live site: http://staging.zuri.chat/music +Zurichat Staging site: http://staging.zuri.chat/music + +Zurichat main site: http://zuri.chat/music + +Live site: http://music.zuri.chat/music API root: http://localhost::22672/music/api/v1 diff --git a/server/.pre-commit-config.yaml b/server/.pre-commit-config.yaml index 7d915720..793194ff 100644 --- a/server/.pre-commit-config.yaml +++ b/server/.pre-commit-config.yaml @@ -16,12 +16,12 @@ repos: rev: 21.9b0 hooks: - id: black - - repo: https://github.com/PyCQA/flake8 - rev: 4.0.1 - hooks: - - id: flake8 - args: - - "--max-line-length=150" +# - repo: https://github.com/PyCQA/flake8 +# rev: 4.0.1 +# hooks: +# - id: flake8 +# args: +# - "--max-line-length=150" - repo: https://github.com/PyCQA/pylint rev: v3.0.0-a4 hooks: diff --git a/server/client/.eslintrc.js b/server/client/.eslintrc.js deleted file mode 100644 index 8fab9f67..00000000 --- a/server/client/.eslintrc.js +++ /dev/null @@ -1,24 +0,0 @@ -module.exports = { - env: { - browser: true, - es2021: true, - }, - extends: [ - 'plugin:react/recommended', - 'airbnb', - ], - parser: '@typescript-eslint/parser', - parserOptions: { - ecmaFeatures: { - jsx: true, - }, - ecmaVersion: 12, - sourceType: 'module', - }, - plugins: [ - 'react', - '@typescript-eslint', - ], - rules: { - }, -}; diff --git a/server/client/babel.config.json b/server/client/babel.config.json deleted file mode 100644 index a43d8041..00000000 --- a/server/client/babel.config.json +++ /dev/null @@ -1,30 +0,0 @@ -{ - "presets": [ - "@babel/preset-env", - [ - "@babel/preset-react", - { - "runtime": "automatic" - } - ], - "@babel/preset-typescript" - ], - "plugins": [ - [ - "@babel/plugin-transform-runtime", - { - "useESModules": true, - "regenerator": false - } - ] - ], - "env": { - "test": { - "presets": [ - ["@babel/preset-env", { - "targets": "current node" - }] - ] - } - } -} diff --git a/server/client/jest.config.js b/server/client/jest.config.js deleted file mode 100644 index d95da1ac..00000000 --- a/server/client/jest.config.js +++ /dev/null @@ -1,28 +0,0 @@ -module.exports = { - rootDir: ".", - testEnvironment: "jsdom", - transform: { - "^.+\\.(j|t)sx?$": "babel-jest", - "^.+\\.tsx?$": "ts-jest", - "^.+\\.svg$": "/src/tests/svgTransform.js" - }, - moduleNameMapper: { - "\\.(css)$": "identity-obj-proxy", - "single-spa-react/parcel": "single-spa-react/lib/cjs/parcel.cjs", - }, - setupFilesAfterEnv: ["@testing-library/jest-dom"], - "setupFiles": ["/src/tests/setupTests.js"], - "testRegex": "/*.test.tsx$", - "collectCoverage": true, - "coverageReporters": ["lcov"], - "coverageDirectory": "test-coverage", - "coverageThreshold": { - "global": { - "branches": 0, - "functions": 0, - "lines": 0, - "statements": 0 - } - }, - "moduleDirectories": ["node_modules", "src"] -}; diff --git a/server/client/package.json b/server/client/package.json deleted file mode 100644 index 272e8480..00000000 --- a/server/client/package.json +++ /dev/null @@ -1,89 +0,0 @@ -{ - "name": "@zuri/zuri-music-plugin", - "scripts": { - "start": "webpack serve --port 8001", - "start:standalone": "webpack serve --env standalone", - "build": "concurrently yarn:build:*", - "build:webpack": "webpack --mode=production", - "analyze": "webpack --mode=production --env analyze", - "lint": "eslint src --ext js,ts,tsx", - "format": "prettier --write .", - "check-format": "prettier --check .", - "test": "cross-env BABEL_ENV=test jest", - "watch-tests": "cross-env BABEL_ENV=test jest --watch", - "prepare": "cd ../.. && husky install", - "coverage": "cross-env BABEL_ENV=test jest --coverage", - "build:types": "tsc" - }, - "devDependencies": { - "@babel/core": "^7.15.0", - "@babel/eslint-parser": "^7.15.0", - "@babel/plugin-transform-runtime": "^7.15.0", - "@babel/preset-env": "^7.15.0", - "@babel/preset-react": "^7.14.5", - "@babel/preset-typescript": "^7.15.0", - "@babel/runtime": "^7.15.3", - "@testing-library/jest-dom": "^5.14.1", - "@testing-library/react": "^12.0.0", - "@types/styled-components": "^5.1.14", - "@types/testing-library__jest-dom": "^5.14.1", - "@typescript-eslint/eslint-plugin": "^5.2.0", - "@typescript-eslint/parser": "^5.2.0", - "babel-jest": "^27.0.6", - "concurrently": "^6.2.1", - "cross-env": "^7.0.3", - "eslint": "^7.32.0", - "eslint-config-airbnb": "^18.2.1", - "eslint-config-prettier": "^8.3.0", - "eslint-config-ts-react-important-stuff": "^3.0.0", - "eslint-plugin-import": "^2.25.2", - "eslint-plugin-jsx-a11y": "^6.4.1", - "eslint-plugin-prettier": "^3.4.1", - "eslint-plugin-react": "^7.26.1", - "eslint-plugin-react-hooks": "^4.2.0", - "husky": ">=6", - "identity-obj-proxy": "^3.0.0", - "jest": "^27.0.6", - "jest-cli": "^27.0.6", - "lint-staged": ">=10", - "prettier": "^2.3.2", - "pretty-quick": "^3.1.1", - "ts-config-single-spa": "^3.0.0", - "typescript": "^4.3.5", - "webpack": "^5.51.1", - "webpack-cli": "^4.8.0", - "webpack-config-single-spa-react": "^4.0.0", - "webpack-config-single-spa-react-ts": "^4.0.0", - "webpack-config-single-spa-ts": "^4.0.0", - "webpack-dev-server": "^4.0.0", - "webpack-merge": "^5.8.0" - }, - "dependencies": { - "@mui/icons-material": "^5.0.1", - "@mui/material": "^5.0.1", - "@reduxjs/toolkit": "^1.6.1", - "@types/jest": "^27.0.1", - "@types/react": "^17.0.19", - "@types/react-dom": "^17.0.9", - "@types/systemjs": "^6.1.1", - "@types/webpack-env": "^1.16.2", - "axios": "^0.21.4", - "centrifuge": "^2.8.2", - "emoji-picker-react": "^3.4.8", - "moment-timezone": "^0.5.33", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "react-giphy-picker": "^1.1.1", - "react-icons": "^4.2.0", - "react-loader-spinner": "^4.0.0", - "react-moment": "^1.1.1", - "react-player": "^2.9.0", - "react-redux": "^7.2.5", - "react-toastify": "^8.0.2", - "single-spa": "^5.9.3", - "single-spa-react": "^4.3.1", - "sockjs-client": "^1.5.2", - "styled-components": "^5.3.1" - }, - "types": "dist/zuri-music-plugin.d.ts" -} diff --git a/server/client/src/App.css b/server/client/src/App.css deleted file mode 100644 index 6704de16..00000000 --- a/server/client/src/App.css +++ /dev/null @@ -1,25 +0,0 @@ -@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300&display=swap"); - -body { - font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", - "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", - sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - - /* background-color: rgb(240, 240, 240); */ - box-sizing: border-box; - margin: 0; - padding: 0; - height: 100%; - min-width: 325px; -} - -body::-webkit-scrollbar { - width: 5px; -} - -body::-webkit-scrollbar-thumb { - width: 6px; - background-color: #00b87c; -} diff --git a/server/client/src/App.d.ts b/server/client/src/App.d.ts deleted file mode 100644 index 05a35b14..00000000 --- a/server/client/src/App.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -/// -import "moment-timezone"; -import "react-toastify/dist/ReactToastify.css"; -import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; -import "./App.css"; -declare function App(): JSX.Element; -export default App; diff --git a/server/client/src/App.tsx b/server/client/src/App.tsx deleted file mode 100644 index c89bf7b6..00000000 --- a/server/client/src/App.tsx +++ /dev/null @@ -1,56 +0,0 @@ -import { useEffect } from "react"; -import styled from "styled-components"; - -import MusicRoom from "./components/musicRoom"; -import DeleteModal from "./components/deleteModal"; - -import chatMediaQuery from "./utils/chatMedia"; - -import eventService from "./services/eventService"; - -import "moment-timezone"; -import "react-toastify/dist/ReactToastify.css"; -import "react-loader-spinner/dist/loader/css/react-spinner-loader.css"; -import "./App.css"; - -function App() { - useEffect(() => { - eventService.connect(); - chatMediaQuery(); // toggle chat display based on screen size. - }, []); - - return ( - - - - - - ); -} - -const Wrapper = styled.div` - box-sizing: border-box; - position: relative; - margin: 0; - padding: 0; - background: black; - height: 100%; - overflow: hidden; - - /* &::-webkit-scrollbar { - width: 5px; - } - - &::-webkit-scrollbar-thumb { - width: 6px; - background-color: #00b87c; - } */ - - .loader-wrapper { - position: absolute; - top: 100px; - z-index: 111; - } -`; - -export default App; diff --git a/server/client/src/app/chatsSlice.d.ts b/server/client/src/app/chatsSlice.d.ts deleted file mode 100644 index 6bcbdf43..00000000 --- a/server/client/src/app/chatsSlice.d.ts +++ /dev/null @@ -1,9 +0,0 @@ -import { RootState } from "./store"; -export declare const addedChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setChats: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, failChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removeChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, sentChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectChats: (state: RootState) => Chat[]; -export declare const selectChatById: (id: string) => (state: RootState) => Chat; -export declare const selectLastChat: (state: RootState) => Chat; -declare const _default: import("redux").Reducer; -export default _default; diff --git a/server/client/src/app/chatsSlice.ts b/server/client/src/app/chatsSlice.ts deleted file mode 100644 index 420e57fb..00000000 --- a/server/client/src/app/chatsSlice.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import { RootState } from "./store"; -import { sanitize } from "../utils/sanitizer"; - -// import avatar from "../media/chatItem.svg"; - -const chatsSlice = createSlice({ - name: "chats", - - initialState: [] as Chat[], - - reducers: { - setChats: (state, { payload }: PayloadAction) => { - return payload.map(sanitize); - }, - - addedChat: (state, { payload }: PayloadAction) => { - state.push(sanitize(payload)); - }, - - removeChat: (state, { payload }: PayloadAction<{ id: string }>) => { - state = state.filter(chat => chat.id !== payload.id); - }, - - failChat: (state, { payload }: PayloadAction) => { - const { id, message } = payload; - state.map(chat => { - if (chat.id === id && chat.message === message) { - chat.notSent = false; - chat.failed = true; - } - }); - }, - - sentChat: (state, { payload }: PayloadAction) => { - const { id, message } = payload; - state.map(chat => { - if (chat.id === id && chat.message === message) { - chat.notSent = false; - chat.failed = false; - } - }); - } - } -}); - -export const { addedChat, setChats, failChat, removeChat, sentChat } = - chatsSlice.actions; - -export const selectChats = (state: RootState) => state.chats; - -export const selectChatById = (id: string) => (state: RootState) => { - return state.chats.find(chat => chat.id === id); -}; - -export const selectLastChat = (state: RootState) => - state.chats[state.chats.length - 1]; - -export default chatsSlice.reducer; diff --git a/server/client/src/app/deleteSongSlice.d.ts b/server/client/src/app/deleteSongSlice.d.ts deleted file mode 100644 index fce0da98..00000000 --- a/server/client/src/app/deleteSongSlice.d.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { RootState } from "./store"; -export declare const updatedSongId: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectUpdateId: (state: RootState) => string; -declare const _default: import("redux").Reducer<{ - updateId: string; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/deleteSongSlice.ts b/server/client/src/app/deleteSongSlice.ts deleted file mode 100644 index afb1a1e5..00000000 --- a/server/client/src/app/deleteSongSlice.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import store, { RootState } from "./store"; - -const slice = createSlice({ - name: "delete", - - initialState: { - updateId: "" // id of the song - }, - - reducers: { - updatedSongId(state, action: PayloadAction) { - state.updateId = action.payload; - } - } -}); - -export const { updatedSongId } = slice.actions; - -export const selectUpdateId = (state: RootState) => state.delete.updateId; - -export default slice.reducer; diff --git a/server/client/src/app/hooks.d.ts b/server/client/src/app/hooks.d.ts deleted file mode 100644 index e3d57645..00000000 --- a/server/client/src/app/hooks.d.ts +++ /dev/null @@ -1,56 +0,0 @@ -import { TypedUseSelectorHook } from "react-redux"; -import type { RootState } from "./store"; -export declare const useAppDispatch: () => import("redux-thunk").ThunkDispatch<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, null, import("redux").AnyAction> & import("redux-thunk").ThunkDispatch<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, undefined, import("redux").AnyAction> & import("redux").Dispatch; -export declare const useAppSelector: TypedUseSelectorHook; diff --git a/server/client/src/app/hooks.ts b/server/client/src/app/hooks.ts deleted file mode 100644 index 36b5ea2f..00000000 --- a/server/client/src/app/hooks.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { TypedUseSelectorHook, useDispatch, useSelector } from "react-redux"; -import type { RootState, AppDispatch } from "./store"; - -// Use throughout your app instead of plain `useDispatch` and `useSelector` -export const useAppDispatch = () => useDispatch(); -export const useAppSelector: TypedUseSelectorHook = useSelector; diff --git a/server/client/src/app/playerSlice.d.ts b/server/client/src/app/playerSlice.d.ts deleted file mode 100644 index 8a6595a9..00000000 --- a/server/client/src/app/playerSlice.d.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { RootState } from "./store"; -export declare const changedPlaying: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedPlayer: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, changedCurrentSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>; -export declare const getPlayerState: (state: RootState) => { - playing: boolean; - show: boolean; - currentSongId: string; -}; -export declare const selectCurrentSong: (state: RootState) => Song; -declare const _default: import("redux").Reducer<{ - playing: boolean; - show: boolean; - currentSongId: string; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/playerSlice.ts b/server/client/src/app/playerSlice.ts deleted file mode 100644 index 2ba4d5cf..00000000 --- a/server/client/src/app/playerSlice.ts +++ /dev/null @@ -1,36 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import store, { RootState } from "./store"; - -const slice = createSlice({ - name: "player", - - initialState: { - playing: false, - show: false, - currentSongId: "" - }, - - reducers: { - changedPlaying: (state, action: PayloadAction) => { - state.playing = action.payload; - }, - - showedPlayer: (state, action: PayloadAction) => { - state.show = action.payload; - }, - - changedCurrentSong: (state, action: PayloadAction<{ id: string }>) => { - state.currentSongId = action.payload.id; - } - } -}); - -export const { changedPlaying, showedPlayer, changedCurrentSong } = - slice.actions; - -export const getPlayerState = (state: RootState) => state.player; - -export const selectCurrentSong = (state: RootState) => - state.songs.find(s => s.id === state.player.currentSongId); - -export default slice.reducer; diff --git a/server/client/src/app/reducer.d.ts b/server/client/src/app/reducer.d.ts deleted file mode 100644 index 6472195d..00000000 --- a/server/client/src/app/reducer.d.ts +++ /dev/null @@ -1,28 +0,0 @@ -declare const reducer: { - users: import("redux").Reducer<{ - currentUser: User; - isMember: boolean; - users: User[]; - }, import("redux").AnyAction>; - chats: import("redux").Reducer; - songs: import("redux").Reducer; - ui: import("redux").Reducer<{ - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }, import("redux").AnyAction>; - player: import("redux").Reducer<{ - playing: boolean; - show: boolean; - currentSongId: string; - }, import("redux").AnyAction>; - delete: import("redux").Reducer<{ - updateId: string; - }, import("redux").AnyAction>; -}; -export default reducer; diff --git a/server/client/src/app/reducer.ts b/server/client/src/app/reducer.ts deleted file mode 100644 index 86289744..00000000 --- a/server/client/src/app/reducer.ts +++ /dev/null @@ -1,17 +0,0 @@ -import usersReducer from "./usersSlice"; -import songsReducer from "./songsSlice"; -import chatsReducer from "./chatsSlice"; -import uiReducer from "./uiSlice"; -import playerReducer from "./playerSlice"; -import deleteReducer from "./deleteSongSlice"; - -const reducer = { - users: usersReducer, - chats: chatsReducer, - songs: songsReducer, - ui: uiReducer, - player: playerReducer, - delete: deleteReducer -}; - -export default reducer; diff --git a/server/client/src/app/songsSlice.d.ts b/server/client/src/app/songsSlice.d.ts deleted file mode 100644 index 8ad971d2..00000000 --- a/server/client/src/app/songsSlice.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { RootState } from "./store"; -export declare const addedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, likedSong: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, initializedSongs: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectSongs: (state: RootState) => Song[]; -export declare const selectSongById: (songId: string) => (state: RootState) => Song; -export declare const selectSongByUrl: (url: string) => (state: RootState) => Song; -export declare const selectFirstSong: (state: RootState) => Song; -export declare const selectLikeCount: ({ songId, userId }: { - songId: string; - userId: string; -}) => (state: RootState) => { - count: number; - liked: boolean; -}; -declare const _default: import("redux").Reducer; -export default _default; diff --git a/server/client/src/app/songsSlice.ts b/server/client/src/app/songsSlice.ts deleted file mode 100644 index 0fc9a9a5..00000000 --- a/server/client/src/app/songsSlice.ts +++ /dev/null @@ -1,87 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import { RootState } from "./store"; - -import { sanitize } from "../utils/sanitizer"; - -const songsSlice = createSlice({ - name: "songs", - - initialState: [] as Song[], - - reducers: { - initializedSongs: (state, { payload }: PayloadAction) => { - return payload.map(sanitize); - }, - - addedSong: (state, { payload }: PayloadAction) => { - state.unshift(sanitize(payload)); - }, - - removedSong: (state, { payload }: PayloadAction<{ id: string }>) => { - state = state.filter(song => song.id !== payload.id); - }, - - likedSong: (state, { payload }: PayloadAction) => { - const { like, songId, userId } = payload; - - const index = state.findIndex(song => song.id === songId); - - if (index === -1) return state; - - const song = state[index]; - - if (like) song.likedBy.push(userId); - else song.likedBy = song.likedBy.filter(id => id !== userId); - - state[index] = song; - } - } -}); - -export const { addedSong, removedSong, likedSong, initializedSongs } = - songsSlice.actions; - -// export const songDispatch = { -// addedSong: (payload: Song) => { -// store.dispatch({ type: addSong.type, payload }); -// }, - -// initializedSongs: (payload: Song[]) => { -// store.dispatch({ type: initialize.type, payload }); -// }, - -// removedSong: (id: string) => { -// store.dispatch({ type: removeSong.type, payload: { id } }); -// }, - -// likedSong: (payload: LikeSong) => { -// store.dispatch({ type: likeSong.type, payload }); -// } -// }; - -export const selectSongs = (state: RootState) => state.songs; - -export const selectSongById = (songId: string) => (state: RootState) => { - return state.songs.find(song => song.id === songId); -}; - -export const selectSongByUrl = (url: string) => (state: RootState) => { - return state.songs.find(song => song.url === url); -}; - -export const selectFirstSong = (state: RootState) => state.songs[0]; - -export const selectLikeCount = - ({ songId, userId }: { songId: string; userId: string }) => - (state: RootState) => { - const song = state.songs.find(song => song.id === songId); - - if (!song) return { count: 0, liked: false }; - - return { - count: song.likedBy.length, - liked: song.likedBy.some(id => id === userId) - }; - }; - -export default songsSlice.reducer; diff --git a/server/client/src/app/store.d.ts b/server/client/src/app/store.d.ts deleted file mode 100644 index 7a8e140f..00000000 --- a/server/client/src/app/store.d.ts +++ /dev/null @@ -1,84 +0,0 @@ -import { ThunkAction, Action } from "@reduxjs/toolkit"; -declare const store: import("@reduxjs/toolkit").EnhancedStore<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, [import("redux-thunk").ThunkMiddleware<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, null> | import("redux-thunk").ThunkMiddleware<{ - users: { - currentUser: User; - isMember: boolean; - users: User[]; - }; - chats: Chat[]; - songs: Song[]; - ui: { - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; - }; - player: { - playing: boolean; - show: boolean; - currentSongId: string; - }; - delete: { - updateId: string; - }; -}, import("redux").AnyAction, undefined>]>; -export declare type AppDispatch = typeof store.dispatch; -export declare type RootState = ReturnType; -export declare type AppThunk = ThunkAction>; -export default store; diff --git a/server/client/src/app/store.ts b/server/client/src/app/store.ts deleted file mode 100644 index b2d34a5f..00000000 --- a/server/client/src/app/store.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { configureStore, ThunkAction, Action } from "@reduxjs/toolkit"; -import reducer from "./reducer"; - -const store = configureStore({ - reducer -}); - -export type AppDispatch = typeof store.dispatch; -export type RootState = ReturnType; -export type AppThunk = ThunkAction< - ReturnType, - RootState, - unknown, - Action ->; - -export default store; diff --git a/server/client/src/app/uiSlice.d.ts b/server/client/src/app/uiSlice.d.ts deleted file mode 100644 index a0ed40e7..00000000 --- a/server/client/src/app/uiSlice.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { RootState } from "./store"; -export declare const loaded: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedChat: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedPasteUrl: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, exitedModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedMemberList: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, showedDeleteModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setEnterModal: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectShowChat: (state: RootState) => boolean; -export declare const selectShowPasteUrl: (state: RootState) => boolean; -export declare const selectIsLoading: (state: RootState) => boolean; -export declare const selectShowModal: (state: RootState) => boolean; -export declare const selectShowExitModal: (state: RootState) => boolean; -export declare const selectShowMemberList: (state: RootState) => boolean; -export declare const selectShowDeleteModal: (state: RootState) => boolean; -export declare const selectEnterModal: (state: RootState) => boolean; -declare const _default: import("redux").Reducer<{ - isLoading: boolean; - showChat: boolean; - showPasteUrl: boolean; - showModal: boolean; - exitModal: boolean; - showMemberList: boolean; - showDeleteModal: boolean; - enterModal: boolean; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/uiSlice.ts b/server/client/src/app/uiSlice.ts deleted file mode 100644 index e647b8e7..00000000 --- a/server/client/src/app/uiSlice.ts +++ /dev/null @@ -1,82 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import { RootState } from "./store"; - -const slice = createSlice({ - name: "ui", - - initialState: { - isLoading: false, - showChat: false, - showPasteUrl: false, - showModal: false, - exitModal: false, - showMemberList: false, - showDeleteModal: false, - enterModal: true - }, - - reducers: { - loaded: (state, action: PayloadAction) => { - state.isLoading = action.payload; - }, - - showedChat: (state, action: PayloadAction) => { - state.showChat = action.payload; - }, - - showedPasteUrl: (state, action: PayloadAction) => { - state.showPasteUrl = action.payload; - }, - showedModal: (state, action: PayloadAction) => { - // state.showModal = action.payload; - return state; - }, - - exitedModal: (state, action: PayloadAction) => { - state.exitModal = action.payload; - }, - - showedMemberList: (state, action: PayloadAction) => { - state.showMemberList = action.payload; - }, - - showedDeleteModal: (state, action: PayloadAction) => { - state.showDeleteModal = action.payload; - }, - - setEnterModal: (state, { payload }: PayloadAction) => { - state.enterModal = payload; - } - } -}); - -export const { - loaded, - showedChat, - showedPasteUrl, - showedModal, - exitedModal, - showedMemberList, - showedDeleteModal, - setEnterModal -} = slice.actions; - -export const selectShowChat = (state: RootState) => state.ui.showChat; - -export const selectShowPasteUrl = (state: RootState) => state.ui.showPasteUrl; - -export const selectIsLoading = (state: RootState) => state.ui.isLoading; - -export const selectShowModal = (state: RootState) => state.ui.showModal; - -export const selectShowExitModal = (state: RootState) => state.ui.exitModal; - -export const selectShowMemberList = (state: RootState) => - state.ui.showMemberList; - -export const selectShowDeleteModal = (state: RootState) => - state.ui.showDeleteModal; - -export const selectEnterModal = (state: RootState) => state.ui.enterModal; - -export default slice.reducer; diff --git a/server/client/src/app/usersSlice.d.ts b/server/client/src/app/usersSlice.d.ts deleted file mode 100644 index ff79d643..00000000 --- a/server/client/src/app/usersSlice.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { RootState } from "./store"; -export declare const setCurrentUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, addedUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, setUsers: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload, removedUser: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload<{ - id: string; -}, string>, setMembership: import("@reduxjs/toolkit").ActionCreatorWithOptionalPayload; -export declare const selectCurrentUser: (state: RootState) => User; -export declare const selectUserList: (state: RootState) => User[]; -export declare const selectUserById: (id: string) => (state: RootState) => User; -export declare const selectUserCount: (state: RootState) => number; -export declare const selectIsMember: (state: RootState) => boolean; -export declare const selectAllUsers: (state: RootState) => { - currentUser: User; - isMember: boolean; - users: User[]; -}; -declare const _default: import("redux").Reducer<{ - currentUser: User; - isMember: boolean; - users: User[]; -}, import("redux").AnyAction>; -export default _default; diff --git a/server/client/src/app/usersSlice.ts b/server/client/src/app/usersSlice.ts deleted file mode 100644 index 6e52affe..00000000 --- a/server/client/src/app/usersSlice.ts +++ /dev/null @@ -1,69 +0,0 @@ -import { createSlice, PayloadAction } from "@reduxjs/toolkit"; -import { RootState } from "./store"; - -const user: User = { - id: "juztiz5000kdkdkdkdkdkdkd", - avatar: "https://music.zuri.chat/static/8088dff19013ace2e359.svg", - name: "Justiz", - email: "" -}; - -const usersSlice = createSlice({ - name: "users", - - initialState: { - currentUser: user, - isMember: true, - users: [] as User[] - }, - - reducers: { - setCurrentUser: (state, { payload }: PayloadAction) => { - // if (typeof payload !== "string") return state; - - state.currentUser = payload; - }, - - setUsers: (state, { payload }: PayloadAction) => { - state.users = payload; - }, - - addedUser: (state, { payload }: PayloadAction) => { - const index = state.users.find(user => user.id === payload.id); - if (!index) state.users.push(payload); - }, - - removedUser: (state, { payload }: PayloadAction<{ id: string }>) => { - const index = state.users.findIndex(user => user.id === payload.id); - state.users.splice(index, 1); - }, - - setMembership: (state, { payload }: PayloadAction) => { - state.isMember = payload; - } - } -}); - -export const { - setCurrentUser, - addedUser, - setUsers, - removedUser, - setMembership -} = usersSlice.actions; - -export const selectCurrentUser = (state: RootState): User => - state.users.currentUser; - -export const selectUserList = (state: RootState) => state.users.users; - -export const selectUserById = (id: string) => (state: RootState) => - state.users.users.find(user => user.id === id); - -export const selectUserCount = (state: RootState) => state.users.users.length; - -export const selectIsMember = (state: RootState) => state.users.isMember; - -export const selectAllUsers = (state: RootState) => state.users; - -export default usersSlice.reducer; diff --git a/server/client/src/components/chat.d.ts b/server/client/src/components/chat.d.ts deleted file mode 100644 index 34145db0..00000000 --- a/server/client/src/components/chat.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Chat(props: any): JSX.Element; -export default Chat; diff --git a/server/client/src/components/chat.tsx b/server/client/src/components/chat.tsx deleted file mode 100644 index 4d58005f..00000000 --- a/server/client/src/components/chat.tsx +++ /dev/null @@ -1,167 +0,0 @@ -import { useEffect, useRef, useState } from "react"; -import styled from "styled-components"; -import { useSelector } from "react-redux"; - -import ChatHeader from "./common/chatHeader"; -import ChatItem from "./common/chatItem"; -import ChatInput from "./common/chatInput"; - -import { selectChats, setChats } from "../app/chatsSlice"; -import { selectShowChat } from "../app/uiSlice"; -import { syncArray } from "../utils/syncArray"; -import chatService from "../services/chatService"; -import userService from "../services/userService"; -import { useAppDispatch } from "../app/hooks"; - -function Chat(props) { - const dispatch = useAppDispatch(); - - const chats = useSelector(selectChats); - const showChat = useSelector(selectShowChat); - const scroller = useRef(null); - //const [ chats, setChats] = useState(chat); - - /*useEffect( () => { - setChats(syncArray(chats, chat)); - console.log(chats); - console.log(chat); - }, [chat]);*/ - - const scrollToBottom = () => { - scroller.current.scrollIntoView(false); - }; - - const [workspaceUsers, setWorkspaceUsers] = useState([] as User[]); - - useEffect(() => { - userService.getWorkspaceUsers().then(setWorkspaceUsers).catch(console.log); - }, []); - - useEffect(() => { - if (showChat) { - scrollToBottom(); - } - }); - - if (!showChat) return null; - - function handleFocus() { - const mediaQuery = window.matchMedia("(max-width: 1000px)"); - const mediaQueryPhone = window.matchMedia("(max-width: 450px)"); - const chatItemGroup = - document.querySelector(".chat-item-group"); - const chatWrapper = document.querySelector(".chat-wrapper"); - - if (mediaQueryPhone.matches) { - chatItemGroup.style.maxHeight = "180px"; - chatWrapper.style.position = "fixed"; - chatWrapper.style.top = "40px"; - } else if (mediaQuery.matches) { - chatItemGroup.style.maxHeight = "200px"; - chatWrapper.style.position = "fixed"; - chatWrapper.style.top = "60px"; - } - } - - function handleBlur() { - const mediaQuery = window.matchMedia("(max-width: 1000px)"); - - const chatItemGroup = - document.querySelector(".chat-item-group"); - - const chatWrapper = document.querySelector(".chat-wrapper"); - - if (mediaQuery.matches) { - chatItemGroup.style.maxHeight = "450px"; - chatWrapper.style.position = "fixed"; - chatWrapper.style.top = "70px"; - } - } - - const Cancel = (id, message) => { - const test = chats.find(chat => chat.id === id && chat.message === message); - let list = []; - chats.map(ch => { - if (ch.message !== test.message) list.push(ch); - }); - //setChats(newchats); - dispatch(setChats(list)); - }; - - const Resend = (id, message) => { - let test = chats.find(chat => chat.id === id && chat.message === message); - let list = []; - chats.map(ch => { - if (ch.message !== test.message) list.push(ch); - }); - //setChats(newchats); - dispatch(setChats(list)); - chatService.addChat({ ...test, failed: false }); - }; - - const items = chat => { - const y = { - onCancel: Cancel, - onResend: Resend, - ...chat - }; - return y; - }; - - return ( - - - -

- {chats.map((chat, index) => ( - - ))} - -
-
- - - ); -} - -const Wrapper = styled.div` - height: 100%; - max-width: 400px; - background: white; - box-shadow: 1px 3px 5px #b4b2b2; - position: relative; - /* z-index: 100; */ - - .chat-item-group { - flex-grow: 1; - overflow-y: scroll; - min-height: 121px; - padding-left: 16px; - padding-right: 30px; - margin-top: 24px; - height: 440px; - } - - .chat-item-group::-webkit-scrollbar { - width: 3px; - } - .chat-item-group::-webkit-scrollbar-thumb { - background-color: hsla(160, 100%, 36%, 1); - width: 3px; - } - - @media (max-width: 1000px) { - margin: 0 30px; - - .chat-item-group { - background-color: white; - } - } - - @media (max-width: 400px) { - width: 350px; - background: white; - } -`; - -export default Chat; diff --git a/server/client/src/components/common/Home.d.ts b/server/client/src/components/common/Home.d.ts deleted file mode 100644 index 013f8033..00000000 --- a/server/client/src/components/common/Home.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function Home(): JSX.Element; -export default Home; diff --git a/server/client/src/components/common/Home.tsx b/server/client/src/components/common/Home.tsx deleted file mode 100644 index 3ee85226..00000000 --- a/server/client/src/components/common/Home.tsx +++ /dev/null @@ -1,1131 +0,0 @@ -import Pluginlogo from '../../media/Rectangle158.svg'; -import Rectangle159 from '../../media/Rectangle159.svg'; -import Rectangle160 from '../../media/Rectangle160.svg'; -import Rectangle163 from '../../media/Rectangle163.svg'; -import LandingScript from './landingscript'; -import styled from 'styled-components'; - -function Home() { - return ( - -
- -

- Market Place -

-
- -
- -
- -
-
- Plugin Logo -
- -
-

- Youtube Plugin -

-
- - -
- - -
- -
-

- Youtube Plugin -

- TAB MENU -
-
    -
  • Description
    • -
  • Review
    • -
  • FAQ
    • -
-
-
-
- - -
- Tab Active Description -
- -
-
-
-
-

- Watch Youtube Videos on Zuri without getting redirected. -

-
-
- -
-
-
-

- Create Playlists and check out what your friends are listening to. -

-
-
- -
-
-
-

- Paste both audio and video url Link to play audio and video. -

-
-
- - ❮ - ❯ -
-
- -
-

- The Zuri Youtube plugin lets you share youtube videos and audio with your team. Once installed, - you can share youtube links that can be played on the platform without being redirected to youtube. - You can also create songs playlists and also add songs to the general music library where other - users can have access to at any time. With the plugin, - members of a team can discuss about a video or an audio. -

-
-
-

- Features -

-
    -
  • Auto Play Feature
    • -
  • Pause Feature
    • -
  • Paste Youtube URL
    • -
  • Like a song Feature
    • -
  • Delete a song
    • -
  • Chat Feature
    • -
  • See active members list
    • -
-
-
- -
-
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
- -
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
- -
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
- -
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
- -
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
- -
-
-
-
-

- Emediong A. -

-
-
- - - - - -
-
- -
-

- This is awesome!!! -

- -

- This is exactly what i was looking for, I love - the feature where i could play videos on the - platform without getting redirected to Youtube. -

-
-
-
- -
-
-

- Frequently Asked Questions -

- -

- Q: Is the plugin only installed by admin?
- A: No, the plugin can be installed by any member of the organization. -

- -

- Q: Can the plugin be used on another platform?
- A: No, the Youtube plugin can only be used on Zuri chat. -

- -

- Q: Does it support Youtube videos or just audio?
- A: The Youtube plugin supports both videos and audio. -

- -

- Q: Is the plugin only installed by admin?
- A: No, the plugin can be installed by any member of the organization. -

- -

- Q: Can the plugin be used on another platform?
- A: No, the Youtube plugin can only be used on Zuri chat. -

- -

- Q: Does it support Youtube videos or just audio?
- A: The Youtube plugin supports both videos and audio. -

-
-
-
-
-
- -
- -
-

English

-
- - -
-

N10,000 (7 days free trial)

-
- - - - - - -
-
- - ) -}; - - const Homestyled = styled.div - ` - -/*========================================*/ -/*--------------- [_Main] -------------*/ -/*========================================*/ -.main__wrapper{ - display: grid; - grid-template-columns: auto; - grid-template-rows: 1fr; - grid-template-areas: "one two"; - gap: 2em; -} - -/*========================================*/ -/*--------------- [_Hero] -------------*/ -/*========================================*/ -.grid__one{ - grid-area: one; -} - -.market__col{ - display: flex; - flex-direction: row; - align-items: center; - cursor: pointer; - color: var(--bluelite-color); -} - -.plugin__img{ - width: 13.125rem; - padding: 2em; - background-color: var(--white-color); -} - -.plugin__img img{ - background-position: center; - background-repeat: no-repeat; -} - -.plugin__dets_mb{ - display: none; -} - -.plugin__dets h1{ - margin-top: .5em; -} - -.plugin__dets .btn__large{ - margin-top: .5em; -} - -@media screen and (min-width:320px) and (max-width:425px) { - .main__wrapper{ - grid-template-areas: 1fr; - } - - .plugin__dets, .plugin__dets_mb{ - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - margin: 0 auto; - } - - .plugin__dets h1{ - margin-top: 1em; - } - - .plugin__dets .btn__large{ - margin-top: var(--mb-32); - } -} - -@media screen and (min-width:425px) and (max-width:900px) { - .main__wrapper{ - grid-template-areas: 1fr; - } - - - .plugin__dets, .plugin__dets_mb{ - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - margin: 0 auto; - } - - .plugin__dets h1{ - margin-top: 1em; - } - - .plugin__dets .btn__large{ - margin-top: var(--mb-32); - } -} - -/*========================================*/ -/*--------------- [_Side Bar] -------------*/ -/*========================================*/ -.side__bar{ - margin-top: var(--mb-32); -} - -.side__txts p{ - font-weight: var(--font-regular); -} - -.side__txts i{ - font-size: var(--font-size-reg); -} - -.side__bar a{ - color: var(--blue-color); -} - -@media screen and (min-width:320px) and (max-width:900px) { - .side__bar{ - display: none; - } -} - -/*========================================*/ -/*--------------- [_TAB ITEMS] -------------*/ -/*========================================*/ -.tabs{ - width: 63vw; -} - -.tab-header{ - display: flex; - flex-direction: row; - align-items: center; - padding: 0; - margin-top: var(--mb-16); -} - -.tab{ - width: auto; - font-size: var(--font-size-midi); - font-weight: var(--font-bold); - color: var(--text-secondary-color); - margin: 0 1.25rem 0 .5rem; - padding: .5625rem 0; - cursor: pointer; - z-index: 2; -} - -.tab.active{ - color: var(--white-color); - border: solid var(--green-color); - background: var(--green-color); - padding: 0 var(--mb-10); - border-radius: 3px; -} - -[data-tab-content]{ - display: none; -} - -.active[data-tab-content]{ - display: block; -} - -.tab-body{ - margin: 2em 0; -} - -/*--------------- [_Slider] -------------*/ -.slide_bar{ - width: auto; - height: 2px; - background: rgba(176, 175, 176, 0.5); - left: 0px; - border-radius: 5px; - z-index: 1; -} - -.tab-indicator { - position:relative; - width:calc(100% / 6); - height:2px; - background:var(--green-color); - left:1px; - border-radius:5px; - transition:all 500ms ease-in-out; - z-index: 2; - } - - -@media screen and (min-width:320px) and (max-width:900px) { - .tab{ - font-size: var(--mfont-size-reg); - } - - .tab__items li{ - font-size: var(--mfont-size-mini); - font-weight: var(--font-bold); - } - - .tab-indicator, .slide_bar{ - display: none; - } - - .tab-header{ - justify-content: center; - } -} - -/*========================================*/ -/*--------------- [_Grid Two] -------------*/ -/*========================================*/ -.grid-two{ - grid-area: two; -} - - - -/*--------------- [_Grid Two__Description Box] -------------*/ -.description__bx{ - margin: 2rem 0; -} - -.display{ - width: 70vw; - height: 30rem; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; -} - -.bx1{ - background: var(--yellow-color); -} - -.bx2{ - background: var(--green-color); -} - -.bx3{ - background: var(--blue-color); -} - -.img__display{ - width: 20rem; - height: 15.5rem; - background-position: center; - box-shadow: 2px 2px 8px 2px rgba(112, 144, 176, 0.4); -} - -.img1{ - background-image: url(${Rectangle159}); -} - -.img2{ - background-image: url(${Rectangle160}); -} - -.img3{ - background-image: url(${Rectangle163}); -} - -.display h1{ - font-size: 24px; - padding: 1em 0; - width: 22rem; - line-height: 2.25rem; - color: var(--white-color); -} - -.display__txt{ - margin: 2em 0; - text-align: justify; - width: auto; -} - -.display__list li{ - color: var(--text-primary-color); - list-style: inside; -} - -/* Slideshow container */ -.slideshow-container { - max-width: 1000px; - position: relative; - margin: auto; -} - - /* Next & previous buttons */ -.prev, .next { - cursor: pointer; - position: absolute; - top: 50%; - width: auto; - padding: 16px; - color: black; - font-weight: bold; - font-size: var(--font-size-midi); - transition: 0.6s ease; - border-radius: 0 3px 3px 0; - background: #a5a5a58e; -} - - -.next { - right: 0; - border-radius: 3px 0 0 3px; -} - - -.prev:hover, .next:hover { - background-color: rgba(255, 255, 255, 0.514); - color: var(--white-color); -} - - /* Fading animation */ -.fade { - -webkit-animation-name: fade; - -webkit-animation-duration: 1.5s; - animation-name: fade; - animation-duration: 1.5s; -} - -@-webkit-keyframes fade { - from {opacity: .4} - to {opacity: 1} -} - -@keyframes fade { - from {opacity: .4} - to {opacity: 1} -} - - -/*--------------- [_GRID TWO__Review Box] -------------*/ - -.review__bx{ - width: 50vw; - height: 9.625rem; - padding: 1rem; - border-radius: 3px; - background: var(--white-color); - margin-bottom: var(--mb-16) -} - -.review__dets{ - margin-bottom: var(--mb-10); -} -.user__profile{ - display: flex; - align-items: center; - justify-content: flex-start; -} - -.profile__img{ - width: 2rem; - height: 2rem; - background: url(../../media/Rectangle163.svg); - background-position: center; - border: 3px; - margin-right: var(--mb-10); -} - -/*--------------- [_Star Rating] -------------*/ -.star__ratings, .user__name{ - padding: 0 .5rem; -} - -.star__ratings i{ - color: #FFDF00; - font-size: var(--font-size-reg); - padding: 0; -} - -.star__ratings .empty{ - color: rgba(176, 175, 176, 0.5); -} - - - -/*--------------- [_Review Texts] -------------*/ -.small{ - font-size: var(--font-size-mini); -} - -.large p{ - font-size: var(--font-size-reg); -} - -/*--------------- [_GRID TWO__FAQ Box] -------------*/ -.faq__bx{ - width: 50vw; - display: grid; - justify-content: center; - padding: 3rem; - background: var(--white-color); -} - -.faq__bx h3{ - margin-bottom: var(--mb-32) -} - -.faq__bx p{ - width: auto; - margin-bottom: var(--mb-32) -} - -@media screen and (min-width:320px) and (max-width:400px) { - .main__wrapper{ - display: flex; - flex-direction: column; - } - - .grid-two{ - display: grid; - justify-content: center; - } - - .grid-two h1{ - display: none; - } - - .display, .faq__bx{ - width: 17rem; - - } - - .display__txt{ - width: auto; - } - - .img__display { - width: 10rem; - margin: 0 auto; - } - - .display{ - display: grid; - grid-template-rows: 1fr; - } - - .display h1{ - display: block; - width: 10rem; - font-size: var(--mfont-size-midi); - margin: 0 auto; - } - - .display__list li{ - font-size: var(--mfont-size-reg); - } - - .slider{ - width: calc(100% / 2.8); - } - - .review__bx{ - width: 13rem; - height: 20rem; - text-align: justify; - } - - .faq__bx{ - width: 13rem; - padding: 1.5rem; - } - - .review__dets{ - margin-bottom: 0; - } - - .prev, .next { - padding: 5px; - } - - .profile__img{ - margin: 0; - } - - .user__profile{ - flex-direction: column; - align-items: flex-start; - } - - .star__ratings, .user__name { - padding: .5rem 0; - } -} - - -@media screen and (min-width:401px) and (max-width:900px) { - - .tabs{ - width: 70vw; - } - - .main__wrapper{ - display: flex; - flex-direction: column; - } - - .grid-two{ - display: grid; - justify-content: center; - } - - .grid-two h1{ - display: none; - } - - .display, - .review__bx, - .faq__bx{ - width: 70vw; - } - - .display{ - display: grid; - grid-template-rows: 1fr; - } - - .display h1{ - display: block; - width: 16rem; - } - - .img__display{ - width: 16rem; - } - - .review__bx{ - height: 13rem; - } - - .review__dets{ - margin-bottom: var(--mb-16); - } -} - -/*========================================*/ -/*--------------- [_Accordion Drop Down] -------------*/ -/*========================================*/ -@media screen and (min-width:320px) and (max-width:425px) { - .drop__down{ - margin: 0 auto; - } - - button.accordion { - background-color: var(--white-color); - color: #444; - cursor: pointer; - padding: 1.5rem 1rem; - width: 16rem; - height: 4rem; - text-align: left; - border: none; - outline: none; - transition: 0.3s; - margin-bottom: var(--mb-10); - display: flex; - align-items: center; - justify-content: space-between; - } - - button.accordion.active, button.accordion:hover { - background-color: #ddd; - } - - .panel { - padding: 0 18px; - background-color: var(--white-color); - display: none; - } - - .panel.show { - display: block !important; - } - - .panel { - padding: 0 18px; - background-color: white; - max-height: 0; - overflow: hidden; - transition: 0.6s ease-in-out; - opacity: 0; - width: 16rem; - } - - .panel.show { - opacity: 1; - max-height: 800px; - padding: var(--mb-16) ; - margin-bottom: var(--mb-16); - } - .panel i{ - font-size: var(--mfont-size-mini); - padding: 0; - } - - .panel p{ - color: var(--text-primary-color); - } - - .panel a{ - color: var(--blue-color); - } - - button.accordion:after { - color: #777; - } - - -} - -@media screen and (min-width: 425px) and (max-width:900px) { - .drop__down{ - margin: 0 auto 2em; - } - - button.accordion { - background-color: var(--white-color); - color: #444; - cursor: pointer; - padding: 1.5rem 1rem; - width: 70vw; - height: 4rem; - text-align: left; - border: none; - outline: none; - transition: 0.3s; - margin-bottom: var(--mb-10); - display: flex; - align-items: center; - justify-content: space-between; - } - - button.accordion.active, button.accordion:hover { - background-color: #ddd; - } - - .panel { - padding: 0 18px; - background-color: var(--white-color); - display: none; - width: 70vw; - } - - .panel.show { - display: block !important; - } - - .panel { - padding: 0 18px; - background-color: white; - max-height: 0; - overflow: hidden; - transition: 0.6s ease-in-out; - opacity: 0; - } - - .panel.show { - opacity: 1; - max-height: 800px; - padding: var(--mb-16) ; - margin-bottom: var(--mb-16); - } - - .panel p{ - color: var(--blue-color); - } - - button.accordion:after { - color: #777; - } - -} - -@media screen and (min-width: 900px) { - .drop__down{ - display: none; - } - - -} - ` - - export default Home; - -function plusSlides(arg0: number): import("react").MouseEventHandler { - throw new Error('Function not implemented.'); -} diff --git a/server/client/src/components/common/alert.css b/server/client/src/components/common/alert.css deleted file mode 100644 index b2990abe..00000000 --- a/server/client/src/components/common/alert.css +++ /dev/null @@ -1,122 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700&display=swap'); - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - font-family: 'Lato', sans-serif; - font-size: 1rem; -} - -html, body { - /* height: 100%; */ - height: 200px; -} - -body { - /* display: grid; - place-items: center; - overflow: hidden; - grid-gap: 0; */ - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - -} - -/* .icon { - position: absolute; - color: #FFFFFF; -} */ - -button { - padding: 0.5rem 1rem; - border-radius: 0.25rem; - border: none; - outline: none; - background: #008B5E; - color: white; - letter-spacing: 0.06rem; - cursor: pointer; - - width: 14rem; -} - -.alert { - /* left:0; - right:0; - margin-left: auto; - margin-right: auto; */ - margin-left: 0; - margin-top: 0; - margin-bottom: 25px; - - background: #008B5E; - /* padding: 1.25rem 1rem; */ - padding: .8rem 1rem; - width: 14rem; - /* position: absolute; */ - /* top: 15.6rem; */ - top: 0.1rem; - overflow: hidden; - opacity: 0; - pointer-events: none; - - /* left:0; - right:0; - margin-left: auto; - margin-right: auto; */ -} - -.alert.showAlert{ - opacity: 1; - pointer-events: auto; -} - -.alert.show{ - /* animation: show_slide 1s ease forwards; */ - transition: opacity 1s ease; - opacity: 1; -} - - /* @keyframes show_slide { - 0%{ - transform: translateX(100%); - } - 40%{ - transform: translateX(-10%); - } - 80%{ - transform: translateX(0%); - } - 100%{ - transform: translateX(-10px); - } -} */ - -.alert.hide{ - /* animation: hide_slide 1s ease forwards; */ - transition: opacity 1s ease; - opacity: 0; -} - -/* @keyframes hide_slide { - 0%{ - transform: translateX(-10px); - } - 40%{ - transform: translateX(0%); - } - 80%{ - transform: translateX(-10%); - } - 100%{ - transform: translateX(100%); - } -} */ - -.alert .msg{ - padding: 0 1.25rem; - color: #FFFFFF; -} diff --git a/server/client/src/components/common/button.d.ts b/server/client/src/components/common/button.d.ts deleted file mode 100644 index a6dfb84e..00000000 --- a/server/client/src/components/common/button.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -import React from "react"; -interface Props { - color?: "primary" | "secondary" | "disabled"; - className?: string; - onClick: () => void; -} -declare const Button: React.FC; -export default Button; diff --git a/server/client/src/components/common/button.tsx b/server/client/src/components/common/button.tsx deleted file mode 100644 index 3cee19c5..00000000 --- a/server/client/src/components/common/button.tsx +++ /dev/null @@ -1,79 +0,0 @@ -import React from "react"; -import styled from "styled-components"; - -interface Props { - color?: "primary" | "secondary" | "disabled"; - className?: string; - onClick: () => void; -} - -const Button: React.FC = (props) => { - const { color, children, ...rest } = props; - const Component = - color === "secondary" - ? Secondary - : color === "disabled" - ? Disabled - : Primary; - - // General styles for both buttons - const styles = { - margin: "5px 0", - fontSize: "14px", - padding: "5px 10px", - fontFamily: "Lato, sans-serif", - cursor: "pointer", - }; - - return ( - - {children} - - ); -}; - -const Primary = styled.button` - background: #ffffff; - border: 1px solid #00b87c; - border-radius: 3px; - color: #00b87c; - transition: all 200ms ease-in-out; - - &:hover { - box-shadow: 0 2px 5px rgba(0, 184, 124, 0.3); - } -`; - -const Secondary = styled.button` - background: #00b87c; - /* box-shadow: 2px 2px 2px rgba(0, 36, 24, 0.04); */ - border-radius: 3px; - border-width: 1px; - border-color: #00b87c; - border-style: solid; - color: #fff; - transition: all 200ms ease-in-out; - - &:hover { - background-color: rgba(0, 184, 124, 0.8); - border-color: rgba(0, 184, 124, 0.8); - } - - /* @media (max-width: 388px) { - font-size: 12px !important; - padding: 3px 5px; - margin: 3px 0 !important; - } */ -`; - -const Disabled = styled.button` - background: #cecccc; - border-radius: 3px; - color: #0a0a0ace; - transition: all 200ms ease-in-out; - cursor: none !important; - border: none; - outline: none; -`; - -export default Button; diff --git a/server/client/src/components/common/chatHeader.d.ts b/server/client/src/components/common/chatHeader.d.ts deleted file mode 100644 index f2441e1f..00000000 --- a/server/client/src/components/common/chatHeader.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function ChatHeader(): JSX.Element; -export default ChatHeader; diff --git a/server/client/src/components/common/chatHeader.tsx b/server/client/src/components/common/chatHeader.tsx deleted file mode 100644 index eff57993..00000000 --- a/server/client/src/components/common/chatHeader.tsx +++ /dev/null @@ -1,110 +0,0 @@ -import styled from "styled-components"; -import { showedChat } from "../../app/uiSlice"; -import { useAppDispatch } from "../../app/hooks"; - -import chatIcon from "../../media/chat.svg"; -import chatIcon__green from "../../media/chat-green.svg"; -import chatClose from "../../media/close.svg"; -import chatClose__black from "../../media/close-black.svg"; - -function ChatHeader() { - const dispatch = useAppDispatch(); - - return ( - -
- - - chat -
Chat
-
- - dispatch(showedChat(false))} - /> - dispatch(showedChat(false))} - /> - - ); -} - -const Wrapper = styled.div` - display: flex; - justify-content: space-between; - align-items: center; - height: 44px; - padding: 0 16px; - background: hsla(160, 100%, 36%, 1); - color: white; - - .chatHeader__left { - display: flex; - align-items: center; - width: 90px; - } - - .chatHeader__icon { - width: 20px; - height: 20px; - } - - .chatHeader__icon__green { - display: none; - } - - .chatHeader__title { - font-size: 18px; - font-weight: 700; - margin-left: 10.25px; - } - - .chatHeader__close { - width: 20px; - height: 20px; - cursor: pointer; - } - - .chatHeader__close__black { - display: none; - } - - @media (max-width: 1000px) { - background: white; - color: #00b87c; - max-height: 64px; - - .chatHeader__close { - display: none; - } - - .chatHeader__close__black { - display: inline; - cursor: pointer; - } - - .chatHeader__icon { - display: none; - width: 20px; - height: 20px; - } - - .chatHeader__icon__green { - display: inline; - width: 20px; - height: 20px; - } - } -`; - -export default ChatHeader; diff --git a/server/client/src/components/common/chatInput.d.ts b/server/client/src/components/common/chatInput.d.ts deleted file mode 100644 index 0c1f765f..00000000 --- a/server/client/src/components/common/chatInput.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -/// -declare function ChatInput(props: any): JSX.Element; -export default ChatInput; diff --git a/server/client/src/components/common/chatInput.tsx b/server/client/src/components/common/chatInput.tsx deleted file mode 100644 index c1fde372..00000000 --- a/server/client/src/components/common/chatInput.tsx +++ /dev/null @@ -1,403 +0,0 @@ -import { useState } from "react"; -import styled from "styled-components"; -import Picker from "emoji-picker-react"; -import GiphyPicker from "react-giphy-picker"; -// import EmojiEmotionsIcon from "@mui/icons-material/EmojiEmotions"; - -import chatEmoji from "../../media/chatEmoji.svg"; -import chatSend from "../../media/chatSend.svg"; -import chatGif from "../../media/chatGif.svg"; -import bold from "../../media/bold.svg"; - -import chatService from "../../services/chatService"; -import { useSelector } from "react-redux"; -import { selectCurrentUser } from "../../app/usersSlice"; - -function ChatInput(props) { - // states to manage the input text and also the showcasing of the emoji - const [inputStr, setInputStr] = useState(""); - const [showPicker, setShowPicker] = useState(false); - const [showGiphy, setShowGiphy] = useState(false); - const handleFocus = props.handleFocus; - // const handleBlur = props.handleBlur; - const currentUser = useSelector(selectCurrentUser); - - // function to display the emoji once clicked and remove once the user select their preferred emoji - const onEmojiClick = (event, emojiObject) => { - setInputStr(prevInput => prevInput + emojiObject.emoji); - setShowPicker(false); - }; - - // function to display a gif once clicked - const onGiphyClick = (event, gifObject) => { - setInputStr(prevInput => prevInput + gifObject.gif); - setShowGiphy(false); - }; - - const clearInput = () => { - setInputStr(""); - }; - - const handleSend = async () => { - //sends message to the comments endpoint - chatService.addChat({ - id: "test", // this will be taken care of by db - userId: "", - message: inputStr, - time: Date.now(), - name: "", - avatar: "" - }); - - //clears the current contents of the input box - clearInput(); - }; - - return ( - -
-