feat: Add responsive design for SelectedPrincipalsList and improve layout in GenericGrantAccessDialog

This commit is contained in:
Marco Beretta 2025-08-05 23:19:51 +02:00
parent f70a62793b
commit 2eb94c56a3
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
2 changed files with 7 additions and 2 deletions

View file

@ -336,6 +336,8 @@ export default function GenericGrantAccessDialog({
)}
</div>
<div className="flex border-t border-border-light" />
{/* Public Access Section */}
<PublicSharingToggle
isPublic={isPublic}

View file

@ -1,5 +1,5 @@
import React from 'react';
import { Button } from '@librechat/client';
import { Button, useMediaQuery } from '@librechat/client';
import { Users, X, ExternalLink } from 'lucide-react';
import type { TPrincipal, AccessRoleIds } from 'librechat-data-provider';
import { ResourceType } from 'librechat-data-provider';
@ -23,10 +23,13 @@ export default function SelectedPrincipalsList({
resourceType = ResourceType.AGENT,
}: SelectedPrincipalsListProps) {
const localize = useLocalize();
const isMobile = useMediaQuery('(max-width: 768px)');
const getPrincipalDisplayInfo = (principal: TPrincipal) => {
const displayName = principal.name || localize('com_ui_unknown');
const subtitle = principal.email || `${principal.type} (${principal.source || 'local'})`;
const subtitle = isMobile
? `${principal.type} (${principal.source || 'local'})`
: principal.email || `${principal.type} (${principal.source || 'local'})`;
return { displayName, subtitle };
};