import { useParams, useHistory } from "react-router-dom"; import { Channels } from "revolt.js/dist/api/objects"; import styled from "styled-components"; import { useState } from "preact/hooks"; import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice"; import { useChannel, useForceUpdate } from "../../context/revoltjs/hooks"; import MessageBox from "../../components/common/messaging/MessageBox"; import JumpToBottom from "../../components/common/messaging/bars/JumpToBottom"; import TypingIndicator from "../../components/common/messaging/bars/TypingIndicator"; import Button from "../../components/ui/Button"; import Checkbox from "../../components/ui/Checkbox"; import MemberSidebar from "../../components/navigation/right/MemberSidebar"; import ChannelHeader from "./ChannelHeader"; import { MessageArea } from "./messaging/MessageArea"; import VoiceHeader from "./voice/VoiceHeader"; import { dispatch, getState } from "../../redux"; const ChannelMain = styled.div` flex-grow: 1; display: flex; min-height: 0; overflow: hidden; flex-direction: row; `; const ChannelContent = styled.div` flex-grow: 1; display: flex; overflow: hidden; flex-direction: column; `; const AgeGate = styled.div` display: flex; flex-grow: 1; flex-direction: column; align-items: center; justify-content: center; user-select: none; padding: 12px; img { height: 150px; } .subtext { color: var(--secondary-foreground); margin-bottom: 12px; font-size: 14px; } .actions { margin-top: 20px; display: flex; gap: 12px; } `; export function Channel({ id }: { id: string }) { const ctx = useForceUpdate(); const channel = useChannel(id, ctx); if (!channel) return null; if (channel.channel_type === "VoiceChannel") { return ; } else { return ; } } const MEMBERS_SIDEBAR_KEY = 'sidebar_members'; function TextChannel({ channel }: { channel: Channels.Channel }) { if ( (channel.channel_type === "TextChannel" || channel.channel_type === "Group") && channel.name.includes("nsfw") ) { const goBack = useHistory(); const [consent, setConsent] = useState(false); const [ageGate, setAgeGate] = useState(false); if (!ageGate) { return (

{channel.name}

This channel is marked as NSFW.{" "} Learn more setConsent(v)}> I confirm that I am at least 18 years old.
); } } const [showMembers, setMembers] = useState(getState().sectionToggle[MEMBERS_SIDEBAR_KEY] ?? true); let id = channel._id; return ( <> { setMembers(!showMembers); if (showMembers) { dispatch({ type: 'SECTION_TOGGLE_SET', id: MEMBERS_SIDEBAR_KEY, state: false }); } else { dispatch({ type: 'SECTION_TOGGLE_UNSET', id: MEMBERS_SIDEBAR_KEY }); } }} /> {!isTouchscreenDevice && showMembers && ( )} ); } function VoiceChannel({ channel }: { channel: Channels.Channel }) { return ( <> ); } export default function () { const { channel } = useParams<{ channel: string }>(); return ; }