Add latest changes from gitlab-org/gitlab@master

5 files changed, 123 insertions, 42 deletions

diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/command_autocomplete_item_spec.js.snap b/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/command_autocomplete_item_spec.js.snap
new file mode 100644
index 00000000000..3c52cc195db
--- /dev/null
+++ b/spec/frontend/super_sidebar/components/global_search/command_palette/__snapshots__/command_autocomplete_item_spec.js.snap
@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`CommandAutocompleteItem should render user item 1`] = `
+<div
+  class="gl-display-flex gl-align-items-center"
+>
+  <gl-icon-stub
+    class="gl-mr-3"
+    name="users"
+    size="16"
+  />
+   
+  <span
+    class="gl-text-gray-900"
+  >
+    Manage &gt; Activity
+  </span>
+</div>
+`;
diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/command_autocomplete_item_spec.js b/spec/frontend/super_sidebar/components/global_search/command_palette/command_autocomplete_item_spec.js
new file mode 100644
index 00000000000..2597812acaf
--- /dev/null
+++ b/spec/frontend/super_sidebar/components/global_search/command_palette/command_autocomplete_item_spec.js
@@ -0,0 +1,25 @@
+import { shallowMount } from '@vue/test-utils';
+import CommandAutocompleteItem from '~/super_sidebar/components/global_search/command_palette/command_autocomplete_item.vue';
+import { linksReducer } from '~/super_sidebar/components/global_search/command_palette/utils';
+import { LINKS } from './mock_data';
+
+describe('CommandAutocompleteItem', () => {
+  let wrapper;
+
+  const createComponent = () => {
+    wrapper = shallowMount(CommandAutocompleteItem, {
+      propsData: {
+        command: LINKS.reduce(linksReducer, [])[1],
+        searchQuery: 'root',
+      },
+    });
+  };
+
+  beforeEach(() => {
+    createComponent();
+  });
+
+  it('should render user item', () => {
+    expect(wrapper.element).toMatchSnapshot();
+  });
+});
diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/command_palette_items_spec.js b/spec/frontend/super_sidebar/components/global_search/command_palette/command_palette_items_spec.js
index df5b7de78f7..bd1e0dbc15d 100644
--- a/spec/frontend/super_sidebar/components/global_search/command_palette/command_palette_items_spec.js
+++ b/spec/frontend/super_sidebar/components/global_search/command_palette/command_palette_items_spec.js
@@ -5,21 +5,19 @@ import MockAdapter from 'axios-mock-adapter';
 import CommandPaletteItems from '~/super_sidebar/components/global_search/command_palette/command_palette_items.vue';
 import {
   COMMAND_HANDLE,
-  COMMANDS_GROUP_TITLE,
   USERS_GROUP_TITLE,
   USER_HANDLE,
 } from '~/super_sidebar/components/global_search/command_palette/constants';
-import { userMapper } from '~/super_sidebar/components/global_search/command_palette/utils';
+import {
+  userMapper,
+  linksReducer,
+} from '~/super_sidebar/components/global_search/command_palette/utils';
 import axios from '~/lib/utils/axios_utils';
 import { HTTP_STATUS_OK } from '~/lib/utils/http_status';
 import waitForPromises from 'helpers/wait_for_promises';
-import { COMMANDS, USERS } from './mock_data';
+import { COMMANDS, LINKS, USERS } from './mock_data';
 
-const commands = COMMANDS.map(({ text, href, keywords }) => ({
-  text,
-  href,
-  keywords: keywords.join(''),
-}));
+const links = LINKS.reduce(linksReducer, []);
 
 describe('CommandPaletteItems', () => {
   let wrapper;
@@ -36,7 +34,8 @@ describe('CommandPaletteItems', () => {
         GlDisclosureDropdownItem,
       },
       provide: {
-        commandPaletteData: COMMANDS,
+        commandPaletteCommands: COMMANDS,
+        commandPaletteLinks: LINKS,
       },
     });
   };
