@ynput/ayon-frontend-shared 0.2.9 → 0.2.11

package/dist/shared/src/containers/Feed/components/CommentInput/helpers.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.cjs.js","sources":["../../../../../../../src/containers/Feed/components/CommentInput/helpers.tsx"],"sourcesContent":["// @ts-nocheck\n\n// remove any query parameters from the url\nexport const parseImages = (body) => {\n  //   find images in the markdown with format ![](image_url)\n  const regex = /!\\[.*?\\]\\((.*?)\\)/g\n  const matches = body.match(regex)\n\n  let newBody = body\n\n  if (matches) {\n    matches.forEach((match) => {\n      if (!match.includes('http')) return\n      const url = match.match(/\\(([^)]+)\\)/)[1]\n      const newUrl = url.split('?')[0]\n      newBody = body.replace(url, newUrl)\n    })\n  }\n\n  return newBody\n}\n\nexport async function typeWithDelay(quill, retain, type, delay = 1) {\n  for (let i = 0; i < type.length; i++) {\n    quill.insertText(retain + i, type[i])\n    await new Promise((resolve) => setTimeout(resolve, delay))\n  }\n}\n\nimport axios from 'axios'\nconst abortController = new AbortController()\nconst cancelToken = axios.CancelToken\nconst cancelTokenSource = cancelToken.source()\nimport { toast } from 'react-toastify'\n\n// used to upload files (quill ImageUploader module)\nexport const uploadFile = (file, projectName, onUploadProgress) => {\n  return new Promise((resolve, reject) => {\n    const formData = new FormData()\n    formData.append('image', file)\n    const opts = {\n      signal: abortController.signal,\n      cancelToken: cancelTokenSource.token,\n      onUploadProgress: (e) => onUploadProgress && onUploadProgress(e, file),\n      headers: {\n        'Content-Type': file.type,\n        'x-file-name': file.name,\n      },\n    }\n\n    axios\n      .post(`/api/projects/${projectName}/files`, file, opts)\n      .then((result) => {\n        resolve({ file: file, data: result.data })\n      })\n      .catch((error) => {\n        console.error(error)\n        reject({ message: 'Upload failed: ' + error.response.data.detail })\n      })\n  })\n}\n\nexport const handleFileDrop = (e, projectName, onProgress, onSuccess) => {\n  e.preventDefault()\n  e.stopPropagation()\n\n  let files = e.dataTransfer.files\n  if (files?.length) {\n    if (files.length === 0) return\n\n    for (const file of files) {\n      uploadFile(file, projectName, onProgress).then(\n        (data) => onSuccess(data),\n        (error) => {\n          toast.error('Upload failed: ' + error.response.data.detail)\n          console.warn(error)\n        },\n      )\n    }\n  }\n}\n"],"names":["toast"],"mappings":";;;;AAGa,MAAA,cAAc,CAAC,SAAS;AAEnC,QAAM,QAAQ;AACR,QAAA,UAAU,KAAK,MAAM,KAAK;AAEhC,MAAI,UAAU;AAEd,MAAI,SAAS;AACH,YAAA,QAAQ,CAAC,UAAU;AACzB,UAAI,CAAC,MAAM,SAAS,MAAM,EAAG;AAC7B,YAAM,MAAM,MAAM,MAAM,aAAa,EAAE,CAAC;AACxC,YAAM,SAAS,IAAI,MAAM,GAAG,EAAE,CAAC;AACrB,gBAAA,KAAK,QAAQ,KAAK,MAAM;AAAA,IAAA,CACnC;AAAA,EAAA;AAGI,SAAA;AACT;AAEA,eAAsB,cAAc,OAAO,QAAQ,MAAM,QAAQ,GAAG;AAClE,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,WAAW,SAAS,GAAG,KAAK,CAAC,CAAC;AACpC,UAAM,IAAI,QAAQ,CAAC,YAAY,WAAW,SAAS,KAAK,CAAC;AAAA,EAAA;AAE7D;AAGA,MAAM,kBAAkB,IAAI,gBAAgB;AAC5C,MAAM,cAAc,MAAM;AAC1B,MAAM,oBAAoB,YAAY,OAAO;AAItC,MAAM,aAAa,CAAC,MAAM,aAAa,qBAAqB;AACjE,SAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AAChC,UAAA,WAAW,IAAI,SAAS;AACrB,aAAA,OAAO,SAAS,IAAI;AAC7B,UAAM,OAAO;AAAA,MACX,QAAQ,gBAAgB;AAAA,MACxB,aAAa,kBAAkB;AAAA,MAC/B,kBAAkB,CAAC,MAAM,oBAAoB,iBAAiB,GAAG,IAAI;AAAA,MACrE,SAAS;AAAA,QACP,gBAAgB,KAAK;AAAA,QACrB,eAAe,KAAK;AAAA,MAAA;AAAA,IAExB;AAGG,UAAA,KAAK,iBAAiB,WAAW,UAAU,MAAM,IAAI,EACrD,KAAK,CAAC,WAAW;AAChB,cAAQ,EAAE,MAAY,MAAM,OAAO,MAAM;AAAA,IAAA,CAC1C,EACA,MAAM,CAAC,UAAU;AAChB,cAAQ,MAAM,KAAK;AACnB,aAAO,EAAE,SAAS,oBAAoB,MAAM,SAAS,KAAK,QAAQ;AAAA,IAAA,CACnE;AAAA,EAAA,CACJ;AACH;AAEO,MAAM,iBAAiB,CAAC,GAAG,aAAa,YAAY,cAAc;AACvE,IAAE,eAAe;AACjB,IAAE,gBAAgB;AAEd,MAAA,QAAQ,EAAE,aAAa;AAC3B,MAAI,+BAAO,QAAQ;AACb,QAAA,MAAM,WAAW,EAAG;AAExB,eAAW,QAAQ,OAAO;AACb,iBAAA,MAAM,aAAa,UAAU,EAAE;AAAA,QACxC,CAAC,SAAS,UAAU,IAAI;AAAA,QACxB,CAAC,UAAU;AACTA,wBAAA,MAAM,MAAM,oBAAoB,MAAM,SAAS,KAAK,MAAM;AAC1D,kBAAQ,KAAK,KAAK;AAAA,QAAA;AAAA,MAEtB;AAAA,IAAA;AAAA,EACF;AAEJ;;;;;"}
+{"version":3,"file":"helpers.cjs.js","sources":["../../../../../../../src/containers/Feed/components/CommentInput/helpers.tsx"],"sourcesContent":["// @ts-nocheck\n\n// remove any query parameters from the url\nexport const parseImages = (body) => {\n  //   find images in the markdown with format ![](image_url)\n  const regex = /!\\[.*?\\]\\((.*?)\\)/g\n  const matches = body.match(regex)\n\n  let newBody = body\n\n  if (matches) {\n    matches.forEach((match) => {\n      if (!match.includes('http')) return\n      const url = match.match(/\\(([^)]+)\\)/)[1]\n      const newUrl = url.split('?')[0]\n      newBody = body.replace(url, newUrl)\n    })\n  }\n\n  return newBody\n}\n\nexport async function typeWithDelay(quill, retain, type, delay = 1) {\n  for (let i = 0; i < type.length; i++) {\n    quill.insertText(retain + i, type[i])\n    await new Promise((resolve) => setTimeout(resolve, delay))\n  }\n}\n\nimport axios from 'axios'\nconst abortController = new AbortController()\nconst cancelToken = axios.CancelToken\nconst cancelTokenSource = cancelToken.source()\nimport { toast } from 'react-toastify'\n\ntype UploadedFile = {\n  file: any\n  data: any\n}\n\n// used to upload files (quill ImageUploader module)\nexport const uploadFile = (file, projectName, onUploadProgress): Promise<UploadedFile> => {\n  return new Promise((resolve, reject) => {\n    const formData = new FormData()\n    formData.append('image', file)\n    const opts = {\n      signal: abortController.signal,\n      cancelToken: cancelTokenSource.token,\n      onUploadProgress: (e) => onUploadProgress && onUploadProgress(e, file),\n      headers: {\n        'Content-Type': file.type,\n        'x-file-name': file.name,\n      },\n    }\n\n    axios\n      .post(`/api/projects/${projectName}/files`, file, opts)\n      .then((result) => {\n        resolve({ file: file, data: result.data })\n      })\n      .catch((error) => {\n        console.error(error)\n        reject({ message: 'Upload failed: ' + error.response.data.detail })\n      })\n  })\n}\n\nexport const handleFileDrop = (e, projectName, onProgress, onSuccess) => {\n  e.preventDefault()\n  e.stopPropagation()\n\n  let files = e.dataTransfer.files\n  if (files?.length) {\n    if (files.length === 0) return\n\n    for (const file of files) {\n      uploadFile(file, projectName, onProgress).then(\n        (data) => onSuccess(data),\n        (error) => {\n          toast.error('Upload failed: ' + error.response.data.detail)\n          console.warn(error)\n        },\n      )\n    }\n  }\n}\n"],"names":["toast"],"mappings":";;;;AAGa,MAAA,cAAc,CAAC,SAAS;AAEnC,QAAM,QAAQ;AACR,QAAA,UAAU,KAAK,MAAM,KAAK;AAEhC,MAAI,UAAU;AAEd,MAAI,SAAS;AACH,YAAA,QAAQ,CAAC,UAAU;AACzB,UAAI,CAAC,MAAM,SAAS,MAAM,EAAG;AAC7B,YAAM,MAAM,MAAM,MAAM,aAAa,EAAE,CAAC;AACxC,YAAM,SAAS,IAAI,MAAM,GAAG,EAAE,CAAC;AACrB,gBAAA,KAAK,QAAQ,KAAK,MAAM;AAAA,IAAA,CACnC;AAAA,EAAA;AAGI,SAAA;AACT;AAEA,eAAsB,cAAc,OAAO,QAAQ,MAAM,QAAQ,GAAG;AAClE,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,WAAW,SAAS,GAAG,KAAK,CAAC,CAAC;AACpC,UAAM,IAAI,QAAQ,CAAC,YAAY,WAAW,SAAS,KAAK,CAAC;AAAA,EAAA;AAE7D;AAGA,MAAM,kBAAkB,IAAI,gBAAgB;AAC5C,MAAM,cAAc,MAAM;AAC1B,MAAM,oBAAoB,YAAY,OAAO;AAStC,MAAM,aAAa,CAAC,MAAM,aAAa,qBAA4C;AACxF,SAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AAChC,UAAA,WAAW,IAAI,SAAS;AACrB,aAAA,OAAO,SAAS,IAAI;AAC7B,UAAM,OAAO;AAAA,MACX,QAAQ,gBAAgB;AAAA,MACxB,aAAa,kBAAkB;AAAA,MAC/B,kBAAkB,CAAC,MAAM,oBAAoB,iBAAiB,GAAG,IAAI;AAAA,MACrE,SAAS;AAAA,QACP,gBAAgB,KAAK;AAAA,QACrB,eAAe,KAAK;AAAA,MAAA;AAAA,IAExB;AAGG,UAAA,KAAK,iBAAiB,WAAW,UAAU,MAAM,IAAI,EACrD,KAAK,CAAC,WAAW;AAChB,cAAQ,EAAE,MAAY,MAAM,OAAO,MAAM;AAAA,IAAA,CAC1C,EACA,MAAM,CAAC,UAAU;AAChB,cAAQ,MAAM,KAAK;AACnB,aAAO,EAAE,SAAS,oBAAoB,MAAM,SAAS,KAAK,QAAQ;AAAA,IAAA,CACnE;AAAA,EAAA,CACJ;AACH;AAEO,MAAM,iBAAiB,CAAC,GAAG,aAAa,YAAY,cAAc;AACvE,IAAE,eAAe;AACjB,IAAE,gBAAgB;AAEd,MAAA,QAAQ,EAAE,aAAa;AAC3B,MAAI,+BAAO,QAAQ;AACb,QAAA,MAAM,WAAW,EAAG;AAExB,eAAW,QAAQ,OAAO;AACb,iBAAA,MAAM,aAAa,UAAU,EAAE;AAAA,QACxC,CAAC,SAAS,UAAU,IAAI;AAAA,QACxB,CAAC,UAAU;AACTA,wBAAA,MAAM,MAAM,oBAAoB,MAAM,SAAS,KAAK,MAAM;AAC1D,kBAAQ,KAAK,KAAK;AAAA,QAAA;AAAA,MAEtB;AAAA,IAAA;AAAA,EACF;AAEJ;;;;;"}

