chore: tidy-up further category typing

packages/components/src/CardProfile/CardDetailsFallback.tsx

@@ -4,7 +4,7 @@ import { Category } from '../Category/Category'
 import { MemberBadge } from '../MemberBadge/MemberBadge'
 import { Username } from '../Username/Username'
 
-import type { DBCategory, IMapPin } from 'oa-shared'
+import type { Category as CategoryType, IMapPin } from 'oa-shared'
 
 interface IProps {
   item: IMapPin
@@ -26,7 +26,7 @@ export const CardDetailsFallback = ({ item, isLink }: IProps) => {
         />
         {subType && (
           <Category
-            category={{ name: subType } as DBCategory}
+            category={{ name: subType } as CategoryType}
             sx={{
               border: '1px solid #0087B6',
               backgroundColor: '#ECFAFF',
@@ -36,7 +36,7 @@ export const CardDetailsFallback = ({ item, isLink }: IProps) => {
         )}
         {type === 'member' && (
           <Category
-            category={{ name: 'Wants to get started' } as DBCategory}
+            category={{ name: 'Wants to get started' } as CategoryType}
             sx={{
               border: '1px solid #A72E5A',
               backgroundColor: '#F7C7D9',

packages/components/src/Category/Category.stories.tsx

@@ -1,7 +1,7 @@
 import { Category } from './Category'
 
 import type { Meta, StoryFn } from '@storybook/react'
-import type { DBCategory } from 'oa-shared'
+import type { Category as CategoryType } from 'oa-shared'
 
 export default {
   title: 'Components/Category',
@@ -13,7 +13,7 @@ export const Default: StoryFn<typeof Category> = () => (
     category={
       {
         name: 'Label',
-      } as DBCategory
+      } as CategoryType
     }
   />
 )

packages/components/src/Category/Category.tsx

@@ -1,18 +1,19 @@
 import { Flex, Text } from 'theme-ui'
 
-import type { DBCategory } from 'oa-shared'
+import type { Category as CategoryType } from 'oa-shared'
 import type { ThemeUIStyleObject } from 'theme-ui'
 
 type OldICategory = { label: string }
 export interface Props {
-  category: DBCategory | OldICategory
+  category: CategoryType | OldICategory
   sx?: ThemeUIStyleObject | undefined
 }
 
 export const Category = (props: Props) => {
   const { category, sx } = props
 
-  const name = (category as DBCategory).name || (category as OldICategory).label
+  const name =
+    (category as CategoryType).name || (category as OldICategory).label
 
   return (
     <Flex sx={{ alignItems: 'start' }}>

packages/components/src/CategoryVerticalList/CategoryVerticalList.stories.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react'
 import { CategoryVerticalList } from './CategoryVerticalList'
 
 import type { Meta, StoryFn } from '@storybook/react'
-import type { ContentTypes, DBCategory, ICategory } from 'oa-shared'
+import type { Category, ContentTypes, ICategory } from 'oa-shared'
 
 export default {
   title: 'Components/CategoryVerticalList',
@@ -12,43 +12,43 @@ export default {
 
 const allCategoriesForPreciousPlastic = [
   {
-    created_at: new Date('2024-12-03T18:03:51.313Z'),
+    createdAt: new Date('2024-12-03T18:03:51.313Z'),
     id: 1,
     name: 'Guides',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-01T18:03:51.313Z'),
+    createdAt: new Date('2022-12-01T18:03:51.313Z'),
     id: 2,
     name: 'Machines',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 3,
     name: 'Moulds',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 4,
     name: 'Products',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 5,
     name: 'Starter Kits',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-04T18:03:51.313Z'),
+    createdAt: new Date('2022-12-04T18:03:51.313Z'),
     id: 6,
     name: 'Recycling',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-05T18:03:51.313Z'),
+    createdAt: new Date('2022-12-05T18:03:51.313Z'),
     id: 7,
     _modified: '2022-12-03T18:03:51.313Z',
     name: 'From the Team',
@@ -58,31 +58,31 @@ const allCategoriesForPreciousPlastic = [
 
 const allCategoriesForProjectKamp = [
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 8,
     name: 'Construction',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 9,
     name: 'Food',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 10,
     name: 'Landscape',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 11,
     name: 'Other',
     type: 'questions' as ContentTypes,
   },
   {
-    created_at: new Date('2022-12-03T18:03:51.313Z'),
+    createdAt: new Date('2022-12-03T18:03:51.313Z'),
     id: 12,
     name: 'Utilities',
     type: 'questions' as ContentTypes,
@@ -91,7 +91,7 @@ const allCategoriesForProjectKamp = [
 
 export const Basic: StoryFn<typeof CategoryVerticalList> = () => {
   const [activeCategory, setActiveCategory] = useState<
-    DBCategory | ICategory | null
+    Category | ICategory | null
   >(null)
   const allCategories = [
     ...allCategoriesForPreciousPlastic,
@@ -111,23 +111,23 @@ export const Basic: StoryFn<typeof CategoryVerticalList> = () => {
 
 export const WhenGlyphNotPresent: StoryFn<typeof CategoryVerticalList> = () => {
   const [activeCategory, setActiveCategory] = useState<
-    DBCategory | ICategory | null
+    Category | ICategory | null
   >(null)
   const noGlyphCategories = [
     {
-      created_at: new Date('2022-12-03T18:03:51.313Z'),
+      createdAt: new Date('2022-12-03T18:03:51.313Z'),
       id: 13,
       name: 'No Glphy A',
       type: 'questions' as ContentTypes,
     },
     {
-      created_at: new Date('2022-12-03T18:03:51.313Z'),
+      createdAt: new Date('2022-12-03T18:03:51.313Z'),
       id: 14,
       name: 'No Glphy B',
       type: 'questions' as ContentTypes,
     },
     {
-      created_at: new Date('2022-12-03T18:03:51.313Z'),
+      createdAt: new Date('2022-12-03T18:03:51.313Z'),
       id: 15,
       name: 'No Glphy C',
       type: 'questions' as ContentTypes,
@@ -147,7 +147,7 @@ export const WhenGlyphNotPresent: StoryFn<typeof CategoryVerticalList> = () => {
 
 export const OnlyOne: StoryFn<typeof CategoryVerticalList> = () => {
   const [activeCategory, setActiveCategory] = useState<
-    DBCategory | ICategory | null
+    Category | ICategory | null
   >(null)
 
   const twoCategories = [

packages/components/src/CategoryVerticalList/CategoryVerticalList.tsx

@@ -4,13 +4,13 @@ import { CardButton } from '../CardButton/CardButton'
 import { getGlyph, Icon } from '../Icon/Icon'
 import { VerticalList } from '../VerticalList/VerticalList.client'
 
-import type { DBCategory, ICategory } from 'oa-shared'
+import type { Category, ICategory } from 'oa-shared'
 import type { availableGlyphs } from '../Icon/types'
 
 export interface IProps {
-  activeCategory: DBCategory | ICategory | null
-  allCategories: (DBCategory | ICategory)[]
-  setActiveCategory: (category: DBCategory | ICategory | null) => void
+  activeCategory: Category | ICategory | null
+  allCategories: (Category | ICategory)[]
+  setActiveCategory: (category: Category | ICategory | null) => void
 }
 
 export const CategoryVerticalList = (props: IProps) => {
@@ -21,18 +21,18 @@ export const CategoryVerticalList = (props: IProps) => {
   }
 
   const orderedCategories = allCategories.toSorted((a, b) =>
-    (a as DBCategory).created_at
-      ? (a as DBCategory).created_at > (b as DBCategory).created_at
+    (a as Category).createdAt
+      ? (a as Category).createdAt > (b as Category).createdAt
         ? 1
         : -1
       : (a as ICategory)._created > (b as ICategory)._created
         ? 1
         : -1,
   )
 
-  const isCategorySelected = (category: DBCategory | ICategory) => {
-    if ((category as DBCategory).id) {
-      return (category as DBCategory).id === (activeCategory as DBCategory)?.id
+  const isCategorySelected = (category: Category | ICategory) => {
+    if ((category as Category).id) {
+      return (category as Category).id === (activeCategory as Category)?.id
     }
     if ((category as ICategory)._id) {
       return (category as ICategory)._id === (activeCategory as ICategory)?._id
@@ -44,7 +44,7 @@ export const CategoryVerticalList = (props: IProps) => {
       {orderedCategories.map((category, index) => {
         const isSelected = isCategorySelected(category)
         const name =
-          (category as DBCategory).name || (category as ICategory).label
+          (category as Category).name || (category as ICategory).label
         const glyph = name.toLowerCase() as availableGlyphs
         const hasGlyph = getGlyph(glyph)
 

packages/components/src/ProfileTagsList/ProfileTagsList.tsx

@@ -2,7 +2,7 @@ import { Flex } from 'theme-ui'
 
 import { Category } from '../Category/Category'
 
-import type { DBCategory, IProfileTag } from 'oa-shared'
+import type { Category as CategoryType, IProfileTag } from 'oa-shared'
 import type { ThemeUIStyleObject } from 'theme-ui'
 
 export interface IProps {
@@ -20,7 +20,7 @@ export const ProfileTagsList = ({ sx, tags }: IProps) => {
           label && (
             <Category
               key={index}
-              category={{ name: label } as DBCategory}
+              category={{ name: label } as CategoryType}
               sx={{
                 borderRadius: 99,
                 border: '1px solid',

shared/models/category.ts

@@ -12,7 +12,7 @@ export class Category extends IDoc {
     const { created_at, id, name, type } = category
     return new Category({
       id,
-      created_at: new Date(created_at),
+      createdAt: new Date(created_at),
       name,
       type,
     })

shared/models/document.ts

@@ -1,6 +1,6 @@
 export class IDoc {
   id: number
-  created_at: Date
+  createdAt: Date
 
   constructor(obj) {
     Object.assign(this, obj)

src/models/question.model.ts

@@ -1,6 +1,6 @@
-import { DBCategory } from 'oa-shared'
+import { Category } from 'oa-shared'
 
-import type { IConvertedFileMeta } from 'oa-shared'
+import type { DBCategory, IConvertedFileMeta } from 'oa-shared'
 import type { SelectValue } from 'src/pages/common/Category/CategoriesSelectV2'
 import type { DBImage, Image } from './image.model'
 import type { Tag } from './tag.model'
@@ -78,7 +78,7 @@ export class Question {
   usefulCount: number
   subscriberCount: number
   commentCount: number
-  category: DBCategory | null
+  category: Category | null
   totalViews: number
   tags: Tag[]
   tagIds?: number[]
@@ -101,7 +101,7 @@ export class Question {
       usefulCount: obj.useful_count || 0,
       subscriberCount: obj.subscriber_count || 0,
       commentCount: obj.comment_count || 0,
-      category: obj.category ? DBCategory.fromDB(obj.category) : null,
+      category: obj.category ? Category.fromDB(obj.category) : null,
       totalViews: obj.total_views || 0,
       tagIds: obj.tags,
       tags: tags,

src/pages/Question/QuestionListHeader.tsx

@@ -14,11 +14,11 @@ import { ListHeader } from '../common/Layout/ListHeader'
 import { headings, listing } from './labels'
 import { QuestionSortOptions } from './QuestionSortOptions'
 
-import type { DBCategory } from 'oa-shared'
+import type { Category } from 'oa-shared'
 import type { QuestionSortOption } from './QuestionSortOptions'
 
 export const QuestionListHeader = () => {
-  const [categories, setCategories] = useState<DBCategory[]>([])
+  const [categories, setCategories] = useState<Category[]>([])
   const [searchString, setSearchString] = useState<string>('')
 
   const [searchParams, setSearchParams] = useSearchParams()
@@ -95,7 +95,7 @@ export const QuestionListHeader = () => {
       setActiveCategory={(updatedCategory) =>
         updateFilter(
           QuestionSearchParams.category,
-          updatedCategory ? (updatedCategory as DBCategory).id.toString() : '',
+          updatedCategory ? (updatedCategory as Category).id.toString() : '',
         )
       }
     />

src/pages/Question/QuestionPage.test.tsx

@@ -67,7 +67,7 @@ describe('Questions', () => {
       mockQuestionItem.title =
         'Do you prefer camping near a lake or in a forest?'
       mockQuestionItem.category = {
-        created_at: new Date(),
+        createdAt: new Date(),
         name: 'Preference',
         id: faker.number.int(),
         type: 'questions',

src/pages/Question/question.service.ts

@@ -1,6 +1,6 @@
 import { logger } from 'src/logger'
 
-import type { DBCategory } from 'oa-shared'
+import type { Category } from 'oa-shared'
 import type { Question } from 'src/models/question.model'
 import type { QuestionSortOption } from './QuestionSortOptions'
 
@@ -40,7 +40,7 @@ const search = async (
 const getQuestionCategories = async () => {
   try {
     const response = await fetch('/api/categories/questions')
-    return (await response.json()) as DBCategory[]
+    return (await response.json()) as Category[]
   } catch (error) {
     logger.error('Failed to fetch questions', { error })
     return []