root/jukebox-vibe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Feat: Show member count in channel dropdown

Browse source 
Add voice channel member count (non-bot users) to channel API
response and display it in the dropdown button and menu options.
Shows (N) suffix when users are in a channel.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Daniel 2026-03-06 20:04:27 +01:00
parent ac96896055
commit 4875747dc5
3 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

9
server/src/index.ts
View file

@ -5,7 +5,7 @@ import express, { Request, Response } from 'express';
import multer from 'multer'; import multer from 'multer';
import cors from 'cors'; import cors from 'cors';
import crypto from 'node:crypto'; import crypto from 'node:crypto';
import { Client, GatewayIntentBits, Partials, ChannelType, Events, type Message, VoiceState } from 'discord.js'; import { Client, GatewayIntentBits, Partials, ChannelType, Events, type Message, type VoiceBasedChannel, VoiceState } from 'discord.js';
import { import {
joinVoiceChannel, joinVoiceChannel,
createAudioPlayer, createAudioPlayer,
@ -1291,14 +1291,17 @@ app.get('/api/channels', (_req: Request, res: Response) => {
if (!client.isReady()) return res.status(503).json({ error: 'Bot noch nicht bereit' }); if (!client.isReady()) return res.status(503).json({ error: 'Bot noch nicht bereit' });
const allowed = new Set(ALLOWED_GUILD_IDS); const allowed = new Set(ALLOWED_GUILD_IDS);
const result: Array<{ guildId: string; guildName: string; channelId: string; channelName: string; selected?: boolean }> = []; const result: Array<{ guildId: string; guildName: string; channelId: string; channelName: string; members: number; selected?: boolean }> = [];
for (const [, guild] of client.guilds.cache) { for (const [, guild] of client.guilds.cache) {
if (allowed.size > 0 && !allowed.has(guild.id)) continue; if (allowed.size > 0 && !allowed.has(guild.id)) continue;
const channels = guild.channels.cache; const channels = guild.channels.cache;
for (const [, ch] of channels) { for (const [, ch] of channels) {
if (ch?.type === ChannelType.GuildVoice || ch?.type === ChannelType.GuildStageVoice) { if (ch?.type === ChannelType.GuildVoice || ch?.type === ChannelType.GuildStageVoice) {
const sel = getSelectedChannelForGuild(guild.id); const sel = getSelectedChannelForGuild(guild.id);
result.push({ guildId: guild.id, guildName: guild.name, channelId: ch.id, channelName: ch.name, selected: sel === ch.id }); const members = ('members' in ch)
? (ch as VoiceBasedChannel).members.filter(m => !m.user.bot).size
: 0;
result.push({ guildId: guild.id, guildName: guild.name, channelId: ch.id, channelName: ch.name, members, selected: sel === ch.id });
} }
} }
} }

4
web/src/App.tsx
View file

@ -610,7 +610,7 @@ export default function App() {
> >
<span className="material-icons cb-icon">headset</span> <span className="material-icons cb-icon">headset</span>
{selected && <span className="channel-status" />} {selected && <span className="channel-status" />}
<span className="channel-label">{selectedChannel?.channelName || 'Channel...'}</span> <span className="channel-label">{selectedChannel ? `${selectedChannel.channelName}${selectedChannel.members ? ` (${selectedChannel.members})` : ''}` : 'Channel...'}</span>
<span className={`material-icons chevron`}>expand_more</span> <span className={`material-icons chevron`}>expand_more</span>
</button> </button>
{channelOpen && ( {channelOpen && (
@ -625,7 +625,7 @@ export default function App() {
onClick={() => handleChannelSelect(ch)} onClick={() => handleChannelSelect(ch)}
> >
<span className="material-icons co-icon">volume_up</span> <span className="material-icons co-icon">volume_up</span>
{ch.channelName} {ch.channelName}{ch.members ? ` (${ch.members})` : ''}
</div> </div>
))} ))}
</React.Fragment> </React.Fragment>

1
web/src/types.ts
View file

@ -20,6 +20,7 @@ export type VoiceChannelInfo = {
guildName: string; guildName: string;
channelId: string; channelId: string;
channelName: string; channelName: string;
members?: number;
selected?: boolean; selected?: boolean;
}; };