sortComparer for Swimlanes React Kanban

[Michael Mascadri]

Hi Syncfusion team,

I am attempting to create a custom sort for the swimlane rows (to make it not be sorted alphabetically but rather another key value) and came across 'sortComparer' property, however, I haven't found any documentation regarding this function as well as its function type tag leading to a broken webpage: https://ej2.syncfusion.com/documentation/api/kanban/sortComparerFunction/

Would this function give me the results that I require? If so would you be able to help me out with how to use it and add to the swimlaneSettings?

Thanks,

~Michael Mascadri

[Vinitha Jeyakumar]

Hi Michael,

Query 1. " I haven't found any documentation regarding this function as well as its function type tag leading to a broken webpage"

Currently, we are validating on your reported query. we will update you the further details on or before 25th July 2022.

Query 2. "Would this function give me the results that I require? If so would you be able to help me out with how to use it and add to the swimlaneSettings?"

Yes, you can use the sortComparer function of the SwimlaneSettings to sort the swimlane rows based on key or text field. Please check code and sample below,

Code snippet:

 <KanbanComponent

              id="kanban"

              cssClass="kanban-swimlane"

              ref={(kanban) => {

                this.kanbanObj = kanban;

              }}

              keyField="Status"

              dataSource={this.data}

              cardSettings={{ contentField: 'Summary', headerField: 'Id' }}

              swimlaneSettings={{

                keyField: 'Assignee',

                textField: 'AssigneeName',

                sortComparer: this.customSorting,

              }}

              height="500px"

            >

              <ColumnsDirective>

                <ColumnDirective headerText="To Do" keyField="Open" />

                <ColumnDirective

                  headerText="In Progress"

                  keyField="InProgress"

                />

                <ColumnDirective headerText="Done" keyField="Close" />

              </ColumnsDirective>

            </KanbanComponent>

 customSorting(args) {

    args.sort((a, b) =>

      a.textField.localeCompare(b.textField, undefined, { numeric: true })

    );

    return args;

  }

Sample: https://stackblitz.com/edit/react-eh5t6p?file=index.js,datasource.json

Regards,

Vinitha

[Vinitha Jeyakumar]

Hi Michael,

Query 1. " I haven't found any documentation regarding this function as well as its function type tag leading to a broken webpage"

We have considered your reported issue "Need to resolve the broken API Link for the SortComparerFunction in the React Kanban" as a bug from our end and the fix for the issue will be included with our upcoming Vol 2 2022 SP 1 release which is expected to rolled out on the mid of the August 2022.

Now you can track the status of the reported issue through the below feedback,

https://www.syncfusion.com/feedback/36594/need-to-resolve-the-broken-api-link-for-the-sortcomparerfunction-in-the-react

Regards,

Vinitha

[Vinitha Jeyakumar]

Hi Michael,

We are facing complexity in fixing the reported issue. we will include the fix with our upcoming patch release on 16^th August 2022.

Regards,

Vinitha

[Vinitha Jeyakumar]

Hi Michael,

We have fixed the broken API Link for the SortComparerFunction in the React Kanban and it will refreshed in live with our upcoming Vol 3 Main release which is scheduled to be rolled out on the end of September 2022.

Regards,

Vinitha

[Vinitha Jeyakumar]

Hi Michael,

We have reported this broken API link issue to the concerned team, and we will include the fix with our upcoming Vol 1 SP release which is expected to be rolled out on the end of May 2023

Regards,

Vinitha

[Vinitha Jeyakumar]

Hi Michael,

The reported issue has been partially resolved at our end. We will fix the issue completely with our upcoming Vol 2 2023 release which is expected to be rolled out on the end of June 2023.

Regards,

Vinitha

[Vinothkumar Yuvaraj]

Hi Michael Mascadri,

We have fixed the broken API link for the SortComparerFunction and refreshed it in the React Kanban component. Please review the following API link.

API Link: https://ej2.syncfusion.com/documentation/api/kanban/sortComparerFunction/