package/dist/shared/src/containers/Feed/components/CommentInput/helpers.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.es.js","sources":["../../../../../../../src/containers/Feed/components/CommentInput/helpers.tsx"],"sourcesContent":["// @ts-nocheck\n\n// remove any query parameters from the url\nexport const parseImages = (body) => {\n  //   find images in the markdown with format ![](image_url)\n  const regex = /!\\[.*?\\]\\((.*?)\\)/g\n  const matches = body.match(regex)\n\n  let newBody = body\n\n  if (matches) {\n    matches.forEach((match) => {\n      if (!match.includes('http')) return\n      const url = match.match(/\\(([^)]+)\\)/)[1]\n      const newUrl = url.split('?')[0]\n      newBody = body.replace(url, newUrl)\n    })\n  }\n\n  return newBody\n}\n\nexport async function typeWithDelay(quill, retain, type, delay = 1) {\n  for (let i = 0; i < type.length; i++) {\n    quill.insertText(retain + i, type[i])\n    await new Promise((resolve) => setTimeout(resolve, delay))\n  }\n}\n\nimport axios from 'axios'\nconst abortController = new AbortController()\nconst cancelToken = axios.CancelToken\nconst cancelTokenSource = cancelToken.source()\nimport { toast } from 'react-toastify'\n\n// used to upload files (quill ImageUploader module)\nexport const uploadFile = (file, projectName, onUploadProgress) => {\n  return new Promise((resolve, reject) => {\n    const formData = new FormData()\n    formData.append('image', file)\n    const opts = {\n      signal: abortController.signal,\n      cancelToken: cancelTokenSource.token,\n      onUploadProgress: (e) => onUploadProgress && onUploadProgress(e, file),\n      headers: {\n        'Content-Type': file.type,\n        'x-file-name': file.name,\n      },\n    }\n\n    axios\n      .post(`/api/projects/${projectName}/files`, file, opts)\n      .then((result) => {\n        resolve({ file: file, data: result.data })\n      })\n      .catch((error) => {\n        console.error(error)\n        reject({ message: 'Upload failed: ' + error.response.data.detail })\n      })\n  })\n}\n\nexport const handleFileDrop = (e, projectName, onProgress, onSuccess) => {\n  e.preventDefault()\n  e.stopPropagation()\n\n  let files = e.dataTransfer.files\n  if (files?.length) {\n    if (files.length === 0) return\n\n    for (const file of files) {\n      uploadFile(file, projectName, onProgress).then(\n        (data) => onSuccess(data),\n        (error) => {\n          toast.error('Upload failed: ' + error.response.data.detail)\n          console.warn(error)\n        },\n      )\n    }\n  }\n}\n"],"names":[],"mappings":";;AAGa,MAAA,cAAc,CAAC,SAAS;AAEnC,QAAM,QAAQ;AACR,QAAA,UAAU,KAAK,MAAM,KAAK;AAEhC,MAAI,UAAU;AAEd,MAAI,SAAS;AACH,YAAA,QAAQ,CAAC,UAAU;AACzB,UAAI,CAAC,MAAM,SAAS,MAAM,EAAG;AAC7B,YAAM,MAAM,MAAM,MAAM,aAAa,EAAE,CAAC;AACxC,YAAM,SAAS,IAAI,MAAM,GAAG,EAAE,CAAC;AACrB,gBAAA,KAAK,QAAQ,KAAK,MAAM;AAAA,IAAA,CACnC;AAAA,EAAA;AAGI,SAAA;AACT;AAEA,eAAsB,cAAc,OAAO,QAAQ,MAAM,QAAQ,GAAG;AAClE,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,WAAW,SAAS,GAAG,KAAK,CAAC,CAAC;AACpC,UAAM,IAAI,QAAQ,CAAC,YAAY,WAAW,SAAS,KAAK,CAAC;AAAA,EAAA;AAE7D;AAGA,MAAM,kBAAkB,IAAI,gBAAgB;AAC5C,MAAM,cAAc,MAAM;AAC1B,MAAM,oBAAoB,YAAY,OAAO;AAItC,MAAM,aAAa,CAAC,MAAM,aAAa,qBAAqB;AACjE,SAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AAChC,UAAA,WAAW,IAAI,SAAS;AACrB,aAAA,OAAO,SAAS,IAAI;AAC7B,UAAM,OAAO;AAAA,MACX,QAAQ,gBAAgB;AAAA,MACxB,aAAa,kBAAkB;AAAA,MAC/B,kBAAkB,CAAC,MAAM,oBAAoB,iBAAiB,GAAG,IAAI;AAAA,MACrE,SAAS;AAAA,QACP,gBAAgB,KAAK;AAAA,QACrB,eAAe,KAAK;AAAA,MAAA;AAAA,IAExB;AAGG,UAAA,KAAK,iBAAiB,WAAW,UAAU,MAAM,IAAI,EACrD,KAAK,CAAC,WAAW;AAChB,cAAQ,EAAE,MAAY,MAAM,OAAO,MAAM;AAAA,IAAA,CAC1C,EACA,MAAM,CAAC,UAAU;AAChB,cAAQ,MAAM,KAAK;AACnB,aAAO,EAAE,SAAS,oBAAoB,MAAM,SAAS,KAAK,QAAQ;AAAA,IAAA,CACnE;AAAA,EAAA,CACJ;AACH;AAEO,MAAM,iBAAiB,CAAC,GAAG,aAAa,YAAY,cAAc;AACvE,IAAE,eAAe;AACjB,IAAE,gBAAgB;AAEd,MAAA,QAAQ,EAAE,aAAa;AAC3B,MAAI,+BAAO,QAAQ;AACb,QAAA,MAAM,WAAW,EAAG;AAExB,eAAW,QAAQ,OAAO;AACb,iBAAA,MAAM,aAAa,UAAU,EAAE;AAAA,QACxC,CAAC,SAAS,UAAU,IAAI;AAAA,QACxB,CAAC,UAAU;AACT,gBAAM,MAAM,oBAAoB,MAAM,SAAS,KAAK,MAAM;AAC1D,kBAAQ,KAAK,KAAK;AAAA,QAAA;AAAA,MAEtB;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"helpers.es.js","sources":["../../../../../../../src/containers/Feed/components/CommentInput/helpers.tsx"],"sourcesContent":["// @ts-nocheck\n\n// remove any query parameters from the url\nexport const parseImages = (body) => {\n  //   find images in the markdown with format ![](image_url)\n  const regex = /!\\[.*?\\]\\((.*?)\\)/g\n  const matches = body.match(regex)\n\n  let newBody = body\n\n  if (matches) {\n    matches.forEach((match) => {\n      if (!match.includes('http')) return\n      const url = match.match(/\\(([^)]+)\\)/)[1]\n      const newUrl = url.split('?')[0]\n      newBody = body.replace(url, newUrl)\n    })\n  }\n\n  return newBody\n}\n\nexport async function typeWithDelay(quill, retain, type, delay = 1) {\n  for (let i = 0; i < type.length; i++) {\n    quill.insertText(retain + i, type[i])\n    await new Promise((resolve) => setTimeout(resolve, delay))\n  }\n}\n\nimport axios from 'axios'\nconst abortController = new AbortController()\nconst cancelToken = axios.CancelToken\nconst cancelTokenSource = cancelToken.source()\nimport { toast } from 'react-toastify'\n\ntype UploadedFile = {\n  file: any\n  data: any\n}\n\n// used to upload files (quill ImageUploader module)\nexport const uploadFile = (file, projectName, onUploadProgress): Promise<UploadedFile> => {\n  return new Promise((resolve, reject) => {\n    const formData = new FormData()\n    formData.append('image', file)\n    const opts = {\n      signal: abortController.signal,\n      cancelToken: cancelTokenSource.token,\n      onUploadProgress: (e) => onUploadProgress && onUploadProgress(e, file),\n      headers: {\n        'Content-Type': file.type,\n        'x-file-name': file.name,\n      },\n    }\n\n    axios\n      .post(`/api/projects/${projectName}/files`, file, opts)\n      .then((result) => {\n        resolve({ file: file, data: result.data })\n      })\n      .catch((error) => {\n        console.error(error)\n        reject({ message: 'Upload failed: ' + error.response.data.detail })\n      })\n  })\n}\n\nexport const handleFileDrop = (e, projectName, onProgress, onSuccess) => {\n  e.preventDefault()\n  e.stopPropagation()\n\n  let files = e.dataTransfer.files\n  if (files?.length) {\n    if (files.length === 0) return\n\n    for (const file of files) {\n      uploadFile(file, projectName, onProgress).then(\n        (data) => onSuccess(data),\n        (error) => {\n          toast.error('Upload failed: ' + error.response.data.detail)\n          console.warn(error)\n        },\n      )\n    }\n  }\n}\n"],"names":[],"mappings":";;AAGa,MAAA,cAAc,CAAC,SAAS;AAEnC,QAAM,QAAQ;AACR,QAAA,UAAU,KAAK,MAAM,KAAK;AAEhC,MAAI,UAAU;AAEd,MAAI,SAAS;AACH,YAAA,QAAQ,CAAC,UAAU;AACzB,UAAI,CAAC,MAAM,SAAS,MAAM,EAAG;AAC7B,YAAM,MAAM,MAAM,MAAM,aAAa,EAAE,CAAC;AACxC,YAAM,SAAS,IAAI,MAAM,GAAG,EAAE,CAAC;AACrB,gBAAA,KAAK,QAAQ,KAAK,MAAM;AAAA,IAAA,CACnC;AAAA,EAAA;AAGI,SAAA;AACT;AAEA,eAAsB,cAAc,OAAO,QAAQ,MAAM,QAAQ,GAAG;AAClE,WAAS,IAAI,GAAG,IAAI,KAAK,QAAQ,KAAK;AACpC,UAAM,WAAW,SAAS,GAAG,KAAK,CAAC,CAAC;AACpC,UAAM,IAAI,QAAQ,CAAC,YAAY,WAAW,SAAS,KAAK,CAAC;AAAA,EAAA;AAE7D;AAGA,MAAM,kBAAkB,IAAI,gBAAgB;AAC5C,MAAM,cAAc,MAAM;AAC1B,MAAM,oBAAoB,YAAY,OAAO;AAStC,MAAM,aAAa,CAAC,MAAM,aAAa,qBAA4C;AACxF,SAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AAChC,UAAA,WAAW,IAAI,SAAS;AACrB,aAAA,OAAO,SAAS,IAAI;AAC7B,UAAM,OAAO;AAAA,MACX,QAAQ,gBAAgB;AAAA,MACxB,aAAa,kBAAkB;AAAA,MAC/B,kBAAkB,CAAC,MAAM,oBAAoB,iBAAiB,GAAG,IAAI;AAAA,MACrE,SAAS;AAAA,QACP,gBAAgB,KAAK;AAAA,QACrB,eAAe,KAAK;AAAA,MAAA;AAAA,IAExB;AAGG,UAAA,KAAK,iBAAiB,WAAW,UAAU,MAAM,IAAI,EACrD,KAAK,CAAC,WAAW;AAChB,cAAQ,EAAE,MAAY,MAAM,OAAO,MAAM;AAAA,IAAA,CAC1C,EACA,MAAM,CAAC,UAAU;AAChB,cAAQ,MAAM,KAAK;AACnB,aAAO,EAAE,SAAS,oBAAoB,MAAM,SAAS,KAAK,QAAQ;AAAA,IAAA,CACnE;AAAA,EAAA,CACJ;AACH;AAEO,MAAM,iBAAiB,CAAC,GAAG,aAAa,YAAY,cAAc;AACvE,IAAE,eAAe;AACjB,IAAE,gBAAgB;AAEd,MAAA,QAAQ,EAAE,aAAa;AAC3B,MAAI,+BAAO,QAAQ;AACb,QAAA,MAAM,WAAW,EAAG;AAExB,eAAW,QAAQ,OAAO;AACb,iBAAA,MAAM,aAAa,UAAU,EAAE;AAAA,QACxC,CAAC,SAAS,UAAU,IAAI;AAAA,QACxB,CAAC,UAAU;AACT,gBAAM,MAAM,oBAAoB,MAAM,SAAS,KAAK,MAAM;AAC1D,kBAAQ,KAAK,KAAK;AAAA,QAAA;AAAA,MAEtB;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.cjs.js

