feat(PoliticalEntity): add order field for listing prioritization

Add order field to PoliticalEntity type and collection to allow manual sorting of entities in listings. Lower numbers appear first, with name used as secondary sort criteria when order is equal.

Author: kelvinkipruto

src/collections/PoliticalEntities/index.ts

@@ -24,6 +24,7 @@ export const PoliticalEntities: CollectionConfig = {
     },
     defaultColumns: [
       "name",
+      "order",
       "image",
       "region",
       "position",
@@ -53,6 +54,23 @@ export const PoliticalEntities: CollectionConfig = {
         },
       },
     }),
+    {
+      name: "order",
+      type: "number",
+      index: true,
+      min: 0,
+      admin: {
+        position: "sidebar",
+        description: {
+          en: "Lower numbers appear first in listings.",
+          fr: "Les nombres les plus bas apparaissent en premier dans les listes.",
+        },
+      },
+      label: {
+        en: "Order",
+        fr: "Ordre",
+      },
+    },
     {
       name: "region",
       type: "text",

src/components/PoliticalEntityList.tsx

@@ -64,8 +64,21 @@ export const PoliticalEntityList = async ({
       )
     : {};
 
+  const sortedPoliticalEntities = [...politicalEntities].sort((entityA, entityB) => {
+    const orderA = entityA.order ?? Number.POSITIVE_INFINITY;
+    const orderB = entityB.order ?? Number.POSITIVE_INFINITY;
+
+    if (orderA !== orderB) {
+      return orderA - orderB;
+    }
+
+    return entityA.name.localeCompare(entityB.name, undefined, {
+      sensitivity: "base",
+    });
+  });
+
   const entitiesWithMedia = await Promise.all(
-    politicalEntities.map(async (entity) => ({
+    sortedPoliticalEntities.map(async (entity) => ({
       entity,
       media: await resolveMedia(entity.image),
     }))

src/payload-types.ts

@@ -235,6 +235,10 @@ export interface PoliticalEntity {
   name: string;
   slug: string;
   slugLock?: boolean | null;
+  /**
+   * Lower numbers appear first in listings.
+   */
+  order?: number | null;
   region?: string | null;
   /**
    * Title of the entity, i.e President, Governor, Prime Minister
@@ -1450,6 +1454,7 @@ export interface PoliticalEntitiesSelect<T extends boolean = true> {
   name?: T;
   slug?: T;
   slugLock?: T;
+  order?: T;
   region?: T;
   position?: T;
   image?: T;