@traky-app/ui 1.6.7 → 1.6.8

package/src/lib/file-items.ts

@@ -0,0 +1,99 @@
+export const STORAGE_FILE_PROVIDERS = ["traky", "legacy"] as const
+
+export type FileStorageProvider = (typeof STORAGE_FILE_PROVIDERS)[number]
+
+export type FileItem = {
+  name: string
+  url: string
+  type: string
+  /** `traky` = objeto nuevo; `legacy` = externo. El host decide el valor. */
+  provider?: FileStorageProvider
+}
+
+function inferMimeFromName(name: string) {
+  const lower = name.toLowerCase()
+  if (/\.pdf$/i.test(lower)) return "application/pdf"
+  if (/\.(webm)$/i.test(lower)) return "video/webm"
+  if (/\.(mp4|mov|mkv)$/i.test(lower)) return "video/mp4"
+  if (/\.(png|jpe?g|webp|gif|bmp|svg)$/i.test(lower)) return "image/jpeg"
+  return ""
+}
+
+function resolveFileProvider(explicit?: unknown): FileStorageProvider | undefined {
+  if (explicit === "traky" || explicit === "legacy") return explicit
+  return undefined
+}
+
+/** Normaliza entradas (strings, objetos incompletos o sin `type`). */
+export function normalizeFileItem(file: unknown): FileItem | null {
+  if (typeof file === "string" && file.trim()) {
+    const url = file.trim()
+    const name = url.split("/").pop()?.split("?")[0] || "archivo"
+    return {
+      name,
+      url,
+      type: inferMimeFromName(name),
+    }
+  }
+
+  if (!file || typeof file !== "object") return null
+
+  const item = file as Record<string, unknown>
+  const urlCandidate = [item.url, item.fileUrl, item.href, item.path, item.src].find(
+    (value) => typeof value === "string" && value.trim(),
+  )
+  if (typeof urlCandidate !== "string") return null
+
+  const url = urlCandidate.trim()
+  const name =
+    (typeof item.name === "string" && item.name.trim()) ||
+    (typeof item.fileName === "string" && item.fileName.trim()) ||
+    url.split("/").pop()?.split("?")[0] ||
+    "archivo"
+  const type =
+    (typeof item.type === "string" && item.type) ||
+    (typeof item.mimeType === "string" && item.mimeType) ||
+    inferMimeFromName(name) ||
+    inferMimeFromName(url)
+
+  return {
+    name,
+    url,
+    type,
+    provider: resolveFileProvider(item.provider),
+  }
+}
+
+export function normalizeFileItems(files: unknown): FileItem[] {
+  if (typeof files === "string") {
+    const trimmed = files.trim()
+    if (!trimmed) return []
+
+    if (trimmed.startsWith("[") || trimmed.startsWith("{")) {
+      try {
+        return normalizeFileItems(JSON.parse(trimmed) as unknown)
+      } catch {
+        // JSON inválido: tratar como URL suelta abajo.
+      }
+    }
+
+    const single = normalizeFileItem(trimmed)
+    return single ? [single] : []
+  }
+
+  if (files && typeof files === "object" && !Array.isArray(files)) {
+    const single = normalizeFileItem(files)
+    return single ? [single] : []
+  }
+
+  if (!Array.isArray(files)) return []
+  return files
+    .map(normalizeFileItem)
+    .filter((file): file is FileItem => file !== null)
+}
+
+export function fileListSignature(files: unknown): string {
+  return normalizeFileItems(files)
+    .map((file) => `${file.url}|${file.name}|${file.type}`)
+    .join("\n")
+}

package/src/lib/file-manager-utils.test.tsx

@@ -0,0 +1,71 @@
+import { describe, expect, it } from "vitest"
+import {
+  getFileDisplayName,
+  isAcceptedFile,
+  isImageFile,
+  isPdfFile,
+  toFileItem,
+} from "./file-manager-utils"
+import { normalizeFileItems } from "./file-items"
+
+describe("file-manager-utils", () => {
+  it("detecta imagen, pdf y tipos aceptados", () => {
+    expect(
+      isImageFile({ name: "a.png", url: "https://cdn.example/a.png", type: "" }),
+    ).toBe(true)
+    expect(
+      isPdfFile({
+        name: "doc.pdf",
+        url: "https://cdn.example/doc.pdf",
+        type: "",
+      }),
+    ).toBe(true)
+    expect(
+      isAcceptedFile(
+        new File(["x"], "foto.jpg", { type: "image/jpeg" }),
+        false,
+      ),
+    ).toBe(true)
+    expect(
+      isAcceptedFile(new File(["x"], "clip.mp4", { type: "video/mp4" }), false),
+    ).toBe(false)
+    expect(
+      isAcceptedFile(new File(["x"], "clip.mp4", { type: "video/mp4" }), true),
+    ).toBe(true)
+  })
+
+  it("arma FileItem desde el archivo subido", () => {
+    const file = new File(["x"], "bodega.webp", { type: "image/webp" })
+    expect(toFileItem(file, "https://cdn.example/bodega.webp", "traky")).toEqual({
+      name: "bodega.webp",
+      url: "https://cdn.example/bodega.webp",
+      type: "image/webp",
+      provider: "traky",
+    })
+  })
+
+  it("acorta nombres largos conservando extensión", () => {
+    expect(
+      getFileDisplayName(
+        {
+          name: "foto-de-bodega-muy-larga-para-mostrar.png",
+          url: "https://cdn.example/x.png",
+          type: "image/png",
+        },
+        20,
+      ),
+    ).toMatch(/…\.png$/)
+  })
+
+  it("normaliza JSON y conserva provider explícito", () => {
+    const files = normalizeFileItems({
+      url: "https://cdn.example.com/foto.jpg",
+      name: "foto.jpg",
+      provider: "legacy",
+    })
+    expect(files[0]).toMatchObject({
+      url: "https://cdn.example.com/foto.jpg",
+      provider: "legacy",
+    })
+  })
+})