@@ -14,7 +14,7 @@ require("../../../../../context/AddonContext.cjs.js");
 const filterEntityAnnotations = (annotations, entityId, filesUploading) => {
   return Object.values(annotations).filter(
     (annotation) => annotation.versionId === entityId && !filesUploading.some((file) => file.name === annotation.name)
-  ).map((annotation) => ({ ...annotation, isAnnotation: true }));
+  ).map((annotation) => ({ ...annotation, isUnsavedAnnotation: true }));
 };
 const useAnnotationsSync = ({ entityId, filesUploading }) => {
   const { editingId, setEditingId, annotations, removeAnnotation } = FeedContext.useFeedContext();

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnnotationsSync.cjs.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { FEED_NEW_COMMENT, useFeedContext } from '../../../context/FeedContext'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  entityId: string\n  filesUploading: File[]\n}\n\nexport type AnnotationPreview = any & {\n  isAnnotation: true\n}\n\n// annotations are temporary store\nexport const filterEntityAnnotations = (\n  annotations: Record<string, any>,\n  entityId: string,\n  filesUploading: File[],\n): AnnotationPreview[] => {\n  return Object.values(annotations)\n    .filter(\n      (annotation) =>\n        annotation.versionId === entityId &&\n        !filesUploading.some((file) => file.name === annotation.name),\n    )\n    .map((annotation) => ({ ...annotation, isAnnotation: true })) as AnnotationPreview[]\n}\n\nconst useAnnotationsSync = ({ entityId, filesUploading }: Props) => {\n  const { editingId, setEditingId, annotations, removeAnnotation } = useFeedContext()\n  const { onGoToFrame } = useDetailsPanelContext()\n\n  // filter out annotations that are for this entity and are NOT uploading\n  const filteredAnnotations = filterEntityAnnotations(annotations || [], entityId, filesUploading)\n\n  // when annotations change, update the state\n  useEffect(() => {\n    // open the comment input if there are annotations and something is not being edited already\n    if (filteredAnnotations.length > 0 && !editingId) {\n      setEditingId(FEED_NEW_COMMENT)\n    }\n  }, [filteredAnnotations])\n\n  const handleGoToAnnotation = (annotation: AnnotationPreview) => {\n    const firstFrame = annotation.range[0]\n    onGoToFrame?.(firstFrame)\n  }\n\n  return {\n    annotations: filteredAnnotations,\n    goToAnnotation: handleGoToAnnotation,\n    removeAnnotation,\n  }\n}\n\nexport default useAnnotationsSync\n"],"names":["useFeedContext","useDetailsPanelContext","useEffect","FEED_NEW_COMMENT"],"mappings":";;;;;;;;;;;;;AAcO,MAAM,0BAA0B,CACrC,aACA,UACA,mBACwB;AACjB,SAAA,OAAO,OAAO,WAAW,EAC7B;AAAA,IACC,CAAC,eACC,WAAW,cAAc,YACzB,CAAC,eAAe,KAAK,CAAC,SAAS,KAAK,SAAS,WAAW,IAAI;AAAA,EAAA,EAE/D,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,cAAc,KAAA,EAAO;AAChE;AAEA,MAAM,qBAAqB,CAAC,EAAE,UAAU,qBAA4B;AAClE,QAAM,EAAE,WAAW,cAAc,aAAa,iBAAA,IAAqBA,YAAAA,eAAe;AAC5E,QAAA,EAAE,YAAY,IAAIC,2CAAuB;AAG/C,QAAM,sBAAsB,wBAAwB,eAAe,CAAA,GAAI,UAAU,cAAc;AAG/FC,QAAAA,UAAU,MAAM;AAEd,QAAI,oBAAoB,SAAS,KAAK,CAAC,WAAW;AAChD,mBAAaC,YAAAA,gBAAgB;AAAA,IAAA;AAAA,EAC/B,GACC,CAAC,mBAAmB,CAAC;AAElB,QAAA,uBAAuB,CAAC,eAAkC;AACxD,UAAA,aAAa,WAAW,MAAM,CAAC;AACrC,+CAAc;AAAA,EAChB;AAEO,SAAA;AAAA,IACL,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB;AAAA,EACF;AACF;;;"}
+{"version":3,"file":"useAnnotationsSync.cjs.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { FEED_NEW_COMMENT, useFeedContext } from '../../../context/FeedContext'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  entityId: string\n  filesUploading: File[]\n}\n\nexport type AnnotationPreview = any & {\n  isUnsavedAnnotation: true\n}\n\n// annotations are temporary store\nexport const filterEntityAnnotations = (\n  annotations: Record<string, any>,\n  entityId: string,\n  filesUploading: File[],\n): AnnotationPreview[] => {\n  return Object.values(annotations)\n    .filter(\n      (annotation) =>\n        annotation.versionId === entityId &&\n        !filesUploading.some((file) => file.name === annotation.name),\n    )\n    .map((annotation) => ({ ...annotation, isUnsavedAnnotation: true })) as AnnotationPreview[]\n}\n\nconst useAnnotationsSync = ({ entityId, filesUploading }: Props) => {\n  const { editingId, setEditingId, annotations, removeAnnotation } = useFeedContext()\n  const { onGoToFrame } = useDetailsPanelContext()\n\n  // filter out annotations that are for this entity and are NOT uploading\n  const filteredAnnotations = filterEntityAnnotations(annotations || [], entityId, filesUploading)\n\n  // when annotations change, update the state\n  useEffect(() => {\n    // open the comment input if there are annotations and something is not being edited already\n    if (filteredAnnotations.length > 0 && !editingId) {\n      setEditingId(FEED_NEW_COMMENT)\n    }\n  }, [filteredAnnotations])\n\n  const handleGoToAnnotation = (annotation: AnnotationPreview) => {\n    const firstFrame = annotation.range[0]\n    onGoToFrame?.(firstFrame)\n  }\n\n  return {\n    annotations: filteredAnnotations,\n    goToAnnotation: handleGoToAnnotation,\n    removeAnnotation,\n  }\n}\n\nexport default useAnnotationsSync\n"],"names":["useFeedContext","useDetailsPanelContext","useEffect","FEED_NEW_COMMENT"],"mappings":";;;;;;;;;;;;;AAcO,MAAM,0BAA0B,CACrC,aACA,UACA,mBACwB;AACjB,SAAA,OAAO,OAAO,WAAW,EAC7B;AAAA,IACC,CAAC,eACC,WAAW,cAAc,YACzB,CAAC,eAAe,KAAK,CAAC,SAAS,KAAK,SAAS,WAAW,IAAI;AAAA,EAAA,EAE/D,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,qBAAqB,KAAA,EAAO;AACvE;AAEA,MAAM,qBAAqB,CAAC,EAAE,UAAU,qBAA4B;AAClE,QAAM,EAAE,WAAW,cAAc,aAAa,iBAAA,IAAqBA,YAAAA,eAAe;AAC5E,QAAA,EAAE,YAAY,IAAIC,2CAAuB;AAG/C,QAAM,sBAAsB,wBAAwB,eAAe,CAAA,GAAI,UAAU,cAAc;AAG/FC,QAAAA,UAAU,MAAM;AAEd,QAAI,oBAAoB,SAAS,KAAK,CAAC,WAAW;AAChD,mBAAaC,YAAAA,gBAAgB;AAAA,IAAA;AAAA,EAC/B,GACC,CAAC,mBAAmB,CAAC;AAElB,QAAA,uBAAuB,CAAC,eAAkC;AACxD,UAAA,aAAa,WAAW,MAAM,CAAC;AACrC,+CAAc;AAAA,EAChB;AAEO,SAAA;AAAA,IACL,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB;AAAA,EACF;AACF;;;"}

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.es.js

