User traits editor UI

lib/web/users.go

@@ -169,7 +169,13 @@ func updateUser(r *http.Request, m userAPIGetter) (*ui.User, error) {
 
 	user.SetRoles(req.Roles)
 
-	updateUserTraits(req, user)
+	// we do not want situation where one trait set (allTraits)
+	// overrides another (traits).
+	if len(req.AllTraits) > 0 {
+		user.SetTraits(req.AllTraits)
+	} else {
+		updateUserTraits(req, user)
+	}
 
 	updated, err := m.UpdateUser(r.Context(), user)
 	if err != nil {
@@ -305,9 +311,10 @@ type userTraits struct {
 // - if the value is an empty array we remove every element from the trait
 // - otherwise, we replace the list for that trait
 type saveUserRequest struct {
-	Name   string     `json:"name"`
-	Roles  []string   `json:"roles"`
-	Traits userTraits `json:"traits"`
+	Name      string              `json:"name"`
+	Roles     []string            `json:"roles"`
+	Traits    userTraits          `json:"traits"`
+	AllTraits map[string][]string `json:"allTraits"`
 }
 
 func (r *saveUserRequest) checkAndSetDefaults() error {

web/packages/shared/components/Validation/rules.ts

@@ -194,6 +194,34 @@ const requiredEmailLike: Rule<string, EmailValidationResult> = email => () => {
   };
 };
 
+/**
+ * A rule function that combines multiple inner rule functions. All rules must
+ * return `valid`, otherwise it returns a comma separated string containing all
+ * invalid rule messages.
+ * @param rules a list of rule functions to apply
+ * @returns a rule function that ANDs all input rules
+ */
+const requiredAll =
+  <T>(...rules: Rule<T | string | string[], ValidationResult>[]): Rule<T> =>
+  (value: T) =>
+  () => {
+    let messages = [];
+    for (let r of rules) {
+      let result = r(value)();
+      if (!result.valid) {
+        messages.push(result.message);
+      }
+    }
+
+    if (messages.length > 0) {
+      return {
+        valid: false,
+        message: messages.join('. '),
+      };
+    }
+    return { valid: true };
+  };
+
 export {
   requiredToken,
   requiredPassword,
@@ -202,4 +230,5 @@ export {
   requiredRoleArn,
   requiredIamRoleName,
   requiredEmailLike,
+  requiredAll,
 };

web/packages/teleport/src/Users/UserAddEdit/TraitsEditor.test.tsx

@@ -0,0 +1,92 @@
+import React from 'react';
+import { fireEvent, render, screen } from 'design/utils/testing';
+
+import Validation from 'shared/components/Validation';
+
+import { AllUserTraits } from 'teleport/services/user';
+
+import { TraitsEditor, traitsToTraitsOption, emptyTrait } from './TraitsEditor';
+
+import type { TraitsOption } from './TraitsEditor';
+
+describe('Render traits correctly', () => {
+  const userTraits = {
+    logins: ['root', 'ubuntu'],
+    db_roles: ['dbadmin', 'postgres'],
+    db_names: ['postgres', 'aurora'],
+  } as AllUserTraits;
+
+  test('Avalable traits are rendered', async () => {
+    let configuredTraits = [] as TraitsOption[];
+
+    const setConfiguredTraits = jest.fn();
+
+    const { rerender } = render(
+      <TraitsEditor
+        allTraits={userTraits}
+        attempt={{ status: '' }}
+        configuredTraits={configuredTraits}
+        setConfiguredTraits={setConfiguredTraits}
+      />
+    );
+
+    expect(screen.getByText('User Traits')).toBeInTheDocument();
+
+    expect(setConfiguredTraits).toHaveBeenLastCalledWith(
+      traitsToTraitsOption(userTraits)
+    );
+
+    rerender(
+      <Validation>
+        <TraitsEditor
+          allTraits={userTraits}
+          attempt={{ status: '' }}
+          configuredTraits={traitsToTraitsOption(userTraits)}
+          setConfiguredTraits={setConfiguredTraits}
+        />
+      </Validation>
+    );
+    expect(screen.getAllByTestId('trait-key')).toHaveLength(3);
+    expect(screen.getAllByTestId('trait-value')).toHaveLength(3);
+  });
+
+  test('Add and remove Trait', async () => {
+    const userTraits = {} as AllUserTraits;
+
+    let configuredTraits = [] as TraitsOption[];
+
+    const setConfiguredTraits = jest.fn();
+
+    const { rerender } = render(
+      <Validation>
+        <TraitsEditor
+          allTraits={userTraits}
+          attempt={{ status: '' }}
+          configuredTraits={configuredTraits}
+          setConfiguredTraits={setConfiguredTraits}
+        />
+      </Validation>
+    );
+    expect(screen.queryAllByTestId('trait-key')).toHaveLength(0);
+
+    const addButtonEl = screen.getByRole('button', { name: /Add user trait/i });
+    expect(addButtonEl).toBeInTheDocument();
+    fireEvent.click(addButtonEl);
+
+    expect(setConfiguredTraits).toHaveBeenLastCalledWith([emptyTrait]);
+
+    const singleTrait = { logins: ['root', 'ubuntu'] };
+    rerender(
+      <Validation>
+        <TraitsEditor
+          allTraits={singleTrait}
+          attempt={{ status: '' }}
+          configuredTraits={traitsToTraitsOption(singleTrait)}
+          setConfiguredTraits={setConfiguredTraits}
+        />
+      </Validation>
+    );
+    fireEvent.click(screen.getByTitle('Remove Trait'));
+    expect(setConfiguredTraits).toHaveBeenCalledWith([]);
+  });
+});