feat: expanding evaluateCondition to filter featured articles

Author: SidStraw

packages/karbon/package.json

@@ -218,4 +218,4 @@
     "access": "public"
   },
   "gitHead": "8df1f4d5837a7e2ddbff6cc79f5fec256c34a394"
-}
+}

packages/karbon/src/runtime/api/article.ts

@@ -31,6 +31,7 @@ export const ListArticles = gql`
         slug
         sid
         published_at
+        featured
         plan
         cover
         seo

packages/karbon/src/runtime/lib/article-filter.ts

@@ -22,7 +22,13 @@ export interface AuthorConditionOption {
   value: string
 }
 
-export type Condition = DeskConditionOption | TagConditionOption | AuthorConditionOption
+export interface FeaturedConditionOption {
+  type: 'featured'
+  key?: 'id'
+  value?: boolean
+}
+
+export type Condition = DeskConditionOption | TagConditionOption | AuthorConditionOption | FeaturedConditionOption
 export type ConditionInput = string | Condition
 
 export function normalizeCondition(conditionInput?: ConditionInput[]): { identity: string; conditions: Condition[] } {
@@ -34,7 +40,7 @@ export function normalizeCondition(conditionInput?: ConditionInput[]): { identit
           type: 'desk' as const,
           ...value,
         }
-        identityList.push(`${res.type}:${res.key}:${res.value}`)
+        identityList.push(`${res.type}:${res?.key ?? '-'}:${res?.value ?? true}`)
         return res
       }
 
@@ -58,13 +64,19 @@ export function evaluateCondition(article: Article, conditions: Condition[] = []
     return true
   }
 
-  return conditions.some(({ type = 'desk', key, value }) => {
-    if (type === 'desk') {
-      return article.desk[key] === value || article.desk?.desk?.[key] === value
-    } else if (type === 'author') {
-      return article.authors.some((author) => author.id === value)
-    } else {
-      return article.tags.some((tag) => tag[key] === value)
+  return conditions.every(({ type = 'desk', key, value }) => {
+    switch (true) {
+      case type === 'featured':
+        value ??= true
+        return article.featured === value
+      case type === 'desk':
+        return article.desk[key!] === value || article.desk?.desk?.[key!] === value
+      case type === 'author':
+        return article.authors.some((author) => author.id === value)
+      case type === 'tag':
+        return article.tags.some((tag) => tag[key!] === value)
+      default:
+        return false
     }
   })
 }

packages/karbon/src/runtime/types.ts

@@ -201,6 +201,7 @@ export interface Article {
   published_at?: any | null
   slug: string
   title: string
+  featured: boolean
   cover?: any | null
   seo?: any | null
   html?: string | null

packages/playground/pages/index.vue

@@ -7,6 +7,10 @@ const multipleValues = useField('multiple-value', { type: FieldType.Text, all: t
 
 const { articles: alphabetArticles } = useFillArticles(10, [{ key: 'slug', value: 'alphabet' }])
 const { articles: lastArticles } = useFillArticles(9)
+const { articles: featureArticles } = useFillArticles(10, [
+  { key: 'slug', value: 'test' },
+  { type: 'featured' }
+])
 
 watch(alphabetArticles, (articles) => {
   const slugs = new Set(articles.map((article) => article.slug))
@@ -61,5 +65,12 @@ watch(alphabetArticles, (articles) => {
         <ArticleLayout :article="article" />
       </div>
     </div>
+
+    <h2 class="text-2xl mt-4">Feature Articles</h2>
+    <div class="flex w-screen mt-4">
+      <div v-for="article in featureArticles" :key="article.id" class="border border-black flex-1 overflow-hidden">
+        <ArticleLayout :article="article" />
+      </div>
+    </div>
   </div>
 </template>