dylan/gander
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

FEAT: Navigate to category page of stream's category upon clicking it

Browse Source
This commit is contained in:
Chris-1010
2025-02-27 21:32:51 +00:00
parent 9f6a4a2d87
commit 2b325746f5
2 changed files with 16 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/components/Stream/ChatPanel.tsx
View File

@@ -150,11 +150,23 @@ const ChatPanel: React.FC<ChatPanelProps> = ({
{/* Toggle Button for Chat */}
<button
onClick={toggleChat}
className={`group cursor-pointer p-2 hover:bg-gray-800 rounded-md absolute top-[1vh] left-[1vw] ${showChat ? "" : "delay-[0.75s] -translate-x-[4vw]"} text-[1rem] text-purple-500 flex items-center flex-nowrap z-[20] duration-[0.3s] transition-all`}
className={`group cursor-pointer p-2 hover:bg-gray-800 rounded-md absolute top-[1vh] left-[1vw] ${
showChat ? "" : "delay-[0.75s] -translate-x-[4vw]"
} text-[1rem] text-purple-500 flex items-center flex-nowrap z-[20] duration-[0.3s] transition-all`}
>
{showChat ? <ArrowRightFromLineIcon /> : <ArrowLeftFromLineIcon />}
<small className={`absolute ${showChat ? justToggled ? "left-0 group-hover:-left-[5vw] group-hover:bg-white/10" : "right-0 group-hover:-right-[5vw] group-hover:bg-red-500/80" : justToggled ? "right-0 group-hover:-right-[5vw] group-hover:bg-red-500/80" : "left-0 group-hover:-left-[5vw] group-hover:bg-white/10"} p-1 rounded-md w-fit text-nowrap font-bold opacity-0 group-hover:opacity-100 text-white transition-all`}>
<small
className={`absolute ${
showChat
? justToggled
? "left-0 group-hover:-left-[5vw] group-hover:bg-white/10"
: "right-0 group-hover:-right-[5vw] group-hover:bg-red-500/80"
: justToggled
? "right-0 group-hover:-right-[5vw] group-hover:bg-red-500/80"
: "left-0 group-hover:-left-[5vw] group-hover:bg-white/10"
} p-1 rounded-md w-fit text-nowrap font-bold opacity-0 group-hover:opacity-100 text-white transition-all`}
>
Press C
</small>
</button>

17
frontend/src/pages/VideoPage.tsx
View File

@@ -32,7 +32,6 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
const [showCheckout, setShowCheckout] = useState(false);
const { showChat } = useChat();
const navigate = useNavigate();
const [isSubscribed, setIsSubscribed] = useState(false);
const [timeStarted, setTimeStarted] = useState("");
useEffect(() => {
@@ -126,18 +125,6 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
loadStripe();
}, []);
// Checks if user is subscribed
useEffect(() => {
fetch(`/api/user/subscription/${streamerName}/expiration`)
.then((response) => response.json())
.then((data) => {
if (data.remaining_time > 0) {
setIsSubscribed(true);
}
})
.catch((error) => console.error("Error fetching subscription:", error));
}, [streamerName]);
return (
<SocketProvider>
<DynamicPageContent className="w-full min-h-screen">
@@ -188,9 +175,9 @@ const VideoPage: React.FC<VideoPageProps> = ({ streamerId }) => {
<h2 className="text-[0.75em] lg:text-[0.85em] xl:text-[1em] font-bold">
{streamData ? streamData.title : "Loading..."}
</h2>
<span className="text-[0.75em] lg:text-[0.85em] xl:text-[1em] text-gray-400">
<a href={streamData ? `/category/${streamData.streamCategory}` : "#"} className="text-[0.75em] lg:text-[0.85em] xl:text-[1em] text-gray-400">
{streamData ? streamData.streamCategory : "Loading..."}
</span>
</a>
</div>
{/* Streamer Info */}