feat(table-addon): add requireSort option to table (#9036)

Co-authored-by: 40oleg <[email protected]>
taiga-family · Sep 30, 2024 · 38c5b20 · 38c5b20
1 parent 3c6e186
commit 38c5b20
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/projects/addon-table/components/table/table.options.ts b/projects/addon-table/components/table/table.options.ts
@@ -4,6 +4,7 @@ import type {TuiSizeL, TuiSizeS} from '@taiga-ui/core/types';
 
 export interface TuiTableOptions {
     readonly direction: -1 | 1;
+    readonly requiredSort: boolean;
     readonly open: boolean;
     readonly resizable: boolean;
     readonly size: TuiSizeL | TuiSizeS;
@@ -21,6 +22,7 @@ export const TUI_TABLE_DEFAULT_OPTIONS: TuiTableOptions = {
     open: true,
     size: 'm',
     direction: 1,
+    requiredSort: false,
     sortIcons: {
         asc: '@tui.chevron-up',
         desc: '@tui.chevron-down',

diff --git a/projects/addon-table/components/table/th/th.component.ts b/projects/addon-table/components/table/th/th.component.ts
@@ -26,6 +26,7 @@ import {TUI_TABLE_OPTIONS} from '../table.options';
     host: {
         '[style.width.px]': 'width',
         '[class._sticky]': 'sticky',
+        '[attr.requiredSort]': 'requiredSort',
     },
 })
 export class TuiTableTh<T extends Partial<Record<keyof T, any>>> {
@@ -53,6 +54,9 @@ export class TuiTableTh<T extends Partial<Record<keyof T, any>>> {
     @Input()
     public sticky = this.options.sticky;
 
+    @Input()
+    public requiredSort = this.options.requiredSort;
+
     public get key(): keyof T {
         if (!this.head) {
             throw new TuiTableSortKeyException();
@@ -76,8 +80,10 @@ export class TuiTableTh<T extends Partial<Record<keyof T, any>>> {
     }
 
     protected updateSorterAndDirection(): void {
+        const sorter = this.requiredSort ? this.sorter : null;
+
         this.table?.updateSorterAndDirection(
-            this.isCurrentAndAscDirection ? null : this.sorter,
+            this.isCurrentAndAscDirection ? sorter : this.sorter,
         );
     }
 

diff --git a/projects/demo/src/modules/components/table/examples/4/index.html b/projects/demo/src/modules/components/table/examples/4/index.html
@@ -69,6 +69,7 @@
                     *tuiHead="'age'"
                     tuiSortable
                     tuiTh
+                    [requiredSort]="true"
                 >
                     Age
                 </th>