---
import { orderBy } from 'lodash-es'

import { karmaUnlocks } from '../constants/karmaUnlocks'

const karmaUnlocksSorted = orderBy(karmaUnlocks, [
  ({ karma }) => (karma >= 0 ? 1 : 2),
  ({ karma }) => Math.abs(karma),
  'id',
])
---

<table>
  <thead>
    <tr>
      <th>Karma</th>
      <th>Unlock</th>
    </tr>
  </thead>
  <tbody>
    {
      karmaUnlocksSorted.map((unlock) => (
        <tr>
          <td>{unlock.karma.toLocaleString()}</td>
          <td>{unlock.name}</td>
        </tr>
      ))
    }
  </tbody>
</table>