fix: store directory

Author: imrim12

app/@layouts/types.ts

@@ -2,7 +2,7 @@ import type { OffsetOptions } from '@floating-ui/dom'
 import type { RouteLocationRaw, RouteRecordNormalized } from 'vue-router'
 import type { AppContentLayoutNav, ContentWidth, FooterType, HorizontalNavType, NavbarType } from '@base/@layouts/enums'
 import type { Component } from 'vue'
-import type { Actions, Subjects } from '@base/utils/casl'
+import type { Actions, Subjects } from '~/stores/casl'
 
 export interface LayoutConfig {
   app: {

app/app.vue

@@ -21,7 +21,7 @@ const { global } = useTheme()
 if (isMobile)
   configStore.appContentLayoutNav = 'vertical'
 
-const notificationStore = useNotificationStore()
+const notificationStore = useMessageStore()
 const layoutStore = useLayoutStore()
 
 onBeforeMount(async () => {

app/components/AppPagination.vue

@@ -5,6 +5,13 @@ defineProps<{
 
 const limit = defineModel('limit', { type: Number, required: true })
 const page = defineModel('page', { type: Number, required: true })
+
+function paginationMeta<T extends { page: number, itemsPerPage: number }>(options: T, total: number) {
+  const start = (options.page - 1) * options.itemsPerPage + 1
+  const end = Math.min(options.page * options.itemsPerPage, total)
+
+  return `${total === 0 ? 0 : start} - ${end} of ${total}`
+}
 </script>
 
 <template>

app/layouts/components/NavBarNotifications.vue

@@ -3,7 +3,7 @@ import { formatDistanceToNow } from '#imports'
 
 type Notification = any
 
-const systemNotificationStore = useSystemNotificationStore()
+const systemNotificationStore = useNotificationStore()
 const emptyNotification = ref(false)
 const location = ref('bottom end' as const)
 const badgeProps = ref<object>({})

app/utils/auth.ts app/stores/auth.tsapp/utils/auth.ts renamed to app/stores/auth.ts

@@ -1,6 +1,6 @@
 import type { InferSelectModel } from 'drizzle-orm'
 import type { sysPermissionTable } from '@base/server/db/schemas'
-import type { Actions, Rule, Subjects } from '@base/utils/casl'
+import type { Actions, Rule, Subjects } from '~/stores/casl'
 
 type Permission = InferSelectModel<typeof sysPermissionTable>
 

app/utils/casl.ts app/stores/casl.tsapp/utils/casl.ts renamed to app/stores/casl.ts

@@ -0,0 +1,81 @@
+export type NotificationLocation = 'top' | 'bottom'
+
+export type NotificationType = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error'
+
+export interface NotifyOptions {
+  type?: NotificationType
+  location?: NotificationLocation
+  timeout?: number
+  outline?: boolean
+  link?: string
+}
+
+export const useMessageStore = defineStore('message', () => {
+  const notificationVisible = ref(false)
+  const notificationLocation = ref<NotificationLocation>('bottom')
+  const notificationMessage = ref('')
+  const notificationType = ref<NotificationType>()
+  const notificationTimeout = ref(3000)
+  const notificationOutline = ref(false)
+  const notificationLink = ref('')
+
+  const confirmationMessage = ref('')
+
+  const notificationProps = computed(() => ({
+    modelValue: notificationVisible.value,
+    location: notificationLocation.value,
+    color: notificationType.value,
+    timeout: notificationTimeout.value,
+    outline: notificationOutline.value,
+    multiline: true,
+    link: notificationLink.value,
+  }))
+
+  function showNotification(message: string, options?: NotifyOptions) {
+    notificationVisible.value = true
+    notificationMessage.value = message
+    notificationType.value = options?.type
+    notificationLocation.value = options?.location || 'bottom'
+    notificationTimeout.value = options?.timeout || 10000
+    notificationOutline.value = options?.outline || false
+    notificationLink.value = options?.link || ''
+
+    setTimeout(hideNotification, options?.timeout || notificationTimeout.value)
+  }
+
+  function hideNotification() {
+    notificationVisible.value = false
+    notificationMessage.value = ''
+    notificationType.value = 'success'
+    notificationLocation.value = 'bottom'
+    notificationTimeout.value = 3000
+    notificationLink.value = ''
+  }
+
+  let confirmationResolver: (value: boolean) => void
+  function showConfirmation(message: string) {
+    confirmationMessage.value = message
+
+    return new Promise<boolean>((resolve) => {
+      confirmationResolver = resolve
+    })
+  }
+
+  function resolveConfirmation(value: boolean) {
+    if (confirmationResolver) {
+      confirmationResolver(value)
+
+      confirmationMessage.value = ''
+    }
+  }
+
+  return {
+    notificationProps,
+    notificationMessage,
+    confirmationMessage,
+    showNotification,
+    hideNotification,
+    showConfirmation,
+    resolveConfirmation,
+  }
+})

app/stores/message.ts

@@ -1,81 +1,57 @@
-export type NotificationLocation = 'top' | 'bottom'
+import type { InferSelectModel } from 'drizzle-orm'
+import type { sysNotificationTable } from '@base/server/db/schemas/sys_notifications.schema.js'
+import type { ParsedFilterQuery } from '@base/server/utils/filter'
 
-export type NotificationType = 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'error'
-
-export interface NotifyOptions {
-  type?: NotificationType
-  location?: NotificationLocation
-  timeout?: number
-  outline?: boolean
-  link?: string
-}
+type Notification = InferSelectModel<typeof sysNotificationTable>
 
 export const useNotificationStore = defineStore('notification', () => {
-  const notificationVisible = ref(false)
-  const notificationLocation = ref<NotificationLocation>('bottom')
-  const notificationMessage = ref('')
-  const notificationType = ref<NotificationType>()
-  const notificationTimeout = ref(3000)
-  const notificationOutline = ref(false)
-  const notificationLink = ref('')
-
-  const confirmationMessage = ref('')
-
-  const notificationProps = computed(() => ({
-    modelValue: notificationVisible.value,
-    location: notificationLocation.value,
-    color: notificationType.value,
-    timeout: notificationTimeout.value,
-    outline: notificationOutline.value,
-    multiline: true,
-    link: notificationLink.value,
-  }))
-
-  function showNotification(message: string, options?: NotifyOptions) {
-    notificationVisible.value = true
-    notificationMessage.value = message
-    notificationType.value = options?.type
-    notificationLocation.value = options?.location || 'bottom'
-    notificationTimeout.value = options?.timeout || 10000
-    notificationOutline.value = options?.outline || false
-    notificationLink.value = options?.link || ''
-
-    setTimeout(hideNotification, options?.timeout || notificationTimeout.value)
+  async function fetchNotifications(query: Partial<ParsedFilterQuery>) {
+    return $api<Notification[]>('/notifications', {
+      query,
+    })
   }
 
-  function hideNotification() {
-    notificationVisible.value = false
-    notificationMessage.value = ''
-    notificationType.value = 'success'
-    notificationLocation.value = 'bottom'
-    notificationTimeout.value = 3000
-    notificationLink.value = ''
+  async function markRead(id: string) {
+    return $api<Notification>(`/notifications/${id}`, {
+      method: 'PATCH',
+      body: {
+        read_at: new Date(),
+      },
+    })
   }
 
-  let confirmationResolver: (value: boolean) => void
-  function showConfirmation(message: string) {
-    confirmationMessage.value = message
-
-    return new Promise<boolean>((resolve) => {
-      confirmationResolver = resolve
+  async function markUnread(id: string) {
+    return $api<Notification>(`/notifications/${id}`, {
+      method: 'PATCH',
+      body: {
+        read_at: null,
+      },
     })
   }
 
-  function resolveConfirmation(value: boolean) {
-    if (confirmationResolver) {
-      confirmationResolver(value)
+  async function markAllRead() {
+    return $api<Notification>('/notifications/mark-all-read', {
+      method: 'PATCH',
+    })
+  }
 
-      confirmationMessage.value = ''
-    }
+  async function markAllUnread() {
+    return $api<Notification>('/notifications/mark-all-unread', {
+      method: 'PATCH',
+    })
   }
 
+  async function deleteNotification(id: string) {
+    return $api<Notification>(`/notifications/${id}`, {
+      method: 'DELETE',
+    })
+  }
   return {
-    notificationProps,
-    notificationMessage,
-    confirmationMessage,
-    showNotification,
-    hideNotification,
-    showConfirmation,
-    resolveConfirmation,
+    fetchNotifications,
+    markRead,
+    markUnread,
+    markAllRead,
+    markAllUnread,
+    deleteNotification,
   }
 })