Skip to content

Commit d8cb320

Browse files
multimokiamultimokia
committed
Merge remote-tracking branch 'origin/main' into FROS-Kicks-And-Bans
2 parents 98716a3 + b35bc37 commit d8cb320

5 files changed

Lines changed: 76 additions & 98 deletions

File tree

‎components/Tooltips/ServerSettingsTooltip.tsx‎

Lines changed: 0 additions & 61 deletions
This file was deleted.

‎components/home/Server.tsx‎

Lines changed: 68 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,20 @@ import {
99
} from 'react';
1010
import { getChannelsInServer } from '@/services/channels.service';
1111
import ServersIcon from '../icons/ServersIcon';
12-
import { useSupabaseClient } from '@supabase/auth-helpers-react';
12+
import { useSupabaseClient, useUser } from '@supabase/auth-helpers-react';
1313
import styles from '@/styles/Servers.module.css';
1414
import { Channel, Server as ServerType } from '@/types/dbtypes';
1515
import { ServerMemberStats } from './ServerMemberStats';
1616
import { OverflowMarquee } from './OverflowMarquee';
17-
import { useChannel, useSetChannel } from '@/lib/store';
17+
import { useChannel, useServerUserProfilePermissions, useSetChannel } from '@/lib/store';
1818
import { ChannelMediaIcon } from '../icons/ChannelMediaIcon';
19-
import { Tooltip } from 'react-tooltip';
2019
import ChannelName from './ChannelName';
20+
import ServerSettingsModal from '@/components/home/modals/ServerSettingsModal';
21+
import AddChannelModal from '@/components/home/modals/AddChannelModal';
22+
import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
23+
import { ServerPermissions } from '@/types/permissions';
24+
import PlusIcon from '@/components/icons/PlusIcon';
25+
import GearIcon from '@/components/icons/GearIcon';
2126