@@ -12,7 +12,7 @@ import "../../../../../context/AddonContext.es.js";
 const filterEntityAnnotations = (annotations, entityId, filesUploading) => {
   return Object.values(annotations).filter(
     (annotation) => annotation.versionId === entityId && !filesUploading.some((file) => file.name === annotation.name)
-  ).map((annotation) => ({ ...annotation, isAnnotation: true }));
+  ).map((annotation) => ({ ...annotation, isUnsavedAnnotation: true }));
 };
 const useAnnotationsSync = ({ entityId, filesUploading }) => {
   const { editingId, setEditingId, annotations, removeAnnotation } = useFeedContext();

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnnotationsSync.es.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { FEED_NEW_COMMENT, useFeedContext } from '../../../context/FeedContext'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  entityId: string\n  filesUploading: File[]\n}\n\nexport type AnnotationPreview = any & {\n  isAnnotation: true\n}\n\n// annotations are temporary store\nexport const filterEntityAnnotations = (\n  annotations: Record<string, any>,\n  entityId: string,\n  filesUploading: File[],\n): AnnotationPreview[] => {\n  return Object.values(annotations)\n    .filter(\n      (annotation) =>\n        annotation.versionId === entityId &&\n        !filesUploading.some((file) => file.name === annotation.name),\n    )\n    .map((annotation) => ({ ...annotation, isAnnotation: true })) as AnnotationPreview[]\n}\n\nconst useAnnotationsSync = ({ entityId, filesUploading }: Props) => {\n  const { editingId, setEditingId, annotations, removeAnnotation } = useFeedContext()\n  const { onGoToFrame } = useDetailsPanelContext()\n\n  // filter out annotations that are for this entity and are NOT uploading\n  const filteredAnnotations = filterEntityAnnotations(annotations || [], entityId, filesUploading)\n\n  // when annotations change, update the state\n  useEffect(() => {\n    // open the comment input if there are annotations and something is not being edited already\n    if (filteredAnnotations.length > 0 && !editingId) {\n      setEditingId(FEED_NEW_COMMENT)\n    }\n  }, [filteredAnnotations])\n\n  const handleGoToAnnotation = (annotation: AnnotationPreview) => {\n    const firstFrame = annotation.range[0]\n    onGoToFrame?.(firstFrame)\n  }\n\n  return {\n    annotations: filteredAnnotations,\n    goToAnnotation: handleGoToAnnotation,\n    removeAnnotation,\n  }\n}\n\nexport default useAnnotationsSync\n"],"names":[],"mappings":";;;;;;;;;;;AAcO,MAAM,0BAA0B,CACrC,aACA,UACA,mBACwB;AACjB,SAAA,OAAO,OAAO,WAAW,EAC7B;AAAA,IACC,CAAC,eACC,WAAW,cAAc,YACzB,CAAC,eAAe,KAAK,CAAC,SAAS,KAAK,SAAS,WAAW,IAAI;AAAA,EAAA,EAE/D,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,cAAc,KAAA,EAAO;AAChE;AAEA,MAAM,qBAAqB,CAAC,EAAE,UAAU,qBAA4B;AAClE,QAAM,EAAE,WAAW,cAAc,aAAa,iBAAA,IAAqB,eAAe;AAC5E,QAAA,EAAE,YAAY,IAAI,uBAAuB;AAG/C,QAAM,sBAAsB,wBAAwB,eAAe,CAAA,GAAI,UAAU,cAAc;AAG/F,YAAU,MAAM;AAEd,QAAI,oBAAoB,SAAS,KAAK,CAAC,WAAW;AAChD,mBAAa,gBAAgB;AAAA,IAAA;AAAA,EAC/B,GACC,CAAC,mBAAmB,CAAC;AAElB,QAAA,uBAAuB,CAAC,eAAkC;AACxD,UAAA,aAAa,WAAW,MAAM,CAAC;AACrC,+CAAc;AAAA,EAChB;AAEO,SAAA;AAAA,IACL,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB;AAAA,EACF;AACF;"}
+{"version":3,"file":"useAnnotationsSync.es.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.ts"],"sourcesContent":["import { useEffect } from 'react'\nimport { FEED_NEW_COMMENT, useFeedContext } from '../../../context/FeedContext'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  entityId: string\n  filesUploading: File[]\n}\n\nexport type AnnotationPreview = any & {\n  isUnsavedAnnotation: true\n}\n\n// annotations are temporary store\nexport const filterEntityAnnotations = (\n  annotations: Record<string, any>,\n  entityId: string,\n  filesUploading: File[],\n): AnnotationPreview[] => {\n  return Object.values(annotations)\n    .filter(\n      (annotation) =>\n        annotation.versionId === entityId &&\n        !filesUploading.some((file) => file.name === annotation.name),\n    )\n    .map((annotation) => ({ ...annotation, isUnsavedAnnotation: true })) as AnnotationPreview[]\n}\n\nconst useAnnotationsSync = ({ entityId, filesUploading }: Props) => {\n  const { editingId, setEditingId, annotations, removeAnnotation } = useFeedContext()\n  const { onGoToFrame } = useDetailsPanelContext()\n\n  // filter out annotations that are for this entity and are NOT uploading\n  const filteredAnnotations = filterEntityAnnotations(annotations || [], entityId, filesUploading)\n\n  // when annotations change, update the state\n  useEffect(() => {\n    // open the comment input if there are annotations and something is not being edited already\n    if (filteredAnnotations.length > 0 && !editingId) {\n      setEditingId(FEED_NEW_COMMENT)\n    }\n  }, [filteredAnnotations])\n\n  const handleGoToAnnotation = (annotation: AnnotationPreview) => {\n    const firstFrame = annotation.range[0]\n    onGoToFrame?.(firstFrame)\n  }\n\n  return {\n    annotations: filteredAnnotations,\n    goToAnnotation: handleGoToAnnotation,\n    removeAnnotation,\n  }\n}\n\nexport default useAnnotationsSync\n"],"names":[],"mappings":";;;;;;;;;;;AAcO,MAAM,0BAA0B,CACrC,aACA,UACA,mBACwB;AACjB,SAAA,OAAO,OAAO,WAAW,EAC7B;AAAA,IACC,CAAC,eACC,WAAW,cAAc,YACzB,CAAC,eAAe,KAAK,CAAC,SAAS,KAAK,SAAS,WAAW,IAAI;AAAA,EAAA,EAE/D,IAAI,CAAC,gBAAgB,EAAE,GAAG,YAAY,qBAAqB,KAAA,EAAO;AACvE;AAEA,MAAM,qBAAqB,CAAC,EAAE,UAAU,qBAA4B;AAClE,QAAM,EAAE,WAAW,cAAc,aAAa,iBAAA,IAAqB,eAAe;AAC5E,QAAA,EAAE,YAAY,IAAI,uBAAuB;AAG/C,QAAM,sBAAsB,wBAAwB,eAAe,CAAA,GAAI,UAAU,cAAc;AAG/F,YAAU,MAAM;AAEd,QAAI,oBAAoB,SAAS,KAAK,CAAC,WAAW;AAChD,mBAAa,gBAAgB;AAAA,IAAA;AAAA,EAC/B,GACC,CAAC,mBAAmB,CAAC;AAElB,QAAA,uBAAuB,CAAC,eAAkC;AACxD,UAAA,aAAa,WAAW,MAAM,CAAC;AACrC,+CAAc;AAAA,EAChB;AAEO,SAAA;AAAA,IACL,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB;AAAA,EACF;AACF;"}

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.cjs.js

