created channelid and memberid page

This commit is contained in:
Bob Burningham 2023-10-20 19:42:52 -07:00
parent 725c67d6f7
commit d148623a0d
5 changed files with 88 additions and 12 deletions

View File

@ -0,0 +1,9 @@
const ChannelIdPage = () => {
return (
<div>
Channel ID Page!
</div>
)
}
export default ChannelIdPage

View File

@ -0,0 +1,9 @@
const MemberIdPage = () => {
return (
<div>
Member ID Page
</div>
)
}
export default MemberIdPage

View File

@ -1,8 +1,50 @@
const ServerIdPage = () => { import { currentProfile } from "@/lib/current-profile";
return ( import { db } from "@/lib/db";
<div> import { redirectToSignIn } from "@clerk/nextjs";
Server ID Page import { redirect } from "next/navigation";
</div>
); interface ServerIdPageProps {
params: {
serverId: string;
};
};
const ServerIdPage = async ({
params
}: ServerIdPageProps) => {
const profile = await currentProfile();
if (!profile) {
return redirectToSignIn();
}
const server = await db.server.findUnique({
where: {
id: params.serverId,
members: {
some: {
profileId: profile.id,
},
},
},
include: {
channels: {
where: {
name: "general"
},
orderBy: {
createdAt: "asc"
}
},
},
});
const inistailChannel = server?.channels[0];
if (inistailChannel?.name !== "general") {
return null;
}
return redirect(`/servers/${params?.serverId}/channels/${inistailChannel?.id}`);
} }
export default ServerIdPage; export default ServerIdPage;

View File

@ -5,7 +5,7 @@ import { Channel, ChannelType, MemberRole, Server } from "@prisma/client";
import { Edit, Hash, Lock, Mic, Trash, Video } from "lucide-react"; import { Edit, Hash, Lock, Mic, Trash, Video } from "lucide-react";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { ActionTooltip } from "@/components/action-tooltip"; import { ActionTooltip } from "@/components/action-tooltip";
import { useModal } from "@/hooks/use-modal-store"; import { ModalType, useModal } from "@/hooks/use-modal-store";
interface ServerChannelProps { interface ServerChannelProps {
channel: Channel; channel: Channel;
@ -30,9 +30,18 @@ export const ServerChannel = ({
const Icon = iconMap[channel.type]; const Icon = iconMap[channel.type];
const onClick = () => {
router.push(`/servers/${params?.serverId}/channels/${channel.id}`);
}
const onAction = (e: React.MouseEvent, action: ModalType) => {
e.stopPropagation();
onOpen(action, { channel, server });
}
return ( return (
<button <button
onClick={() => {}} onClick={onClick}
className={cn( className={cn(
"group px-2 py-2 rounded-md flex items-center gap-x-2 w-full hover:bg-zinc-700/10 dark:hover:bg-zinc-700/50 transition mb-1", "group px-2 py-2 rounded-md flex items-center gap-x-2 w-full hover:bg-zinc-700/10 dark:hover:bg-zinc-700/50 transition mb-1",
params?.channelId === channel.id && "bg-zinc-700/10 dark:bg-zinc-700" params?.channelId === channel.id && "bg-zinc-700/10 dark:bg-zinc-700"
@ -49,13 +58,13 @@ export const ServerChannel = ({
<div className="ml-auto flex items-center gap-x-2"> <div className="ml-auto flex items-center gap-x-2">
<ActionTooltip label="Edit"> <ActionTooltip label="Edit">
<Edit <Edit
onClick={() => onOpen("editChannel", {channel, server})} onClick={(e) => onAction(e, "editChannel")}
className="hidden group-hover:block w-4 h-4 text-zinc-500 hove:text-zinc-600 dark:text-zinc-400 dark:hove:text-zinc-300 transition" className="hidden group-hover:block w-4 h-4 text-zinc-500 hove:text-zinc-600 dark:text-zinc-400 dark:hove:text-zinc-300 transition"
/> />
</ActionTooltip> </ActionTooltip>
<ActionTooltip label="Delete"> <ActionTooltip label="Delete">
<Trash <Trash
onClick={() => onOpen("deleteChannel", {channel, server})} onClick={(e) => onAction(e, "deleteChannel")}
className="hidden group-hover:block w-4 h-4 text-zinc-500 hove:text-zinc-600 dark:text-zinc-400 dark:hove:text-zinc-300 transition" className="hidden group-hover:block w-4 h-4 text-zinc-500 hove:text-zinc-600 dark:text-zinc-400 dark:hove:text-zinc-300 transition"
/> />
</ActionTooltip> </ActionTooltip>

View File

@ -25,11 +25,18 @@ export const ServerMember = ({
server server
}: ServerMemberProps) => { }: ServerMemberProps) => {
const params = useParams(); const params = useParams();
//const router = useRouter(); const router = useRouter();
const icon = roleIconMap[member.role]; const icon = roleIconMap[member.role];
const onClick = () => {
router.push(`/servers/${params?.serverId}/conversations/${member.id}`);
}
return ( return (
<button className={cn( <button
onClick={onClick}
className={cn(
"group px-2 py-2 rounded-md flex items-center gap-x-2 w-full hover:bg-zinc-700/10 dark:hover:bg-zinc-700/50 transition mb-1", "group px-2 py-2 rounded-md flex items-center gap-x-2 w-full hover:bg-zinc-700/10 dark:hover:bg-zinc-700/50 transition mb-1",
params?.memberId === member.id && "bg-zinc-700/20 dark:bg-zinc-700" params?.memberId === member.id && "bg-zinc-700/20 dark:bg-zinc-700"
)}> )}>