package/src/lib/file-manager-utils.ts

@@ -0,0 +1,116 @@
+import type { FileItem, FileStorageProvider } from "./file-items"
+
+export const ACCEPTED_TYPES = ".png,.jpg,.jpeg,.webp,.gif,.pdf"
+export const ACCEPTED_TYPES_WITH_VIDEO =
+  ".png,.jpg,.jpeg,.webp,.gif,.pdf,.mp4,.webm,.mov,.mkv"
+export const ACCEPTED_MIME = [
+  "image/png",
+  "image/jpeg",
+  "image/webp",
+  "image/gif",
+  "application/pdf",
+]
+export const VIDEO_MIME = [
+  "video/mp4",
+  "video/webm",
+  "video/quicktime",
+  "video/x-matroska",
+]
+
+export function isImageFile(file: FileItem) {
+  const type = file.type ?? ""
+  const name = file.name ?? ""
+  const url = file.url ?? ""
+  return (
+    type.startsWith("image/") ||
+    /\.(png|jpe?g|gif|webp|bmp|svg)$/i.test(name) ||
+    /\.(png|jpe?g|gif|webp|bmp|svg)(\?|$)/i.test(url)
+  )
+}
+
+export function isPdfFile(file: FileItem) {
+  const type = file.type ?? ""
+  const name = file.name ?? ""
+  const url = file.url ?? ""
+  return (
+    type.includes("pdf") || /\.pdf$/i.test(name) || /\.pdf(\?|$)/i.test(url)
+  )
+}
+
+export function isVideoFile(file: FileItem) {
+  const type = file.type ?? ""
+  const name = file.name ?? ""
+  const url = file.url ?? ""
+  return (
+    type.startsWith("video/") ||
+    /\.(mp4|webm|mov|mkv)$/i.test(name) ||
+    /\.(mp4|webm|mov|mkv)(\?|$)/i.test(url)
+  )
+}
+
+export function isAcceptedFile(file: File, acceptVideos: boolean) {
+  const type = file.type ?? ""
+  if (ACCEPTED_MIME.includes(type)) return true
+  if (acceptVideos && (VIDEO_MIME.includes(type) || type.startsWith("video/"))) {
+    return true
+  }
+  if (/\.(png|jpe?g|webp|gif|pdf)$/i.test(file.name)) return true
+  if (acceptVideos && /\.(mp4|webm|mov|mkv)$/i.test(file.name)) return true
+  return false
+}
+
+export function getFileDisplayName(file: FileItem, maxLength = 40): string {
+  let label = file.name?.trim() ?? ""
+  const looksLikeUrl =
+    /^https?:\/\//i.test(label) || (label.length > 72 && !label.includes(" "))
+
+  if (!label || looksLikeUrl) {
+    try {
+      const pathname = decodeURIComponent(new URL(file.url ?? "").pathname)
+      const fromUrl = pathname.split("/").filter(Boolean).pop() ?? ""
+      if (fromUrl) label = fromUrl
+    } catch {
+      // ignore invalid URL
+    }
+  }
+
+  if (!label) return "Archivo"
+  if (label.length <= maxLength) return label
+
+  const dot = label.lastIndexOf(".")
+  const ext = dot > 0 && label.length - dot <= 8 ? label.slice(dot) : ""
+  const stem = ext ? label.slice(0, dot) : label
+  const budget = maxLength - ext.length - 1
+  if (budget < 8) return `${label.slice(0, maxLength - 1)}…`
+  return `${stem.slice(0, budget)}…${ext}`
+}
+
+export function getFileFullName(file: FileItem): string {
+  const label = file.name?.trim()
+  if (label && !/^https?:\/\//i.test(label)) return label
+  return getFileDisplayName(file, 200)
+}
+
+export function downloadFile(file: FileItem) {
+  const link = document.createElement("a")
+  link.href = file.url
+  link.download = file.name || "archivo"
+  link.target = "_blank"
+  link.rel = "noopener noreferrer"
+  document.body.appendChild(link)
+  link.click()
+  link.remove()
+}
+
+export function toFileItem(
+  file: File,
+  url: string,
+  provider?: FileStorageProvider,
+): FileItem {
+  return {
+    name: file.name,
+    url,
+    type: file.type,
+    ...(provider ? { provider } : {}),
+  }
+}