Sorting not working in frontend-config

Hi,

Sorting is not working for me in frontend-config.
I want to sort on Advice # which is a integer type column and using the following:

tradeAdvice: {
    type: "table-view",
    title: "Trade Advice",
    source: {
      type: "contracts",
      filter: [
             ],
      search: "",
      sort: [
        {
          field: "id",
          direction: "DESCENDING"
        }
      ]
    },
    columns: [
      {
        key: "id",
        title: "Advice #",
        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).adviceNumber}),
        sortable: true,
        width: 20,
        weight: 0,
        alignment: "left"
      },

Can you please advise what I may be doing wrong?

Thanks in advance.
Chandan

field: "id" will sort by the contract id. Based on what you’re displaying in the columns section it looks like you want to sort on a field called adviceNumber. You can do that with field: "argument.adviceNumber" where argument matches on the actual contract payload. The full frontend config then looks something like this

trade_advice: {
      type: "table-view",
      title: "Trade Advice",
      source: {
        type: "contracts",
        filter: [
               ],
        search: "",
        sort: [
          {
            field: "argument.adviceNumber",
            direction: "DESCENDING"
          }
        ]
      },
      columns: [
        {
          key: "id",
          title: "Advice #",
          createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).adviceNumber}),
          sortable: true,
          width: 20,
          weight: 0,
          alignment: "left"
        },
      ]
  }

credit to @Robert_Autenrieth for figuring this out

1 Like

HI,

Yes, you are right, I want to sort on AdviceNumber.

I tried this but still does not work. Please help me. This is what my complete js file looks like:

import { DamlLfValue } from '@da/ui-core';

export const version = {

  schema: 'navigator-config',

  major: 2,

  minor: 0,

};

export const customViews = (userId, party, role) => ({

  tradeAdvice: {

    type: "table-view",

    title: "Trade Advice",

    source: {

      type: "contracts",

      filter: [  

      ],

      search: "",

      sort: [

        {

          field: "arguement.adviceNumber",

          direction: "DESCENDING"

        }

      ]

    },

    columns: [

      {

        key: "id",

        title: "Advice #",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).adviceNumber}),

        sortable: true,

        width: 20,

        weight: 0,

        alignment: "left"

      },

      {

        key: "tradeNumber",

        title: "#",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).tradeNumber}),

        sortable: true,

        width: 10,

        weight: 0,

        alignment: "left"

      },

      {

        key: "tradeTime",

        title: "Time",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).tradeTime}),

        sortable: true,

        width: 60,

        weight: 0,

        alignment: "left"

      },

      {

        key: "tradeTimeMS",

        title: "Time (ms)",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).tradeTimeMS}),

        sortable: true,

        width: 80,

        weight: 0,

        alignment: "left"

      },

      {

        key: "tradeSide",

        title: "Side",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).tradeSide}),

        sortable: true,

        width: 10,

        weight: 0,

        alignment: "left"

      },

      {

        key: "tradeQuantity",

        title: "Quantity",

        createCell: ({rowData}) => ({type: "text", value: DamlLfValue.toJSON(rowData.argument).tradeQuantity}),

        sortable: true,

        width: 10,

        weight: 0,

        alignment: "right"

      },

      {

        key: "tradePrice",

        title: "Price",

        createCell: ({rowData}) => ({type: "text", value: wrapInBrackets(DamlLfValue.toJSON(rowData.argument).tradePrice, '$')}),

        sortable: true,

        width: 10,

        weight: 0,

        alignment: "right"

      },

      {

        key: "pnl",

        title: "This PNL",

        createCell: ({rowData}) => ({type: "text", value: wrapInBrackets(DamlLfValue.toJSON(rowData.argument).pnl, '$')}),

        sortable: true,

        width: 10,

        weight: 0,

        alignment: "right"

      },

      {

        key: "cumulativePNL",

        title: "Cumulative PNL",

        createCell: ({rowData}) => ({type: "text", value: wrapInBrackets(DamlLfValue.toJSON(rowData.argument).cumulativePNL, '$')}),

        sortable: true,

        width: 20,

        weight: 0,

        alignment: "right"

      }

    ]

  }

})

function makeTwice(input)

{

  return input + input;

}

//fucntion 

function wrapInBrackets(value, symbol)

{

  //alert()

  var absValue = Math.abs(value);

  var returnString = new Intl.NumberFormat('en-US', { minimumFractionDigits: 4 }).format(absValue);

  return  symbol + (value < 0 ? '(' + returnString + ')' : returnString);

}
1 Like

You have a typo in this line. It should be argument instead of arguement. Can you please try again after fixing the typo?

2 Likes