Role-restricted API keys

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.45.2",
+  "version": "7.45.3-fb-role-restricted-api-keys.2",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

packages/components/releaseNotes/components.md

@@ -1,6 +1,10 @@
 # @labkey/components
 Components, models, actions, and utility functions for LabKey applications and pages
 
+### version 7.45.3
+*Released*: TBD
+- Add role restriction option to API key dialog
+
 ### version 7.45.2
 *Released*: 29 June 2026
 - GitHub Issue #1023: Add redirect() helper that uses core-safeRedirect when necessary to check url before redirecting

packages/components/src/internal/components/security/APIWrapper.ts

@@ -56,6 +56,11 @@ export interface RemoveGroupMembersResponse {
     removed: number[];
 }
 
+export interface ApiKeyRole {
+    displayName: string;
+    uniqueName: string;
+}
+
 export interface AuthenticationConfiguration {
     description: string;
     reauthUrl: string;
@@ -68,7 +73,8 @@ interface AuthenticationConfigurationResponse {
 
 export interface SecurityAPIWrapper {
     addGroupMembers: (groupId: number, principalIds: number[], projectPath: string) => Promise<AddGroupMembersResponse>;
-    createApiKey: (type?: string, description?: string) => Promise<string>;
+    createApiKey: (type?: string, description?: string, role?: string) => Promise<string>;
+    getApiKeyRoles: () => Promise<ApiKeyRole[]>;
     createGroup: (groupName: string, projectPath: string) => Promise<Security.CreateGroupResponse>;
     deleteApiKeys: (selections: Set<string>) => Promise<QueryCommandResponse>;
     deleteContainer: (options: DeleteContainerOptions) => Promise<Record<string, unknown>>;
@@ -133,17 +139,24 @@ export class ServerSecurityAPIWrapper implements SecurityAPIWrapper {
         });
     };
 
-    createApiKey = async (type = 'apikey', description?: string): Promise<string> => {
+    createApiKey = async (type = 'apikey', description?: string, role?: string): Promise<string> => {
         const response = await request<{ apikey: string }>({
             url: ActionURL.buildURL('security', 'createApiKey.api'),
             method: 'POST',
-            jsonData: { type, description },
+            jsonData: { type, description, role },
             errorLogMsg: 'Problem generating the apiKey for this user.',
         });
 
         return response.apikey;
     };
 
+    getApiKeyRoles = (): Promise<ApiKeyRole[]> => {
+        return request<ApiKeyRole[]>({
+            url: ActionURL.buildURL('security', 'getApiKeyRoles.api'),
+            errorLogMsg: 'Failed to load API key roles.',
+        });
+    };
+
     deleteApiKeys(selections: Set<string>): Promise<QueryCommandResponse> {
         const rows = [];
         selections.forEach(selection => {
@@ -453,6 +466,7 @@ export function getSecurityTestAPIWrapper(
     return {
         addGroupMembers: mockFn(),
         createApiKey: mockFn(),
+        getApiKeyRoles: mockFn(),
         deleteApiKeys: mockFn(),
         createGroup: mockFn(),
         deleteContainer: mockFn(),

packages/components/src/internal/components/user/APIKeysPanel.test.tsx

@@ -80,6 +80,7 @@ describe('KeyGeneratorModal', () => {
                     api: {
                         security: {
                             createApiKey: apiKeyFn,
+                            getApiKeyRoles: jest.fn().mockResolvedValue([]),
                         },
                     },
                 },

packages/components/src/internal/components/user/APIKeysPanel.tsx

@@ -31,6 +31,7 @@ import { GridPanel } from '../../../public/QueryModel/GridPanel';
 import { Modal } from '../../Modal';
 import { getHelpLink, HelpLink } from '../../util/helpLinks';
 import { biologicsIsPrimaryApp } from '../../app/products';
+import { ApiKeyRole } from '../security/APIWrapper';
 
 const API_KEYS_QUERY_HREF = ActionURL.buildURL('query', 'executeQuery.view', '/', {
     schemaName: 'core',
@@ -101,19 +102,21 @@ interface ModalProps extends KeyGeneratorProps {
 export const KeyGeneratorModal: FC<ModalProps> = props => {
     const { type, afterCreate, noun, onClose } = props;
     const [description, setDescription] = useState<string>();
+    const [role, setRole] = useState<string>();
+    const [roles, setRoles] = useState<ApiKeyRole[]>([]);
     const { api } = useAppContext<AppContext>();
     const [error, setError] = useState<boolean>(false);
     const [keyValue, setKeyValue] = useState<string>(undefined);
 
     const onGenerateKey = useCallback(async () => {
         try {
-            const key = await api.security.createApiKey(type, description);
+            const key = await api.security.createApiKey(type, description, role);
             setKeyValue(key);
             afterCreate?.();
         } catch (e) {
             setError(true);
         }
-    }, [api.security, type, afterCreate, description]);
+    }, [api.security, type, afterCreate, description, role]);
 
     useEffect(() => {
         (async () => {
@@ -123,6 +126,12 @@ export const KeyGeneratorModal: FC<ModalProps> = props => {
         })();
     }, [type, onGenerateKey]);
 
+    useEffect(() => {
+        if (type === 'apikey') {
+            api.security.getApiKeyRoles().then(setRoles).catch(() => {});
+        }
+    }, [api.security, type]);
+
     const onCopyKey = useCallback(() => {
         const handleCopy = (event: ClipboardEvent): void => {
             setCopyValue(event, keyValue);
@@ -137,6 +146,10 @@ export const KeyGeneratorModal: FC<ModalProps> = props => {
         setDescription(event.target.value);
     }, []);
 
+    const changeRole = useCallback((event: ChangeEvent<HTMLSelectElement>) => {
+        setRole(event.target.value || undefined);
+    }, []);
+
     return (
         <Modal
             title={noun}
@@ -157,6 +170,24 @@ export const KeyGeneratorModal: FC<ModalProps> = props => {
                         autoFocus
                         placeholder="Enter description of key usage (optional)"
                     />
+                    {roles.length > 0 && (
+                        <div className="top-padding">
+                            <label htmlFor="keyRole">Restrict Permissions</label>
+                            <select
+                                className="form-control"
+                                id="keyRole"
+                                onChange={changeRole}
+                                value={role ?? ''}
+                            >
+                                <option value="">No Restrictions</option>
+                                {roles.map(r => (
+                                    <option key={r.uniqueName} value={r.uniqueName}>
+                                        {r.displayName}
+                                    </option>
+                                ))}
+                            </select>
+                        </div>
+                    )}
                 </div>
             )}
             {!!keyValue && (