diff --git a/frontend/src/components/tables/UsersTable.jsx b/frontend/src/components/tables/UsersTable.jsx
index 467423dc..fb6fdb7c 100644
--- a/frontend/src/components/tables/UsersTable.jsx
+++ b/frontend/src/components/tables/UsersTable.jsx
@@ -2,6 +2,7 @@ import React, { useMemo, useCallback, useState } from 'react';
import API from '../../api';
import UserForm from '../forms/User';
import useUsersStore from '../../store/users';
+import useChannelsStore from '../../store/channels';
import useAuthStore from '../../store/auth';
import { USER_LEVELS, USER_LEVEL_LABELS } from '../../constants';
import useWarningsStore from '../../store/warnings';
@@ -26,6 +27,7 @@ import {
UnstyledButton,
LoadingOverlay,
Stack,
+ Badge,
} from '@mantine/core';
import { CustomTable, useTable } from './CustomTable';
import ConfirmationDialog from '../ConfirmationDialog';
@@ -83,6 +85,7 @@ const UsersTable = () => {
* STORES
*/
const users = useUsersStore((s) => s.users);
+ const profiles = useChannelsStore((s) => s.profiles);
const authUser = useAuthStore((s) => s.user);
const isWarningSuppressed = useWarningsStore((s) => s.isWarningSuppressed);
const suppressWarning = useWarningsStore((s) => s.suppressWarning);
@@ -144,6 +147,15 @@ const UsersTable = () => {
/**
* useMemo
*/
+ // Create a profile ID to name lookup map for efficient rendering
+ const profileIdToName = useMemo(() => {
+ const map = {};
+ Object.values(profiles).forEach((profile) => {
+ map[profile.id] = profile.name;
+ });
+ return map;
+ }, [profiles]);
+
const columns = useMemo(
() => [
{
@@ -265,6 +277,37 @@ const UsersTable = () => {
);
},
},
+ {
+ header: 'Channel Profiles',
+ accessorKey: 'channel_profiles',
+ grow: true,
+ cell: ({ getValue }) => {
+ const userProfiles = getValue() || [];
+ const profileNames = userProfiles
+ .map((id) => profileIdToName[id])
+ .filter(Boolean); // Filter out any undefined values
+ return (
+
+ {profileNames.length > 0 ? (
+ profileNames.map((name, index) => (
+
+ {name}
+
+ ))
+ ) : (
+
+ All
+
+ )}
+
+ );
+ },
+ },
{
id: 'actions',
size: 80,
@@ -280,7 +323,7 @@ const UsersTable = () => {
),
},
],
- [theme, editUser, deleteUser, visiblePasswords, togglePasswordVisibility]
+ [theme, editUser, deleteUser, visiblePasswords, togglePasswordVisibility, profileIdToName]
);
const closeUserForm = () => {
@@ -319,6 +362,7 @@ const UsersTable = () => {
user_level: renderHeaderCell,
last_login: renderHeaderCell,
date_joined: renderHeaderCell,
+ channel_profiles: renderHeaderCell,
custom_properties: renderHeaderCell,
},
});
@@ -333,7 +377,7 @@ const UsersTable = () => {
minHeight: '100vh',
}}
>
-
+