import { gql, useQuery } from "~/generated/graphql"
import { useSelector } from "../store"

export function useFileName(fileId?: string | null) {
  const { data: { file } = {} } = useQuery(FileTitleQuery, {
    variables: { id: fileId! },
    skip: !fileId,
  })

  return file?.name
}

export function useActiveFileName() {
  const fileId = useSelector(state => state.activeFileId)
  return useFileName(fileId)
}

const FileTitleQuery = gql<"FileTitleQuery">`
  query FileTitleQuery($id: ID!) {
    file(id: $id) {
      id
      name
    }
  }
`
