fix(FilterBar/ObjectPage): add toolbar for making action bars respons…

…ive (#546) Closes #533
SAP · May 29, 2020 · bb0d9d4 · bb0d9d4
1 parent 7230d8e
commit bb0d9d4
Show file tree

Hide file tree

Showing 14 changed files with 553 additions and 370 deletions.
diff --git a/packages/main/src/components/FilterBar/FilterBar.jss.ts b/packages/main/src/components/FilterBar/FilterBar.jss.ts
@@ -18,10 +18,6 @@ const styles = {
     boxShadow: 'none',
     flexWrap: 'wrap'
   },
-  vLine: {
-    borderLeft: '1px solid gray',
-    paddingLeft: '0.5rem'
-  },
   filterArea: {
     display: 'flex',
     flexWrap: 'wrap',

diff --git a/packages/main/src/components/FilterBar/FilterBar.test.tsx b/packages/main/src/components/FilterBar/FilterBar.test.tsx
@@ -12,6 +12,7 @@ import { Select } from '@ui5/webcomponents-react/lib/Select';
 import { Switch } from '@ui5/webcomponents-react/lib/Switch';
 import { VariantManagement } from '@ui5/webcomponents-react/lib/VariantManagement';
 import { MultiComboBoxItem } from '@ui5/webcomponents-react/lib/MultiComboBoxItem';
+import { Toolbar } from '@ui5/webcomponents-react/lib/Toolbar';
 import { mount } from 'enzyme';
 import React from 'react';
 import { act } from 'react-dom/test-utils';
@@ -198,7 +199,8 @@ describe('FilterBar', () => {
         </FilterGroupItem>
       </FilterBar>
     );
-    const openFiltersDialogBtn = wrapper.find('.FilterBar-headerRowRight-0-2-7').childAt(3);
+    const openFiltersDialogBtn = wrapper.find(Toolbar).find(Button).at(5);
+
     act(() => {
       openFiltersDialogBtn.prop('onClick')();
     });
@@ -266,7 +268,7 @@ describe('FilterBar', () => {
     );
 
     const filterItemsFB = wrapper.find(FilterGroupItem);
-    const openFiltersDialogBtn = wrapper.find('.FilterBar-headerRowRight-0-2-7').childAt(3);
+    const openFiltersDialogBtn = wrapper.find(Toolbar).find(Button).at(3);
     act(() => {
       openFiltersDialogBtn.prop('onClick')();
     });