Brands list

Fixes #246

app/components/PerdSidebar/PerdSidebar.vue

@@ -36,6 +36,13 @@
           Equipment database
         </SidebarItem>
 
+        <SidebarItem
+          to="/brands"
+          icon="tabler:building-store"
+        >
+          Brands
+        </SidebarItem>
+
         <SidebarItem
           v-if="user.isAdmin"
           to="/manager/equipment"

app/composables/use-brands.ts

@@ -0,0 +1,11 @@
+export default function useBrands() {
+  // const brands = ref<Brand[]>([])
+
+  // onMounted(async () => {
+  //   brands.value = await fetchBrands()
+  // })
+
+  // return {
+  //   brands
+  // }
+}

app/pages/brands/index.vue

@@ -0,0 +1,43 @@
+
+<template>
+  <PageContent page-title="Brands">
+    <template #actions>
+      <PerdButton
+        small
+        icon="tabler:plus"
+        @click="onAddBrandClick"
+      >
+        Add brand
+      </PerdButton>
+    </template>
+
+    <EmptyState
+      icon="streamline-emojis:face-screaming-in-fear"
+    >
+      Can't load brands data
+    </EmptyState>
+  </PageContent>
+</template>
+
+<script lang="ts" setup>
+  import PageContent from '~/components/layout/PageContent.vue'
+  import PerdButton from '~/components/PerdButton.vue'
+  import EmptyState from '~/components/EmptyState.vue'
+
+  definePageMeta({
+    layout: 'page'
+  })
+
+  const router = useRouter()
+
+  function onAddBrandClick() {
+    router.push('/brands/add')
+  }
+</script>
+
+<style module>
+  .content {
+    display: grid;
+    row-gap: var(--spacing-12);
+  }
+</style>

constants.ts

@@ -17,5 +17,6 @@ export const limits = {
   maxEquipmentTypeNameLength: 32,
   maxOAuthProviderNameLength: 32,
   maxOAuthProviderTypeLength: 32,
-  maxUserNameLength: 32
+  maxUserNameLength: 32,
+  maxBrandNameLength: 64
 } as const

server/api/brands/index.get.ts

@@ -0,0 +1,28 @@
+import { asc, count, eq } from 'drizzle-orm'
+
+interface ReturnData {
+  readonly id: number;
+  readonly name: string;
+}
+
+export default defineEventHandler(async (event) : Promise<ReturnData[]> => {
+  const result = await event.context.db
+    .select({
+      id: tables.brands.id,
+      name: tables.brands.name,
+      websiteUrl: tables.brands.websiteUrl,
+      equipmentCount: count(tables.equipment.id)
+    })
+    .from(tables.brands)
+    .leftJoin(
+      tables.equipment,
+      eq(tables.equipment.brandId, tables.brands.id)
+    )
+    .groupBy(tables.brands.id)
+    .orderBy(
+      asc(tables.brands.name)
+    )
+    .limit(100)
+
+  return result
+})

server/api/equipment/items/index.post.ts

@@ -33,6 +33,14 @@ const bodySchema = v.object({
     v.number(),
     v.integer(),
     v.minValue(1)
+  ),
+
+  brandId: v.optional(
+    v.pipe(
+      v.number(),
+      v.integer(),
+      v.minValue(1)
+    )
   )
 })
 
@@ -46,13 +54,15 @@ export default defineEventHandler(async (event) => {
   const body = await readValidatedBody(event, validateBody)
   const status: EquipmentStatus = 'draft'
   const description = body.description ?? null
+  const brandId = body.brandId ?? null
 
   const [inserted] = await db
     .insert(tables.equipment)
     .values({
       description,
       status,
       creatorId: userId,
+      brandId,
       name: body.name,
       weight: body.weight,
       equipmentTypeId: body.typeId,

server/database/schema.ts

@@ -207,6 +207,35 @@ export const equipmentGroups = pgTable('equipmentGroups', {
     .$onUpdate(() => sql`now()`)
 })
 
+/**
+ * Brands table
+ *
+ * This table is used to store equipment brands
+ */
+
+export const brands = pgTable('brands', {
+  id:
+    serial()
+    .primaryKey(),
+
+  name:
+    varchar({
+      length: limits.maxBrandNameLength
+    })
+    .notNull(),
+
+  websiteUrl: varchar(),
+
+  createdAt:
+    timestamp({
+      withTimezone: true
+    })
+    .notNull()
+    .defaultNow()
+}, (table) => [
+  index().on(table.name)
+])
+
 /**
  * Equipment table
  *
@@ -258,6 +287,13 @@ export const equipment = pgTable('equipment', {
       onUpdate: 'cascade'
     }),
 
+  brandId:
+    integer()
+    .references(() => brands.id, {
+      onDelete: 'restrict',
+      onUpdate: 'cascade'
+    }),
+
   createdAt:
     timestamp({
       withTimezone: true
@@ -277,6 +313,7 @@ export const equipment = pgTable('equipment', {
 }, (table) => [
   index().on(table.equipmentTypeId),
   index().on(table.equipmentGroupId),
+  index().on(table.brandId),
 
   check(
     'equipment_description_check',
@@ -507,6 +544,10 @@ export const equipmentGroupsRelations = relations(equipmentGroups, ({ many }) =>
   equipment: many(equipment)
 }))
 
+export const brandsRelations = relations(brands, ({ many }) => ({
+  equipment: many(equipment)
+}))
+
 export const equipmentRelations = relations(equipment, ({ many, one }) => ({
   userEquipment: many(userEquipment),
   checklistItems: many(checklistItems),
@@ -525,6 +566,11 @@ export const equipmentRelations = relations(equipment, ({ many, one }) => ({
   creatorId: one(users, {
     fields: [equipment.creatorId],
     references: [users.id]
+  }),
+
+  brand: one(brands, {
+    fields: [equipment.brandId],
+    references: [brands.id]
   })
 }))