chore: fix some missing components

Talend · Oct 12, 2023 · f207ed3 · f207ed3
1 parent 557b309
commit f207ed3
Show file tree

Hide file tree

Showing 7 changed files with 36 additions and 82 deletions.
diff --git a/packages/design-system/src/components/Dropdown/Dropdown.tsx b/packages/design-system/src/components/Dropdown/Dropdown.tsx
@@ -16,7 +16,7 @@ import DropdownDivider from './Primitive/DropdownDivider';
 import DropdownLink from './Primitive/DropdownLink';
 import DropdownShell from './Primitive/DropdownShell';
 import DropdownTitle from './Primitive/DropdownTitle';
-import MenuButton from './Primitive/MenuButton';
+import { DropdownButton } from './Primitive/DropdownButton';
 
 type DropdownButtonType = Omit<ClickableProps, 'children'> & {
 	label: string;
@@ -104,7 +104,7 @@ export const Dropdown = ({
 						const { label, ...entryRest } = entry;
 						const id = `${label}-${index}`;
 						return (
-							<MenuButton
+							<DropdownButton
 								{...entryRest}
 								// {...menu}
 								onClick={(event: MouseEvent<HTMLButtonElement> | KeyboardEvent) => {
@@ -118,7 +118,7 @@ export const Dropdown = ({
 								data-test={`${menuItemTest}.${id}`}
 							>
 								{label}
-							</MenuButton>
+							</DropdownButton>
 						);
 					}
 

diff --git a/...ponents/Dropdown/Primitive/MenuButton.tsx → ...nts/Dropdown/Primitive/DropdownButton.tsx b/...ponents/Dropdown/Primitive/MenuButton.tsx → ...nts/Dropdown/Primitive/DropdownButton.tsx
@@ -9,12 +9,12 @@ import { getIconWithDeprecatedSupport } from '../../Icon/DeprecatedIconHelper';
 
 import styles from './DropdownEntry.module.scss';
 
-export type MenuButtonType = ClickableProps & /*MenuItemProps &*/ {
+export type DropdownButtonType = ClickableProps & /*MenuItemProps &*/ {
 	icon?: DeprecatedIconNames | IconNameWithSize<'M'>;
 };
 
-const MenuButton = forwardRef(
-	({ children, icon, ...props }: MenuButtonType, ref: Ref<HTMLButtonElement>) => {
+export const DropdownButton = forwardRef(
+	({ children, icon, ...props }: DropdownButtonType, ref: Ref<HTMLButtonElement>) => {
 		return (
 			<Clickable {...props} ref={ref}>
 				<div className={styles.dropdownEntry}>
@@ -34,6 +34,4 @@ const MenuButton = forwardRef(
 	},
 );
 
-MenuButton.displayName = 'MenuButton';
-
-export default MenuButton;
+DropdownButton.displayName = 'DropdownButton';
diff --git a/packages/design-system/src/components/Dropdown/index.ts b/packages/design-system/src/components/Dropdown/index.ts
@@ -1 +1,2 @@
 export * from './Dropdown';
+export * from './Primitive/DropdownButton';
diff --git a/packages/faceted-search/src/components/Badges/BadgeMenu/BadgeMenuForm.component.js b/packages/faceted-search/src/components/Badges/BadgeMenu/BadgeMenuForm.component.js
@@ -143,5 +143,4 @@ BadgeMenuForm.propTypes = {
 	t: PropTypes.func.isRequired,
 };
 
-// eslint-disable-next-line import/prefer-default-export
 export { BadgeMenuForm };
diff --git a/packages/faceted-search/src/components/Badges/BadgeMenu/BadgeMenuForm.component.test.js b/packages/faceted-search/src/components/Badges/BadgeMenu/BadgeMenuForm.component.test.js
@@ -4,6 +4,8 @@ import userEvent from '@testing-library/user-event';
 import { BadgeMenuForm } from './BadgeMenuForm.component';
 import getDefaultT from '../../../translate';
 
+jest.unmock('@talend/design-system');
+
 const menuItems = [
 	{
 		id: 'item-one',

diff --git a/...aceted-search/src/components/BasicSearch/__snapshots__/BasicSearch.component.test.js.snap b/...aceted-search/src/components/BasicSearch/__snapshots__/BasicSearch.component.test.js.snap
@@ -126,80 +126,34 @@ exports[`BasicSearch should render the default html output with no badges 1`] =
     <div
       class="tc-basic-search-content-popover theme-tc-basic-search-content-popover"
     >
-      <div
-        class="tc-add-facet-popover theme-tc-add-facet-popover"
-        id="manager-id-basic-search-add-facet-popover"
+      <button
+        aria-busy="false"
+        aria-expanded="false"
+        aria-haspopup="dialog"
+        class="theme-clickable theme-button theme-secondary theme-size-S"
+        data-feature="filter.basic.add"
+        type="button"
       >
-        <div
-          class="tc-add-facet-popover-container theme-tc-add-facet-popover-container"
-          id="manager-id-basic-search-add-facet-popover"
+        <span
+          class="theme-stack theme-justify-start theme-align-center theme-nowrap theme-row theme-block theme-gap-x-XS theme-gap-y-XS"
         >
-          <div>
-            <header
-              class="theme-header tc-tooltip-header tc-add-facet-popover-header theme-tc-add-facet-popover-header"
-              id="manager-id-basic-search-add-facet-popover-null-header"
-            >
-              <form
-                class="theme-filter tc-add-facet-popover-filter theme-tc-add-facet-popover-filter theme-navbar"
-                role="search"
-              >
-                <div
-                  class="form-group"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="tc-svg-icon tc-icon theme-svg theme-search-icon tc-icon-name-talend-search"
-                    focusable="false"
-                    name="talend-search"
-                    pointer-events="none"
-                    shape-rendering="geometricPrecision"
-                  />
-                  <input
-                    aria-label="Find a filter"
-                    autocomplete="off"
-                    class="theme-search form-control"
-                    id="manager-id-basic-search-add-facet-popover-null-filter-input"
-                    name="search"
-                    placeholder="Find a filter"
-                    role="searchbox"
-                    type="search"
-                    value=""
-                  />
-                </div>
-              </form>
-            </header>
-            <div
-              class="theme-body tc-tooltip-body"
-              id="manager-id-basic-search-add-facet-popover-null-body"
+          Add filter
+          <span
+            class="theme-button__caret"
+          >
+            <svg
+              aria-hidden="true"
+              pointer-events="none"
+              shape-rendering="geometricPrecision"
+              style="width: 1.2rem; height: 1.2rem;"
             >
-              <div
-                class="theme-content tc-tooltip-content"
-                id="manager-id-basic-search-add-facet-popover-null-body-content"
-              >
-                <div
-                  class="tc-add-facet-popover-row-container theme-tc-add-facet-popover-row-container"
-                >
-                  <button
-                    class="tc-add-facet-popover-row-button theme-tc-add-facet-popover-row-button"
-                    id="manager-id-basic-search-add-facet-popover-row-button-Name"
-                    tabindex="0"
-                  >
-                    <div
-                      class="theme-stack theme-justify-start theme-align-start theme-nowrap theme-row theme-block theme-align-content-baseline theme-gap-x-S theme-gap-y-S"
-                    >
-                      <div
-                        class="theme-item theme-align-auto theme-overflow-auto theme-grow theme-shrink"
-                      >
-                        Name
-                      </div>
-                    </div>
-                  </button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
+              <use
+                xlink:href="#chevron-down:S"
+              />
+            </svg>
+          </span>
+        </span>
+      </button>
     </div>
   </div>
   <div

diff --git a/packages/faceted-search/src/helpers/usage.helpers.js b/packages/faceted-search/src/helpers/usage.helpers.js
@@ -1,5 +1,5 @@
-import { USAGE_TRACKING_TAGS } from '../constants';
 import { pick } from 'lodash';
+import { USAGE_TRACKING_TAGS } from '../constants';
 
 export const getApplyDataFeature = feature => {
 	const formatedFeature = feature.toLowerCase().replace(' ', '_');
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		export * from './Dropdown';
		export * from './Primitive/DropdownButton';