Merge branch 'main' into backend_ai_fixes

Author: Artuomka

backend/src/enums/widget-type.enum.ts

@@ -19,5 +19,6 @@ export enum WidgetTypeEnum {
   Code = 'Code',
   Phone = 'Phone',
   Country = 'Country',
-  Color = 'Color'
+  Color = 'Color',
+  Range = 'Range'
 }

frontend/src/app/app-routing.module.ts

@@ -8,11 +8,10 @@ import { ConnectDBComponent } from './components/connect-db/connect-db.component
 import { ConnectionSettingsComponent } from './components/connection-settings/connection-settings.component';
 import { ConnectionsListComponent } from './components/connections-list/connections-list.component';
 import { DashboardComponent } from './components/dashboard/dashboard.component'
-import { DbTableActionsComponent } from './components/dashboard/db-table-actions/db-table-actions.component';
-import { DbTableComponent } from './components/dashboard/db-table/db-table.component';
+import { DbTableActionsComponent } from './components/dashboard/db-table-view/db-table-actions/db-table-actions.component';
 import { DbTableRowEditComponent } from './components/db-table-row-edit/db-table-row-edit.component';
-import { DbTableSettingsComponent } from './components/dashboard/db-table-settings/db-table-settings.component';
-import { DbTableWidgetsComponent } from './components/dashboard/db-table-widgets/db-table-widgets.component';
+import { DbTableSettingsComponent } from './components/dashboard/db-table-view/db-table-settings/db-table-settings.component';
+import { DbTableWidgetsComponent } from './components/dashboard/db-table-view/db-table-widgets/db-table-widgets.component';
 import { EmailChangeComponent } from './components/email-change/email-change.component';
 import { EmailVerificationComponent } from './components/email-verification/email-verification.component';
 import { LoginComponent } from './components/login/login.component';

frontend/src/app/components/dashboard/dashboard.component.html

@@ -74,7 +74,7 @@ <h3 class='mat-subheading-2'>Rocketadmin can not find any tables</h3>
                 </div>
 
                 <app-content-loader *ngIf="dataSource === null"></app-content-loader>
-                <app-db-table *ngIf="dataSource"
+                <app-db-table-view *ngIf="dataSource"
                     [displayName]="selectedTableDisplayName"
                     [activeFilters]="filters"
                     [filterComparators]="comparators"
@@ -89,8 +89,9 @@ <h3 class='mat-subheading-2'>Rocketadmin can not find any tables</h3>
                     (removeFilter)="removeFilter($event)"
                     (resetAllFilters)="clearAllFilters()"
                     (search)="search($event)"
-                    (activateActions)="activateActions($event)">
-                </app-db-table>
+                    (activateActions)="activateActions($event)"
+                    (applyFilter)="applyFilter($event)">
+                </app-db-table-view>
             </div>
             <app-db-table-row-view *ngIf="selectedRow"
                 [activeFilters]="filters"

frontend/src/app/components/dashboard/dashboard.component.ts

@@ -7,16 +7,16 @@ import { first, map } from 'rxjs/operators';
 
 import { AlertComponent } from '../ui-components/alert/alert.component';
 import { BannerComponent } from '../ui-components/banner/banner.component';
-import { BbBulkActionConfirmationDialogComponent } from './db-bulk-action-confirmation-dialog/db-bulk-action-confirmation-dialog.component';
+import { BbBulkActionConfirmationDialogComponent } from './db-table-view/db-bulk-action-confirmation-dialog/db-bulk-action-confirmation-dialog.component';
 import { CommonModule } from '@angular/common';
 import { CompanyService } from 'src/app/services/company.service';
 import { ConnectionsService } from 'src/app/services/connections.service';
 import { ContentLoaderComponent } from '../ui-components/content-loader/content-loader.component';
-import { DbActionLinkDialogComponent } from './db-action-link-dialog/db-action-link-dialog.component';
-import { DbTableAiPanelComponent } from './db-table-ai-panel/db-table-ai-panel.component';
-import { DbTableComponent } from './db-table/db-table.component';
-import { DbTableFiltersDialogComponent } from './db-table-filters-dialog/db-table-filters-dialog.component';
-import { DbTableRowViewComponent } from './db-table-row-view/db-table-row-view.component';
+import { DbActionLinkDialogComponent } from './db-table-view/db-action-link-dialog/db-action-link-dialog.component';
+import { DbTableAiPanelComponent } from './db-table-view/db-table-ai-panel/db-table-ai-panel.component';
+import { DbTableFiltersDialogComponent } from './db-table-view/db-table-filters-dialog/db-table-filters-dialog.component';
+import { DbTableRowViewComponent } from './db-table-view/db-table-row-view/db-table-row-view.component';
+import { DbTableViewComponent } from './db-table-view/db-table-view.component';
 import { DbTablesListComponent } from './db-tables-list/db-tables-list.component';
 import { HttpErrorResponse } from '@angular/common/http';
 import JsonURL from "@jsonurl/jsonurl";
@@ -58,7 +58,7 @@ interface DataToActivateActions {
     MatDialogModule,
     MatSidenavModule,
     DbTablesListComponent,
-    DbTableComponent,
+    DbTableViewComponent,
     DbTableAiPanelComponent,
     DbTableRowViewComponent,
     AlertComponent,
@@ -151,6 +151,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
         this.shownTableTitles = settings?.connections[this.connectionID]?.shownTableTitles ?? true;
 
         this.getData();
+        console.log('getData from ngOnInit');
     });
   }
 
