Merge pull request #3599 from huridocs/3186-remove-fabs

Remove unwanted FABs
huridocs · Apr 20, 2021 · 32f33ec · 32f33ec
2 parents 39462c1 + 62cc0e7
commit 32f33ec
Show file tree

Hide file tree

Showing 4 changed files with 105 additions and 71 deletions.
diff --git a/app/react/App/scss/layout/_sidepanel.scss b/app/react/App/scss/layout/_sidepanel.scss
@@ -300,6 +300,35 @@ $c-sidebar: $c-white;
   line-height: 50px;
   height: 50px;
   border-bottom: 1px solid #d7d7dc;
+  display: flex;
+  flex-flow: row nowrap;
+
+  div:nth-child(1) {
+    width: 65%;
+  }
+  div:nth-child(2) {
+    width: 35%
+  }
+  .filter-buttons {
+
+    .clear-button {
+      text-decoration: none;
+      letter-spacing: normal;
+      font-weight: normal;
+      display: inline;
+      text-transform: capitalize;
+      border: 1px solid rgb(204, 204, 204);
+      padding: 3px;
+      cursor: pointer;
+      border-radius: 2px;
+    }
+
+    @media(min-width: 1020px) {
+      .push-right {
+        margin-left: 30px;
+      }
+    }
+  }
 }
 
 .item.readOnly {

diff --git a/app/react/Library/components/LibraryFilters.js b/app/react/Library/components/LibraryFilters.js
@@ -34,34 +34,33 @@ export class LibraryFilters extends Component {
     return (
       <SidePanel className="library-filters" mode={this.props.sidePanelMode} open={this.props.open}>
         <div className="sidepanel-footer">
-          <button
-            type="button"
-            onClick={this.reset.bind(this)}
-            className="btn btn-primary resetFilters"
-          >
-            <Icon icon="sync" />
-            <span className="btn-label">{t('System', 'Reset')}</span>
-          </button>
-          <button type="submit" form="filtersForm" className="btn btn-success">
-            <Icon icon="search" />
-            <span className="btn-label">{t('System', 'Search')}</span>
-          </button>
           <Export storeKey={this.props.storeKey} />
         </div>
         <div className="sidepanel-body">
-          <p className="sidepanel-title">
-            {t('System', 'Filters configuration')}
-            <button
-              type="button"
-              className={`closeSidepanel ${
-                this.props.sidePanelMode === 'unpinned-mode' ? '' : 'only-mobile'
-              }`}
-              onClick={this.props.hideFilters}
-              aria-label="Close side panel"
-            >
-              <Icon icon="times" />
-            </button>
-          </p>
+          <div className="sidepanel-title">
+            <div>{t('System', 'Filters configuration')}</div>
+            <div className="filter-buttons">
+              <div
+                className={`clear-button ${
+                  this.props.sidePanelMode === 'unpinned-mode' ? '' : 'push-right'
+                }`}
+                onClick={this.reset.bind(this)}
+              >
+                <Icon icon="times" />
+                &nbsp;Clear Filters
+              </div>
+              <button
+                type="button"
+                className={`closeSidepanel ${
+                  this.props.sidePanelMode === 'unpinned-mode' ? '' : 'only-mobile'
+                }`}
+                onClick={this.props.hideFilters}
+                aria-label="Close side panel"
+              >
+                <Icon icon="times" />
+              </button>
+            </div>
+          </div>
           <NeedAuthorization>
             {!this.props.unpublished && (
               <Field

diff --git a/nightmare/helpers/selectors.js b/nightmare/helpers/selectors.js
@@ -161,11 +161,11 @@ export default {
     documentAfterLoadMore:
       '#app > div.content > div > div > div > main > div > div > div.item-group > div:nth-child(31)',
     superVillianType:
-      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-body > div.documentTypes-selector.nested-selector > ul > li:nth-child(2) > label',
+      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-body > div > ul > li:nth-child(2) > label',
     minorVillianType:
-      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-body > div.documentTypes-selector.nested-selector > ul > li:nth-child(5) > label',
+      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-body > div > ul > li:nth-child(5) > label',
     resetFilters:
-      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-footer > .resetFilters',
+      '#app > div.content > div > div > div > aside.side-panel.library-filters > div.sidepanel-body > div.sidepanel-title > div.filter-buttons > div.clear-button',
     sidePanelCloseButton:
       '#app > div.content > div > div > div > aside.side-panel.metadata-sidepanel.is-active > div.sidepanel-header > button',
     sidePanelDocumentType:
@@ -285,7 +285,7 @@ export default {
     uploadsNavButton:
       '#app > div.content > header > ul > li.menuActions > ul > li:nth-child(2) > a',
     libraryNavButton:
-      '#app > div.content > header > ul > li.menuActions > ul > li:nth-child(1) > a',
+      '#app > div.content > header > ul > li.menuActions > ul.menuNav-list > li:nth-child(1) > a',
     settingsNavButton:
       '#app > div.content > header > ul > li.menuActions > ul.menuNav-list > li:nth-child(3) > a',
     spanish:

diff --git a/nightmare/suite2/translations.spec.js b/nightmare/suite2/translations.spec.js
@@ -12,63 +12,69 @@ describe('translations path', () => {
   afterAll(async () => nightmare.end());
 
   describe('login', () => {
-    it('should log in as admin then click the settings nav button', (done) => {
+    it('should log in as admin then click the settings nav button', done => {
       loginAsAdminAndGoToSettings(nightmare, catchErrors, done);
     });
   });
 
   describe('Translations tests', () => {
-    it('should click Translations button and then click on Test Document', (done) => {
+    it('should click Translations button and then click on Test Document', done => {
       nightmare
-      .waitToClick(selectors.settingsView.translationsButton)
-      .wait(selectors.settingsView.liElementsOfSection)
-      .manageItemFromList(selectors.settingsView.liElementsOfSection, 'Test Document', '.btn-default')
-      .wait(selectors.settingsView.translationsSaveButton)
-      .isVisible(selectors.settingsView.translationsSaveButton)
-      .then((result) => {
-        expect(result).toBe(true);
-        done();
-      })
-      .catch(catchErrors(done));
+        .waitToClick(selectors.settingsView.translationsButton)
+        .wait(selectors.settingsView.liElementsOfSection)
+        .manageItemFromList(
+          selectors.settingsView.liElementsOfSection,
+          'Test Document',
+          '.btn-default'
+        )
+        .wait(selectors.settingsView.translationsSaveButton)
+        .isVisible(selectors.settingsView.translationsSaveButton)
+        .then(result => {
+          expect(result).toBe(true);
+          done();
+        })
+        .catch(catchErrors(done));
     });
 
-    it('should change Test Document text to Document and Documento', (done) => {
+    it('should change Test Document text to Document and Documento', done => {
       nightmare
-      .clearInput(selectors.settingsView.translationInputEn)
-      .write(selectors.settingsView.translationInputEn, 'Document')
-      .clearInput(selectors.settingsView.translationInputEs)
-      .write(selectors.settingsView.translationInputEs, 'Documento')
-      .waitToClick(selectors.settingsView.translationsSaveButton)
-      .waitToClick('.alert.alert-success')
-      .then(() => { done(); })
-      .catch(catchErrors(done));
+        .clearInput(selectors.settingsView.translationInputEn)
+        .write(selectors.settingsView.translationInputEn, 'Document')
+        .clearInput(selectors.settingsView.translationInputEs)
+        .write(selectors.settingsView.translationInputEs, 'Documento')
+        .waitToClick(selectors.settingsView.translationsSaveButton)
+        .waitToClick('.alert.alert-success')
+        .then(() => {
+          done();
+        })
+        .catch(catchErrors(done));
     });
 
-    it('should go to library and check the translation in spanish', (done) => {
+    it('should go to library and check the translation in spanish', done => {
       nightmare
-      .waitToClick(selectors.navigation.libraryNavButton)
-      .waitToClick(selectors.navigation.spanish)
-      .wait(selectors.libraryView.documentTypeFilter)
-      .getInnerText(selectors.libraryView.documentTypeFilter)
-      .then((result) => {
-        expect(result).toBe('Documento');
-        done();
-      })
-      .catch(catchErrors(done));
+        .waitToClick(selectors.navigation.libraryNavButton)
+        .waitToClick(selectors.navigation.spanish)
+        .wait(selectors.libraryView.documentTypeFilter)
+        .getInnerText(selectors.libraryView.documentTypeFilter)
+        .then(result => {
+          expect(result).toBe('Documento');
+          done();
+        })
+        .catch(catchErrors(done));
     });
 
-    it('should go to library and check the translation in english', (done) => {
+    it('should go to library and check the translation in english', done => {
       nightmare
-      .waitToClick(selectors.navigation.libraryNavButton)
-      .waitToClick(selectors.navigation.english)
-      .wait(selectors.libraryView.documentTypeFilter)
-      .wait(selectors.libraryView.documentTypeFilter)
-      .getInnerText(selectors.libraryView.documentTypeFilter)
-      .then((result) => {
-        expect(result).toBe('Document');
-        done();
-      })
-      .catch(catchErrors(done));
+        .waitToClick(selectors.navigation.libraryNavButton)
+        .waitToClick(selectors.navigation.english)
+        .wait(selectors.libraryView.documentTypeFilter)
+        .wait(selectors.libraryView.documentTypeFilter)
+        .getInnerText(selectors.libraryView.documentTypeFilter)
+        .then(result => {
+          expect(result).toBe('Document');
+          done();
+        })
+        .catch(catchErrors(done));
     });
   });
 });