Implemented trusted app name truncation. (#79976) (#79983)

Author: efreeti

x-pack/plugins/security_solution/common/endpoint/schema/trusted_apps.ts

@@ -35,7 +35,7 @@ export const GetTrustedAppsRequestSchema = {
 
 export const PostTrustedAppCreateRequestSchema = {
   body: schema.object({
-    name: schema.string({ minLength: 1 }),
+    name: schema.string({ minLength: 1, maxLength: 256 }),
     description: schema.maybe(schema.string({ minLength: 0, maxLength: 256, defaultValue: '' })),
     os: schema.oneOf([schema.literal('linux'), schema.literal('macos'), schema.literal('windows')]),
     entries: schema.arrayOf(

x-pack/plugins/security_solution/public/management/pages/trusted_apps/test_utils/index.ts

@@ -33,29 +33,39 @@ import { TrustedAppsListResourceStateChanged } from '../store/action';
 
 const OS_LIST: Array<TrustedApp['os']> = ['windows', 'macos', 'linux'];
 
-export const createSampleTrustedApp = (i: number): TrustedApp => {
+const generate = <T>(count: number, generator: (i: number) => T) =>
+  [...new Array(count).keys()].map(generator);
+
+export const createSampleTrustedApp = (i: number, longTexts?: boolean): TrustedApp => {
   return {
     id: String(i),
-    name: `trusted app ${i}`,
-    description: `Trusted App ${i}`,
+    name: generate(longTexts ? 10 : 1, () => `trusted app ${i}`).join(' '),
+    description: generate(longTexts ? 10 : 1, () => `Trusted App ${i}`).join(' '),
     created_at: '1 minute ago',
     created_by: 'someone',
     os: OS_LIST[i % 3],
     entries: [],
   };
 };
 
-export const createSampleTrustedApps = (pagination: Partial<Pagination>): TrustedApp[] => {
+export const createSampleTrustedApps = (
+  pagination: Partial<Pagination>,
+  longTexts?: boolean
+): TrustedApp[] => {
   const fullPagination = { ...createDefaultPagination(), ...pagination };
 
-  return [...new Array(fullPagination.pageSize).keys()].map(createSampleTrustedApp);
+  return generate(fullPagination.pageSize, (i: number) => createSampleTrustedApp(i, longTexts));
 };
 
-export const createTrustedAppsListData = (pagination: Partial<Pagination>, timestamp: number) => {
+export const createTrustedAppsListData = (
+  pagination: Partial<Pagination>,
+  timestamp: number,
+  longTexts?: boolean
+) => {
   const fullPagination = { ...createDefaultPagination(), ...pagination };
 
   return {
-    items: createSampleTrustedApps(fullPagination),
+    items: createSampleTrustedApps(fullPagination, longTexts),
     pageSize: fullPagination.pageSize,
     pageIndex: fullPagination.pageIndex,
     totalItemsCount: fullPagination.totalItemCount,
@@ -75,10 +85,11 @@ export const createUninitialisedResourceState = (): UninitialisedResourceState =
 
 export const createListLoadedResourceState = (
   pagination: Partial<Pagination>,
-  timestamp: number
+  timestamp: number,
+  longTexts?: boolean
 ): LoadedResourceState<TrustedAppsListData> => ({
   type: 'LoadedResourceState',
-  data: createTrustedAppsListData(pagination, timestamp),
+  data: createTrustedAppsListData(pagination, timestamp, longTexts),
 });
 
 export const createListFailedResourceState = (

x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/create_trusted_app_form.tsx

@@ -361,6 +361,7 @@ export const CreateTrustedAppForm = memo<CreateTrustedAppFormProps>(
             onBlur={handleDomBlurEvents}
             fullWidth
             required
+            maxLength={256}
             data-test-subj={getTestId('nameTextField')}
           />
         </EuiFormRow>

x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_app_card/__snapshots__/index.test.tsx.snap

@@ -53,11 +53,10 @@ storiesOf('TrustedApps/TrustedAppCard', module)
 
     return <TrustedAppCard trustedApp={trustedApp} onDelete={action('onClick')} />;
   })
-  .add('trim description', () => {
-    const trustedApp: TrustedApp = createSampleTrustedApp(5);
+  .add('longs texts', () => {
+    const trustedApp: TrustedApp = createSampleTrustedApp(5, true);
     trustedApp.created_at = '2020-09-17T14:52:33.899Z';
     trustedApp.entries = [PATH_CONDITION, SIGNER_CONDITION];
-    trustedApp.description = [...new Array(40).keys()].map((index) => `item${index}`).join(' ');
 
     return <TrustedAppCard trustedApp={trustedApp} onDelete={action('onClick')} />;
   });

x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_app_card/index.stories.tsx

@@ -19,12 +19,10 @@ describe('trusted_app_card', () => {
       expect(element).toMatchSnapshot();
     });
 
-    it('should trim long descriptions', () => {
-      const trustedApp = {
-        ...createSampleTrustedApp(4),
-        description: [...new Array(40).keys()].map((index) => `item${index}`).join(' '),
-      };
-      const element = shallow(<TrustedAppCard trustedApp={trustedApp} onDelete={() => {}} />);
+    it('should trim long texts', () => {
+      const element = shallow(
+        <TrustedAppCard trustedApp={createSampleTrustedApp(4, true)} onDelete={() => {}} />
+      );
 
       expect(element).toMatchSnapshot();
     });

x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_app_card/index.test.tsx

@@ -84,7 +84,11 @@ export const TrustedAppCard = memo(({ trustedApp, onDelete }: TrustedAppCardProp
 
   return (
     <ItemDetailsCard>
-      <ItemDetailsPropertySummary name={PROPERTY_TITLES.name} value={trustedApp.name} />
+      <ItemDetailsPropertySummary
+        name={PROPERTY_TITLES.name}
+        value={useMemo(() => trimTextOverflow(trustedApp.name || '', 100), [trustedApp.name])}
+        title={trustedApp.name}
+      />
       <ItemDetailsPropertySummary name={PROPERTY_TITLES.os} value={OS_TITLES[trustedApp.os]} />
       <ItemDetailsPropertySummary
         name={PROPERTY_TITLES.created_at}