@@ -159,6 +160,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
   }
 
   async getData() {
+    console.log('getData');
     let tables;
     try {
       tables = await this.getTables();
@@ -185,6 +187,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
             if (tableName) {
               this.selectedTableName = tableName;
               this.setTable(tableName);
+              console.log('setTable from getData paramMap');
               this.title.setTitle(`${this.selectedTableDisplayName} table | ${this._company.companyTabTitle || 'Rocketadmin'}`);
               this.selection.clear();
             } else {
@@ -201,12 +204,14 @@ export class DashboardComponent implements OnInit, OnDestroy {
         this._tableRow.cast.subscribe((arg) => {
           if (arg === 'delete row' && this.selectedTableName) {
             this.setTable(this.selectedTableName);
+            console.log('setTable from getData _tableRow cast');
             this.selection.clear();
           };
         });
         this._tables.cast.subscribe((arg) => {
           if ((arg === 'delete rows' || arg === 'import') && this.selectedTableName) {
             this.setTable(this.selectedTableName);
+            console.log('setTable from getData _tables cast');
             this.selection.clear();
           };
           if (arg === 'activate actions') {
@@ -217,6 +222,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
   }
 
   getTables() {
+    console.log('getTables');
     return this._tables.fetchTables(this.connectionID).toPromise();
   }
 
@@ -243,17 +249,17 @@ export class DashboardComponent implements OnInit, OnDestroy {
 
   setTable(tableName: string) {
     this.selectedTableName = tableName;
-    this.route.queryParams.pipe(first()).subscribe((queryParams) => {
-      this.filters = JsonURL.parse( queryParams.filters );
-      this.comparators = getComparatorsFromUrl(this.filters);
-      this.pageIndex = parseInt(queryParams.page_index) || 0;
-      this.pageSize = parseInt(queryParams.page_size) || 30;
-      this.sortColumn = queryParams.sort_active;
-      this.sortOrder = queryParams.sort_direction;
-
-      const search = queryParams.search;
-      this.getRows(search);
-    })
+    const queryParams = this.route.snapshot.queryParams;
+    this.filters = JsonURL.parse(queryParams.filters);
+    this.comparators = getComparatorsFromUrl(this.filters);
+    this.pageIndex = parseInt(queryParams.page_index) || 0;
+    this.pageSize = parseInt(queryParams.page_size) || 30;
+    this.sortColumn = queryParams.sort_active;
+    this.sortOrder = queryParams.sort_direction;
+
+    const search = queryParams.search;
+    this.getRows(search);
+    console.log('getRows from setTable');
 
     const selectedTableProperties = this.tablesList.find( (table: any) => table.table == this.selectedTableName);
     if (selectedTableProperties) {
@@ -279,21 +285,27 @@ export class DashboardComponent implements OnInit, OnDestroy {
       if (action === 'filter') {
         const filtersFromDialog = {...filterDialodRef.componentInstance.tableRowFieldsShown};
 
+        console.log('Filters from dialog:', filtersFromDialog);
+
         const nonEmptyFilters = omitBy(filtersFromDialog, (value) => value === undefined);
         this.comparators = filterDialodRef.componentInstance.tableRowFieldsComparator;
 
         if (Object.keys(nonEmptyFilters).length) {
           this.filters = {};
           for (const key in nonEmptyFilters) {
-              if (this.comparators[key] !== undefined) {
-                this.filters[key] = {
-                      [this.comparators[key]]: nonEmptyFilters[key]
-                  };
-              }
+            if (this.comparators[key] !== undefined) {
+              this.filters[key] = {
+                [this.comparators[key]]: nonEmptyFilters[key]
+              };
+            }
           }
 
+          console.log('Filters to apply:', this.filters);
+
           const filters = JsonURL.stringify( this.filters );
 
+          console.log('Filters to navigate:', filters);
+
           this.router.navigate([`/dashboard/${this.connectionID}/${this.selectedTableName}`], {
             queryParams: {
               filters,
@@ -302,6 +314,8 @@ export class DashboardComponent implements OnInit, OnDestroy {
             }
           });
           this.getRows();
+          console.log('getRows from afterClosed');
+
 
           this.angulartics2.eventTrack.next({
             action: 'Dashboard: filter is applied',
@@ -310,6 +324,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
       } else if (action === 'reset') {
         this.filters = {};
         this.getRows();
+        console.log('getRows from reset filters afterClosed');
         this.router.navigate([`/dashboard/${this.connectionID}/${this.selectedTableName}`]);
       }
     })
@@ -324,6 +339,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
     this.selection.clear();
 
     this.getRows();
+    console.log('getRows from removeFilter');
     this.router.navigate([`/dashboard/${this.connectionID}/${this.selectedTableName}`], {
       queryParams: {
         filters,
@@ -337,6 +353,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
     this.filters = {};
     this.comparators = {};
     this.getRows();
+    console.log('getRows from clearAllFilters');
     this.router.navigate([`/dashboard/${this.connectionID}/${this.selectedTableName}`], {
       queryParams: {
         page_index: 0,
@@ -347,6 +364,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
 
   search(value: string) {
     this.getRows(value);
+    console.log('getRows from search');
     this.filters = {};
     this.router.navigate([`/dashboard/${this.connectionID}/${this.selectedTableName}`], {
       queryParams: {
@@ -358,6 +376,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
   }
 
   getRows(search?: string) {
+    console.log('getRows, filters:', this.filters);
     this._uiSettings.getUiSettings()
       .subscribe ((settings: UiSettings) => {
         this.uiSettings = settings?.connections[this.connectionID];
@@ -376,7 +395,13 @@ export class DashboardComponent implements OnInit, OnDestroy {
           shownColumns
         });
     });
+  }
 
+  applyFilter(filters: any) {
+    console.log('applyFilter with filters:', filters);
+    this.filters = filters?.filters;
+    this.getRows();
+    console.log('getRows from applyFilter');
   }
 
   openIntercome() {