From f4d040aed8bd6306c02f37051c0589c3f52cdcca Mon Sep 17 00:00:00 2001 From: Gagan Suie Date: Thu, 16 Feb 2023 19:46:20 -0600 Subject: [PATCH] Feat: fixed naming conventions and added sections page --- ...Drawer.svelte => DrawerAddCategory.svelte} | 0 ...awer.svelte => DrawerCreateChannel.svelte} | 4 +- src/lib/components/Browse/SearchBar.svelte | 4 +- ...Item.svelte => LoadingItemCarousel.svelte} | 0 ...lItem.svelte => LoadingItemChannel.svelte} | 0 ...bleItem.svelte => LoadingItemTable.svelte} | 0 ...lSection.svelte => SectionCarousel.svelte} | 4 +- ...elSection.svelte => SectionChannel.svelte} | 9 +- ...ableSection.svelte => SectionTable.svelte} | 4 +- ...{UserSection.svelte => SectionUser.svelte} | 9 +- .../{ChatDrawer.svelte => DrawerChat.svelte} | 6 +- .../{ChatMessage.svelte => Message.svelte} | 4 +- ...tProfileCard.svelte => ProfileCard.svelte} | 0 src/lib/components/Channel/ChatMessage.svelte | 64 -------------- .../{StreamGrid.svelte => GridVideo.svelte} | 0 .../{MainDrawer.svelte => DrawerMain.svelte} | 0 ...gesDrawer.svelte => DrawerMessages.svelte} | 0 ...{SmallDrawer.svelte => DrawerSmall.svelte} | 0 ...scribeList.svelte => ListSubscribe.svelte} | 0 .../{SearchItem.svelte => ItemSearch.svelte} | 0 src/lib/components/Search/ItemSection.svelte | 83 +++++++++++++++++++ ...SearchSection.svelte => ListSearch.svelte} | 14 +++- src/lib/utils.ts | 27 ++++++ src/routes/+layout.svelte | 8 +- src/routes/browse/+page.svelte | 38 ++++++--- src/routes/browse/[sectionId]/+page.server.ts | 18 ++-- src/routes/browse/[sectionId]/+page.svelte | 47 +++++++++++ src/routes/channel/[channelId]/+page.svelte | 4 +- .../profile/[customUsername]/+page.svelte | 8 +- src/routes/search/+page.svelte | 8 +- 30 files changed, 239 insertions(+), 124 deletions(-) rename src/lib/components/Browse/{AddCategoryDrawer.svelte => DrawerAddCategory.svelte} (100%) rename src/lib/components/Browse/{CreateChannelDrawer.svelte => DrawerCreateChannel.svelte} (98%) rename src/lib/components/Browse/Sections/{LoadingCarouselItem.svelte => LoadingItemCarousel.svelte} (100%) rename src/lib/components/Browse/Sections/{LoadingChannelItem.svelte => LoadingItemChannel.svelte} (100%) rename src/lib/components/Browse/Sections/{LoadingTableItem.svelte => LoadingItemTable.svelte} (100%) rename src/lib/components/Browse/Sections/{CarouselSection.svelte => SectionCarousel.svelte} (95%) rename src/lib/components/Browse/Sections/{ChannelSection.svelte => SectionChannel.svelte} (92%) rename src/lib/components/Browse/Sections/{TableSection.svelte => SectionTable.svelte} (95%) rename src/lib/components/Browse/Sections/{UserSection.svelte => SectionUser.svelte} (93%) rename src/lib/components/Channel/Chat/{ChatDrawer.svelte => DrawerChat.svelte} (91%) rename src/lib/components/Channel/Chat/{ChatMessage.svelte => Message.svelte} (93%) rename src/lib/components/Channel/Chat/{ChatProfileCard.svelte => ProfileCard.svelte} (100%) delete mode 100644 src/lib/components/Channel/ChatMessage.svelte rename src/lib/components/Channel/{StreamGrid.svelte => GridVideo.svelte} (100%) rename src/lib/components/MainDrawer/{MainDrawer.svelte => DrawerMain.svelte} (100%) rename src/lib/components/MainDrawer/{MessagesDrawer.svelte => DrawerMessages.svelte} (100%) rename src/lib/components/MainDrawer/{SmallDrawer.svelte => DrawerSmall.svelte} (100%) rename src/lib/components/Profile/{SubscribeList.svelte => ListSubscribe.svelte} (100%) rename src/lib/components/Search/{SearchItem.svelte => ItemSearch.svelte} (100%) create mode 100644 src/lib/components/Search/ItemSection.svelte rename src/lib/components/Search/{SearchSection.svelte => ListSearch.svelte} (62%) diff --git a/src/lib/components/Browse/AddCategoryDrawer.svelte b/src/lib/components/Browse/DrawerAddCategory.svelte similarity index 100% rename from src/lib/components/Browse/AddCategoryDrawer.svelte rename to src/lib/components/Browse/DrawerAddCategory.svelte diff --git a/src/lib/components/Browse/CreateChannelDrawer.svelte b/src/lib/components/Browse/DrawerCreateChannel.svelte similarity index 98% rename from src/lib/components/Browse/CreateChannelDrawer.svelte rename to src/lib/components/Browse/DrawerCreateChannel.svelte index 89be5625..cd3fc8fe 100644 --- a/src/lib/components/Browse/CreateChannelDrawer.svelte +++ b/src/lib/components/Browse/DrawerCreateChannel.svelte @@ -3,7 +3,7 @@ import { tags, getTags } from '$lib/stores/channelStore' import { onMount } from 'svelte' import Tags from 'svelte-tags-input' - import AddCategoryDrawer from './AddCategoryDrawer.svelte' + import DrawerAddCategory from './DrawerAddCategory.svelte' import { goto } from '$app/navigation' import { post, put } from '$lib/api' @@ -72,7 +72,7 @@
(showDrawer = false)} class="drawer-overlay" /> {#if showAddCategory} - diff --git a/src/lib/components/Browse/SearchBar.svelte b/src/lib/components/Browse/SearchBar.svelte index a4118a21..dd88a29e 100644 --- a/src/lib/components/Browse/SearchBar.svelte +++ b/src/lib/components/Browse/SearchBar.svelte @@ -2,7 +2,7 @@ import IconCreate from '$lib/assets/icons/IconCreate.svelte' import IconCross from '$lib/assets/icons/IconCross.svelte' import IconSearch from '$lib/assets/icons/IconSearch.svelte' - import CreateChannelDrawer from './CreateChannelDrawer.svelte' + import DrawerCreateChannel from './DrawerCreateChannel.svelte' import { current_user } from '$lib/stores/authStore' import { is_login_modal_open } from '$lib/stores/helperStore' @@ -48,6 +48,6 @@ {/if} {#if showDrawer && !searchPage} - + {/if}
diff --git a/src/lib/components/Browse/Sections/LoadingCarouselItem.svelte b/src/lib/components/Browse/Sections/LoadingItemCarousel.svelte similarity index 100% rename from src/lib/components/Browse/Sections/LoadingCarouselItem.svelte rename to src/lib/components/Browse/Sections/LoadingItemCarousel.svelte diff --git a/src/lib/components/Browse/Sections/LoadingChannelItem.svelte b/src/lib/components/Browse/Sections/LoadingItemChannel.svelte similarity index 100% rename from src/lib/components/Browse/Sections/LoadingChannelItem.svelte rename to src/lib/components/Browse/Sections/LoadingItemChannel.svelte diff --git a/src/lib/components/Browse/Sections/LoadingTableItem.svelte b/src/lib/components/Browse/Sections/LoadingItemTable.svelte similarity index 100% rename from src/lib/components/Browse/Sections/LoadingTableItem.svelte rename to src/lib/components/Browse/Sections/LoadingItemTable.svelte diff --git a/src/lib/components/Browse/Sections/CarouselSection.svelte b/src/lib/components/Browse/Sections/SectionCarousel.svelte similarity index 95% rename from src/lib/components/Browse/Sections/CarouselSection.svelte rename to src/lib/components/Browse/Sections/SectionCarousel.svelte index 1d3a90c0..f87ddc61 100644 --- a/src/lib/components/Browse/Sections/CarouselSection.svelte +++ b/src/lib/components/Browse/Sections/SectionCarousel.svelte @@ -2,7 +2,7 @@ import IconDrawerLeft from '$lib/assets/icons/drawer/IconDrawerLeft.svelte' import IconDrawerChevron from '$lib/assets/icons/drawer/IconDrawerChevron.svelte' import { goto } from '$app/navigation' - import LoadingCarouselItem from '$lib/components/Browse/Sections/LoadingCarouselItem.svelte' + import LoadingItemCarousel from '$lib/components/Browse/Sections/LoadingItemCarousel.svelte' import { onMount } from 'svelte' import Swiper, { Navigation } from 'swiper' @@ -71,7 +71,7 @@ {:else}
{#each Array(5) as _, index (index)} - + {/each} Loading...
diff --git a/src/lib/components/Browse/Sections/ChannelSection.svelte b/src/lib/components/Browse/Sections/SectionChannel.svelte similarity index 92% rename from src/lib/components/Browse/Sections/ChannelSection.svelte rename to src/lib/components/Browse/Sections/SectionChannel.svelte index 916c60c2..85a114fa 100644 --- a/src/lib/components/Browse/Sections/ChannelSection.svelte +++ b/src/lib/components/Browse/Sections/SectionChannel.svelte @@ -3,11 +3,12 @@ import IconDrawerChevron from '$lib/assets/icons/drawer/IconDrawerChevron.svelte' import IconPlay from '$lib/assets/icons/IconPlay.svelte' import { goto } from '$app/navigation' - import LoadingChannelItem from '$lib/components/Browse/Sections/LoadingChannelItem.svelte' + import LoadingItemChannel from '$lib/components/Browse/Sections/LoadingItemChannel.svelte' export let title: string = '', channels: any = undefined, - isLoading: boolean = false + isLoading: boolean = false, + sectionId: string = '' let ref: any $: hidden = ((channels != undefined && channels.length == 0) || channels.error) && !isLoading @@ -34,7 +35,7 @@
{#if channels && channels.length}
- {title} + {title}
@@ -100,7 +101,7 @@
{#each Array(6) as _, index (index)} - + {/each} Loading...
diff --git a/src/lib/components/Browse/Sections/TableSection.svelte b/src/lib/components/Browse/Sections/SectionTable.svelte similarity index 95% rename from src/lib/components/Browse/Sections/TableSection.svelte rename to src/lib/components/Browse/Sections/SectionTable.svelte index 320e0138..c85bf9f5 100644 --- a/src/lib/components/Browse/Sections/TableSection.svelte +++ b/src/lib/components/Browse/Sections/SectionTable.svelte @@ -4,7 +4,7 @@ import VirtualList from '@sveltejs/svelte-virtual-list' import { techList } from '$lib/stores/channelStore' import { goto } from '$app/navigation' - import LoadingTableItem from '$lib/components/Browse/Sections/LoadingTableItem.svelte' + import LoadingItemTable from '$lib/components/Browse/Sections/LoadingItemTable.svelte' export let channels: any = [], isLoading: boolean = false @@ -83,7 +83,7 @@ {:else} - + Loading... diff --git a/src/lib/components/Browse/Sections/UserSection.svelte b/src/lib/components/Browse/Sections/SectionUser.svelte similarity index 93% rename from src/lib/components/Browse/Sections/UserSection.svelte rename to src/lib/components/Browse/Sections/SectionUser.svelte index d5803d8c..9f5df807 100644 --- a/src/lib/components/Browse/Sections/UserSection.svelte +++ b/src/lib/components/Browse/Sections/SectionUser.svelte @@ -3,11 +3,12 @@ import IconDrawerChevron from '$lib/assets/icons/drawer/IconDrawerChevron.svelte' import IconPlay from '$lib/assets/icons/IconPlay.svelte' import { goto } from '$app/navigation' - import LoadingChannelItem from '$lib/components/Browse/Sections/LoadingChannelItem.svelte' + import LoadingItemChannel from '$lib/components/Browse/Sections/LoadingItemChannel.svelte' export let title: string = '', users: any = undefined, - isLoading: boolean = false + isLoading: boolean = false, + sectionId: string = '' let ref: any $: hidden = ((users != undefined && users.length == 0) || users.error) && !isLoading @@ -35,7 +36,7 @@
{#if users && users.length}
- {title} + {title}
@@ -103,7 +104,7 @@
{#each Array(6) as _, index (index)} - + {/each} Loading...
diff --git a/src/lib/components/Channel/Chat/ChatDrawer.svelte b/src/lib/components/Channel/Chat/DrawerChat.svelte similarity index 91% rename from src/lib/components/Channel/Chat/ChatDrawer.svelte rename to src/lib/components/Channel/Chat/DrawerChat.svelte index 686ed983..fd3022c7 100644 --- a/src/lib/components/Channel/Chat/ChatDrawer.svelte +++ b/src/lib/components/Channel/Chat/DrawerChat.svelte @@ -1,6 +1,6 @@ - +
    diff --git a/src/lib/components/Channel/Chat/ChatProfileCard.svelte b/src/lib/components/Channel/Chat/ProfileCard.svelte similarity index 100% rename from src/lib/components/Channel/Chat/ChatProfileCard.svelte rename to src/lib/components/Channel/Chat/ProfileCard.svelte diff --git a/src/lib/components/Channel/ChatMessage.svelte b/src/lib/components/Channel/ChatMessage.svelte deleted file mode 100644 index 8956fab3..00000000 --- a/src/lib/components/Channel/ChatMessage.svelte +++ /dev/null @@ -1,64 +0,0 @@ - - - - -
    -
      -
    • - {#if sender.role === 'You'} - -
      - - {sender.message} - @{sender.username} - {sender.role} - -
      - {:else} - -
      - - {#if sender.role == 'Host' || sender.role == 'Mod'} - {sender.role} - {/if} - @{sender.username} - {sender.message} - -
      - {/if} -
      • -
    -
    diff --git a/src/lib/components/Channel/StreamGrid.svelte b/src/lib/components/Channel/GridVideo.svelte similarity index 100% rename from src/lib/components/Channel/StreamGrid.svelte rename to src/lib/components/Channel/GridVideo.svelte diff --git a/src/lib/components/MainDrawer/MainDrawer.svelte b/src/lib/components/MainDrawer/DrawerMain.svelte similarity index 100% rename from src/lib/components/MainDrawer/MainDrawer.svelte rename to src/lib/components/MainDrawer/DrawerMain.svelte diff --git a/src/lib/components/MainDrawer/MessagesDrawer.svelte b/src/lib/components/MainDrawer/DrawerMessages.svelte similarity index 100% rename from src/lib/components/MainDrawer/MessagesDrawer.svelte rename to src/lib/components/MainDrawer/DrawerMessages.svelte diff --git a/src/lib/components/MainDrawer/SmallDrawer.svelte b/src/lib/components/MainDrawer/DrawerSmall.svelte similarity index 100% rename from src/lib/components/MainDrawer/SmallDrawer.svelte rename to src/lib/components/MainDrawer/DrawerSmall.svelte diff --git a/src/lib/components/Profile/SubscribeList.svelte b/src/lib/components/Profile/ListSubscribe.svelte similarity index 100% rename from src/lib/components/Profile/SubscribeList.svelte rename to src/lib/components/Profile/ListSubscribe.svelte diff --git a/src/lib/components/Search/SearchItem.svelte b/src/lib/components/Search/ItemSearch.svelte similarity index 100% rename from src/lib/components/Search/SearchItem.svelte rename to src/lib/components/Search/ItemSearch.svelte diff --git a/src/lib/components/Search/ItemSection.svelte b/src/lib/components/Search/ItemSection.svelte new file mode 100644 index 00000000..3653aa80 --- /dev/null +++ b/src/lib/components/Search/ItemSection.svelte @@ -0,0 +1,83 @@ + + +
    + + + + +
    + {#if Array.isArray(channel.category)} +
    + {#each channel.category as cat} +
    {cat}
    + {/each} +
    + {/if} + + +

    + {channel.title || ''} +

    +     + +

    + {channel.memberCount || 0} Views - {timeSince(channel.createdAt)} +

    + + +
    +
    + avater +
    +
    +

    {channel.createdBy || ''}

    +     + +

    + {channel.description ? channel.description.slice(0, 100) : ''} +

    + + {#if Array.isArray(channel.tags)} +
    + {#each channel.tags as tag} +
    {tag}
    + {/each} +
    + {/if} +
    +
    diff --git a/src/lib/components/Search/SearchSection.svelte b/src/lib/components/Search/ListSearch.svelte similarity index 62% rename from src/lib/components/Search/SearchSection.svelte rename to src/lib/components/Search/ListSearch.svelte index c0a7b536..b9269c3e 100644 --- a/src/lib/components/Search/SearchSection.svelte +++ b/src/lib/components/Search/ListSearch.svelte @@ -1,14 +1,20 @@
    {#each channels as channel} {#if channel.isPrivate !== true} - + {#if isSearchPage} + + {:else} + + {/if} {/if} {:else}

    No records found

    diff --git a/src/lib/utils.ts b/src/lib/utils.ts index de401e69..40e205b7 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -24,3 +24,30 @@ export const isJsonString = (str: string): boolean => { } return true } + +export const getSectionUrl = ({ + sectionId, + query, + skip, + limit +}: { + sectionId: string + query: string + skip: number + limit: number +}): string => { + switch (sectionId) { + case 'weekly': + return `channels/weekly?searchQuery=${query}&skip=${skip}&limit=${limit}` + case 'highest-ranked': + return `users/highest-ranked?searchQuery=${query}&skip=${skip}&limit=${limit}` + case 'rising-stars': + return `users/rising-stars?searchQuery=${query}&skip=${skip}&limit=${limit}` + case 'my': + return `channels/me/hosted?searchQuery=${query}&skip=${skip}&limit=${limit}` + case 'fav': + return `channels/me/fav?searchQuery=${query}&skip=${skip}&limit=${limit}` + default: + return `channels?searchQuery=${query}&skip=${skip}&limit=${limit}` + } +} diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 7e58a9c2..e142b2dc 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -10,8 +10,8 @@ // NProgress Loading bar import '$lib/assets/styles/nprogress.css' import LoginPrompt from '$lib/components/MainDrawer/LoginPrompt.svelte' - import MainDrawer from '$lib/components/MainDrawer/MainDrawer.svelte' - import SmallDrawer from '$lib/components/MainDrawer/SmallDrawer.svelte' + import DrawerMain from '$lib/components/MainDrawer/DrawerMain.svelte' + import DrawerSmall from '$lib/components/MainDrawer/DrawerSmall.svelte' import { page } from '$app/stores' import { onMount } from 'svelte' import { get } from '$lib/api' @@ -105,9 +105,9 @@
    diff --git a/src/routes/browse/+page.svelte b/src/routes/browse/+page.svelte index cba94ed1..9bb2c5ae 100644 --- a/src/routes/browse/+page.svelte +++ b/src/routes/browse/+page.svelte @@ -1,11 +1,11 @@ - + - + - + - + {#if current_user} - + - + {/if} - + diff --git a/src/routes/browse/[sectionId]/+page.server.ts b/src/routes/browse/[sectionId]/+page.server.ts index 3dbf1408..0dce628c 100644 --- a/src/routes/browse/[sectionId]/+page.server.ts +++ b/src/routes/browse/[sectionId]/+page.server.ts @@ -1,12 +1,8 @@ -import { error } from '@sveltejs/kit' -import type { PageServerLoad } from './$types' +import type { PageServerLoad } from '../$types' -export const load = (async ({ params }) => { - // const post = await getChannels() - - // if (post) { - // return post - // } - - // throw error(404, 'Not found') -}) satisfies PageServerLoad \ No newline at end of file +export const load = (async ({ locals }) => { + locals.user + return { + user: locals.user + } +}) satisfies PageServerLoad diff --git a/src/routes/browse/[sectionId]/+page.svelte b/src/routes/browse/[sectionId]/+page.svelte index e69de29b..536044a1 100644 --- a/src/routes/browse/[sectionId]/+page.svelte +++ b/src/routes/browse/[sectionId]/+page.svelte @@ -0,0 +1,47 @@ + + + + +
    + {title} +
    + + diff --git a/src/routes/channel/[channelId]/+page.svelte b/src/routes/channel/[channelId]/+page.svelte index d0ecc53d..3c36382d 100644 --- a/src/routes/channel/[channelId]/+page.svelte +++ b/src/routes/channel/[channelId]/+page.svelte @@ -1,6 +1,6 @@