Data Layer

Purpose

The Data Layer serves as a bridge between the frontend components and the frontend service layer. It provides a set of Tanstack Query hooks for executing queries and mutations, making it easier for developers to fetch and manipulate data from the server. By using these hooks, frontend developers can streamline data management, reduce boilerplate code, and ensure efficient data synchronization between the frontend and backend.

Tanstack Query Docs documentation site

Tanstack Query Hooks

The Data Layer offers a set of Tanstack Query hooks for performing queries and mutations. Here are some examples:

examples

usage:

import {useQuery} from 'tanstack/query'
import {SoftwareQueries, softwareKeys} from './path/to/queries'

const svc = new SoftwareService()

// query
export const useGetSoftwares = (query: SoftwareQueries) => {
  const res = useQuery({
    queryKey: softwareKeys.list(query),
    queryFn: () => svc.getSoftwares(query),
  })

  return {
    softwares: res.data ?? [],
    isPending: res.isPending,
    isError: res.isError,
  }
}

// mutation
export const useDeleteSoftware = () => {
  return useMutate(
    svc.deleteSoftware,
    softwareKeys.list(),
    SOFTWARE_TRACKING_TOASTS.deleteSoftwareTracking,
  )
}