2227
export default function Server({
2328
server,
@@ -37,6 +42,11 @@ export default function Server({
3742
const [channels, setChannels] = useState<Channel[]>([]);
3843
const currentChannel = useChannel();
3944

45+
const [showServerSettingsModal, setShowServerSettingsModal] = useState(false);
46+
const [showAddChannelModal, setShowAddChannelModal] = useState(false);
47+
48+
const user = useUser();
49+
const serverPermissions = useServerUserProfilePermissions(server.id, user?.id!);
4050
useEffect(() => {
4151
const handleAsync = async () => {
4252
if (server) {
@@ -60,6 +70,16 @@ export default function Server({
6070
if (expand) {
6171
return (
6272
<div className="relative overflow-x-visible">
73+
<ServerSettingsModal
74+
showModal={showServerSettingsModal}
75+
setShowModal={setShowServerSettingsModal}
76+
server={server}
77+
/>
78+
<AddChannelModal
79+
showModal={showAddChannelModal}
80+
setShowModal={setShowAddChannelModal}
81+
serverId={expanded}
82+
/>
6383
<div className="border-b-2 border-grey-700 py-2 px-3 flex bg-grey-600 justify-between rounded-xl items-center relative z-10">
6484
<div className="flex items-center">
6585
<div
@@ -75,15 +95,51 @@ export default function Server({
7595
<ServerMemberStats server={server} />
7696
</div>
7797
</div>
78-
<div
79-
onMouseEnter={() => setIsSettingsHovered(true)}
80-
onMouseLeave={() => setIsSettingsHovered(false)}
81-
className="hover:cursor-pointer"
82-
data-tooltip-id="serverSettings"
83-
data-tooltip-place="right"
84-
>
85-
<VerticalSettingsIcon hovered={isSettingsHovered} />
86-
</div>
98+
<DropdownMenu.Root>
99+
<DropdownMenu.Trigger
100+
asChild
101+
disabled={
102+
!((serverPermissions & ServerPermissions.MANAGE_MESSAGES) > 0 ||
103+
(serverPermissions & ServerPermissions.OWNER) > 0 ||
104+
(serverPermissions & ServerPermissions.MANAGE_SERVER) > 0)
105+
}
106+
>
107+
<div
108+
onMouseEnter={() => setIsSettingsHovered(true)}
109+
onMouseLeave={() => setIsSettingsHovered(false)}
110+
className="hover:cursor-pointer"
111+
>
112+
<VerticalSettingsIcon hovered={isSettingsHovered} />
113+
</div>
114+
</DropdownMenu.Trigger>
115+
<DropdownMenu.Portal>
116+
<DropdownMenu.Content className="ContextMenuContent" side='right'>
117+
<DropdownMenu.Item asChild
118+
className="flex justify-center items-center hover:text-grey-300 cursor-pointer"
119+
onClick={() => {
120+
setShowAddChannelModal(true);
121+
}}
122+
>
123+
<div className="flex flex-row w-full">
124+
<PlusIcon width={5} height={5}/>
125+
<span className="ml-2 w-full">New channel</span>
126+
</div>
127+
</DropdownMenu.Item>
128+
<DropdownMenu.Item asChild
129+
className="flex justify-center items-center hover:text-grey-300 cursor-pointer"
130+
onClick={() => {
131+
setShowServerSettingsModal(true);
132+
}}
133+
hidden={(serverPermissions & ServerPermissions.MANAGE_SERVER) === 0}
134+
>
135+
<div className="flex flex-row w-full">
136+
<GearIcon width={5} height={5} />
137+
<span className="ml-2 w-full">Server Settings</span>
138+
</div>
139+
</DropdownMenu.Item>
140+
</DropdownMenu.Content>
141+
</DropdownMenu.Portal>
142+
</DropdownMenu.Root>
87143
</div>
88144
<div className="channels bg-grey-700 rounded-lg relative -top-3 py-4 px-7 ">
89145
{channels.map((channel: Channel, idx: number) => (

‎components/home/ServerList.tsx‎

Lines changed: 0 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,6 @@ export default function ServerList() {
2626
//TODO: Display default page (when user belongs to and has no servers)
2727

2828
const [showAddServer, setShowAddServer] = useState(false);
29-
const [showAddChannelModal, setShowAddChannelModal] = useState(false);
30-
const [showServerSettingsModal, setShowServerSettingsModal] = useState(false);
3129
const [expanded, setExpanded] = useState(0);
3230
const [currentServer, setCurrentServer] = useState<ServersForUser | null>(
3331
null
@@ -70,16 +68,6 @@ export default function ServerList() {
7068
showModal={showAddServer}
7169
setShowModal={setShowAddServer}
7270
/>
73-
<AddChannelModal
74-
showModal={showAddChannelModal}
75-
setShowModal={setShowAddChannelModal}
76-
serverId={expanded}
77-
/>
78-
<ServerSettingsModal
79-
showModal={showServerSettingsModal}
80-
setShowModal={setShowServerSettingsModal}
81-
server={currentServer}
82-
/>
8371
<div className="flex pb-3 items-center border-b-2 border-grey-700">
8472
<h1 className=" text-5xl font-bold tracking-wide">Servers</h1>
8573
<div className="pt-2 ml-3 relative">
@@ -156,11 +144,6 @@ export default function ServerList() {
156144
isLast={idx == serverList.length - 1}
157145
setExpanded={setExpanded}
158146
/>
159-
<ServerSettingsTooltip
160-
server_id={server.server_id}
161-
setShowAddChannelModal={setShowAddChannelModal}
162-
setShowServerSettingsModal={setShowServerSettingsModal}
163-
/>
164147
</span>
165148
);
166149
}

‎components/home/modals/ServerSettingsModal.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import Modal from '@/components/home/modals/Modal';
22
import { Dispatch, SetStateAction, useRef } from 'react';
33
import { useSupabaseClient, useUser } from '@supabase/auth-helpers-react';
4-
import { ServersForUser } from '@/types/dbtypes';
4+
import { Server, ServersForUser } from '@/types/dbtypes';
55
import { ServerPermissions } from '@/types/permissions';
66
import * as Tabs from '@radix-ui/react-tabs';
77
import 'styles/TabNav.module.css';
@@ -25,20 +25,20 @@ export default function ServerSettingsModal({
2525
}: {
2626
showModal: boolean;
2727
setShowModal: Dispatch<SetStateAction<boolean>>;
28-
server: ServersForUser | null;
28+
server: Server | null;
2929
}) {
3030
const modalRef = useRef<HTMLDialogElement>(null);
3131
const supabase = useSupabaseClient();
32-
const roles = useServerRoles(server?.server_id!);
32+
const roles = useServerRoles(server?.id!);
3333
const user = useUser();
34-
const userServerPerms = useServerUserProfilePermissions(server?.server_id!, user?.id!);
35-
const maxRole = useServerUserProfileHighestRolePosition(server?.server_id!, user?.id!);
34+
const userServerPerms = useServerUserProfilePermissions(server?.id!, user?.id!);
35+
const maxRole = useServerUserProfileHighestRolePosition(server?.id!, user?.id!);
3636

3737
return (
3838
<Modal
3939
modalRef={modalRef}
4040
showModal={showModal}
41-
title={`${server?.servers.name} - Server Settings`}
41+
title={`${server?.name} - Server Settings`}
4242
buttons={
4343
<button
4444
className="btn btn-primary"
@@ -86,7 +86,7 @@ export default function ServerSettingsModal({
8686
onClick={async () => {
8787
const { error } = await createRole(
8888
supabase,
89-
server?.server_id!,
89+
server?.id!,
9090
'New Role',
9191
roles.length - 1,
9292
0,

‎styles/ContextMenu.module.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
overflow: hidden;
1919
padding: 5px;
2020
box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2);
21-
z-index: 20;
21+
z-index: 100;
2222
border-color: rgb(71 85 105);
2323
border-width: 1px;
2424
}

0 commit comments

Comments
 (0)