Appearance

Composable Types ​

File Information ​

  • Path: app/types/composables.ts
  • Purpose: TypeScript interfaces for composable return types and parameters
  • Exported From: ~/types (via index.ts)

Overview ​

This file contains TypeScript interfaces for composable return types, parameters, and related types. These types ensure type safety when using composables throughout the application.

Type Definitions ​

Folder Details Composable ​

UseFolderDetailsReturn ​

Return type for useFolderDetails composable.

typescript
interface UseFolderDetailsReturn {
  // State (Refs)
  folderCardKey: Ref<number>
  shareDialog: Ref<boolean>
  folderAssets: Ref<any[]>
  selected_items: Ref<any[]>
  currentPage: Ref<number>
  lastPage: Ref<number>
  total_assets: Ref<number>
  loading: Ref<boolean>
  contentLoading: Ref<boolean>
  pageScrolling: Ref<boolean>
  loadMore: Ref<boolean>
  download_all: Ref<boolean>
  downloadFld: Ref<boolean>
  folder: Ref<Folder | null>
  sort_loader: Ref<string>
  viewMode: Ref<'list' | 'grid'>
  share_selection: Ref<boolean>
  share_single_item: Ref<boolean>
  share_folder: Ref<boolean>
  download_items: Ref<any[]>
  folders2share: Ref<any[]>
  files2share: Ref<any[]>
  selectedFile: Ref<any | null>
  selectedFolder: Ref<any | null>
  flag: Ref<string>
  fileCardKey: Ref<number>
  internal_select_all: Ref<boolean>
  lastSelectedIndex: Ref<number>
  showArrowSort: Ref<Record<string, boolean>>
  // ... more state properties

  // Computed
  workspaceId: ComputedRef<string>
  selectAllClass: ComputedRef<string>
  truncatedDescription: ComputedRef<string>
  breadcrumbChildLnk: ComputedRef<any[]>
  selectedItemsCount: ComputedRef<number>
  selectedItemAssets: ComputedRef<number[]>
  selectedItemFolders: ComputedRef<number[]>
  select_all: Ref<boolean>
  mainFolderMenu: ComputedRef<Array<{...}>>
  listItemMenu: ComputedRef<Array<{...}>>
  getShareTitle: ComputedRef<string>
  getShareDescription: ComputedRef<string>

  // Methods
  fetchFolder: (flag?: string) => Promise<void>
  processAssetWithCache: (asset: any, selectAll?: boolean) => any
  handleScroll: (flag?: string) => Promise<void>
  toggleSelectAll: (flag?: boolean) => void
  toggleSelect: (file: any, index: number, event: any) => void
  downloadFile: (flag?: string) => Promise<void>
  openShareDialog: (payload: any[]) => void
  closeShareAssetDialog: () => void
  trackFolderClick: (folder: any) => void
  listItemClick: (payload: { label: string; file: any }) => Promise<void>
  isActiveArrow: (field: string) => string
  trackAssetClick: (asset: any) => void
  changeView: (data: 'list' | 'grid') => void
  removeFolderCache: (folderIds: number[]) => void
  getSrcPathRef: (file: any) => string
  toHumanlySize: (size: number) => string
  formatDate: (date: string) => string
  brandName: string
  handleSort: (flag: string) => void
  onFolderDownload: (folder: any) => void
  onAssetCardSelect: (asset: any, index: number, payload: any) => void
  onFolderCardSelect: (folder: any, index: number, event: Event) => void
  onBulkDownload: () => Promise<void>
}

Auth Composable ​

LoginCredentials ​

Login credentials structure.

typescript
interface LoginCredentials {
  email: string
  password: string
  userAgentAndLocation?: any
}

LoginOptions ​

Login options structure.

typescript
interface LoginOptions {
  isSupport?: Ref<boolean>
}

Workspace ​

Workspace data structure.

typescript
interface Workspace {
  id: number
  name: string
  [key: string]: any
}

Analytics Types ​

UserAgentAndLocation ​

User agent and location data.

typescript
interface UserAgentAndLocation {
  location?: string
  agent?: string
  userAgent?: string
  [key: string]: any
}

Share Table Composable Types ​

UseShareTableListItemProps ​

Share table list item props.

typescript
interface UseShareTableListItemProps {
  file: any
  index: number
}

UseShareTableListItemEmits ​

Share table list item emits.

typescript
interface UseShareTableListItemEmits {
  (e: 'download', file: any): void
  (e: 'revoke', file: any): void
  (e: 'delete', file: any): void
}

UseShareTableHeaderProps ​

Share table header props.

typescript
interface UseShareTableHeaderProps {
  headers: any[]
  sortBy?: string
  sortOrder?: 'ASC' | 'DESC'
}

UseShareTableHeaderEmits ​

Share table header emits.

typescript
interface UseShareTableHeaderEmits {
  (e: 'sort', payload: { sortBy: string; sortOrder: 'ASC' | 'DESC' }): void
}

View Mode Cache Composable ​

UseCachedViewModeReturn ​

Return type for useCachedViewMode composable.

typescript
interface UseCachedViewModeReturn {
  viewMode: Readonly<Ref<'list' | 'grid'>>
  setCachedViewMode: (mode: 'list' | 'grid') => void
}

Usage Examples ​

Using Composable Return Types ​

typescript
import type { UseFolderDetailsReturn } from '~/types'

export function useFolderDetails(): UseFolderDetailsReturn {
  // Implementation
  return {
    folder: ref(null),
    loading: ref(false),
    fetchFolder: async () => {},
    // ... other properties
  }
}

Using Login Credentials ​

typescript
import type { LoginCredentials } from '~/types'

const credentials: LoginCredentials = {
  email: '[email protected]',
  password: 'password123',
  userAgentAndLocation: {
    userAgent: navigator.userAgent,
    location: 'US'
  }
}

Using View Mode Cache ​

typescript
import type { UseCachedViewModeReturn } from '~/types'

const { viewMode, setCachedViewMode }: UseCachedViewModeReturn = useCachedViewMode()
  • Folder - From common.ts
  • FilterBuilderOptions - From common.ts
  • Ref, ComputedRef - From Vue

Import Example ​

typescript
import type {
  UseFolderDetailsReturn,
  LoginCredentials,
  LoginOptions,
  Workspace,
  UserAgentAndLocation,
  UseCachedViewModeReturn
} from '~/types'

Notes ​

  • All composable types are exported from ~/types
  • Return types include both state (Refs) and methods
  • Computed properties are typed as ComputedRef
  • Methods are typed as functions with proper signatures
  • Types ensure type safety when destructuring composables