@@ -45,24 +44,31 @@ describe('CommandPaletteItems', () => {
   const findGroup = () => wrapper.findComponent(GlDisclosureDropdownGroup);
   const findLoader = () => wrapper.findComponent(GlLoadingIcon);
 
-  describe('COMMANDS', () => {
+  describe('COMMANDS & LINKS', () => {
     it('renders all commands initially', () => {
       createComponent();
-      expect(findItems()).toHaveLength(COMMANDS.length);
+      const commandGroup = COMMANDS[0];
+      expect(findItems()).toHaveLength(commandGroup.items.length);
       expect(findGroup().props('group')).toEqual({
-        name: COMMANDS_GROUP_TITLE,
-        items: commands,
+        name: commandGroup.name,
+        items: commandGroup.items,
       });
     });
 
     describe('with search query', () => {
-      it('should filter by the search query', async () => {
+      it('should filter comamnds and links by the search query', async () => {
         jest.spyOn(fuzzaldrinPlus, 'filter');
         createComponent({ searchQuery: 'mr' });
         const searchQuery = 'todo';
         await wrapper.setProps({ searchQuery });
+        const commandGroup = COMMANDS[0];
+        expect(fuzzaldrinPlus.filter).toHaveBeenCalledWith(
+          commandGroup.items,
+          searchQuery,
+          expect.objectContaining({ key: 'text' }),
+        );
         expect(fuzzaldrinPlus.filter).toHaveBeenCalledWith(
-          commands,
+          links,
           searchQuery,
           expect.objectContaining({ key: 'keywords' }),
         );
diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/mock_data.js b/spec/frontend/super_sidebar/components/global_search/command_palette/mock_data.js
index e924efd56af..726339f56a1 100644
--- a/spec/frontend/super_sidebar/components/global_search/command_palette/mock_data.js
+++ b/spec/frontend/super_sidebar/components/global_search/command_palette/mock_data.js
@@ -1,18 +1,63 @@
 export const COMMANDS = [
   {
-    text: 'New project/repository',
-    href: '/projects/new',
-    keywords: ['new', 'project', 'repository'],
-  },
-  {
-    text: 'New group',
-    href: '/groups/new',
-    keywords: ['new', 'group'],
+    name: 'Global',
+    items: [
+      {
+        text: 'New project/repository',
+        href: '/projects/new',
+        keywords: ['new', 'project', 'repository'],
+      },
+      {
+        text: 'New group',
+        href: '/groups/new',
+        keywords: ['new', 'group'],
+      },
+      {
+        text: 'New snippet',
+        href: '/-/snippets/new',
+        keywords: ['new', 'snippet'],
+      },
+    ],
   },
+];
+
+export const LINKS = [
   {
-    text: 'New snippet',
-    href: '/-/snippets/new',
-    keywords: ['new', 'snippet'],
+    title: 'Manage',
+    icon: 'users',
+    link: '/flightjs/Flight/activity',
+    is_active: false,
+    pill_count: null,
+    items: [
+      {
+        id: 'activity',
+        title: 'Activity',
+        icon: null,
+        link: '/flightjs/Flight/activity',
+        pill_count: null,
+        link_classes: 'shortcuts-project-activity',
+        is_active: false,
+      },
+      {
+        id: 'members',
+        title: 'Members',
+        icon: null,
+        link: '/flightjs/Flight/-/project_members',
+        pill_count: null,
+        link_classes: null,
+        is_active: false,
+      },
+      {
+        id: 'labels',
+        title: 'Labels',
+        icon: null,
+        link: '/flightjs/Flight/-/labels',
+        pill_count: null,
+        link_classes: null,
+        is_active: false,
+      },
+    ],
+    separated: false,
   },
 ];
 
diff --git a/spec/frontend/super_sidebar/components/global_search/command_palette/utils_spec.js b/spec/frontend/super_sidebar/components/global_search/command_palette/utils_spec.js
index 5bcf5e95793..74a5247add5 100644
--- a/spec/frontend/super_sidebar/components/global_search/command_palette/utils_spec.js
+++ b/spec/frontend/super_sidebar/components/global_search/command_palette/utils_spec.js
@@ -1,8 +1,5 @@
-import {
-  userMapper,
-  commandMapper,
-} from '~/super_sidebar/components/global_search/command_palette/utils';
-import { COMMANDS, USERS } from './mock_data';
+import { userMapper } from '~/super_sidebar/components/global_search/command_palette/utils';
+import { USERS } from './mock_data';
 
 describe('userMapper', () => {
   it('should transform users response', () => {
@@ -16,14 +13,3 @@ describe('userMapper', () => {
     });
   });
 });
-
-describe('commandMapper', () => {
-  it('should transform commands response', () => {
-    const command = COMMANDS[0];
-    expect(commandMapper(command)).toEqual({
-      href: command.href,
-      text: command.text,
-      keywords: command.keywords.join(''),
-    });
-  });
-});