Store Types

File Information

• Path: app/types/stores.ts
• Purpose: TypeScript interfaces for Pinia stores
• Exported From: ~/types (via index.ts)

Overview

This file contains TypeScript interfaces for Pinia store state structures including auth store, app data store, and download store. These types ensure type safety for store state and actions.

Type Definitions

App Data Store

CacheOptions

Cache configuration options.

interface CacheOptions {
  force?: boolean
  ttlMs?: number
}

Properties:

• force?: boolean - Force refresh (bypass cache)
• ttlMs?: number - Time-to-live in milliseconds

Usage:

import type { CacheOptions } from '~/types'

const options: CacheOptions = {
  force: true,
  ttlMs: 5 * 60 * 1000 // 5 minutes
}

Auth Store

User

User data structure.

interface User {
  id: number
  email?: string
  name?: string
  workspace_id?: string | number
  dealer_user_id?: number
  instance_id?: number
  is_slider?: boolean
  is_backend_user?: number
  brand_name?: string
  url?: string
  accessibleInstances?: any[]
  settings?: Record<string, any>
  [key: string]: any
}

Properties:

• id: number - User ID
• email?: string - User email
• name?: string - User name
• workspace_id?: string | number - Workspace identifier
• dealer_user_id?: number - Dealer user ID
• instance_id?: number - Instance ID
• is_slider?: boolean - Slider preference
• is_backend_user?: number - Backend user flag
• brand_name?: string - Brand name
• url?: string - User URL
• accessibleInstances?: any[] - Accessible workspace instances
• settings?: Record<string, any> - User settings
• [key: string]: any - Additional properties

Usage:

import type { User } from '~/types'

const user: User = {
  id: 1,
  email: '[email protected]',
  name: 'John Doe',
  workspace_id: 123,
  accessibleInstances: []
}

App Data Store

Banner

Banner data structure.

interface Banner {
  id: number
  title: string
  description: string
  image: string
  url: string
  position: number
}

Properties:

• id: number - Banner ID
• title: string - Banner title
• description: string - Banner description
• image: string - Banner image URL
• url: string - Banner link URL
• position: number - Display position

Tile

Dashboard tile data structure.

interface Tile {
  id: number
  title: string
  icon: string
  url: string
  position: number
  image: string
}

Properties:

• id: number - Tile ID
• title: string - Tile title
• icon: string - Tile icon identifier
• url: string - Tile link URL
• position: number - Display position
• image: string - Tile image URL

File

File data structure.

interface File {
  id: number
  name: string
  type: string
  thumbnail: string
  download_url: string
  size?: number
}

Properties:

• id: number - File ID
• name: string - File name
• type: string - File type
• thumbnail: string - Thumbnail URL
• download_url: string - Download URL
• size?: number - File size in bytes

DashboardData

Dashboard metrics data structure.

interface DashboardData {
  trending_data: File[]
  recent_uploads: {
    images: File[]
    documents: File[]
    videos: File[]
    audios: File[]
  }
  total_images: number
  total_documents: number
  total_videos: number
  total_audios: number
}

Properties:

• trending_data: File[] - Trending assets
• recent_uploads - Recent uploads by type
• total_images: number - Total images count
• total_documents: number - Total documents count
• total_videos: number - Total videos count
• total_audios: number - Total audios count

AppDataState

App data store state structure.

interface AppDataState {
  bannerData: Banner[]
  tileData: Tile[]
  dashboardData: DashboardData | null
  folders: any[]
  leftMenuOpen: boolean
  scrollTo: string
  scrollToRecent: boolean
  logo: string
  brand: any
  subscriptionFeatures: any
}

Properties:

• bannerData: Banner[] - Banner carousel data
• tileData: Tile[] - Dashboard tiles
• dashboardData: DashboardData | null - Dashboard metrics
• folders: any[] - Folder list
• leftMenuOpen: boolean - Sidebar open state
• scrollTo: string - Scroll target
• scrollToRecent: boolean - Scroll to recent flag
• logo: string - Brand logo URL
• brand: any - Brand data
• subscriptionFeatures: any - Subscription features

Download Store

DownloadItem

Download item structure.

interface DownloadItem {
  url: string
  name: string
  progress: number
  loaded: number
  total: number
  downloading: boolean
  source?: unknown
  errorMessage?: string
  [key: string]: unknown // extras
}

Properties:

• url: string - Download URL
• name: string - File name
• progress: number - Download progress (0-100)
• loaded: number - Bytes loaded
• total: number - Total bytes
• downloading: boolean - Download in progress
• source?: unknown - Abort controller source
• errorMessage?: string - Error message if failed
• [key: string]: unknown - Additional properties

DownloaderState

Download store state structure.

interface DownloaderState {
  pinned: boolean
  expanded: boolean
  count: number
  files: Record<string, DownloadItem>
}

Properties:

• pinned: boolean - Download panel pinned state
• expanded: boolean - Download panel expanded state
• count: number - Number of active downloads
• files: Record<string, DownloadItem> - Download items by ID

Usage Examples

User Type

import type { User } from '~/types'

const user: User = {
  id: 1,
  email: '[email protected]',
  name: 'John Doe',
  workspace_id: 123,
  accessibleInstances: [
    { workspace_id: '123', brand_name: 'Brand 1' },
    { workspace_id: '456', brand_name: 'Brand 2' }
  ],
  settings: {
    is_slider: true,
    is_trading: true
  }
}

Dashboard Data

import type { DashboardData, File } from '~/types'

const dashboardData: DashboardData = {
  trending_data: [
    { id: 1, name: 'file1.jpg', type: 'jpg', thumbnail: '/thumb1.jpg', download_url: '/download/1' }
  ],
  recent_uploads: {
    images: [],
    documents: [],
    videos: [],
    audios: []
  },
  total_images: 100,
  total_documents: 50,
  total_videos: 25,
  total_audios: 10
}

Download Item

import type { DownloadItem } from '~/types'

const downloadItem: DownloadItem = {
  url: '/api/files/download/123',
  name: 'document.pdf',
  progress: 50,
  loaded: 1024,
  total: 2048,
  downloading: true
}

Cache Options

import type { CacheOptions } from '~/types'

// Force refresh
const forceOptions: CacheOptions = {
  force: true
}

// Custom TTL
const customTTLOptions: CacheOptions = {
  ttlMs: 10 * 60 * 1000 // 10 minutes
}

Related Types

• Used by Pinia stores
• Used by store composables

Import Example

import type {
  User,
  Banner,
  Tile,
  File,
  DashboardData,
  AppDataState,
  DownloadItem,
  DownloaderState,
  CacheOptions
} from '~/types'

Notes

• All store types are exported from ~/types
• Types match Pinia store state structures
• User type supports flexible properties
• DownloadItem supports additional properties via index signature
• CacheOptions used for store caching configuration

Related Documentation

• Auth Store - Authentication store
• App Data Store - Application data store
• Download Store - Download store