Update sidebar footer area and add channels you follow
This commit is contained in:
Korbs
parent
4972e55607
commit
3bf8214e6e
1 changed files with 58 additions and 28 deletions
|
|
@ -9,6 +9,11 @@ import {
|
|||
version
|
||||
} from '@root/package.json'
|
||||
|
||||
// Components
|
||||
import CreatorInSidebar from '@components/CreatorInSidebar.astro'
|
||||
import { ViewTransitions } from 'astro:transitions';
|
||||
import { slide } from "astro/virtual-modules/transitions.js";
|
||||
|
||||
// Icons
|
||||
import {
|
||||
GraphUp,
|
||||
|
|
@ -18,45 +23,61 @@ import {
|
|||
AppleImac2021Side,
|
||||
EmojiTalkingHappy,
|
||||
PeaceHand,
|
||||
HelpCircle,
|
||||
Server,
|
||||
CurveArray,
|
||||
PlanetAlt,
|
||||
InputSearch,
|
||||
ProfileCircle,
|
||||
SettingsProfiles,
|
||||
Settings
|
||||
InputSearch,
|
||||
Settings,
|
||||
LogIn
|
||||
} from '@iconoir/vue'
|
||||
|
||||
// i18n
|
||||
import i18next, { t } from "i18next"
|
||||
import SettingsLayout from '@layouts/Settings.astro'
|
||||
|
||||
// Supabase Data
|
||||
import { supabase } from "@library/supabase"
|
||||
const { data: { user } } = await supabase.auth.getUser()
|
||||
const id = user?.id
|
||||
|
||||
// Is the user logged in?
|
||||
if (user?.id === "undefined") {
|
||||
var Guest = true
|
||||
} else {
|
||||
var Guest = false
|
||||
}
|
||||
|
||||
// Get Channels
|
||||
const { data: channels, error } = await supabase
|
||||
.from('channels')
|
||||
.select('*')
|
||||
let { data: subs } = await supabase
|
||||
.from('subs')
|
||||
.select("*")
|
||||
.eq('UserSubscribed', id)
|
||||
---
|
||||
|
||||
<ViewTransitions transition:animate={slide} />
|
||||
<div class="sidebar">
|
||||
<div class="sidebar-top">
|
||||
<div class="sidebar-top-start">
|
||||
<a href='/'><img src="/images/logo/MinPluto - Logo.png"/></a>
|
||||
<div>
|
||||
<a href="#"><InputSearch/></a>
|
||||
<a href="/login"><LogIn/></a>
|
||||
<a href="#"><Settings/></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-top-end">
|
||||
<a href={'/'}><PlanetAlt/> {t("SIDEBAR.HOME")}</a>
|
||||
<a href="#"><InputSearch/> {t("HEADER.SEARCH")}</a>
|
||||
<hr/>
|
||||
{SIDEBAR_CATEGORIES ?
|
||||
<h2>{t("SIDEBAR.CATEGORY")}</h2>
|
||||
<a href={'/category/trending'}><GraphUp/> {t("SIDEBAR.CATEGORY_LIST.TRENDING")}</a>
|
||||
<a href={'/category/movies'}><Movie/> {t("SIDEBAR.CATEGORY_LIST.MOVIES")}</a>
|
||||
<a href={'/category/music'}><MusicDoubleNote/> {t("SIDEBAR.CATEGORY_LIST.MUSIC")}</a>
|
||||
<a href={'/category/gaming'}><Gamepad/> {t("SIDEBAR.CATEGORY_LIST.GAMES")}</a>
|
||||
<h2>{t("SIDEBAR.TRENDING")}</h2>
|
||||
<a href={'/discover?category=trending&?platform=youtube'}><GraphUp/> {t("SIDEBAR.CATEGORY_LIST.POPULAR")}</a>
|
||||
<a href={'/discover?category=movies&?platform=youtube'}><Movie/> {t("SIDEBAR.CATEGORY_LIST.TRAILERS")}</a>
|
||||
<a href={'/discover?category=music&?platform=youtube'}><MusicDoubleNote/> {t("SIDEBAR.CATEGORY_LIST.MUSIC")}</a>
|
||||
<a href={'/discover?category=gaming&?platform=youtube'}><Gamepad/> {t("SIDEBAR.CATEGORY_LIST.GAMES")}</a>
|
||||
:
|
||||
null
|
||||
}
|
||||
{SIDEBAR_DISCOVER ?
|
||||
<hr/>
|
||||
<h2>{t("SIDEBAR.DISCOVER")}</h2>
|
||||
<a href={'/discover/tech'}><AppleImac2021Side/> {t("SIDEBAR.DISCOVER_LIST.TECH")}</a>
|
||||
<a href="/discover/comedy"><EmojiTalkingHappy/> {t("SIDEBAR.DISCOVER_LIST.COMEDY")}</a>
|
||||
|
|
@ -64,22 +85,25 @@ import SettingsLayout from '@layouts/Settings.astro'
|
|||
:
|
||||
null
|
||||
}
|
||||
{Guest ?
|
||||
null
|
||||
:
|
||||
<h2>Following</h2>
|
||||
<span>
|
||||
{subs.map((channel) =>
|
||||
<CreatorInSidebar ChannelId={channel.Id}/>
|
||||
)}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="sidebar-bottom">
|
||||
<div class="sidebar-bottom-start">
|
||||
<a style="pointer-events: none;"><PeaceHand/> {t("SIDEBAR.FOOTER.ALPHA")}</a>
|
||||
<a href="/telemtry"><CurveArray/> Telemtry</a>
|
||||
<a id="sidebar-disable"><HelpCircle/> Help</a>
|
||||
<a href="/instance"><Server/> Instance</a>
|
||||
</div>
|
||||
<div class="sidebar-bottom-center">
|
||||
<p id="version">v{version}</p>
|
||||
</div>
|
||||
<div class="sidebar-bottom-end">
|
||||
<a href="https://lemmy.world/c/minpluto" target="_blank">{t("SIDEBAR.FOOTER.FORUM")}</a>
|
||||
<p id="version">v{version}</p>
|
||||
<a href="https://status.minpluto.org/" target="_blank">{t("SIDEBAR.FOOTER.STATUS")}</a>
|
||||
<a href="https://ark.sudovanilla.org/MinPluto/MinPluto" target="_blank">{t("SIDEBAR.FOOTER.SOURCE_CODE")}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -167,15 +191,16 @@ import SettingsLayout from '@layouts/Settings.astro'
|
|||
}
|
||||
}
|
||||
.sidebar-bottom {
|
||||
padding: 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.sidebar-bottom-center {
|
||||
background: #232323;
|
||||
padding: 0px 24px;
|
||||
margin: 0px -24px 12px -24px;
|
||||
.sidebar-bottom-end {
|
||||
text-align: center;
|
||||
padding-bottom: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0px 18px;
|
||||
}
|
||||
a {
|
||||
margin: 0px 4px;
|
||||
|
|
@ -186,6 +211,11 @@ import SettingsLayout from '@layouts/Settings.astro'
|
|||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
p#version {
|
||||
background: rgb(48, 48, 48);
|
||||
border-radius: 3rem;
|
||||
padding: 6px 12px;
|
||||
}
|
||||
}
|
||||
.sidebar-top-end a, .sidebar-bottom-start a {
|
||||
color: white;
|
||||
|
|
|
|||
Reference in a new issue