color mode stuff

This commit is contained in:
vel 2022-01-24 19:45:47 -08:00
parent 0fd974266c
commit e4d7906cb5
Signed by: velvox
GPG Key ID: 1C8200C1D689CEF5
4 changed files with 17 additions and 16 deletions

View File

@ -5,10 +5,8 @@
</component>
<component name="ChangeListManager">
<list default="true" id="8a64704d-5500-41a6-aa4c-e275933fc58c" name="Changes" comment="">
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/handlers.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/handlers.go" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/hub.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/hub.go" afterDir="false" />
<change beforePath="$PROJECT_DIR$/internal/ws/message.go" beforeDir="false" afterPath="$PROJECT_DIR$/internal/ws/message.go" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../frontend/src/components/Player.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/components/Player.tsx" afterDir="false" />
<change beforePath="$PROJECT_DIR$/../frontend/src/pages/player.tsx" beforeDir="false" afterPath="$PROJECT_DIR$/../frontend/src/pages/player.tsx" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />

View File

@ -1,19 +1,15 @@
import React, { FC } from "react";
import ReactPlayer, { ReactPlayerProps } from "react-player";
import ReactPlayer, { Config, ReactPlayerProps } from "react-player";
type PlayerProps = { id: string } & ReactPlayerProps;
const Player: FC<PlayerProps> = ({ id, config }) => {
return <ReactPlayer url={id} config={config} />;
};
Player.defaultProps = {
id: "",
config: {
const Player: FC<PlayerProps> = (props) => {
const config: Config = {
file: {
forceHLS: true,
},
},
};
return <ReactPlayer url={props.id} config={config} {...props} />;
};
export default Player;

View File

@ -1,5 +1,6 @@
import NextDocument, { Html, Head, Main, NextScript } from "next/document";
import { ColorModeScript } from "@chakra-ui/react";
import theme from "../theme";
export default class Document extends NextDocument {
render() {
@ -8,7 +9,7 @@ export default class Document extends NextDocument {
<Head />
<body>
{/* Make Color mode to persists when you refresh the page. */}
<ColorModeScript />
<ColorModeScript initialColorMode={theme.config.initialColorMode} />
<Main />
<NextScript />
</body>

View File

@ -3,7 +3,8 @@ import { GetServerSideProps, NextPage } from "next";
import { Session, User } from "next-auth";
import { getSession, useSession } from "next-auth/react";
import dynamic from "next/dynamic";
import React, { useEffect } from "react";
import React, { useEffect, useRef } from "react";
import ReactPlayer from "react-player";
import { Container } from "../components/Container";
import { MessageTypes } from "../interfaces/IMessage";
import Message from "../util/Message";
@ -28,6 +29,7 @@ const pingEvent = (ws: WebSocket) => {
};
const PlayerPage: NextPage<PlayerPageProps> = ({ URI, user }) => {
const playerRef = useRef<ReactPlayer>();
consola.wrapAll();
useEffect(() => {
if (typeof window === "undefined") return;
@ -63,7 +65,11 @@ const PlayerPage: NextPage<PlayerPageProps> = ({ URI, user }) => {
ws.close();
};
}, []);
return <Container height="100vh">{/* <Player /> */}</Container>;
return (
<Container height="100vh">
<Player id="" ref={playerRef} />
</Container>
);
};
export const getServerSideProps: GetServerSideProps = async (context) => {