Merge pull request #1311 from rocket-admin/saved-filters-notification

Saved filters notification

Author: lyubov-voloshko

frontend/src/app/app.component.ts

@@ -59,7 +59,7 @@ export class AppComponent {
   public isSaas = (environment as any).saas;
   userActivity;
   userInactive: Subject<any> = new Subject();
-  currentFeatureNotificationId: string = 'full-white-label';
+  currentFeatureNotificationId: string = 'saved-filters';
   isFeatureNotificationShown: boolean = false;
 
   userLoggedIn = null;

frontend/src/app/components/dashboard/db-table-view/saved-filters-panel/saved-filters-dialog/saved-filters-dialog.component.css

@@ -1,16 +1,10 @@
-.filters-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-top: 16px;
-}
-
 .filters-content {
     display: grid;
     grid-template-columns: auto 228px 0 1fr 160px 32px;
     grid-column-gap: 8px;
     align-content: flex-start;
     align-items: flex-start;
+    padding-top: 4px !important;
 }
 
 .filters-select {

frontend/src/app/components/dashboard/db-table-view/saved-filters-panel/saved-filters-dialog/saved-filters-dialog.component.html

@@ -1,32 +1,29 @@
 <form #tableFiltersForm="ngForm" (ngSubmit)="handleSaveFilters()" class="filters-form">
     <h1 mat-dialog-title class="filters-header">
-        <span>Save Filters for <strong>{{ data.displayTableName }}</strong> table</span>
-        <a mat-icon-button mat-dialog-close
-            routerLink="/dashboard/{{data.connectionID}}/{{data.tableName}}/settings"
-            matTooltip="Advanced settings">
-            <mat-icon>settings</mat-icon>
-        </a>
+        <span>New Fast Filter for <strong>{{ data.displayTableName }}</strong></span>
     </h1>
     <app-content-loader *ngIf="!fields || !tableTypes; else filterControls"></app-content-loader>
     <ng-template #filterControls>
         <mat-dialog-content class="filters-content">
             <!-- Filter Name and Description Fields -->
             <mat-form-field appearance="outline" class="full-width">
-                <mat-label>Filter Name</mat-label>
+                <mat-label>Fast Filter name</mat-label>
                 <input matInput required
                     name="filters_set_name"
                     [(ngModel)]="data.filtersSet.name">
                 <mat-error *ngIf="!data.filtersSet.name">
-                    Filter name is required
+                    Fast filter name is required
                 </mat-error>
             </mat-form-field>
 
-            <h3 class="section-title">Define Filters and Dynamic Column</h3>
-            <p class="section-description">Select filters to apply and optionally mark one column as dynamic</p>
+            <h3 class="section-title">Conditions & Main column</h3>
+            <p class="section-description">
+                Select which conditions to add and choose a Main column. Main columns remain editable, while conditions are set.
+            </p>
 
             <!-- Filter Selection -->
             <mat-form-field class="filters-select" appearance="outline">
-                <mat-label>Add filter by...</mat-label>
+                <mat-label>Click here to add condition</mat-label>
                 <input type="text" matInput name="filter_columns"
                     [matAutocomplete]="auto"
                     [formControl]="fieldSearchControl">
@@ -144,7 +141,7 @@ <h3 class="section-title">Define Filters and Dynamic Column</h3>
                     <mat-checkbox
                         [checked]="dynamicColumn === value.key"
                         (change)="toggleDynamicColumn(value.key)">
-                        Dynamic column
+                        Main column
                     </mat-checkbox>
                 </div>
                 <button mat-icon-button type="button" class="filter-delete-button"

frontend/src/app/components/dashboard/db-table-view/saved-filters-panel/saved-filters-panel.component.html

@@ -7,11 +7,12 @@
             angularticsAction="Saved filters: first time setup is clicked"
             (click)="handleOpenSavedFiltersDialog()">
             <mat-icon>tune</mat-icon>
-            Setup custom filters
+            Create Fast Filter
         </button>
 
         <button *ngIf="accessLevel === 'edit' && savedFilterData.length !== 0"
             mat-icon-button type="button"
+            matTooltip="Set up, edit, or remove Fast Filters"
             [matMenuTriggerFor]="menu"
             angulartics2On="click"
             angularticsAction="Saved filters: open menu is clicked">
@@ -20,7 +21,7 @@
         <mat-menu #menu="matMenu">
             <button mat-menu-item (click)="handleOpenSavedFiltersDialog()">
                 <mat-icon>add</mat-icon>
-                Create new filter
+                New Fast Filter
             </button>
             <button mat-menu-item
                 *ngFor="let filter of savedFilterData"

frontend/src/app/components/feature-notification/feature-notification.component.html

@@ -1,15 +1,15 @@
 <div class="feature-notification">
     <div class="feature-notification__content">
-        <img class="feature-notification__image" src="assets/feture-images/white-label.gif" alt="Feature Notification Icon">
-        <h1 class="feature-notification__title">New: Make it yours</h1>
+        <img class="feature-notification__image" src="assets/feture-images/saved-filters.gif" alt="Feature Notification Icon">
+        <h1 class="feature-notification__title">New: Fast Filters</h1>
         <p class="feature-notification__description">
-            Customize your favicon and page title, and add branding to your Rocketadmin experience.
+            Save your filter setups and quickly change options on the fly
         </p>
     </div>
     <div class="actions">
-        <a mat-button class="actions__secondary" routerLink="/company" (click)="dismiss.emit()">
+        <!--<a mat-button class="actions__secondary" routerLink="/company" (click)="dismiss.emit()">
             Set up now
-        </a>
+        </a>-->
         <button type="button" mat-flat-button color="accent" class="actions__primary" (click)="dismiss.emit()">
             Got it
         </button>