Hide and show element (sorting on column) in react js

I am working on a task (column based sorting). I am having 5 to 6 columns. Namely

1. Date
2. Type,
3. Credited Amount
4. Debited Amount
5. Credit Balance
6. Debit Balance.

My requirement is to hide values of 6) Debit Balance and 5) Credit Balance once user clicks 3) Credited Amount and 4) Debited Amount. This will happen in Ascending order.

If the user again clicks it, it will go to Descending Order. At that time I want to display column values of (5 and 6).

In simple terms while Ascending order I want to hide the column values of (5 and 6) while in descending order I want to display column values.

As of now what I am getting is while Ascending order the values are getting hidden. But in Descending order I couldn't get the values. Can anyone guide me to achieve this?

My Code goes below

const columns = [{
    "key": "date",
    "name": "Date",
    "isSort": true
  },
  {
    "key": "type",
    "name": "Type",
    "isSort": true
  },

  {
    "key": "CreditedAmount",
    "name": "CAmount",
    "isSort": true
  },
  {
    "key": "DebitedAmount",
    "name": "DAmount",
    "isSort": true
  },

  {
    "key": "CreditBalance",
    "name": "CBal",
  },
  {
    "key": "DebitBalance",
    "name": "DBal",
  },
]

const [col, setCol] = useState(columns)
const Rows = props.contractDetails; //I am getting data from this props
const TotalDetails = props.totalCount

function SortingRow(rows, col, sortMethod) {
  let sortRow = ((sortMethod === "ASC") ?
    rows.map(contractDet) => {
      if ((col === "type") || (col === "creditedAmount") || (col === "DebitedAmount"))
        contractDet.CreditBalance = " "
      contractDet.DebitBalance = " "
    } else {
      return contractDet
    }): rows
  return sortMethod ?
    sortRow
    .slice()
    .sort(
      ({
        [col]: a
      }, {
        [col]: b
      }) =>
      (a === b ? 0 : a < b ? -1 : 1) *
      (sortMethod === "ASC" ? 1 : -1)
    ) :
    rows
}

const rows = col
  .slice()
  .reverse()
  .reduce(
    (sortedRows, {
      key: col,
      isSort,
      sortMethod
    }) =>
    isSort ? SortingRow(sortedRows, col, sortMethod) : sortedRows,
    Rows
  );

return (

  rows = {
    rows
  }
  col = {
    col
  }
  onSort = {
    (col, sortMethod) => setCol(
      cols.map(cl =>
        c.key === col ? Object.assign({}, cl, {
          sortMethod
        }) :
        cl
      )
    )
  }
)