feat: sort proposals

packages/shared/components/Proposals.svelte

@@ -5,12 +5,12 @@
     import { IProposal } from '@contexts/governance/interfaces'
     import { proposalFilter } from '@contexts/governance'
     import { isVisibleProposal } from '@contexts/governance/utils/isVisibleProposal'
+    import { sortProposals } from '@contexts/governance/utils/sortProposals'
 
     export let proposals: IProposal[] = []
 
-    $: sortedProposals = proposals
-        .filter((proposal) => isVisibleProposal(proposal, $proposalFilter))
-        .sort((a, b) => (a.id < b.id ? -1 : 1))
+    $: visibleProposals = proposals.filter((proposal) => isVisibleProposal(proposal, $proposalFilter))
+    $: sortedProposals = sortProposals(visibleProposals, $proposalFilter)
 </script>
 
 <proposals-container class="flex flex-col h-full">

packages/shared/lib/contexts/governance/enums/index.ts

@@ -1,2 +1,3 @@
+export * from './proposal-order-option.enum'
 export * from './proposal-type.enum'
 export * from './proposal-status.enum'

packages/shared/lib/contexts/governance/enums/proposal-order-option.enum.ts

@@ -0,0 +1,4 @@
+export enum ProposalOrderOption {
+    Phase = 'phase',
+    Name = 'name',
+}

packages/shared/lib/contexts/governance/interfaces/proposal-filter.interface.ts

@@ -1,7 +1,8 @@
-import { SelectionFilterUnit } from '@core/utils/interfaces/filter/filter-unit.interface'
+import { OrderFilterUnit, SelectionFilterUnit } from '@core/utils/interfaces/filter/filter-unit.interface'
 
 export interface ProposalFilter {
     phase: SelectionFilterUnit
     type: SelectionFilterUnit
     participated: SelectionFilterUnit
+    order: OrderFilterUnit
 }

packages/shared/lib/contexts/governance/stores/proposal-filter.store.ts

@@ -1,6 +1,6 @@
-import { BooleanFilterOption } from '@core/utils/enums/filters'
+import { BooleanFilterOption, OrderOption } from '@core/utils/enums/filters'
 import { writable, Writable } from 'svelte/store'
-import { ProposalFilter, ProposalStatus, ProposalType } from '..'
+import { ProposalFilter, ProposalStatus, ProposalType, ProposalOrderOption } from '..'
 
 export const proposalFilter: Writable<ProposalFilter> = writable({
     phase: {
@@ -25,4 +25,12 @@ export const proposalFilter: Writable<ProposalFilter> = writable({
         selected: BooleanFilterOption.Yes,
         choices: [BooleanFilterOption.Yes, BooleanFilterOption.No],
     },
+    order: {
+        active: false,
+        type: 'order',
+        localeKey: 'filters.proposalOrder',
+        selected: ProposalOrderOption.Name,
+        ascDesc: OrderOption.Asc,
+        choices: [ProposalOrderOption.Name, ProposalOrderOption.Phase],
+    },
 })

packages/shared/lib/contexts/governance/utils/sortProposals.ts

@@ -0,0 +1,36 @@
+import { OrderOption } from '@core/utils/enums/filters'
+import { ProposalOrderOption, ProposalStatus } from '../enums'
+import { IProposal, ProposalFilter } from '../interfaces'
+
+export function sortProposals(proposals: IProposal[], filter: ProposalFilter): IProposal[] {
+    let orderFunction = sortByName
+    let isAscending = true
+
+    if (filter.order.active) {
+        switch (filter.order.selected) {
+            case ProposalOrderOption.Name:
+                orderFunction = sortByName
+                break
+            case ProposalOrderOption.Phase:
+                orderFunction = sortByPhase
+                break
+        }
+        isAscending = filter.order.ascDesc === OrderOption.Asc
+    }
+
+    return proposals?.sort((proposal1, propsal2) => orderFunction(proposal1, propsal2, isAscending)) ?? []
+}
+
+function sortByName(proposal1: IProposal, proposal2: IProposal, asc: boolean): number {
+    return proposal1.title.toLowerCase() > proposal2.title.toLowerCase() ? (asc ? 1 : -1) : asc ? -1 : 1
+}
+
+function sortByPhase(proposal1: IProposal, proposal2: IProposal, asc: boolean): number {
+    const phaseOrdering = {
+        [ProposalStatus.Upcoming]: 0,
+        [ProposalStatus.Commencing]: 1,
+        [ProposalStatus.Holding]: 2,
+        [ProposalStatus.Ended]: 3,
+    }
+    return phaseOrdering[proposal1.status] > phaseOrdering[proposal2.status] ? (asc ? 1 : -1) : asc ? -1 : 1
+}

packages/shared/locales/en.json

@@ -1584,6 +1584,11 @@
             "label": "Participated",
             "yes": "Yes",
             "no": "No"
+        },
+        "proposalOrder": {
+            "label": "Order",
+            "name": "Name",
+            "phase": "Phase"
         }
     },
     "dates": {