@@ -7,37 +7,49 @@ const useAnnotationsUpload = ({ projectName, onSuccess }) => {
   const uploadAnnotations = async (annotations) => {
     try {
       const uploadPromises = annotations.map(async (annotation) => {
-        const blob = await (exportAnnotationComposite == null ? void 0 : exportAnnotationComposite(annotation.id));
-        if (!blob) {
+        const composite = await (exportAnnotationComposite == null ? void 0 : exportAnnotationComposite(annotation.id));
+        if (!composite) {
           throw new Error(`Exporting composite image for annotation ${annotation.id} failed`);
         }
-        const file = new File([blob], annotation.name, {
+        const compositeFile = new File([composite], annotation.name, {
           type: "image/png"
         });
-        return helpers.uploadFile(file, projectName, () => {
+        const transparent = await fetch(annotation.annotationData).then((r) => r.blob());
+        const transparentFile = new File([transparent], `annotation-${annotation.name}`, {
+          type: "image/png"
         });
+        const uploads = await Promise.all([
+          helpers.uploadFile(compositeFile, projectName, () => {
+          }),
+          helpers.uploadFile(transparentFile, projectName, () => {
+          })
+        ]);
+        return { annotation, uploads };
       });
       const res = await Promise.allSettled(uploadPromises);
       const successfulFiles = [];
+      const metadata = [];
       res.forEach((result) => {
-        var _a;
         if (result.status === "fulfilled") {
-          const newFile = onSuccess(result.value);
-          successfulFiles.push(newFile);
-          const annotationId = (_a = annotations.find(
-            (annotation) => annotation.name === result.value.file.name
-          )) == null ? void 0 : _a.id;
-          if (annotationId) {
-            removeAnnotation == null ? void 0 : removeAnnotation(annotationId);
-          }
+          const { uploads, annotation } = result.value;
+          uploads.forEach((upload) => {
+            successfulFiles.push(onSuccess(upload));
+          });
+          metadata.push({
+            range: annotation.range,
+            id: annotation.id,
+            composite: uploads[0].data.id,
+            transparent: uploads[1].data.id
+          });
+          removeAnnotation == null ? void 0 : removeAnnotation(annotation.id);
         } else {
           reactToastify.toast.error("Upload failed: " + result.reason.message);
         }
       });
-      return successfulFiles;
+      return { files: successfulFiles, metadata };
     } catch (error) {
       reactToastify.toast.error("Upload failed: " + error.message);
-      return [];
+      return { files: [], metadata: [] };
     }
   };
   return uploadAnnotations;

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnnotationsUpload.cjs.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.ts"],"sourcesContent":["import { uploadFile } from '../helpers'\nimport { toast } from 'react-toastify'\nimport { useFeedContext } from '../../../context/FeedContext'\n\ntype Props = {\n  projectName: string\n  onSuccess: (data: any) => void\n}\n\nconst useAnnotationsUpload = ({ projectName, onSuccess }: Props) => {\n  const { removeAnnotation, exportAnnotationComposite } = useFeedContext()\n\n  const uploadAnnotations = async (annotations: any[]) => {\n    try {\n      const uploadPromises = annotations.map(async (annotation) => {\n        const blob = await exportAnnotationComposite?.(annotation.id)\n        if (!blob) {\n          throw new Error(`Exporting composite image for annotation ${annotation.id} failed`)\n        }\n\n        const file = new File([blob], annotation.name, {\n          type: 'image/png',\n        })\n\n        return uploadFile(file, projectName, () => {})\n      })\n\n      const res = await Promise.allSettled(uploadPromises)\n\n      const successfulFiles: any[] = []\n      //   for each result, if successful use callback\n      res.forEach((result: any) => {\n        if (result.status === 'fulfilled') {\n          const newFile = onSuccess(result.value)\n\n          successfulFiles.push(newFile)\n\n          const annotationId = annotations.find(\n            (annotation) => annotation.name === result.value.file.name,\n          )?.id\n          if (annotationId) {\n            removeAnnotation?.(annotationId)\n          }\n        } else {\n          toast.error('Upload failed: ' + result.reason.message)\n        }\n      })\n\n      return successfulFiles\n    } catch (error: any) {\n      toast.error('Upload failed: ' + error.message)\n      return []\n    }\n  }\n\n  return uploadAnnotations\n}\n\nexport default useAnnotationsUpload\n\nconst base64ToBlob = (base64: string) => {\n  const byteString = atob(base64.split(',')[1])\n  const mimeString = base64.split(',')[0].split(':')[1].split(';')[0]\n  const ab = new ArrayBuffer(byteString.length)\n  const ia = new Uint8Array(ab)\n  for (let i = 0; i < byteString.length; i++) {\n    ia[i] = byteString.charCodeAt(i)\n  }\n  return new Blob([ab], { type: mimeString })\n}\n"],"names":["useFeedContext","uploadFile","toast"],"mappings":";;;;AASA,MAAM,uBAAuB,CAAC,EAAE,aAAa,gBAAuB;AAClE,QAAM,EAAE,kBAAkB,0BAA0B,IAAIA,2BAAe;AAEjE,QAAA,oBAAoB,OAAO,gBAAuB;AAClD,QAAA;AACF,YAAM,iBAAiB,YAAY,IAAI,OAAO,eAAe;AAC3D,cAAM,OAAO,OAAM,uEAA4B,WAAW;AAC1D,YAAI,CAAC,MAAM;AACT,gBAAM,IAAI,MAAM,4CAA4C,WAAW,EAAE,SAAS;AAAA,QAAA;AAGpF,cAAM,OAAO,IAAI,KAAK,CAAC,IAAI,GAAG,WAAW,MAAM;AAAA,UAC7C,MAAM;AAAA,QAAA,CACP;AAEM,eAAAC,QAAA,WAAW,MAAM,aAAa,MAAM;AAAA,QAAA,CAAE;AAAA,MAAA,CAC9C;AAED,YAAM,MAAM,MAAM,QAAQ,WAAW,cAAc;AAEnD,YAAM,kBAAyB,CAAC;AAE5B,UAAA,QAAQ,CAAC,WAAgB;;AACvB,YAAA,OAAO,WAAW,aAAa;AAC3B,gBAAA,UAAU,UAAU,OAAO,KAAK;AAEtC,0BAAgB,KAAK,OAAO;AAE5B,gBAAM,gBAAe,iBAAY;AAAA,YAC/B,CAAC,eAAe,WAAW,SAAS,OAAO,MAAM,KAAK;AAAA,UAAA,MADnC,mBAElB;AACH,cAAI,cAAc;AAChB,iEAAmB;AAAA,UAAY;AAAA,QACjC,OACK;AACLC,wBAAAA,MAAM,MAAM,oBAAoB,OAAO,OAAO,OAAO;AAAA,QAAA;AAAA,MACvD,CACD;AAEM,aAAA;AAAA,aACA,OAAY;AACbA,oBAAAA,MAAA,MAAM,oBAAoB,MAAM,OAAO;AAC7C,aAAO,CAAC;AAAA,IAAA;AAAA,EAEZ;AAEO,SAAA;AACT;;"}
+{"version":3,"file":"useAnnotationsUpload.cjs.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.ts"],"sourcesContent":["import { uploadFile } from '../helpers'\nimport { toast } from 'react-toastify'\nimport { useFeedContext } from '../../../context/FeedContext'\nimport { SavedAnnotationMetadata } from '../../../index'\n\ntype Props = {\n  projectName: string\n  onSuccess: (data: any) => void\n}\n\nconst useAnnotationsUpload = ({ projectName, onSuccess }: Props) => {\n  const { removeAnnotation, exportAnnotationComposite } = useFeedContext()\n\n  const uploadAnnotations = async (annotations: any[]) => {\n    try {\n      const uploadPromises = annotations.map(async (annotation) => {\n        const composite = await exportAnnotationComposite?.(annotation.id)\n        if (!composite) {\n          throw new Error(`Exporting composite image for annotation ${annotation.id} failed`)\n        }\n\n        const compositeFile = new File([composite], annotation.name, {\n          type: 'image/png',\n        })\n\n        const transparent = await fetch(annotation.annotationData).then(r => r.blob())\n        const transparentFile = new File([transparent], `annotation-${annotation.name}`, {\n          type: 'image/png',\n        })\n\n        const uploads = await Promise.all([\n          uploadFile(compositeFile, projectName, () => {}),\n          uploadFile(transparentFile, projectName, () => {}),\n        ])\n\n        return { annotation, uploads }\n      })\n\n      const res = await Promise.allSettled(uploadPromises)\n\n      const successfulFiles: any[] = []\n      const metadata: SavedAnnotationMetadata[] = []\n\n      res.forEach((result) => {\n        if (result.status === 'fulfilled') {\n          const { uploads, annotation } = result.value\n\n          uploads.forEach((upload: any) => {\n            successfulFiles.push(onSuccess(upload))\n          })\n\n          metadata.push({\n            range: annotation.range,\n            id: annotation.id,\n            composite: uploads[0].data.id,\n            transparent: uploads[1].data.id,\n          })\n\n          removeAnnotation?.(annotation.id)\n        } else {\n          toast.error('Upload failed: ' + result.reason.message)\n        }\n      })\n\n      return { files: successfulFiles, metadata }\n    } catch (error: any) {\n      toast.error('Upload failed: ' + error.message)\n      return { files: [], metadata: [] }\n    }\n  }\n\n  return uploadAnnotations\n}\n\nexport default useAnnotationsUpload\n\nconst base64ToBlob = (base64: string) => {\n  const byteString = atob(base64.split(',')[1])\n  const mimeString = base64.split(',')[0].split(':')[1].split(';')[0]\n  const ab = new ArrayBuffer(byteString.length)\n  const ia = new Uint8Array(ab)\n  for (let i = 0; i < byteString.length; i++) {\n    ia[i] = byteString.charCodeAt(i)\n  }\n  return new Blob([ab], { type: mimeString })\n}\n"],"names":["useFeedContext","uploadFile","toast"],"mappings":";;;;AAUA,MAAM,uBAAuB,CAAC,EAAE,aAAa,gBAAuB;AAClE,QAAM,EAAE,kBAAkB,0BAA0B,IAAIA,2BAAe;AAEjE,QAAA,oBAAoB,OAAO,gBAAuB;AAClD,QAAA;AACF,YAAM,iBAAiB,YAAY,IAAI,OAAO,eAAe;AAC3D,cAAM,YAAY,OAAM,uEAA4B,WAAW;AAC/D,YAAI,CAAC,WAAW;AACd,gBAAM,IAAI,MAAM,4CAA4C,WAAW,EAAE,SAAS;AAAA,QAAA;AAGpF,cAAM,gBAAgB,IAAI,KAAK,CAAC,SAAS,GAAG,WAAW,MAAM;AAAA,UAC3D,MAAM;AAAA,QAAA,CACP;AAEK,cAAA,cAAc,MAAM,MAAM,WAAW,cAAc,EAAE,KAAK,CAAA,MAAK,EAAE,MAAM;AACvE,cAAA,kBAAkB,IAAI,KAAK,CAAC,WAAW,GAAG,cAAc,WAAW,IAAI,IAAI;AAAA,UAC/E,MAAM;AAAA,QAAA,CACP;AAEK,cAAA,UAAU,MAAM,QAAQ,IAAI;AAAA,UAChCC,mBAAW,eAAe,aAAa,MAAM;AAAA,UAAA,CAAE;AAAA,UAC/CA,mBAAW,iBAAiB,aAAa,MAAM;AAAA,UAAE,CAAA;AAAA,QAAA,CAClD;AAEM,eAAA,EAAE,YAAY,QAAQ;AAAA,MAAA,CAC9B;AAED,YAAM,MAAM,MAAM,QAAQ,WAAW,cAAc;AAEnD,YAAM,kBAAyB,CAAC;AAChC,YAAM,WAAsC,CAAC;AAEzC,UAAA,QAAQ,CAAC,WAAW;AAClB,YAAA,OAAO,WAAW,aAAa;AACjC,gBAAM,EAAE,SAAS,WAAW,IAAI,OAAO;AAE/B,kBAAA,QAAQ,CAAC,WAAgB;AACf,4BAAA,KAAK,UAAU,MAAM,CAAC;AAAA,UAAA,CACvC;AAED,mBAAS,KAAK;AAAA,YACZ,OAAO,WAAW;AAAA,YAClB,IAAI,WAAW;AAAA,YACf,WAAW,QAAQ,CAAC,EAAE,KAAK;AAAA,YAC3B,aAAa,QAAQ,CAAC,EAAE,KAAK;AAAA,UAAA,CAC9B;AAED,+DAAmB,WAAW;AAAA,QAAE,OAC3B;AACLC,wBAAAA,MAAM,MAAM,oBAAoB,OAAO,OAAO,OAAO;AAAA,QAAA;AAAA,MACvD,CACD;AAEM,aAAA,EAAE,OAAO,iBAAiB,SAAS;AAAA,aACnC,OAAY;AACbA,oBAAAA,MAAA,MAAM,oBAAoB,MAAM,OAAO;AAC7C,aAAO,EAAE,OAAO,IAAI,UAAU,CAAA,EAAG;AAAA,IAAA;AAAA,EAErC;AAEO,SAAA;AACT;;"}

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.es.js

@@ -6,37 +6,49 @@ const useAnnotationsUpload = ({ projectName, onSuccess }) => {
   const uploadAnnotations = async (annotations) => {
     try {
       const uploadPromises = annotations.map(async (annotation) => {
-        const blob = await (exportAnnotationComposite == null ? void 0 : exportAnnotationComposite(annotation.id));
-        if (!blob) {
+        const composite = await (exportAnnotationComposite == null ? void 0 : exportAnnotationComposite(annotation.id));
+        if (!composite) {
           throw new Error(`Exporting composite image for annotation ${annotation.id} failed`);
         }
-        const file = new File([blob], annotation.name, {
+        const compositeFile = new File([composite], annotation.name, {
           type: "image/png"
         });
-        return uploadFile(file, projectName, () => {
+        const transparent = await fetch(annotation.annotationData).then((r) => r.blob());
+        const transparentFile = new File([transparent], `annotation-${annotation.name}`, {
+          type: "image/png"
         });
+        const uploads = await Promise.all([
+          uploadFile(compositeFile, projectName, () => {
+          }),
+          uploadFile(transparentFile, projectName, () => {
+          })
+        ]);
+        return { annotation, uploads };
       });
       const res = await Promise.allSettled(uploadPromises);
       const successfulFiles = [];
+      const metadata = [];
       res.forEach((result) => {
-        var _a;
         if (result.status === "fulfilled") {
-          const newFile = onSuccess(result.value);
-          successfulFiles.push(newFile);
-          const annotationId = (_a = annotations.find(
-            (annotation) => annotation.name === result.value.file.name
-          )) == null ? void 0 : _a.id;
-          if (annotationId) {
-            removeAnnotation == null ? void 0 : removeAnnotation(annotationId);
-          }
+          const { uploads, annotation } = result.value;
+          uploads.forEach((upload) => {
+            successfulFiles.push(onSuccess(upload));
+          });
+          metadata.push({
+            range: annotation.range,
+            id: annotation.id,
+            composite: uploads[0].data.id,
+            transparent: uploads[1].data.id
+          });
+          removeAnnotation == null ? void 0 : removeAnnotation(annotation.id);
         } else {
           toast.error("Upload failed: " + result.reason.message);
         }
       });
-      return successfulFiles;
+      return { files: successfulFiles, metadata };
     } catch (error) {
       toast.error("Upload failed: " + error.message);
-      return [];
+      return { files: [], metadata: [] };
     }
   };
   return uploadAnnotations;

package/dist/shared/src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnnotationsUpload.es.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.ts"],"sourcesContent":["import { uploadFile } from '../helpers'\nimport { toast } from 'react-toastify'\nimport { useFeedContext } from '../../../context/FeedContext'\n\ntype Props = {\n  projectName: string\n  onSuccess: (data: any) => void\n}\n\nconst useAnnotationsUpload = ({ projectName, onSuccess }: Props) => {\n  const { removeAnnotation, exportAnnotationComposite } = useFeedContext()\n\n  const uploadAnnotations = async (annotations: any[]) => {\n    try {\n      const uploadPromises = annotations.map(async (annotation) => {\n        const blob = await exportAnnotationComposite?.(annotation.id)\n        if (!blob) {\n          throw new Error(`Exporting composite image for annotation ${annotation.id} failed`)\n        }\n\n        const file = new File([blob], annotation.name, {\n          type: 'image/png',\n        })\n\n        return uploadFile(file, projectName, () => {})\n      })\n\n      const res = await Promise.allSettled(uploadPromises)\n\n      const successfulFiles: any[] = []\n      //   for each result, if successful use callback\n      res.forEach((result: any) => {\n        if (result.status === 'fulfilled') {\n          const newFile = onSuccess(result.value)\n\n          successfulFiles.push(newFile)\n\n          const annotationId = annotations.find(\n            (annotation) => annotation.name === result.value.file.name,\n          )?.id\n          if (annotationId) {\n            removeAnnotation?.(annotationId)\n          }\n        } else {\n          toast.error('Upload failed: ' + result.reason.message)\n        }\n      })\n\n      return successfulFiles\n    } catch (error: any) {\n      toast.error('Upload failed: ' + error.message)\n      return []\n    }\n  }\n\n  return uploadAnnotations\n}\n\nexport default useAnnotationsUpload\n\nconst base64ToBlob = (base64: string) => {\n  const byteString = atob(base64.split(',')[1])\n  const mimeString = base64.split(',')[0].split(':')[1].split(';')[0]\n  const ab = new ArrayBuffer(byteString.length)\n  const ia = new Uint8Array(ab)\n  for (let i = 0; i < byteString.length; i++) {\n    ia[i] = byteString.charCodeAt(i)\n  }\n  return new Blob([ab], { type: mimeString })\n}\n"],"names":[],"mappings":";;;AASA,MAAM,uBAAuB,CAAC,EAAE,aAAa,gBAAuB;AAClE,QAAM,EAAE,kBAAkB,0BAA0B,IAAI,eAAe;AAEjE,QAAA,oBAAoB,OAAO,gBAAuB;AAClD,QAAA;AACF,YAAM,iBAAiB,YAAY,IAAI,OAAO,eAAe;AAC3D,cAAM,OAAO,OAAM,uEAA4B,WAAW;AAC1D,YAAI,CAAC,MAAM;AACT,gBAAM,IAAI,MAAM,4CAA4C,WAAW,EAAE,SAAS;AAAA,QAAA;AAGpF,cAAM,OAAO,IAAI,KAAK,CAAC,IAAI,GAAG,WAAW,MAAM;AAAA,UAC7C,MAAM;AAAA,QAAA,CACP;AAEM,eAAA,WAAW,MAAM,aAAa,MAAM;AAAA,QAAA,CAAE;AAAA,MAAA,CAC9C;AAED,YAAM,MAAM,MAAM,QAAQ,WAAW,cAAc;AAEnD,YAAM,kBAAyB,CAAC;AAE5B,UAAA,QAAQ,CAAC,WAAgB;;AACvB,YAAA,OAAO,WAAW,aAAa;AAC3B,gBAAA,UAAU,UAAU,OAAO,KAAK;AAEtC,0BAAgB,KAAK,OAAO;AAE5B,gBAAM,gBAAe,iBAAY;AAAA,YAC/B,CAAC,eAAe,WAAW,SAAS,OAAO,MAAM,KAAK;AAAA,UAAA,MADnC,mBAElB;AACH,cAAI,cAAc;AAChB,iEAAmB;AAAA,UAAY;AAAA,QACjC,OACK;AACL,gBAAM,MAAM,oBAAoB,OAAO,OAAO,OAAO;AAAA,QAAA;AAAA,MACvD,CACD;AAEM,aAAA;AAAA,aACA,OAAY;AACb,YAAA,MAAM,oBAAoB,MAAM,OAAO;AAC7C,aAAO,CAAC;AAAA,IAAA;AAAA,EAEZ;AAEO,SAAA;AACT;"}
+{"version":3,"file":"useAnnotationsUpload.es.js","sources":["../../../../../../../../src/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.ts"],"sourcesContent":["import { uploadFile } from '../helpers'\nimport { toast } from 'react-toastify'\nimport { useFeedContext } from '../../../context/FeedContext'\nimport { SavedAnnotationMetadata } from '../../../index'\n\ntype Props = {\n  projectName: string\n  onSuccess: (data: any) => void\n}\n\nconst useAnnotationsUpload = ({ projectName, onSuccess }: Props) => {\n  const { removeAnnotation, exportAnnotationComposite } = useFeedContext()\n\n  const uploadAnnotations = async (annotations: any[]) => {\n    try {\n      const uploadPromises = annotations.map(async (annotation) => {\n        const composite = await exportAnnotationComposite?.(annotation.id)\n        if (!composite) {\n          throw new Error(`Exporting composite image for annotation ${annotation.id} failed`)\n        }\n\n        const compositeFile = new File([composite], annotation.name, {\n          type: 'image/png',\n        })\n\n        const transparent = await fetch(annotation.annotationData).then(r => r.blob())\n        const transparentFile = new File([transparent], `annotation-${annotation.name}`, {\n          type: 'image/png',\n        })\n\n        const uploads = await Promise.all([\n          uploadFile(compositeFile, projectName, () => {}),\n          uploadFile(transparentFile, projectName, () => {}),\n        ])\n\n        return { annotation, uploads }\n      })\n\n      const res = await Promise.allSettled(uploadPromises)\n\n      const successfulFiles: any[] = []\n      const metadata: SavedAnnotationMetadata[] = []\n\n      res.forEach((result) => {\n        if (result.status === 'fulfilled') {\n          const { uploads, annotation } = result.value\n\n          uploads.forEach((upload: any) => {\n            successfulFiles.push(onSuccess(upload))\n          })\n\n          metadata.push({\n            range: annotation.range,\n            id: annotation.id,\n            composite: uploads[0].data.id,\n            transparent: uploads[1].data.id,\n          })\n\n          removeAnnotation?.(annotation.id)\n        } else {\n          toast.error('Upload failed: ' + result.reason.message)\n        }\n      })\n\n      return { files: successfulFiles, metadata }\n    } catch (error: any) {\n      toast.error('Upload failed: ' + error.message)\n      return { files: [], metadata: [] }\n    }\n  }\n\n  return uploadAnnotations\n}\n\nexport default useAnnotationsUpload\n\nconst base64ToBlob = (base64: string) => {\n  const byteString = atob(base64.split(',')[1])\n  const mimeString = base64.split(',')[0].split(':')[1].split(';')[0]\n  const ab = new ArrayBuffer(byteString.length)\n  const ia = new Uint8Array(ab)\n  for (let i = 0; i < byteString.length; i++) {\n    ia[i] = byteString.charCodeAt(i)\n  }\n  return new Blob([ab], { type: mimeString })\n}\n"],"names":[],"mappings":";;;AAUA,MAAM,uBAAuB,CAAC,EAAE,aAAa,gBAAuB;AAClE,QAAM,EAAE,kBAAkB,0BAA0B,IAAI,eAAe;AAEjE,QAAA,oBAAoB,OAAO,gBAAuB;AAClD,QAAA;AACF,YAAM,iBAAiB,YAAY,IAAI,OAAO,eAAe;AAC3D,cAAM,YAAY,OAAM,uEAA4B,WAAW;AAC/D,YAAI,CAAC,WAAW;AACd,gBAAM,IAAI,MAAM,4CAA4C,WAAW,EAAE,SAAS;AAAA,QAAA;AAGpF,cAAM,gBAAgB,IAAI,KAAK,CAAC,SAAS,GAAG,WAAW,MAAM;AAAA,UAC3D,MAAM;AAAA,QAAA,CACP;AAEK,cAAA,cAAc,MAAM,MAAM,WAAW,cAAc,EAAE,KAAK,CAAA,MAAK,EAAE,MAAM;AACvE,cAAA,kBAAkB,IAAI,KAAK,CAAC,WAAW,GAAG,cAAc,WAAW,IAAI,IAAI;AAAA,UAC/E,MAAM;AAAA,QAAA,CACP;AAEK,cAAA,UAAU,MAAM,QAAQ,IAAI;AAAA,UAChC,WAAW,eAAe,aAAa,MAAM;AAAA,UAAA,CAAE;AAAA,UAC/C,WAAW,iBAAiB,aAAa,MAAM;AAAA,UAAE,CAAA;AAAA,QAAA,CAClD;AAEM,eAAA,EAAE,YAAY,QAAQ;AAAA,MAAA,CAC9B;AAED,YAAM,MAAM,MAAM,QAAQ,WAAW,cAAc;AAEnD,YAAM,kBAAyB,CAAC;AAChC,YAAM,WAAsC,CAAC;AAEzC,UAAA,QAAQ,CAAC,WAAW;AAClB,YAAA,OAAO,WAAW,aAAa;AACjC,gBAAM,EAAE,SAAS,WAAW,IAAI,OAAO;AAE/B,kBAAA,QAAQ,CAAC,WAAgB;AACf,4BAAA,KAAK,UAAU,MAAM,CAAC;AAAA,UAAA,CACvC;AAED,mBAAS,KAAK;AAAA,YACZ,OAAO,WAAW;AAAA,YAClB,IAAI,WAAW;AAAA,YACf,WAAW,QAAQ,CAAC,EAAE,KAAK;AAAA,YAC3B,aAAa,QAAQ,CAAC,EAAE,KAAK;AAAA,UAAA,CAC9B;AAED,+DAAmB,WAAW;AAAA,QAAE,OAC3B;AACL,gBAAM,MAAM,oBAAoB,OAAO,OAAO,OAAO;AAAA,QAAA;AAAA,MACvD,CACD;AAEM,aAAA,EAAE,OAAO,iBAAiB,SAAS;AAAA,aACnC,OAAY;AACb,YAAA,MAAM,oBAAoB,MAAM,OAAO;AAC7C,aAAO,EAAE,OAAO,IAAI,UAAU,CAAA,EAAG;AAAA,IAAA;AAAA,EAErC;AAEO,SAAA;AACT;"}

package/dist/shared/src/containers/Feed/components/FileUploadCard/FileUploadCard.cjs.js

@@ -5,6 +5,15 @@ const FileUploadCard_styled = require("./FileUploadCard.styled.cjs.js");
 const clsx = require("clsx");
 const React = require("react");
 const FileUploadPreview = require("../FileUploadPreview/FileUploadPreview.cjs.js");
+require("../../../../context/RemoteModulesContext.cjs.js");
+const DetailsPanelContext = require("../../../../context/DetailsPanelContext.cjs.js");
+require("../../../../context/ThumbnailUploaderContext.cjs.js");
+require("../../../../context/SettingsPanelContext.cjs.js");
+require("../../../../context/pip/PiPProvider.cjs.js");
+require("react-dom");
+require("../../../../context/pip/PiPWrapper.cjs.js");
+require("../../../../context/AddonProjectContext.cjs.js");
+require("../../../../context/AddonContext.cjs.js");
 const fileIcons = {
   // special cases
   description: ["doc"],
@@ -60,31 +69,30 @@ const FileUploadCard = ({
   name,
   mime,
   src,
-  isAnnotation,
+  isUnsavedAnnotation,
+  savedAnnotation,
   size,
   progress,
   onRemove,
   isCompact,
   isDownloadable = false,
   onExpand,
+  onJumpTo,
   className,
   ...props
 }) => {
   const inProgress = progress && progress < 100;
   const [imageError, setImageError] = React.useState(false);
+  const { feedAnnotationsEnabled } = DetailsPanelContext.useDetailsPanelContext();
   const nameParts = name.split(".");
   const extension = nameParts.pop() || "";
   const fileName = nameParts.join(".");
   const isPreviewable = FileUploadPreview.isFilePreviewable(mime || "." + extension);
-  const isImage = (mime == null ? void 0 : mime.includes("image/")) || isAnnotation;
+  const isImage = (mime == null ? void 0 : mime.includes("image/")) || isUnsavedAnnotation;
   const downloadComponent = /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("span", { className: "size", children: ayonReactComponents.getFileSizeString(size) }),
     /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ayonReactComponents.Icon, { icon: "download", className: "download-icon" })
   ] });
-  const handleImageClick = () => {
-    if (!isPreviewable && !isAnnotation || !onExpand || imageError) return;
-    onExpand();
-  };
   return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
     FileUploadCard_styled.File,
     {
@@ -92,21 +100,23 @@ const FileUploadCard = ({
         compact: isCompact,
         isDownloadable,
         isPreviewable,
-        isAnnotation
+        isUnsavedAnnotation
       }),
       ...props,
       children: [
         /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
           FileUploadCard_styled.ContentWrapper,
           {
-            className: clsx("content-wrapper", { isPreviewable, isAnnotation }),
-            onClick: handleImageClick,
+            className: clsx("content-wrapper", { isPreviewable, isUnsavedAnnotation }),
             children: [
               /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ayonReactComponents.Icon, { icon: getIconForType(mime || "." + extension), className: "type-icon" }),
               isImage && src && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
                 FileUploadCard_styled.ImageWrapper,
                 {
-                  className: clsx({ isDownloadable: isDownloadable || isPreviewable || isAnnotation }),
+                  className: clsx({
+                    "image-wrapper": true,
+                    isDownloadable: isDownloadable || isPreviewable || isUnsavedAnnotation
+                  }),
                   children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
                     "img",
                     {
@@ -119,8 +129,26 @@ const FileUploadCard = ({
                   )
                 }
               ),
-              isPreviewable && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ayonReactComponents.Icon, { icon: "open_in_full", className: "expand-icon" }),
-              isAnnotation && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(ayonReactComponents.Icon, { icon: "play_circle", className: "expand-icon" })
+              /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(FileUploadCard_styled.Buttons, { className: "expand-buttons", children: [
+                isPreviewable && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+                  FileUploadCard_styled.ExpandButton,
+                  {
+                    "data-tooltip": "Open preview",
+                    icon: "open_in_full",
+                    variant: "nav",
+                    onClick: onExpand
+                  }
+                ),
+                (isUnsavedAnnotation || feedAnnotationsEnabled && savedAnnotation) && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+                  FileUploadCard_styled.ExpandButton,
+                  {
+                    "data-tooltip": "Jump to annotation",
+                    icon: "play_circle",
+                    variant: "nav",
+                    onClick: onJumpTo
+                  }
+                )
+              ] })
             ]
           }
         ),

package/dist/shared/src/containers/Feed/components/FileUploadCard/FileUploadCard.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadCard.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadCard/FileUploadCard.tsx"],"sourcesContent":["import { Button, getFileSizeString, Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './FileUploadCard.styled'\nimport clsx from 'clsx'\nimport { useState } from 'react'\nimport { isFilePreviewable } from '../FileUploadPreview'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  isAnnotation?: boolean\n  size: number\n  progress: number\n  onRemove?: () => void\n  isCompact?: boolean\n  isDownloadable?: boolean\n  onExpand?: () => void\n}\n\nconst fileIcons: { [key: string]: string[] } = {\n  // special cases\n  description: ['doc'],\n  folder_zip: ['zip'],\n  code_blocks: [\n    'json',\n    'javascript',\n    'python',\n    'html',\n    'css',\n    '.py',\n    '.js',\n    '.html',\n    '.css',\n    '.json',\n    '.ts',\n  ],\n  brush: ['.psd', '.ai', '.xd', '.sketch'],\n  '3d_rotation': [\n    '.mb',\n    '.ma',\n    '.c4d',\n    '.blend',\n    '.max',\n    '.3ds',\n    '.lwo',\n    '.lws',\n    '.lxo',\n    '.hip',\n    '.hda',\n  ],\n  theaters: ['.aep', '.tpl', '.clip', '.nk', '.fusion', '.prproj', '.spsm', '.drp'],\n  picture_as_pdf: ['pdf', '.pdf'],\n  // default\n  image: ['image', '.png', '.jpg', '.jpeg', '.gif', '.svg', '.webp'],\n  videocam: ['video', '.mp4', '.mov', '.avi', '.mkv', '.webm', '.mxf'],\n  business_center: ['application'],\n  audio_file: ['audio'],\n  text_snippet: ['text'],\n  filter_none: ['sequence'],\n  font_download: ['font'],\n  deployed_code: ['model', '.obj', '.abc', '.stl', '.fbx', '.gltf', '.glb', '.usd'],\n}\n\nconst getIconForType = (type: string): string => {\n  for (const [icon, keywords] of Object.entries(fileIcons)) {\n    if (keywords.some((keyword) => type.includes(keyword))) {\n      return icon\n    }\n  }\n  return 'draft'\n}\n\nconst FileUploadCard = ({\n  name,\n  mime,\n  src,\n  isAnnotation,\n  size,\n  progress,\n  onRemove,\n  isCompact,\n  isDownloadable = false,\n  onExpand,\n  className,\n  ...props\n}: FileUploadCardProps) => {\n  const inProgress = progress && progress < 100\n\n  const [imageError, setImageError] = useState(false)\n\n  // split name and file extension\n  const nameParts = name.split('.')\n  const extension = nameParts.pop() || ''\n  const fileName = nameParts.join('.')\n\n  const isPreviewable = isFilePreviewable(mime || '.' + extension)\n  const isImage = mime?.includes('image/') || isAnnotation\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const handleImageClick = () => {\n    if ((!isPreviewable && !isAnnotation) || !onExpand || imageError) return\n    onExpand()\n  }\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isAnnotation,\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', { isPreviewable, isAnnotation })}\n        onClick={handleImageClick}\n      >\n        <Icon icon={getIconForType(mime || '.' + extension)} className=\"type-icon\" />\n        {isImage && src && (\n          <Styled.ImageWrapper\n            className={clsx({ isDownloadable: isDownloadable || isPreviewable || isAnnotation })}\n          >\n            <img\n              src={src}\n              onError={() => setImageError(true)}\n              style={{\n                display: imageError ? 'none' : 'block',\n              }}\n            />\n          </Styled.ImageWrapper>\n        )}\n        {isPreviewable && <Icon icon=\"open_in_full\" className=\"expand-icon\" />}\n        {isAnnotation && <Icon icon=\"play_circle\" className=\"expand-icon\" />}\n      </Styled.ContentWrapper>\n      <Styled.Footer className={clsx({ inProgress, isPreviewable, isDownloadable })}>\n        <span className=\"progress\" style={{ right: `${100 - progress}%` }} />\n        <div className=\"name-wrapper\">\n          <span className=\"name\">{fileName}</span>\n        </div>\n        <span className=\"extension\">.{extension}</span>\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} download className=\"download\">\n              {downloadComponent}\n            </a>\n          ) : (\n            <div className=\"download\">{downloadComponent}</div>\n          ))}\n      </Styled.Footer>\n      {onRemove && <Button className=\"remove\" onClick={onRemove} icon=\"close\" />}\n    </Styled.File>\n  )\n}\n\nexport default FileUploadCard\n"],"names":["useState","isFilePreviewable","jsxs","Fragment","jsx","getFileSizeString","Icon","Styled.File","Styled.ContentWrapper","Styled.ImageWrapper","Styled.Footer","Button"],"mappings":"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"}
+{"version":3,"file":"FileUploadCard.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadCard/FileUploadCard.tsx"],"sourcesContent":["import { Button, getFileSizeString, Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './FileUploadCard.styled'\nimport clsx from 'clsx'\nimport { useState } from 'react'\nimport { isFilePreviewable } from '../FileUploadPreview'\nimport { SavedAnnotationMetadata } from '@shared/containers'\nimport { useDetailsPanelContext } from '@shared/context'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  isUnsavedAnnotation?: boolean\n  savedAnnotation: SavedAnnotationMetadata\n  size: number\n  progress: number\n  onRemove?: () => void\n  isCompact?: boolean\n  isDownloadable?: boolean\n  onExpand?: () => void\n  onJumpTo?: () => void\n}\n\nconst fileIcons: { [key: string]: string[] } = {\n  // special cases\n  description: ['doc'],\n  folder_zip: ['zip'],\n  code_blocks: [\n    'json',\n    'javascript',\n    'python',\n    'html',\n    'css',\n    '.py',\n    '.js',\n    '.html',\n    '.css',\n    '.json',\n    '.ts',\n  ],\n  brush: ['.psd', '.ai', '.xd', '.sketch'],\n  '3d_rotation': [\n    '.mb',\n    '.ma',\n    '.c4d',\n    '.blend',\n    '.max',\n    '.3ds',\n    '.lwo',\n    '.lws',\n    '.lxo',\n    '.hip',\n    '.hda',\n  ],\n  theaters: ['.aep', '.tpl', '.clip', '.nk', '.fusion', '.prproj', '.spsm', '.drp'],\n  picture_as_pdf: ['pdf', '.pdf'],\n  // default\n  image: ['image', '.png', '.jpg', '.jpeg', '.gif', '.svg', '.webp'],\n  videocam: ['video', '.mp4', '.mov', '.avi', '.mkv', '.webm', '.mxf'],\n  business_center: ['application'],\n  audio_file: ['audio'],\n  text_snippet: ['text'],\n  filter_none: ['sequence'],\n  font_download: ['font'],\n  deployed_code: ['model', '.obj', '.abc', '.stl', '.fbx', '.gltf', '.glb', '.usd'],\n}\n\nconst getIconForType = (type: string): string => {\n  for (const [icon, keywords] of Object.entries(fileIcons)) {\n    if (keywords.some((keyword) => type.includes(keyword))) {\n      return icon\n    }\n  }\n  return 'draft'\n}\n\nconst FileUploadCard = ({\n  name,\n  mime,\n  src,\n  isUnsavedAnnotation,\n  savedAnnotation,\n  size,\n  progress,\n  onRemove,\n  isCompact,\n  isDownloadable = false,\n  onExpand,\n  onJumpTo,\n  className,\n  ...props\n}: FileUploadCardProps) => {\n  const inProgress = progress && progress < 100\n\n  const [imageError, setImageError] = useState(false)\n  const { feedAnnotationsEnabled } = useDetailsPanelContext()\n\n  // split name and file extension\n  const nameParts = name.split('.')\n  const extension = nameParts.pop() || ''\n  const fileName = nameParts.join('.')\n\n  const isPreviewable = isFilePreviewable(mime || '.' + extension)\n  const isImage = mime?.includes('image/') || isUnsavedAnnotation\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation,\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', { isPreviewable, isUnsavedAnnotation })}\n      >\n        <Icon icon={getIconForType(mime || '.' + extension)} className=\"type-icon\" />\n        {isImage && src && (\n          <Styled.ImageWrapper\n            className={clsx({\n              'image-wrapper': true,\n              isDownloadable: isDownloadable || isPreviewable || isUnsavedAnnotation,\n            })}\n          >\n            <img\n              src={src}\n              onError={() => setImageError(true)}\n              style={{\n                display: imageError ? 'none' : 'block',\n              }}\n            />\n          </Styled.ImageWrapper>\n        )}\n        <Styled.Buttons className=\"expand-buttons\">\n          {isPreviewable && (\n            <Styled.ExpandButton\n              data-tooltip=\"Open preview\"\n              icon=\"open_in_full\"\n              variant=\"nav\"\n              onClick={onExpand}\n            />\n          )}\n          {(isUnsavedAnnotation || (feedAnnotationsEnabled && savedAnnotation)) && (\n            <Styled.ExpandButton\n              data-tooltip=\"Jump to annotation\"\n              icon=\"play_circle\"\n              variant=\"nav\"\n              onClick={onJumpTo}\n            />\n          )}\n        </Styled.Buttons>\n      </Styled.ContentWrapper>\n      <Styled.Footer className={clsx({ inProgress, isPreviewable, isDownloadable })}>\n        <span className=\"progress\" style={{ right: `${100 - progress}%` }} />\n        <div className=\"name-wrapper\">\n          <span className=\"name\">{fileName}</span>\n        </div>\n        <span className=\"extension\">.{extension}</span>\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} download className=\"download\">\n              {downloadComponent}\n            </a>\n          ) : (\n            <div className=\"download\">{downloadComponent}</div>\n          ))}\n      </Styled.Footer>\n      {onRemove && <Button className=\"remove\" onClick={onRemove} icon=\"close\" />}\n    </Styled.File>\n  )\n}\n\nexport default FileUploadCard\n"],"names":["useState","useDetailsPanelContext","isFilePreviewable","jsxs","Fragment","jsx","getFileSizeString","Icon","Styled.File","Styled.ContentWrapper","Styled.ImageWrapper","Styled.Buttons","Styled.ExpandButton","Styled.Footer","Button"],"mappings":"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"}

package/dist/shared/src/containers/Feed/components/FileUploadCard/FileUploadCard.es.js

@@ -1,9 +1,18 @@
 import { j as jsxRuntimeExports } from "../../../../../../_virtual/jsx-runtime.es.js";
 import { getFileSizeString, Icon, Button } from "@ynput/ayon-react-components";
-import { File, ContentWrapper, ImageWrapper, Footer } from "./FileUploadCard.styled.es.js";
+import { File, ContentWrapper, ImageWrapper, Buttons, ExpandButton, Footer } from "./FileUploadCard.styled.es.js";
 import clsx from "clsx";
 import { useState } from "react";
 import { isFilePreviewable } from "../FileUploadPreview/FileUploadPreview.es.js";
+import "../../../../context/RemoteModulesContext.es.js";
+import { useDetailsPanelContext } from "../../../../context/DetailsPanelContext.es.js";
+import "../../../../context/ThumbnailUploaderContext.es.js";
+import "../../../../context/SettingsPanelContext.es.js";
+import "../../../../context/pip/PiPProvider.es.js";
+import "react-dom";
+import "../../../../context/pip/PiPWrapper.es.js";
+import "../../../../context/AddonProjectContext.es.js";
+import "../../../../context/AddonContext.es.js";
 const fileIcons = {
   // special cases
   description: ["doc"],
@@ -59,31 +68,30 @@ const FileUploadCard = ({
   name,
   mime,
   src,
-  isAnnotation,
+  isUnsavedAnnotation,
+  savedAnnotation,
   size,
   progress,
   onRemove,
   isCompact,
   isDownloadable = false,
   onExpand,
+  onJumpTo,
   className,
   ...props
 }) => {
   const inProgress = progress && progress < 100;
   const [imageError, setImageError] = useState(false);
+  const { feedAnnotationsEnabled } = useDetailsPanelContext();
   const nameParts = name.split(".");
   const extension = nameParts.pop() || "";
   const fileName = nameParts.join(".");
   const isPreviewable = isFilePreviewable(mime || "." + extension);
-  const isImage = (mime == null ? void 0 : mime.includes("image/")) || isAnnotation;
+  const isImage = (mime == null ? void 0 : mime.includes("image/")) || isUnsavedAnnotation;
   const downloadComponent = /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "size", children: getFileSizeString(size) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "download", className: "download-icon" })
   ] });
-  const handleImageClick = () => {
-    if (!isPreviewable && !isAnnotation || !onExpand || imageError) return;
-    onExpand();
-  };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     File,
     {
@@ -91,21 +99,23 @@ const FileUploadCard = ({
         compact: isCompact,
         isDownloadable,
         isPreviewable,
-        isAnnotation
+        isUnsavedAnnotation
       }),
       ...props,
       children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs(
           ContentWrapper,
           {
-            className: clsx("content-wrapper", { isPreviewable, isAnnotation }),
-            onClick: handleImageClick,
+            className: clsx("content-wrapper", { isPreviewable, isUnsavedAnnotation }),
             children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: getIconForType(mime || "." + extension), className: "type-icon" }),
               isImage && src && /* @__PURE__ */ jsxRuntimeExports.jsx(
                 ImageWrapper,
                 {
-                  className: clsx({ isDownloadable: isDownloadable || isPreviewable || isAnnotation }),
+                  className: clsx({
+                    "image-wrapper": true,
+                    isDownloadable: isDownloadable || isPreviewable || isUnsavedAnnotation
+                  }),
                   children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                     "img",
                     {
@@ -118,8 +128,26 @@ const FileUploadCard = ({
                   )
                 }
               ),
-              isPreviewable && /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "open_in_full", className: "expand-icon" }),
-              isAnnotation && /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { icon: "play_circle", className: "expand-icon" })
+              /* @__PURE__ */ jsxRuntimeExports.jsxs(Buttons, { className: "expand-buttons", children: [
+                isPreviewable && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  ExpandButton,
+                  {
+                    "data-tooltip": "Open preview",
+                    icon: "open_in_full",
+                    variant: "nav",
+                    onClick: onExpand
+                  }
+                ),
+                (isUnsavedAnnotation || feedAnnotationsEnabled && savedAnnotation) && /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  ExpandButton,
+                  {
+                    "data-tooltip": "Jump to annotation",
+                    icon: "play_circle",
+                    variant: "nav",
+                    onClick: onJumpTo
+                  }
+                )
+              ] })
             ]
           }
         ),

package/dist/shared/src/containers/Feed/components/FileUploadCard/FileUploadCard.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileUploadCard.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadCard/FileUploadCard.tsx"],"sourcesContent":["import { Button, getFileSizeString, Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './FileUploadCard.styled'\nimport clsx from 'clsx'\nimport { useState } from 'react'\nimport { isFilePreviewable } from '../FileUploadPreview'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  isAnnotation?: boolean\n  size: number\n  progress: number\n  onRemove?: () => void\n  isCompact?: boolean\n  isDownloadable?: boolean\n  onExpand?: () => void\n}\n\nconst fileIcons: { [key: string]: string[] } = {\n  // special cases\n  description: ['doc'],\n  folder_zip: ['zip'],\n  code_blocks: [\n    'json',\n    'javascript',\n    'python',\n    'html',\n    'css',\n    '.py',\n    '.js',\n    '.html',\n    '.css',\n    '.json',\n    '.ts',\n  ],\n  brush: ['.psd', '.ai', '.xd', '.sketch'],\n  '3d_rotation': [\n    '.mb',\n    '.ma',\n    '.c4d',\n    '.blend',\n    '.max',\n    '.3ds',\n    '.lwo',\n    '.lws',\n    '.lxo',\n    '.hip',\n    '.hda',\n  ],\n  theaters: ['.aep', '.tpl', '.clip', '.nk', '.fusion', '.prproj', '.spsm', '.drp'],\n  picture_as_pdf: ['pdf', '.pdf'],\n  // default\n  image: ['image', '.png', '.jpg', '.jpeg', '.gif', '.svg', '.webp'],\n  videocam: ['video', '.mp4', '.mov', '.avi', '.mkv', '.webm', '.mxf'],\n  business_center: ['application'],\n  audio_file: ['audio'],\n  text_snippet: ['text'],\n  filter_none: ['sequence'],\n  font_download: ['font'],\n  deployed_code: ['model', '.obj', '.abc', '.stl', '.fbx', '.gltf', '.glb', '.usd'],\n}\n\nconst getIconForType = (type: string): string => {\n  for (const [icon, keywords] of Object.entries(fileIcons)) {\n    if (keywords.some((keyword) => type.includes(keyword))) {\n      return icon\n    }\n  }\n  return 'draft'\n}\n\nconst FileUploadCard = ({\n  name,\n  mime,\n  src,\n  isAnnotation,\n  size,\n  progress,\n  onRemove,\n  isCompact,\n  isDownloadable = false,\n  onExpand,\n  className,\n  ...props\n}: FileUploadCardProps) => {\n  const inProgress = progress && progress < 100\n\n  const [imageError, setImageError] = useState(false)\n\n  // split name and file extension\n  const nameParts = name.split('.')\n  const extension = nameParts.pop() || ''\n  const fileName = nameParts.join('.')\n\n  const isPreviewable = isFilePreviewable(mime || '.' + extension)\n  const isImage = mime?.includes('image/') || isAnnotation\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const handleImageClick = () => {\n    if ((!isPreviewable && !isAnnotation) || !onExpand || imageError) return\n    onExpand()\n  }\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isAnnotation,\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', { isPreviewable, isAnnotation })}\n        onClick={handleImageClick}\n      >\n        <Icon icon={getIconForType(mime || '.' + extension)} className=\"type-icon\" />\n        {isImage && src && (\n          <Styled.ImageWrapper\n            className={clsx({ isDownloadable: isDownloadable || isPreviewable || isAnnotation })}\n          >\n            <img\n              src={src}\n              onError={() => setImageError(true)}\n              style={{\n                display: imageError ? 'none' : 'block',\n              }}\n            />\n          </Styled.ImageWrapper>\n        )}\n        {isPreviewable && <Icon icon=\"open_in_full\" className=\"expand-icon\" />}\n        {isAnnotation && <Icon icon=\"play_circle\" className=\"expand-icon\" />}\n      </Styled.ContentWrapper>\n      <Styled.Footer className={clsx({ inProgress, isPreviewable, isDownloadable })}>\n        <span className=\"progress\" style={{ right: `${100 - progress}%` }} />\n        <div className=\"name-wrapper\">\n          <span className=\"name\">{fileName}</span>\n        </div>\n        <span className=\"extension\">.{extension}</span>\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} download className=\"download\">\n              {downloadComponent}\n            </a>\n          ) : (\n            <div className=\"download\">{downloadComponent}</div>\n          ))}\n      </Styled.Footer>\n      {onRemove && <Button className=\"remove\" onClick={onRemove} icon=\"close\" />}\n    </Styled.File>\n  )\n}\n\nexport default FileUploadCard\n"],"names":["jsxs","Fragment","jsx","Styled.File","Styled.ContentWrapper","Styled.ImageWrapper","Styled.Footer"],"mappings":"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"}
+{"version":3,"file":"FileUploadCard.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadCard/FileUploadCard.tsx"],"sourcesContent":["import { Button, getFileSizeString, Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './FileUploadCard.styled'\nimport clsx from 'clsx'\nimport { useState } from 'react'\nimport { isFilePreviewable } from '../FileUploadPreview'\nimport { SavedAnnotationMetadata } from '@shared/containers'\nimport { useDetailsPanelContext } from '@shared/context'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  isUnsavedAnnotation?: boolean\n  savedAnnotation: SavedAnnotationMetadata\n  size: number\n  progress: number\n  onRemove?: () => void\n  isCompact?: boolean\n  isDownloadable?: boolean\n  onExpand?: () => void\n  onJumpTo?: () => void\n}\n\nconst fileIcons: { [key: string]: string[] } = {\n  // special cases\n  description: ['doc'],\n  folder_zip: ['zip'],\n  code_blocks: [\n    'json',\n    'javascript',\n    'python',\n    'html',\n    'css',\n    '.py',\n    '.js',\n    '.html',\n    '.css',\n    '.json',\n    '.ts',\n  ],\n  brush: ['.psd', '.ai', '.xd', '.sketch'],\n  '3d_rotation': [\n    '.mb',\n    '.ma',\n    '.c4d',\n    '.blend',\n    '.max',\n    '.3ds',\n    '.lwo',\n    '.lws',\n    '.lxo',\n    '.hip',\n    '.hda',\n  ],\n  theaters: ['.aep', '.tpl', '.clip', '.nk', '.fusion', '.prproj', '.spsm', '.drp'],\n  picture_as_pdf: ['pdf', '.pdf'],\n  // default\n  image: ['image', '.png', '.jpg', '.jpeg', '.gif', '.svg', '.webp'],\n  videocam: ['video', '.mp4', '.mov', '.avi', '.mkv', '.webm', '.mxf'],\n  business_center: ['application'],\n  audio_file: ['audio'],\n  text_snippet: ['text'],\n  filter_none: ['sequence'],\n  font_download: ['font'],\n  deployed_code: ['model', '.obj', '.abc', '.stl', '.fbx', '.gltf', '.glb', '.usd'],\n}\n\nconst getIconForType = (type: string): string => {\n  for (const [icon, keywords] of Object.entries(fileIcons)) {\n    if (keywords.some((keyword) => type.includes(keyword))) {\n      return icon\n    }\n  }\n  return 'draft'\n}\n\nconst FileUploadCard = ({\n  name,\n  mime,\n  src,\n  isUnsavedAnnotation,\n  savedAnnotation,\n  size,\n  progress,\n  onRemove,\n  isCompact,\n  isDownloadable = false,\n  onExpand,\n  onJumpTo,\n  className,\n  ...props\n}: FileUploadCardProps) => {\n  const inProgress = progress && progress < 100\n\n  const [imageError, setImageError] = useState(false)\n  const { feedAnnotationsEnabled } = useDetailsPanelContext()\n\n  // split name and file extension\n  const nameParts = name.split('.')\n  const extension = nameParts.pop() || ''\n  const fileName = nameParts.join('.')\n\n  const isPreviewable = isFilePreviewable(mime || '.' + extension)\n  const isImage = mime?.includes('image/') || isUnsavedAnnotation\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation,\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', { isPreviewable, isUnsavedAnnotation })}\n      >\n        <Icon icon={getIconForType(mime || '.' + extension)} className=\"type-icon\" />\n        {isImage && src && (\n          <Styled.ImageWrapper\n            className={clsx({\n              'image-wrapper': true,\n              isDownloadable: isDownloadable || isPreviewable || isUnsavedAnnotation,\n            })}\n          >\n            <img\n              src={src}\n              onError={() => setImageError(true)}\n              style={{\n                display: imageError ? 'none' : 'block',\n              }}\n            />\n          </Styled.ImageWrapper>\n        )}\n        <Styled.Buttons className=\"expand-buttons\">\n          {isPreviewable && (\n            <Styled.ExpandButton\n              data-tooltip=\"Open preview\"\n              icon=\"open_in_full\"\n              variant=\"nav\"\n              onClick={onExpand}\n            />\n          )}\n          {(isUnsavedAnnotation || (feedAnnotationsEnabled && savedAnnotation)) && (\n            <Styled.ExpandButton\n              data-tooltip=\"Jump to annotation\"\n              icon=\"play_circle\"\n              variant=\"nav\"\n              onClick={onJumpTo}\n            />\n          )}\n        </Styled.Buttons>\n      </Styled.ContentWrapper>\n      <Styled.Footer className={clsx({ inProgress, isPreviewable, isDownloadable })}>\n        <span className=\"progress\" style={{ right: `${100 - progress}%` }} />\n        <div className=\"name-wrapper\">\n          <span className=\"name\">{fileName}</span>\n        </div>\n        <span className=\"extension\">.{extension}</span>\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} download className=\"download\">\n              {downloadComponent}\n            </a>\n          ) : (\n            <div className=\"download\">{downloadComponent}</div>\n          ))}\n      </Styled.Footer>\n      {onRemove && <Button className=\"remove\" onClick={onRemove} icon=\"close\" />}\n    </Styled.File>\n  )\n}\n\nexport default FileUploadCard\n"],"names":["jsxs","Fragment","jsx","Styled.File","Styled.ContentWrapper","Styled.ImageWrapper","Styled.Buttons","Styled.ExpandButton","Styled.Footer"],"mappings":"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"}