feat(channel): add edit/delete modal, API, and context updates
This commit is contained in:
Chneemann
parent
21a49ff1d9
commit
942fce0e63
4 changed files with 485 additions and 21 deletions
144
app/api/channels/[channelId]/route.ts
Normal file
144
app/api/channels/[channelId]/route.ts
Normal file
|
|
@ -0,0 +1,144 @@
|
|||
/**
|
||||
* @file app/api/channels/[channelId]/route.ts
|
||||
* @description API route handler for updating and deleting channels.
|
||||
*/
|
||||
|
||||
import { auth } from "@/auth";
|
||||
import { db } from "@/db";
|
||||
import { channels, members } from "@/db/schema";
|
||||
import { and, eq } from "drizzle-orm";
|
||||
import { NextResponse } from "next/server";
|
||||
|
||||
/**
|
||||
* Handles PATCH requests to update an existing channel's name.
|
||||
*
|
||||
* @async
|
||||
* @function PATCH
|
||||
* @param {Request} req - The incoming HTTP request object containing the updated channel name in the body.
|
||||
* @param {Object} context - The route context parameters.
|
||||
* @param {Promise<{ channelId: string }>} context.params - A promise resolving to the route parameters containing the channel ID.
|
||||
* @returns {Promise<NextResponse>} A JSON response containing the updated channel object or an error message.
|
||||
*/
|
||||
export async function PATCH(
|
||||
req: Request,
|
||||
{ params }: { params: Promise<{ channelId: string }> },
|
||||
) {
|
||||
try {
|
||||
const { channelId } = await params;
|
||||
const session = await auth();
|
||||
const { name } = await req.json();
|
||||
|
||||
if (!session?.user?.id) {
|
||||
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
|
||||
}
|
||||
|
||||
if (!name || !name.trim()) {
|
||||
return NextResponse.json(
|
||||
{ error: "Channel name cannot be empty" },
|
||||
{ status: 400 },
|
||||
);
|
||||
}
|
||||
|
||||
const [existingChannel] = await db
|
||||
.select()
|
||||
.from(channels)
|
||||
.where(eq(channels.id, channelId))
|
||||
.limit(1);
|
||||
|
||||
if (!existingChannel) {
|
||||
return NextResponse.json({ error: "Channel not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Check if the user is a member of the server
|
||||
const [member] = await db
|
||||
.select()
|
||||
.from(members)
|
||||
.where(
|
||||
and(
|
||||
eq(members.userId, session.user.id),
|
||||
eq(members.serverId, existingChannel.serverId),
|
||||
),
|
||||
)
|
||||
.limit(1);
|
||||
|
||||
if (!member) {
|
||||
return NextResponse.json({ error: "Forbidden" }, { status: 403 });
|
||||
}
|
||||
|
||||
// Update Channel
|
||||
const [updatedChannel] = await db
|
||||
.update(channels)
|
||||
.set({ name: name.trim() })
|
||||
.where(eq(channels.id, channelId))
|
||||
.returning();
|
||||
|
||||
return NextResponse.json(updatedChannel);
|
||||
} catch (error) {
|
||||
console.error("API Channel PATCH error:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Internal Server Error" },
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles DELETE requests to remove an existing channel.
|
||||
*
|
||||
* @async
|
||||
* @function DELETE
|
||||
* @param {Request} req - The incoming HTTP request object.
|
||||
* @param {Object} context - The route context parameters.
|
||||
* @param {Promise<{ channelId: string }>} context.params - A promise resolving to the route parameters containing the channel ID.
|
||||
* @returns {Promise<NextResponse>} A JSON response confirming deletion or returning an error message.
|
||||
*/
|
||||
export async function DELETE(
|
||||
req: Request,
|
||||
{ params }: { params: Promise<{ channelId: string }> },
|
||||
) {
|
||||
try {
|
||||
const { channelId } = await params;
|
||||
const session = await auth();
|
||||
|
||||
if (!session?.user?.id) {
|
||||
return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
|
||||
}
|
||||
|
||||
const [existingChannel] = await db
|
||||
.select()
|
||||
.from(channels)
|
||||
.where(eq(channels.id, channelId))
|
||||
.limit(1);
|
||||
|
||||
if (!existingChannel) {
|
||||
return NextResponse.json({ error: "Channel not found" }, { status: 404 });
|
||||
}
|
||||
|
||||
// Check if the user is a member of the server
|
||||
const [member] = await db
|
||||
.select()
|
||||
.from(members)
|
||||
.where(
|
||||
and(
|
||||
eq(members.userId, session.user.id),
|
||||
eq(members.serverId, existingChannel.serverId),
|
||||
),
|
||||
)
|
||||
.limit(1);
|
||||
|
||||
if (!member) {
|
||||
return NextResponse.json({ error: "Forbidden" }, { status: 403 });
|
||||
}
|
||||
|
||||
// Delete Channel
|
||||
await db.delete(channels).where(eq(channels.id, channelId));
|
||||
|
||||
return NextResponse.json({ success: true });
|
||||
} catch (error) {
|
||||
console.error("API Channel DELETE error:", error);
|
||||
return NextResponse.json(
|
||||
{ error: "Internal Server Error" },
|
||||
{ status: 500 },
|
||||
);
|
||||
}
|
||||
}
|
||||
231
components/modals/EditChannelModal.tsx
Normal file
231
components/modals/EditChannelModal.tsx
Normal file
|
|
@ -0,0 +1,231 @@
|
|||
/**
|
||||
* @file components/modals/EditChannelModal.tsx
|
||||
* @description Modal dialog to edit channel settings or delete the channel.
|
||||
*/
|
||||
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { X, Loader2, Trash2 } from "lucide-react";
|
||||
import { useActiveServer } from "@/lib/context/ServerContext";
|
||||
import type { Channel } from "@/db/schema";
|
||||
|
||||
/**
|
||||
* Properties for the EditChannelModal component.
|
||||
*
|
||||
* @interface EditChannelModalProps
|
||||
* @property {boolean} isOpen - Determines whether the modal dialog is currently visible.
|
||||
* @property {() => void} onClose - Callback function triggered to close the modal.
|
||||
* @property {Channel | null} channel - The channel object being edited, or null if none is selected.
|
||||
*/
|
||||
interface EditChannelModalProps {
|
||||
isOpen: boolean;
|
||||
onClose: () => void;
|
||||
channel: Channel | null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders a modal dialog allowing users to modify channel properties or delete the channel.
|
||||
*
|
||||
* @param {EditChannelModalProps} props - The component props.
|
||||
* @param {boolean} props.isOpen - Determines whether the modal dialog is currently visible.
|
||||
* @param {() => void} props.onClose - Callback function triggered to close the modal.
|
||||
* @param {Channel | null} props.channel - The channel object being edited, or null if none is selected.
|
||||
* @returns {JSX.Element | null} The rendered edit channel modal, or null if closed or no channel is selected.
|
||||
*/
|
||||
export function EditChannelModal({
|
||||
isOpen,
|
||||
onClose,
|
||||
channel,
|
||||
}: EditChannelModalProps) {
|
||||
const [name, setName] = useState("");
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const [isDeleting, setIsDeleting] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
const router = useRouter();
|
||||
const { updateChannel, removeChannel, activeServer } = useActiveServer();
|
||||
|
||||
useEffect(() => {
|
||||
if (channel) {
|
||||
setName(channel.name);
|
||||
}
|
||||
}, [channel]);
|
||||
|
||||
if (!isOpen || !channel) return null;
|
||||
|
||||
const isChanged = name.trim() !== channel.name;
|
||||
const isValid = name.trim().length > 0;
|
||||
const canSave = isChanged && isValid && !isLoading && !isDeleting;
|
||||
|
||||
/**
|
||||
* Handles the asynchronous update of the channel name.
|
||||
*
|
||||
* @async
|
||||
* @function handleUpdate
|
||||
* @param {React.FormEvent} e - The form submission event.
|
||||
* @returns {Promise<void>} Resolves when the channel update process completes or fails.
|
||||
*/
|
||||
const handleUpdate = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
if (!canSave) return;
|
||||
|
||||
try {
|
||||
setIsLoading(true);
|
||||
setError(null);
|
||||
|
||||
const response = await fetch(`/api/channels/${channel.id}`, {
|
||||
method: "PATCH",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ name }),
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error("Fehler beim Aktualisieren des Channels.");
|
||||
}
|
||||
|
||||
const updated = await response.json();
|
||||
updateChannel(updated);
|
||||
onClose();
|
||||
} catch (err: unknown) {
|
||||
setError(
|
||||
err instanceof Error ? err.message : "Etwas ist schiefgelaufen.",
|
||||
);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Handles the asynchronous deletion of the channel and redirects the user accordingly.
|
||||
*
|
||||
* @async
|
||||
* @function handleDelete
|
||||
* @returns {Promise<void>} Resolves when the channel deletion and navigation processes complete or fail.
|
||||
*/
|
||||
const handleDelete = async () => {
|
||||
if (isDeleting || isLoading) return;
|
||||
|
||||
try {
|
||||
setIsDeleting(true);
|
||||
setError(null);
|
||||
|
||||
const response = await fetch(`/api/channels/${channel.id}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error("Fehler beim Löschen des Channels.");
|
||||
}
|
||||
|
||||
removeChannel(channel.id);
|
||||
onClose();
|
||||
|
||||
if (activeServer) {
|
||||
const remainingChannels = activeServer.channels.filter(
|
||||
(c) => c.id !== channel.id,
|
||||
);
|
||||
if (remainingChannels.length > 0) {
|
||||
router.push(
|
||||
`/servers/${activeServer.id}/channels/${remainingChannels[0].id}`,
|
||||
);
|
||||
} else {
|
||||
router.push(`/servers/${activeServer.id}`);
|
||||
}
|
||||
}
|
||||
} catch (err: unknown) {
|
||||
setError(
|
||||
err instanceof Error ? err.message : "Etwas ist schiefgelaufen.",
|
||||
);
|
||||
} finally {
|
||||
setIsDeleting(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
onClick={onClose}
|
||||
className="fixed inset-0 z-50 bg-black/70 flex items-center justify-center p-4"
|
||||
>
|
||||
<div
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
className="bg-surface border border-surface/50 rounded-2xl w-full max-w-md p-6 shadow-2xl relative animate-in fade-in zoom-in-95 duration-150"
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onClose}
|
||||
disabled={isLoading || isDeleting}
|
||||
className="absolute top-4 right-4 text-muted hover:text-white transition-colors cursor-pointer"
|
||||
>
|
||||
<X className="w-5 h-5" />
|
||||
</button>
|
||||
|
||||
<h2 className="text-xl font-bold text-white mb-1">Edit Channel</h2>
|
||||
<p className="text-sm text-muted mb-6">
|
||||
Change channel details or delete this channel.
|
||||
</p>
|
||||
|
||||
<form onSubmit={handleUpdate} className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-xs font-semibold text-muted uppercase tracking-wider mb-2">
|
||||
Channel Name
|
||||
</label>
|
||||
<div className="relative flex items-center">
|
||||
<span className="absolute left-3.5 text-muted text-sm font-semibold">
|
||||
#
|
||||
</span>
|
||||
<input
|
||||
type="text"
|
||||
required
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
placeholder="channel-name"
|
||||
disabled={isLoading || isDeleting}
|
||||
autoFocus
|
||||
className="w-full bg-background border border-surface/80 rounded-xl pl-8 pr-3.5 py-2.5 text-sm text-white placeholder:text-muted focus:outline-none focus:ring-2 focus:ring-accent transition-all disabled:opacity-50"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{error && <p className="text-xs text-red-400 mt-2">{error}</p>}
|
||||
|
||||
<div className="flex items-center justify-between pt-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleDelete}
|
||||
disabled={isLoading || isDeleting}
|
||||
className="flex items-center gap-1.5 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors cursor-pointer disabled:opacity-50"
|
||||
>
|
||||
{isDeleting ? (
|
||||
<Loader2 className="w-4 h-4 animate-spin" />
|
||||
) : (
|
||||
<Trash2 className="w-4 h-4" />
|
||||
)}
|
||||
Delete Channel
|
||||
</button>
|
||||
|
||||
<div className="flex items-center gap-3">
|
||||
<button
|
||||
type="button"
|
||||
onClick={onClose}
|
||||
disabled={isLoading || isDeleting}
|
||||
className="px-4 py-2 text-sm font-medium text-muted hover:text-white transition-colors cursor-pointer"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={!canSave}
|
||||
className="px-5 py-2 bg-accent text-white font-medium text-sm rounded-xl hover:bg-accent/90 transition-all disabled:opacity-50 flex items-center gap-2 cursor-pointer"
|
||||
>
|
||||
{isLoading && <Loader2 className="w-4 h-4 animate-spin" />}
|
||||
Save
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
/**
|
||||
* @file components/sidebar/ChannelSidebar.tsx
|
||||
* @description Sidebar component displaying server channels, navigation toggles, and modal triggers.
|
||||
* @description Sidebar component for navigating text channels within an active server, featuring channel creation, editing, and mobile responsiveness.
|
||||
*/
|
||||
|
||||
"use client";
|
||||
|
|
@ -12,22 +12,26 @@ import { useActiveServer } from "@/lib/context/ServerContext";
|
|||
import { DirectMessageSidebar } from "@/components/sidebar/DirectMessageSidebar";
|
||||
import { useSidebarStore } from "@/lib/stores/useSidebarStore";
|
||||
import { CreateChannelModal } from "@/components/modals/CreateChannelModal";
|
||||
import { PanelLeftClose, Plus } from "lucide-react";
|
||||
import { EditChannelModal } from "@/components/modals/EditChannelModal";
|
||||
import { PanelLeftClose, Plus, Settings } from "lucide-react";
|
||||
import type { Channel } from "@/db/schema";
|
||||
|
||||
/**
|
||||
* Renders the channel sidebar for active servers, allowing users to navigate channels or create new ones.
|
||||
* Renders the channel sidebar for the active server with text channel lists, creation triggers, and settings handlers.
|
||||
*
|
||||
* @returns {JSX.Element} The rendered channel sidebar container.
|
||||
*/
|
||||
export function ChannelSidebar() {
|
||||
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
|
||||
const [editingChannel, setEditingChannel] = useState<Channel | null>(null);
|
||||
|
||||
const params = useParams();
|
||||
const currentChannelId = params?.channelId as string;
|
||||
const { activeServer } = useActiveServer();
|
||||
const { closeNav, toggleNav } = useSidebarStore();
|
||||
|
||||
/**
|
||||
* Handles channel selection clicks, closing the mobile navigation sidebar on smaller viewports.
|
||||
* Handles channel selection clicks, automatically closing the mobile navigation drawer on smaller screens.
|
||||
*
|
||||
* @function handleChannelClick
|
||||
* @returns {void}
|
||||
|
|
@ -38,6 +42,20 @@ export function ChannelSidebar() {
|
|||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Opens the channel settings modal for the selected channel, preventing event propagation.
|
||||
*
|
||||
* @function handleOpenSettings
|
||||
* @param {React.MouseEvent} e - The mouse click event.
|
||||
* @param {Channel} channel - The channel object to edit.
|
||||
* @returns {void}
|
||||
*/
|
||||
const handleOpenSettings = (e: React.MouseEvent, channel: Channel) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setEditingChannel(channel);
|
||||
};
|
||||
|
||||
if (!activeServer) {
|
||||
return <DirectMessageSidebar />;
|
||||
}
|
||||
|
|
@ -64,7 +82,7 @@ export function ChannelSidebar() {
|
|||
<span>Text Channels</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setIsModalOpen(true)}
|
||||
onClick={() => setIsCreateModalOpen(true)}
|
||||
className="p-1 rounded text-muted hover:text-white hover:bg-surface transition-colors cursor-pointer"
|
||||
aria-label="Create channel"
|
||||
>
|
||||
|
|
@ -82,16 +100,29 @@ export function ChannelSidebar() {
|
|||
href={`/servers/${activeServer.id}/channels/${channel.id}`}
|
||||
onClick={handleChannelClick}
|
||||
prefetch={false}
|
||||
className={`flex items-center gap-2 px-2 py-1.5 rounded-md text-sm transition-all group ${
|
||||
className={`flex items-center justify-between px-2 py-1.5 rounded-md text-sm transition-all group ${
|
||||
isActive
|
||||
? "bg-accent/50 text-white font-medium"
|
||||
: "text-muted hover:bg-surface hover:text-white"
|
||||
}`}
|
||||
>
|
||||
<span className="text-muted group-hover:text-white text-base">
|
||||
#
|
||||
</span>
|
||||
<span className="truncate">{channel.name}</span>
|
||||
<div className="flex items-center gap-2 min-w-0">
|
||||
<span className="text-muted group-hover:text-white text-base">
|
||||
#
|
||||
</span>
|
||||
<span className="truncate">{channel.name}</span>
|
||||
</div>
|
||||
|
||||
{/* Gear Button */}
|
||||
<button
|
||||
type="button"
|
||||
onClick={(e) => handleOpenSettings(e, channel)}
|
||||
className="opacity-0 group-hover:opacity-100 p-1 text-muted hover:text-white focus:outline-none transition-all cursor-pointer"
|
||||
aria-label="Channel Settings"
|
||||
title="Channel Settings"
|
||||
>
|
||||
<Settings className="w-3.5 h-3.5" />
|
||||
</button>
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
|
|
@ -99,11 +130,18 @@ export function ChannelSidebar() {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
{/* Modals */}
|
||||
<CreateChannelModal
|
||||
isOpen={isModalOpen}
|
||||
onClose={() => setIsModalOpen(false)}
|
||||
isOpen={isCreateModalOpen}
|
||||
onClose={() => setIsCreateModalOpen(false)}
|
||||
serverId={activeServer.id}
|
||||
/>
|
||||
|
||||
<EditChannelModal
|
||||
isOpen={!!editingChannel}
|
||||
onClose={() => setEditingChannel(null)}
|
||||
channel={editingChannel}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,6 +33,9 @@ export interface ServerMember {
|
|||
* @interface ServerContextType
|
||||
* @property {ServerWithChannels | null} activeServer - The currently active server instance with its associated channels.
|
||||
* @property {(server: ServerWithChannels | null) => void} setActiveServer - State setter function for updating the active server.
|
||||
* @property {(channel: Channel) => void} addChannel - Function to add a new channel to the active server.
|
||||
* @property {(channelId: string) => void} removeChannel - Function to remove a channel by its identifier.
|
||||
* @property {(channel: Channel) => void} updateChannel - Function to update an existing channel.
|
||||
* @property {ServerMember[]} members - The list of members belonging to the active server.
|
||||
* @property {(members: ServerMember[]) => void} setMembers - State setter function for updating the server members list.
|
||||
*/
|
||||
|
|
@ -40,6 +43,8 @@ interface ServerContextType {
|
|||
activeServer: ServerWithChannels | null;
|
||||
setActiveServer: (server: ServerWithChannels | null) => void;
|
||||
addChannel: (channel: Channel) => void;
|
||||
removeChannel: (channelId: string) => void;
|
||||
updateChannel: (channel: Channel) => void;
|
||||
members: ServerMember[];
|
||||
setMembers: (members: ServerMember[]) => void;
|
||||
}
|
||||
|
|
@ -48,6 +53,8 @@ const ServerContext = createContext<ServerContextType>({
|
|||
activeServer: null,
|
||||
setActiveServer: () => {},
|
||||
addChannel: () => {},
|
||||
removeChannel: () => {},
|
||||
updateChannel: () => {},
|
||||
members: [],
|
||||
setMembers: () => {},
|
||||
});
|
||||
|
|
@ -65,22 +72,59 @@ export function ServerProvider({ children }: { children: React.ReactNode }) {
|
|||
);
|
||||
const [members, setMembers] = useState<ServerMember[]>([]);
|
||||
|
||||
const addChannel = (channel: Channel) => {
|
||||
setActiveServer((prev) => {
|
||||
if (!prev || prev.id !== channel.serverId) return prev;
|
||||
return {
|
||||
...prev,
|
||||
channels: [...prev.channels, channel],
|
||||
};
|
||||
});
|
||||
/**
|
||||
* Helper function to update channels within the active server state.
|
||||
*
|
||||
* @function updateChannels
|
||||
* @param {(channels: Channel[]) => Channel[]} fn - The updater function receiving current channels and returning new channels.
|
||||
* @returns {void}
|
||||
*/
|
||||
const updateChannels = (fn: (channels: Channel[]) => Channel[]) => {
|
||||
setActiveServer((prev) =>
|
||||
prev ? { ...prev, channels: fn(prev.channels) } : prev,
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
* Adds a new channel to the active server.
|
||||
*
|
||||
* @function addChannel
|
||||
* @param {Channel} channel - The channel object to add.
|
||||
* @returns {void}
|
||||
*/
|
||||
const addChannel = (channel: Channel) =>
|
||||
updateChannels((prev) => [...prev, channel]);
|
||||
|
||||
/**
|
||||
* Removes a channel from the active server by its identifier.
|
||||
*
|
||||
* @function removeChannel
|
||||
* @param {string} channelId - The unique identifier of the channel to remove.
|
||||
* @returns {void}
|
||||
*/
|
||||
const removeChannel = (channelId: string) =>
|
||||
updateChannels((prev) => prev.filter((c) => c.id !== channelId));
|
||||
|
||||
/**
|
||||
* Updates an existing channel within the active server.
|
||||
*
|
||||
* @function updateChannel
|
||||
* @param {Channel} updatedChannel - The updated channel object.
|
||||
* @returns {void}
|
||||
*/
|
||||
const updateChannel = (updatedChannel: Channel) =>
|
||||
updateChannels((prev) =>
|
||||
prev.map((c) => (c.id === updatedChannel.id ? updatedChannel : c)),
|
||||
);
|
||||
|
||||
return (
|
||||
<ServerContext.Provider
|
||||
value={{
|
||||
activeServer,
|
||||
setActiveServer,
|
||||
addChannel,
|
||||
removeChannel,
|
||||
updateChannel,
|
||||
members,
|
||||
setMembers,
|
||||
}}
|
||||
|
|
@ -90,6 +134,13 @@ export function ServerProvider({ children }: { children: React.ReactNode }) {
|
|||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Custom hook to access the active server context.
|
||||
*
|
||||
* @function useActiveServer
|
||||
* @throws {Error} Throws an error if used outside of a ServerProvider.
|
||||
* @returns {ServerContextType} The active server context value.
|
||||
*/
|
||||
export function useActiveServer() {
|
||||
const context = useContext(ServerContext);
|
||||
if (!context) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue