@ynput/ayon-frontend-shared 0.2.15 → 0.2.16

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'\nimport { SavedAnnotationMetadata } from '@shared/containers'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { AnnotationPreview } from '../CommentInput/hooks/useAnnotationsSync'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  unsavedAnnotation?: AnnotationPreview\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  unsavedAnnotation,\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/') || Boolean(unsavedAnnotation)\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const someAnnotation = unsavedAnnotation ?? savedAnnotation\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation: Boolean(unsavedAnnotation),\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', {\n          isPreviewable,\n          isUnsavedAnnotation: Boolean(unsavedAnnotation),\n        })}\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 || unsavedAnnotation,\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          {(unsavedAnnotation || (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          {someAnnotation ? (\n            <span className=\"name\">\n              <Icon icon=\"draw\" />\n              {someAnnotation.range[0]}\n              {someAnnotation.range[1] !== someAnnotation.range[0] &&\n                ` - ${someAnnotation.range[1]}`}\n            </span>\n          ) : (\n            <span className=\"name\">\n              {fileName}\n              <span className=\"extension\">.{extension}</span>\n            </span>\n          )}\n        </div>\n\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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"}
+{"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'\nimport { AnnotationPreview } from '../CommentInput/hooks/useAnnotationsSync'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  unsavedAnnotation?: AnnotationPreview\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  unsavedAnnotation,\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/') || Boolean(unsavedAnnotation)\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const someAnnotation = unsavedAnnotation ?? savedAnnotation\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation: Boolean(unsavedAnnotation),\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', {\n          isPreviewable,\n          isUnsavedAnnotation: Boolean(unsavedAnnotation),\n        })}\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 || unsavedAnnotation,\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          {(unsavedAnnotation || (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          {someAnnotation ? (\n            <span className=\"name\">\n              <Icon icon=\"draw\" />\n              {someAnnotation.range[0]}\n              {someAnnotation.range[1] !== someAnnotation.range[0] &&\n                ` - ${someAnnotation.range[1]}`}\n            </span>\n          ) : (\n            <span className=\"name\">\n              {fileName}\n              <span className=\"extension\">.{extension}</span>\n            </span>\n          )}\n        </div>\n\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} target=\"_blank\" rel=\"noopener noreferrer\" 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

@@ -169,7 +169,7 @@ const FileUploadCard = ({
               extension
             ] })
           ] }) }),
-          isDownloadable && (!onRemove ? /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: src, download: true, className: "download", children: downloadComponent }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "download", children: downloadComponent }))
+          isDownloadable && (!onRemove ? /* @__PURE__ */ jsxRuntimeExports.jsx("a", { href: src, target: "_blank", rel: "noopener noreferrer", className: "download", children: downloadComponent }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "download", children: downloadComponent }))
         ] }),
         onRemove && /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { className: "remove", onClick: onRemove, icon: "close" })
       ]

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'\nimport { SavedAnnotationMetadata } from '@shared/containers'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { AnnotationPreview } from '../CommentInput/hooks/useAnnotationsSync'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  unsavedAnnotation?: AnnotationPreview\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  unsavedAnnotation,\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/') || Boolean(unsavedAnnotation)\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const someAnnotation = unsavedAnnotation ?? savedAnnotation\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation: Boolean(unsavedAnnotation),\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', {\n          isPreviewable,\n          isUnsavedAnnotation: Boolean(unsavedAnnotation),\n        })}\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 || unsavedAnnotation,\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          {(unsavedAnnotation || (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          {someAnnotation ? (\n            <span className=\"name\">\n              <Icon icon=\"draw\" />\n              {someAnnotation.range[0]}\n              {someAnnotation.range[1] !== someAnnotation.range[0] &&\n                ` - ${someAnnotation.range[1]}`}\n            </span>\n          ) : (\n            <span className=\"name\">\n              {fileName}\n              <span className=\"extension\">.{extension}</span>\n            </span>\n          )}\n        </div>\n\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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"}
+{"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'\nimport { AnnotationPreview } from '../CommentInput/hooks/useAnnotationsSync'\n\nexport interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string\n  mime?: string\n  src?: string\n  unsavedAnnotation?: AnnotationPreview\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  unsavedAnnotation,\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/') || Boolean(unsavedAnnotation)\n\n  const downloadComponent = (\n    <>\n      <span className=\"size\">{getFileSizeString(size)}</span>\n      <Icon icon=\"download\" className=\"download-icon\" />\n    </>\n  )\n\n  const someAnnotation = unsavedAnnotation ?? savedAnnotation\n\n  return (\n    <Styled.File\n      className={clsx(className, {\n        compact: isCompact,\n        isDownloadable,\n        isPreviewable,\n        isUnsavedAnnotation: Boolean(unsavedAnnotation),\n      })}\n      {...props}\n    >\n      <Styled.ContentWrapper\n        className={clsx('content-wrapper', {\n          isPreviewable,\n          isUnsavedAnnotation: Boolean(unsavedAnnotation),\n        })}\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 || unsavedAnnotation,\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          {(unsavedAnnotation || (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          {someAnnotation ? (\n            <span className=\"name\">\n              <Icon icon=\"draw\" />\n              {someAnnotation.range[0]}\n              {someAnnotation.range[1] !== someAnnotation.range[0] &&\n                ` - ${someAnnotation.range[1]}`}\n            </span>\n          ) : (\n            <span className=\"name\">\n              {fileName}\n              <span className=\"extension\">.{extension}</span>\n            </span>\n          )}\n        </div>\n\n        {isDownloadable &&\n          (!onRemove ? (\n            <a href={src} target=\"_blank\" rel=\"noopener noreferrer\" 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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"}

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

@@ -126,7 +126,14 @@ const FileUploadPreview = ({
             onClick: handleNavigateToPrevious
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { style: { zIndex: zIndex + 1 }, children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(MimeComponent, { file, fullPreviews }) }),
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+          FileUploadPreview_styled.ScrollableContent,
+          {
+            style: { zIndex: zIndex + 1 },
+            className: clsx({ scrollable: !isImage }),
+            children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(MimeComponent, { file, fullPreviews })
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
           ayonReactComponents.Icon,
           {

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

@@ -1 +1 @@
-{"version":3,"file":"FileUploadPreview.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { getFileURL } from './fileUtils'\nimport ImageMime from './Mimes/ImageMime'\nimport TextMime from './Mimes/TextMime'\nimport clsx from 'clsx'\nimport { Icon } from '@ynput/ayon-react-components'\nimport useAttachmentNavigation from './hooks/useAttachmentNavigation'\nimport * as Styled from './FileUploadPreview.styled'\n\nexport type MimeTypeDefinition = {\n  component: React.FC<any> | null\n  mimeTypes: string[]\n  fullPreviews?: string[]\n  id: string\n  callback?: (file: any) => void\n}\n\n// define expandable mime types and their components\nexport const expandableMimeTypes: { [key: string]: MimeTypeDefinition } = {\n  image: {\n    component: ImageMime,\n    mimeTypes: ['image/'],\n    fullPreviews: ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp'],\n    id: 'image',\n  },\n  text: {\n    component: TextMime,\n    mimeTypes: ['text/', 'application/json', 'scss', 'jsx'],\n    id: 'text',\n  },\n  pdf: {\n    component: null,\n    mimeTypes: ['pdf'],\n    id: 'pdf',\n    callback: (file: any) => window.open(getFileURL(file.id, file.projectName), '_blank'),\n  },\n}\n\nexport const isFilePreviewable = (mime = '', ext = '') =>\n  Object.values(expandableMimeTypes).some(({ mimeTypes = [] }) =>\n    mimeTypes.some((type) => (mime || ext)?.includes(type)),\n  )\n\ninterface FileUploadPreviewProps {\n  files: any[] // replace with correct type\n  index: number\n  activityId: string\n  projectName: string\n  onFilePreviewClose: () => void\n  onNavigate: (payload: any) => void // replace with correct type\n}\n\nconst FileUploadPreview: React.FC<FileUploadPreviewProps> = ({\n  files,\n  index,\n  activityId,\n  projectName,\n  onFilePreviewClose,\n  onNavigate,\n}) => {\n  const {\n    canNavigateDown,\n    canNavigateUp,\n    canNavigateLeft,\n    canNavigateRight,\n    getByIndexActivity,\n    navigateUp,\n    navigateDown,\n    navigateLeft,\n    navigateRight,\n  } = useAttachmentNavigation({ files, index, activityId, onNavigate })\n  const file = { ...getByIndexActivity(activityId, index), projectName }\n  const { id, mime, extension, name } = file\n\n  // when dialog open, focus on the dialog\n  // we do this so that the user can navigate with the keyboard (esc works)\n  const dialogRef = useRef<HTMLDivElement>(null)\n  useEffect(() => {\n    if (id && projectName) {\n      dialogRef.current?.focus()\n    }\n  }, [id, projectName])\n\n  const handleClose = () => {\n    onFilePreviewClose()\n  }\n\n  if (!id || !projectName) return null\n\n  // get the correct mime type component based on mimeTypes match\n  const previewable = Object.values(expandableMimeTypes).find(({ mimeTypes }) =>\n    mimeTypes.some((type) => (mime || extension)?.includes(type)),\n  )\n\n  // @ts-ignore\n  const { component: MimeComponent, id: typeId, callback, fullPreviews } = previewable || {}\n\n  // if there is a callback, run it and return null\n  // mainly for pdfs\n  if (callback) {\n    callback(file)\n    return null\n  }\n\n  const handleNavigateToPrevActivity = () => canNavigateUp() && navigateUp()\n  const handleNavigateToNextActivity = () => canNavigateDown() && navigateDown()\n  const handleNavigateToPrevious = () => canNavigateLeft() && navigateLeft()\n  const handleNavigateToNext = () => canNavigateRight() && navigateRight()\n\n  const isImage = typeId === 'image'\n  const zIndex = 50\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.code === 'ArrowUp') {\n      handleNavigateToPrevActivity()\n    }\n    if (e.code === 'ArrowDown') {\n      handleNavigateToNextActivity()\n    }\n    if (e.code === 'ArrowRight') {\n      handleNavigateToNext()\n    }\n    if (e.code === 'ArrowLeft') {\n      handleNavigateToPrevious()\n    }\n    if (e.key === 'Escape') {\n      e.preventDefault()\n      handleClose()\n    }\n  }\n\n  if (!MimeComponent) {\n    return null\n  }\n\n  return (\n    <Styled.DialogWrapper\n      onKeyDown={handleKeyDown}\n      size=\"full\"\n      isOpen={!!(id && projectName)}\n      onClose={handleClose}\n      hideCancelButton={isImage}\n      ref={dialogRef}\n      className={clsx({ isImage }, 'block-shortcuts')}\n      header={isImage ? null : name}\n    >\n      <div style={{ position: 'absolute', inset: 0, zIndex: zIndex }} onClick={handleClose}></div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_left\"\n        className={clsx('navIcon', 'left', { disabled: !canNavigateLeft() })}\n        onClick={handleNavigateToPrevious}\n      />\n\n      <div style={{ zIndex: zIndex + 1 }}>\n        <MimeComponent file={file} fullPreviews={fullPreviews} />\n      </div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_right\"\n        className={clsx('navIcon', 'right', { disabled: !canNavigateRight() })}\n        onClick={handleNavigateToNext}\n      />\n    </Styled.DialogWrapper>\n  )\n}\n\nexport default FileUploadPreview\n"],"names":["getFileURL","useRef","useEffect","jsxs","Styled.DialogWrapper","jsx","Icon"],"mappings":"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"}
+{"version":3,"file":"FileUploadPreview.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { getFileURL } from './fileUtils'\nimport ImageMime from './Mimes/ImageMime'\nimport TextMime from './Mimes/TextMime'\nimport clsx from 'clsx'\nimport { Icon } from '@ynput/ayon-react-components'\nimport useAttachmentNavigation from './hooks/useAttachmentNavigation'\nimport * as Styled from './FileUploadPreview.styled'\n\nexport type MimeTypeDefinition = {\n  component: React.FC<any> | null\n  mimeTypes: string[]\n  fullPreviews?: string[]\n  id: string\n  callback?: (file: any) => void\n}\n\n// define expandable mime types and their components\nexport const expandableMimeTypes: { [key: string]: MimeTypeDefinition } = {\n  image: {\n    component: ImageMime,\n    mimeTypes: ['image/'],\n    fullPreviews: ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp'],\n    id: 'image',\n  },\n  text: {\n    component: TextMime,\n    mimeTypes: ['text/', 'application/json', 'scss', 'jsx'],\n    id: 'text',\n  },\n  pdf: {\n    component: null,\n    mimeTypes: ['pdf'],\n    id: 'pdf',\n    callback: (file: any) => window.open(getFileURL(file.id, file.projectName), '_blank'),\n  },\n}\n\nexport const isFilePreviewable = (mime = '', ext = '') =>\n  Object.values(expandableMimeTypes).some(({ mimeTypes = [] }) =>\n    mimeTypes.some((type) => (mime || ext)?.includes(type)),\n  )\n\ninterface FileUploadPreviewProps {\n  files: any[] // replace with correct type\n  index: number\n  activityId: string\n  projectName: string\n  onFilePreviewClose: () => void\n  onNavigate: (payload: any) => void // replace with correct type\n}\n\nconst FileUploadPreview: React.FC<FileUploadPreviewProps> = ({\n  files,\n  index,\n  activityId,\n  projectName,\n  onFilePreviewClose,\n  onNavigate,\n}) => {\n  const {\n    canNavigateDown,\n    canNavigateUp,\n    canNavigateLeft,\n    canNavigateRight,\n    getByIndexActivity,\n    navigateUp,\n    navigateDown,\n    navigateLeft,\n    navigateRight,\n  } = useAttachmentNavigation({ files, index, activityId, onNavigate })\n  const file = { ...getByIndexActivity(activityId, index), projectName }\n  const { id, mime, extension, name } = file\n\n  // when dialog open, focus on the dialog\n  // we do this so that the user can navigate with the keyboard (esc works)\n  const dialogRef = useRef<HTMLDivElement>(null)\n  useEffect(() => {\n    if (id && projectName) {\n      dialogRef.current?.focus()\n    }\n  }, [id, projectName])\n\n  const handleClose = () => {\n    onFilePreviewClose()\n  }\n\n  if (!id || !projectName) return null\n\n  // get the correct mime type component based on mimeTypes match\n  const previewable = Object.values(expandableMimeTypes).find(({ mimeTypes }) =>\n    mimeTypes.some((type) => (mime || extension)?.includes(type)),\n  )\n\n  // @ts-ignore\n  const { component: MimeComponent, id: typeId, callback, fullPreviews } = previewable || {}\n\n  // if there is a callback, run it and return null\n  // mainly for pdfs\n  if (callback) {\n    callback(file)\n    return null\n  }\n\n  const handleNavigateToPrevActivity = () => canNavigateUp() && navigateUp()\n  const handleNavigateToNextActivity = () => canNavigateDown() && navigateDown()\n  const handleNavigateToPrevious = () => canNavigateLeft() && navigateLeft()\n  const handleNavigateToNext = () => canNavigateRight() && navigateRight()\n\n  const isImage = typeId === 'image'\n  const zIndex = 50\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.code === 'ArrowUp') {\n      handleNavigateToPrevActivity()\n    }\n    if (e.code === 'ArrowDown') {\n      handleNavigateToNextActivity()\n    }\n    if (e.code === 'ArrowRight') {\n      handleNavigateToNext()\n    }\n    if (e.code === 'ArrowLeft') {\n      handleNavigateToPrevious()\n    }\n    if (e.key === 'Escape') {\n      e.preventDefault()\n      handleClose()\n    }\n  }\n\n  if (!MimeComponent) {\n    return null\n  }\n\n  return (\n    <Styled.DialogWrapper\n      onKeyDown={handleKeyDown}\n      size=\"full\"\n      isOpen={!!(id && projectName)}\n      onClose={handleClose}\n      hideCancelButton={isImage}\n      ref={dialogRef}\n      className={clsx({ isImage }, 'block-shortcuts')}\n      header={isImage ? null : name}\n    >\n      <div style={{ position: 'absolute', inset: 0, zIndex: zIndex }} onClick={handleClose}></div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_left\"\n        className={clsx('navIcon', 'left', { disabled: !canNavigateLeft() })}\n        onClick={handleNavigateToPrevious}\n      />\n\n      <Styled.ScrollableContent\n        style={{ zIndex: zIndex + 1 }}\n        className={clsx({ scrollable: !isImage })}\n      >\n        <MimeComponent file={file} fullPreviews={fullPreviews} />\n      </Styled.ScrollableContent>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_right\"\n        className={clsx('navIcon', 'right', { disabled: !canNavigateRight() })}\n        onClick={handleNavigateToNext}\n      />\n    </Styled.DialogWrapper>\n  )\n}\n\nexport default FileUploadPreview\n"],"names":["getFileURL","useRef","useEffect","jsxs","Styled.DialogWrapper","jsx","Icon","Styled.ScrollableContent"],"mappings":";;;;;;;;;;;AAkBO,MAAM,sBAA6D;AAAA,EACxE,OAAO;AAAA,IACL,WAAW;AAAA,IACX,WAAW,CAAC,QAAQ;AAAA,IACpB,cAAc,CAAC,OAAO,OAAO,QAAQ,OAAO,OAAO,MAAM;AAAA,IACzD,IAAI;AAAA,EACN;AAAA,EACA,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,WAAW,CAAC,SAAS,oBAAoB,QAAQ,KAAK;AAAA,IACtD,IAAI;AAAA,EACN;AAAA,EACA,KAAK;AAAA,IACH,WAAW;AAAA,IACX,WAAW,CAAC,KAAK;AAAA,IACjB,IAAI;AAAA,IACJ,UAAU,CAAC,SAAc,OAAO,KAAKA,UAAAA,WAAW,KAAK,IAAI,KAAK,WAAW,GAAG,QAAQ;AAAA,EAAA;AAExF;AAEa,MAAA,oBAAoB,CAAC,OAAO,IAAI,MAAM,OACjD,OAAO,OAAO,mBAAmB,EAAE;AAAA,EAAK,CAAC,EAAE,YAAY,GACrD,MAAA,UAAU,KAAK,CAAC,SAAU;;AAAA,yBAAQ,QAAR,mBAAc,SAAS;AAAA,GAAK;AACxD;AAWF,MAAM,oBAAsD,CAAC;AAAA,EAC3D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACE,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE,wBAAwB,EAAE,OAAO,OAAO,YAAY,YAAY;AACpE,QAAM,OAAO,EAAE,GAAG,mBAAmB,YAAY,KAAK,GAAG,YAAY;AACrE,QAAM,EAAE,IAAI,MAAM,WAAW,KAAS,IAAA;AAIhC,QAAA,YAAYC,aAAuB,IAAI;AAC7CC,QAAAA,UAAU,MAAM;;AACd,QAAI,MAAM,aAAa;AACrB,sBAAU,YAAV,mBAAmB;AAAA,IAAM;AAAA,EAC3B,GACC,CAAC,IAAI,WAAW,CAAC;AAEpB,QAAM,cAAc,MAAM;AACL,uBAAA;AAAA,EACrB;AAEA,MAAI,CAAC,MAAM,CAAC,YAAoB,QAAA;AAGhC,QAAM,cAAc,OAAO,OAAO,mBAAmB,EAAE;AAAA,IAAK,CAAC,EAAE,UAAU,MACvE,UAAU,KAAK,CAAC,SAAA;;AAAU,2BAAQ,cAAR,mBAAoB,SAAS;AAAA,KAAK;AAAA,EAC9D;AAGM,QAAA,EAAE,WAAW,eAAe,IAAI,QAAQ,UAAU,iBAAiB,eAAe,CAAC;AAIzF,MAAI,UAAU;AACZ,aAAS,IAAI;AACN,WAAA;AAAA,EAAA;AAGT,QAAM,+BAA+B,MAAM,cAAc,KAAK,WAAW;AACzE,QAAM,+BAA+B,MAAM,gBAAgB,KAAK,aAAa;AAC7E,QAAM,2BAA2B,MAAM,gBAAgB,KAAK,aAAa;AACzE,QAAM,uBAAuB,MAAM,iBAAiB,KAAK,cAAc;AAEvE,QAAM,UAAU,WAAW;AAC3B,QAAM,SAAS;AAET,QAAA,gBAAgB,CAAC,MAA2B;AAC5C,QAAA,EAAE,SAAS,WAAW;AACK,mCAAA;AAAA,IAAA;AAE3B,QAAA,EAAE,SAAS,aAAa;AACG,mCAAA;AAAA,IAAA;AAE3B,QAAA,EAAE,SAAS,cAAc;AACN,2BAAA;AAAA,IAAA;AAEnB,QAAA,EAAE,SAAS,aAAa;AACD,+BAAA;AAAA,IAAA;AAEvB,QAAA,EAAE,QAAQ,UAAU;AACtB,QAAE,eAAe;AACL,kBAAA;AAAA,IAAA;AAAA,EAEhB;AAEA,MAAI,CAAC,eAAe;AACX,WAAA;AAAA,EAAA;AAIP,SAAAC,2BAAA,kBAAA;AAAA,IAACC,yBAAO;AAAA,IAAP;AAAA,MACC,WAAW;AAAA,MACX,MAAK;AAAA,MACL,QAAQ,CAAC,EAAE,MAAM;AAAA,MACjB,SAAS;AAAA,MACT,kBAAkB;AAAA,MAClB,KAAK;AAAA,MACL,WAAW,KAAK,EAAE,QAAA,GAAW,iBAAiB;AAAA,MAC9C,QAAQ,UAAU,OAAO;AAAA,MAEzB,UAAA;AAAA,QAACC,2BAAAA,kBAAAA,IAAA,OAAA,EAAI,OAAO,EAAE,UAAU,YAAY,OAAO,GAAG,OAAA,GAAkB,SAAS,YAAa,CAAA;AAAA,QAEtFA,2BAAA,kBAAA;AAAA,UAACC,oBAAA;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,QAAQ,SAAS,EAAE;AAAA,YAC5B,MAAK;AAAA,YACL,WAAW,KAAK,WAAW,QAAQ,EAAE,UAAU,CAAC,gBAAgB,GAAG;AAAA,YACnE,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,QAEAD,2BAAA,kBAAA;AAAA,UAACE,yBAAO;AAAA,UAAP;AAAA,YACC,OAAO,EAAE,QAAQ,SAAS,EAAE;AAAA,YAC5B,WAAW,KAAK,EAAE,YAAY,CAAC,SAAS;AAAA,YAExC,UAAAF,2BAAAA,kBAAAA,IAAC,eAAc,EAAA,MAAY,aAA4B,CAAA;AAAA,UAAA;AAAA,QACzD;AAAA,QAEAA,2BAAA,kBAAA;AAAA,UAACC,oBAAA;AAAA,UAAA;AAAA,YACC,OAAO,EAAE,QAAQ,SAAS,EAAE;AAAA,YAC5B,MAAK;AAAA,YACL,WAAW,KAAK,WAAW,SAAS,EAAE,UAAU,CAAC,iBAAiB,GAAG;AAAA,YACrE,SAAS;AAAA,UAAA;AAAA,QAAA;AAAA,MACX;AAAA,IAAA;AAAA,EACF;AAEJ;;;;"}

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

@@ -6,7 +6,7 @@ import TextMime from "./Mimes/TextMime.es.js";
 import clsx from "clsx";
 import { Icon } from "@ynput/ayon-react-components";
 import useAttachmentNavigation from "./hooks/useAttachmentNavigation.es.js";
-import { DialogWrapper } from "./FileUploadPreview.styled.es.js";
+import { DialogWrapper, ScrollableContent } from "./FileUploadPreview.styled.es.js";
 const expandableMimeTypes = {
   image: {
     component: ImageMime,
@@ -124,7 +124,14 @@ const FileUploadPreview = ({
             onClick: handleNavigateToPrevious
           }
         ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { zIndex: zIndex + 1 }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(MimeComponent, { file, fullPreviews }) }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          ScrollableContent,
+          {
+            style: { zIndex: zIndex + 1 },
+            className: clsx({ scrollable: !isImage }),
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(MimeComponent, { file, fullPreviews })
+          }
+        ),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Icon,
           {

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

@@ -1 +1 @@
-{"version":3,"file":"FileUploadPreview.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { getFileURL } from './fileUtils'\nimport ImageMime from './Mimes/ImageMime'\nimport TextMime from './Mimes/TextMime'\nimport clsx from 'clsx'\nimport { Icon } from '@ynput/ayon-react-components'\nimport useAttachmentNavigation from './hooks/useAttachmentNavigation'\nimport * as Styled from './FileUploadPreview.styled'\n\nexport type MimeTypeDefinition = {\n  component: React.FC<any> | null\n  mimeTypes: string[]\n  fullPreviews?: string[]\n  id: string\n  callback?: (file: any) => void\n}\n\n// define expandable mime types and their components\nexport const expandableMimeTypes: { [key: string]: MimeTypeDefinition } = {\n  image: {\n    component: ImageMime,\n    mimeTypes: ['image/'],\n    fullPreviews: ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp'],\n    id: 'image',\n  },\n  text: {\n    component: TextMime,\n    mimeTypes: ['text/', 'application/json', 'scss', 'jsx'],\n    id: 'text',\n  },\n  pdf: {\n    component: null,\n    mimeTypes: ['pdf'],\n    id: 'pdf',\n    callback: (file: any) => window.open(getFileURL(file.id, file.projectName), '_blank'),\n  },\n}\n\nexport const isFilePreviewable = (mime = '', ext = '') =>\n  Object.values(expandableMimeTypes).some(({ mimeTypes = [] }) =>\n    mimeTypes.some((type) => (mime || ext)?.includes(type)),\n  )\n\ninterface FileUploadPreviewProps {\n  files: any[] // replace with correct type\n  index: number\n  activityId: string\n  projectName: string\n  onFilePreviewClose: () => void\n  onNavigate: (payload: any) => void // replace with correct type\n}\n\nconst FileUploadPreview: React.FC<FileUploadPreviewProps> = ({\n  files,\n  index,\n  activityId,\n  projectName,\n  onFilePreviewClose,\n  onNavigate,\n}) => {\n  const {\n    canNavigateDown,\n    canNavigateUp,\n    canNavigateLeft,\n    canNavigateRight,\n    getByIndexActivity,\n    navigateUp,\n    navigateDown,\n    navigateLeft,\n    navigateRight,\n  } = useAttachmentNavigation({ files, index, activityId, onNavigate })\n  const file = { ...getByIndexActivity(activityId, index), projectName }\n  const { id, mime, extension, name } = file\n\n  // when dialog open, focus on the dialog\n  // we do this so that the user can navigate with the keyboard (esc works)\n  const dialogRef = useRef<HTMLDivElement>(null)\n  useEffect(() => {\n    if (id && projectName) {\n      dialogRef.current?.focus()\n    }\n  }, [id, projectName])\n\n  const handleClose = () => {\n    onFilePreviewClose()\n  }\n\n  if (!id || !projectName) return null\n\n  // get the correct mime type component based on mimeTypes match\n  const previewable = Object.values(expandableMimeTypes).find(({ mimeTypes }) =>\n    mimeTypes.some((type) => (mime || extension)?.includes(type)),\n  )\n\n  // @ts-ignore\n  const { component: MimeComponent, id: typeId, callback, fullPreviews } = previewable || {}\n\n  // if there is a callback, run it and return null\n  // mainly for pdfs\n  if (callback) {\n    callback(file)\n    return null\n  }\n\n  const handleNavigateToPrevActivity = () => canNavigateUp() && navigateUp()\n  const handleNavigateToNextActivity = () => canNavigateDown() && navigateDown()\n  const handleNavigateToPrevious = () => canNavigateLeft() && navigateLeft()\n  const handleNavigateToNext = () => canNavigateRight() && navigateRight()\n\n  const isImage = typeId === 'image'\n  const zIndex = 50\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.code === 'ArrowUp') {\n      handleNavigateToPrevActivity()\n    }\n    if (e.code === 'ArrowDown') {\n      handleNavigateToNextActivity()\n    }\n    if (e.code === 'ArrowRight') {\n      handleNavigateToNext()\n    }\n    if (e.code === 'ArrowLeft') {\n      handleNavigateToPrevious()\n    }\n    if (e.key === 'Escape') {\n      e.preventDefault()\n      handleClose()\n    }\n  }\n\n  if (!MimeComponent) {\n    return null\n  }\n\n  return (\n    <Styled.DialogWrapper\n      onKeyDown={handleKeyDown}\n      size=\"full\"\n      isOpen={!!(id && projectName)}\n      onClose={handleClose}\n      hideCancelButton={isImage}\n      ref={dialogRef}\n      className={clsx({ isImage }, 'block-shortcuts')}\n      header={isImage ? null : name}\n    >\n      <div style={{ position: 'absolute', inset: 0, zIndex: zIndex }} onClick={handleClose}></div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_left\"\n        className={clsx('navIcon', 'left', { disabled: !canNavigateLeft() })}\n        onClick={handleNavigateToPrevious}\n      />\n\n      <div style={{ zIndex: zIndex + 1 }}>\n        <MimeComponent file={file} fullPreviews={fullPreviews} />\n      </div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_right\"\n        className={clsx('navIcon', 'right', { disabled: !canNavigateRight() })}\n        onClick={handleNavigateToNext}\n      />\n    </Styled.DialogWrapper>\n  )\n}\n\nexport default FileUploadPreview\n"],"names":["jsxs","Styled.DialogWrapper","jsx"],"mappings":"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"}
+{"version":3,"file":"FileUploadPreview.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { getFileURL } from './fileUtils'\nimport ImageMime from './Mimes/ImageMime'\nimport TextMime from './Mimes/TextMime'\nimport clsx from 'clsx'\nimport { Icon } from '@ynput/ayon-react-components'\nimport useAttachmentNavigation from './hooks/useAttachmentNavigation'\nimport * as Styled from './FileUploadPreview.styled'\n\nexport type MimeTypeDefinition = {\n  component: React.FC<any> | null\n  mimeTypes: string[]\n  fullPreviews?: string[]\n  id: string\n  callback?: (file: any) => void\n}\n\n// define expandable mime types and their components\nexport const expandableMimeTypes: { [key: string]: MimeTypeDefinition } = {\n  image: {\n    component: ImageMime,\n    mimeTypes: ['image/'],\n    fullPreviews: ['png', 'jpg', 'jpeg', 'gif', 'svg', 'webp'],\n    id: 'image',\n  },\n  text: {\n    component: TextMime,\n    mimeTypes: ['text/', 'application/json', 'scss', 'jsx'],\n    id: 'text',\n  },\n  pdf: {\n    component: null,\n    mimeTypes: ['pdf'],\n    id: 'pdf',\n    callback: (file: any) => window.open(getFileURL(file.id, file.projectName), '_blank'),\n  },\n}\n\nexport const isFilePreviewable = (mime = '', ext = '') =>\n  Object.values(expandableMimeTypes).some(({ mimeTypes = [] }) =>\n    mimeTypes.some((type) => (mime || ext)?.includes(type)),\n  )\n\ninterface FileUploadPreviewProps {\n  files: any[] // replace with correct type\n  index: number\n  activityId: string\n  projectName: string\n  onFilePreviewClose: () => void\n  onNavigate: (payload: any) => void // replace with correct type\n}\n\nconst FileUploadPreview: React.FC<FileUploadPreviewProps> = ({\n  files,\n  index,\n  activityId,\n  projectName,\n  onFilePreviewClose,\n  onNavigate,\n}) => {\n  const {\n    canNavigateDown,\n    canNavigateUp,\n    canNavigateLeft,\n    canNavigateRight,\n    getByIndexActivity,\n    navigateUp,\n    navigateDown,\n    navigateLeft,\n    navigateRight,\n  } = useAttachmentNavigation({ files, index, activityId, onNavigate })\n  const file = { ...getByIndexActivity(activityId, index), projectName }\n  const { id, mime, extension, name } = file\n\n  // when dialog open, focus on the dialog\n  // we do this so that the user can navigate with the keyboard (esc works)\n  const dialogRef = useRef<HTMLDivElement>(null)\n  useEffect(() => {\n    if (id && projectName) {\n      dialogRef.current?.focus()\n    }\n  }, [id, projectName])\n\n  const handleClose = () => {\n    onFilePreviewClose()\n  }\n\n  if (!id || !projectName) return null\n\n  // get the correct mime type component based on mimeTypes match\n  const previewable = Object.values(expandableMimeTypes).find(({ mimeTypes }) =>\n    mimeTypes.some((type) => (mime || extension)?.includes(type)),\n  )\n\n  // @ts-ignore\n  const { component: MimeComponent, id: typeId, callback, fullPreviews } = previewable || {}\n\n  // if there is a callback, run it and return null\n  // mainly for pdfs\n  if (callback) {\n    callback(file)\n    return null\n  }\n\n  const handleNavigateToPrevActivity = () => canNavigateUp() && navigateUp()\n  const handleNavigateToNextActivity = () => canNavigateDown() && navigateDown()\n  const handleNavigateToPrevious = () => canNavigateLeft() && navigateLeft()\n  const handleNavigateToNext = () => canNavigateRight() && navigateRight()\n\n  const isImage = typeId === 'image'\n  const zIndex = 50\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.code === 'ArrowUp') {\n      handleNavigateToPrevActivity()\n    }\n    if (e.code === 'ArrowDown') {\n      handleNavigateToNextActivity()\n    }\n    if (e.code === 'ArrowRight') {\n      handleNavigateToNext()\n    }\n    if (e.code === 'ArrowLeft') {\n      handleNavigateToPrevious()\n    }\n    if (e.key === 'Escape') {\n      e.preventDefault()\n      handleClose()\n    }\n  }\n\n  if (!MimeComponent) {\n    return null\n  }\n\n  return (\n    <Styled.DialogWrapper\n      onKeyDown={handleKeyDown}\n      size=\"full\"\n      isOpen={!!(id && projectName)}\n      onClose={handleClose}\n      hideCancelButton={isImage}\n      ref={dialogRef}\n      className={clsx({ isImage }, 'block-shortcuts')}\n      header={isImage ? null : name}\n    >\n      <div style={{ position: 'absolute', inset: 0, zIndex: zIndex }} onClick={handleClose}></div>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_left\"\n        className={clsx('navIcon', 'left', { disabled: !canNavigateLeft() })}\n        onClick={handleNavigateToPrevious}\n      />\n\n      <Styled.ScrollableContent\n        style={{ zIndex: zIndex + 1 }}\n        className={clsx({ scrollable: !isImage })}\n      >\n        <MimeComponent file={file} fullPreviews={fullPreviews} />\n      </Styled.ScrollableContent>\n\n      <Icon\n        style={{ zIndex: zIndex + 1 }}\n        icon=\"chevron_right\"\n        className={clsx('navIcon', 'right', { disabled: !canNavigateRight() })}\n        onClick={handleNavigateToNext}\n      />\n    </Styled.DialogWrapper>\n  )\n}\n\nexport default FileUploadPreview\n"],"names":["jsxs","Styled.DialogWrapper","jsx","Styled.ScrollableContent"],"mappings":"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"}

package/dist/shared/src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js

@@ -14,6 +14,7 @@ const DialogWrapper = styled(ayonReactComponents.Dialog)`
     justify-content: center;
     align-content: center;
     padding-top: 0;
+    overflow: hidden;
   }
   .navIcon {
     position: absolute;
@@ -98,6 +99,14 @@ const Image = styled.img`
   min-width: 300px;
   background-color: var(--md-sys-color-surface-container-lowest);
 `;
+const ScrollableContent = styled.div`
+  &.scrollable {
+    position: absolute;
+    inset: 56px;
+    overflow: auto;
+  }
+`;
 exports.DialogWrapper = DialogWrapper;
 exports.Image = Image;
+exports.ScrollableContent = ScrollableContent;
 //# sourceMappingURL=FileUploadPreview.styled.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FileUploadPreview.styled.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.ts"],"sourcesContent":["import { Dialog } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const DialogWrapper = styled(Dialog)`\n  min-height: 90vh;\n  max-height: 90vh;\n  min-width: min(90vw, 100%);\n  max-width: 1000px;\n\n  .body {\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-content: center;\n    padding-top: 0;\n  }\n  .navIcon {\n    position: absolute;\n    top: 50%;\n    user-select: none;\n\n    &.left {\n      left: 0;\n      translate: -100% -50%;\n    }\n    &.right {\n      right: 0;\n      translate: 100% -50%;\n    }\n    align-content: center;\n    font-size: 60px;\n    &:hover {\n      cursor: pointer;\n      color: var(--md-sys-color-primary);\n    }\n    &.disabled {\n      color: var(--md-sys-color-outline-variant);\n      &:hover {\n        cursor: not-allowed;\n      }\n    }\n  }\n\n  /* custom image styles */\n  &.isImage {\n    /* remove min/max height */\n\n    background-color: unset;\n    border-radius: 0;\n\n    width: 0;\n\n    .cancelButton {\n      top: 1px;\n      right: 1px;\n      background-color: var(--md-sys-color-surface-container-highest);\n    }\n\n    /* Backdrop property affects inactive area around modal */\n    &::backdrop {\n      background-color: rgba(0, 0, 0, 0.7);\n    }\n\n    .header {\n      display: none;\n    }\n\n    .body {\n      padding: 0;\n      align-items: stretch;\n      user-select: none;\n      overflow: hidden;\n    }\n\n    footer {\n      display: none;\n    }\n\n    /* remove focus outline */\n    &:focus {\n      outline: none;\n    }\n  }\n  /* remove focus outline */\n  &:focus-visible {\n    outline: none;\n  }\n`\n\nexport const Image = styled.img`\n  height: 100%;\n  width: 100%;\n\n  width: max-content;\n  height: max-content;\n  max-height: 80vh;\n  max-width: 90vw;\n  min-width: 300px;\n  background-color: var(--md-sys-color-surface-container-lowest);\n`\n"],"names":["Dialog"],"mappings":";;;;AAGa,MAAA,gBAAgB,OAAOA,0BAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsFnC,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;"}
+{"version":3,"file":"FileUploadPreview.styled.cjs.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.ts"],"sourcesContent":["import { Dialog } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const DialogWrapper = styled(Dialog)`\n  min-height: 90vh;\n  max-height: 90vh;\n  min-width: min(90vw, 100%);\n  max-width: 1000px;\n\n  .body {\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-content: center;\n    padding-top: 0;\n    overflow: hidden;\n  }\n  .navIcon {\n    position: absolute;\n    top: 50%;\n    user-select: none;\n\n    &.left {\n      left: 0;\n      translate: -100% -50%;\n    }\n    &.right {\n      right: 0;\n      translate: 100% -50%;\n    }\n    align-content: center;\n    font-size: 60px;\n    &:hover {\n      cursor: pointer;\n      color: var(--md-sys-color-primary);\n    }\n    &.disabled {\n      color: var(--md-sys-color-outline-variant);\n      &:hover {\n        cursor: not-allowed;\n      }\n    }\n  }\n\n  /* custom image styles */\n  &.isImage {\n    /* remove min/max height */\n\n    background-color: unset;\n    border-radius: 0;\n\n    width: 0;\n\n    .cancelButton {\n      top: 1px;\n      right: 1px;\n      background-color: var(--md-sys-color-surface-container-highest);\n    }\n\n    /* Backdrop property affects inactive area around modal */\n    &::backdrop {\n      background-color: rgba(0, 0, 0, 0.7);\n    }\n\n    .header {\n      display: none;\n    }\n\n    .body {\n      padding: 0;\n      align-items: stretch;\n      user-select: none;\n      overflow: hidden;\n    }\n\n    footer {\n      display: none;\n    }\n\n    /* remove focus outline */\n    &:focus {\n      outline: none;\n    }\n  }\n  /* remove focus outline */\n  &:focus-visible {\n    outline: none;\n  }\n`\n\nexport const Image = styled.img`\n  height: 100%;\n  width: 100%;\n\n  width: max-content;\n  height: max-content;\n  max-height: 80vh;\n  max-width: 90vw;\n  min-width: 300px;\n  background-color: var(--md-sys-color-surface-container-lowest);\n`\n\nexport const ScrollableContent = styled.div`\n  &.scrollable {\n    position: absolute;\n    inset: 56px;\n    overflow: auto;\n  }\n`\n"],"names":["Dialog"],"mappings":";;;;AAGa,MAAA,gBAAgB,OAAOA,0BAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuFnC,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYrB,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;"}

package/dist/shared/src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.es.js

@@ -12,6 +12,7 @@ const DialogWrapper = styled(Dialog)`
     justify-content: center;
     align-content: center;
     padding-top: 0;
+    overflow: hidden;
   }
   .navIcon {
     position: absolute;
@@ -96,8 +97,16 @@ const Image = styled.img`
   min-width: 300px;
   background-color: var(--md-sys-color-surface-container-lowest);
 `;
+const ScrollableContent = styled.div`
+  &.scrollable {
+    position: absolute;
+    inset: 56px;
+    overflow: auto;
+  }
+`;
 export {
   DialogWrapper,
-  Image
+  Image,
+  ScrollableContent
 };
 //# sourceMappingURL=FileUploadPreview.styled.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FileUploadPreview.styled.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.ts"],"sourcesContent":["import { Dialog } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const DialogWrapper = styled(Dialog)`\n  min-height: 90vh;\n  max-height: 90vh;\n  min-width: min(90vw, 100%);\n  max-width: 1000px;\n\n  .body {\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-content: center;\n    padding-top: 0;\n  }\n  .navIcon {\n    position: absolute;\n    top: 50%;\n    user-select: none;\n\n    &.left {\n      left: 0;\n      translate: -100% -50%;\n    }\n    &.right {\n      right: 0;\n      translate: 100% -50%;\n    }\n    align-content: center;\n    font-size: 60px;\n    &:hover {\n      cursor: pointer;\n      color: var(--md-sys-color-primary);\n    }\n    &.disabled {\n      color: var(--md-sys-color-outline-variant);\n      &:hover {\n        cursor: not-allowed;\n      }\n    }\n  }\n\n  /* custom image styles */\n  &.isImage {\n    /* remove min/max height */\n\n    background-color: unset;\n    border-radius: 0;\n\n    width: 0;\n\n    .cancelButton {\n      top: 1px;\n      right: 1px;\n      background-color: var(--md-sys-color-surface-container-highest);\n    }\n\n    /* Backdrop property affects inactive area around modal */\n    &::backdrop {\n      background-color: rgba(0, 0, 0, 0.7);\n    }\n\n    .header {\n      display: none;\n    }\n\n    .body {\n      padding: 0;\n      align-items: stretch;\n      user-select: none;\n      overflow: hidden;\n    }\n\n    footer {\n      display: none;\n    }\n\n    /* remove focus outline */\n    &:focus {\n      outline: none;\n    }\n  }\n  /* remove focus outline */\n  &:focus-visible {\n    outline: none;\n  }\n`\n\nexport const Image = styled.img`\n  height: 100%;\n  width: 100%;\n\n  width: max-content;\n  height: max-content;\n  max-height: 80vh;\n  max-width: 90vw;\n  min-width: 300px;\n  background-color: var(--md-sys-color-surface-container-lowest);\n`\n"],"names":[],"mappings":";;AAGa,MAAA,gBAAgB,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsFnC,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"FileUploadPreview.styled.es.js","sources":["../../../../../../../src/containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.ts"],"sourcesContent":["import { Dialog } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const DialogWrapper = styled(Dialog)`\n  min-height: 90vh;\n  max-height: 90vh;\n  min-width: min(90vw, 100%);\n  max-width: 1000px;\n\n  .body {\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    align-content: center;\n    padding-top: 0;\n    overflow: hidden;\n  }\n  .navIcon {\n    position: absolute;\n    top: 50%;\n    user-select: none;\n\n    &.left {\n      left: 0;\n      translate: -100% -50%;\n    }\n    &.right {\n      right: 0;\n      translate: 100% -50%;\n    }\n    align-content: center;\n    font-size: 60px;\n    &:hover {\n      cursor: pointer;\n      color: var(--md-sys-color-primary);\n    }\n    &.disabled {\n      color: var(--md-sys-color-outline-variant);\n      &:hover {\n        cursor: not-allowed;\n      }\n    }\n  }\n\n  /* custom image styles */\n  &.isImage {\n    /* remove min/max height */\n\n    background-color: unset;\n    border-radius: 0;\n\n    width: 0;\n\n    .cancelButton {\n      top: 1px;\n      right: 1px;\n      background-color: var(--md-sys-color-surface-container-highest);\n    }\n\n    /* Backdrop property affects inactive area around modal */\n    &::backdrop {\n      background-color: rgba(0, 0, 0, 0.7);\n    }\n\n    .header {\n      display: none;\n    }\n\n    .body {\n      padding: 0;\n      align-items: stretch;\n      user-select: none;\n      overflow: hidden;\n    }\n\n    footer {\n      display: none;\n    }\n\n    /* remove focus outline */\n    &:focus {\n      outline: none;\n    }\n  }\n  /* remove focus outline */\n  &:focus-visible {\n    outline: none;\n  }\n`\n\nexport const Image = styled.img`\n  height: 100%;\n  width: 100%;\n\n  width: max-content;\n  height: max-content;\n  max-height: 80vh;\n  max-width: 90vw;\n  min-width: 300px;\n  background-color: var(--md-sys-color-surface-container-lowest);\n`\n\nexport const ScrollableContent = styled.div`\n  &.scrollable {\n    position: absolute;\n    inset: 56px;\n    overflow: auto;\n  }\n`\n"],"names":[],"mappings":";;AAGa,MAAA,gBAAgB,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuFnC,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYrB,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/shared/src/containers/Feed/context/FeedContext.cjs.js

@@ -38,6 +38,7 @@ require("../../../api/generated/users.cjs.js");
 require("../../../api/generated/versions.cjs.js");
 require("../../../api/generated/workfiles.cjs.js");
 require("../../../api/generated/ynputCloud.cjs.js");
+require("../../../api/generated/grouping.cjs.js");
 require("../../../api/queries/actions/getActions.cjs.js");
 const getActivities = require("../../../api/queries/activities/getActivities.cjs.js");
 const updateActivities = require("../../../api/queries/activities/updateActivities.cjs.js");
@@ -69,6 +70,7 @@ require("../../../api/queries/users/getUsers.cjs.js");
 require("../../../api/queries/users/updateUsers.cjs.js");
 require("../../../api/queries/watchers/getWatchers.cjs.js");
 require("../../../api/queries/permissions/getPermissions.cjs.js");
+require("../../../api/queries/grouping/getGrouping.cjs.js");
 require("../../../context/RemoteModulesContext.cjs.js");
 const DetailsPanelContext = require("../../../context/DetailsPanelContext.cjs.js");
 require("../../../context/ThumbnailUploaderContext.cjs.js");

package/dist/shared/src/containers/Feed/context/FeedContext.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeedContext.cjs.js","sources":["../../../../../../src/containers/Feed/context/FeedContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useState } from 'react'\nimport useGetFeedActivitiesData from '../hooks/useGetFeedActivitiesData'\n\n// Queries\nimport {\n  useCreateEntityActivityMutation,\n  useDeleteActivityMutation,\n  useUpdateActivityMutation,\n  useCreateReactionToActivityMutation,\n  useDeleteReactionToActivityMutation,\n  useGetActivityUsersQuery,\n  useGetEntityMentionsQuery,\n  useGetEntityTooltipQuery,\n} from '@shared/api'\nimport type { SuggestRequest, SuggestResponse } from '@shared/api'\nimport { ActivityUser } from '../helpers/groupMinorActivities'\nimport { DetailsPanelTab, useScopedDetailsPanel } from '@shared/context'\nimport { getFilterActivityTypes } from '@shared/api'\n\nexport const FEED_NEW_COMMENT = '__new__' as const\n\nexport type EditingState = null | typeof FEED_NEW_COMMENT | string\n\n// Add type for the refTooltip\nexport interface RefTooltip {\n  id: string | null\n  type: string\n  name: string\n  label: string\n  pos: {\n    top: number\n    left: number\n  }\n}\n\nexport type FeedContextProps = {\n  children: React.ReactNode\n  projectName: string\n  entityType: string\n  activityTypes?: string[] | null\n  entities: any[]\n  projectInfo: any\n  scope: string\n  userName: string\n  userFullName: string\n\n  // annotations\n  annotations?: Record<string, any>\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n  // editingId state and functions\n  editingId: EditingState\n  setEditingId: (id: EditingState) => void\n}\n\ninterface FeedContextType extends Omit<FeedContextProps, 'children'> {\n  currentTab: DetailsPanelTab\n  // activities data props\n  activitiesData: any[]\n  isLoadingActivities: boolean\n  isLoadingNew: boolean\n  isLoadingNextPage: boolean\n  hasNextPage: boolean\n  loadNextPage?: () => Promise<any>\n  // refTooltip state and functions\n  refTooltip: RefTooltip | null\n  setRefTooltip: (tooltip: RefTooltip | null) => void\n  // tooltip data\n  entityTooltipData: any\n  isFetchingTooltip: boolean\n  // query functions\n  createEntityActivity: (args: any) => Promise<any>\n  updateActivity: (args: any) => Promise<any>\n  deleteActivity: (args: any) => Promise<any>\n  createReaction: (args: any) => Promise<any>\n  deleteReaction: (args: any) => Promise<any>\n  isUpdatingActivity: boolean\n  // users data\n  users: ActivityUser[]\n  // mentions data\n  mentionSuggestionsData: SuggestResponse\n}\n\nconst FeedContext = createContext<FeedContextType | undefined>(undefined)\n\nexport const FeedProvider = ({ children, ...props }: FeedContextProps) => {\n  const { data: users = [] } = useGetActivityUsersQuery({ projects: [props.projectName] })\n  const { currentTab } = useScopedDetailsPanel(props.scope)\n\n  //   queries\n  const [createEntityActivityMutation, { isLoading: isLoadingCreate }] =\n    useCreateEntityActivityMutation()\n  const [updateActivityMutation, { isLoading: isLoadingUpdate }] = useUpdateActivityMutation()\n  const [deleteActivityMutation, { isLoading: isLoadingDelete }] = useDeleteActivityMutation()\n  const isUpdatingActivity = isLoadingCreate || isLoadingUpdate || isLoadingDelete\n\n  const createEntityActivity: FeedContextType['createEntityActivity'] = async (args) =>\n    await createEntityActivityMutation(args).unwrap()\n  const updateActivity: FeedContextType['updateActivity'] = async (args) =>\n    await updateActivityMutation(args).unwrap()\n  const deleteActivity: FeedContextType['deleteActivity'] = async (args) =>\n    await deleteActivityMutation(args).unwrap()\n\n  const [createReactionToActivity] = useCreateReactionToActivityMutation()\n  const [deleteReactionToActivity] = useDeleteReactionToActivityMutation()\n\n  const createReaction: FeedContextType['createReaction'] = async (args) =>\n    await createReactionToActivity(args).unwrap()\n  const deleteReaction: FeedContextType['deleteReaction'] = async (args) =>\n    await deleteReactionToActivity(args).unwrap()\n\n  const activityTypes = getFilterActivityTypes(currentTab)\n\n  const activitiesDataProps = useGetFeedActivitiesData({\n    entities: props.entities,\n    filter: currentTab,\n    activityTypes: activityTypes,\n    projectName: props.projectName,\n    entityType: props.entityType,\n  })\n\n  const [refTooltip, setRefTooltip] = useState<RefTooltip | null>(null)\n  const skip = !props.projectName || !refTooltip?.id || refTooltip.type === 'user'\n  const { data: entityTooltipData, isFetching: isFetchingTooltip } = useGetEntityTooltipQuery(\n    { entityType: refTooltip?.type, entityId: refTooltip?.id, projectName: props.projectName },\n    { skip: skip },\n  )\n\n  // get all versions that can be mentioned\n  const { data: mentionSuggestionsData = {} } = useGetEntityMentionsQuery(\n    {\n      suggestRequest: {\n        entityType: props.entityType as SuggestRequest['entityType'],\n        entityId: props.entities[0]?.id,\n      },\n      projectName: props.projectName,\n    },\n    { skip: !props.editingId },\n  )\n\n  return (\n    <FeedContext.Provider\n      value={{\n        ...props,\n        ...activitiesDataProps,\n        mentionSuggestionsData,\n        users,\n        isUpdatingActivity,\n        entityTooltipData,\n        isFetchingTooltip,\n        refTooltip,\n        activityTypes,\n        currentTab,\n        setRefTooltip,\n        // Query functions\n        createEntityActivity,\n        updateActivity,\n        deleteActivity,\n        createReaction,\n        deleteReaction,\n      }}\n    >\n      {children}\n    </FeedContext.Provider>\n  )\n}\n\nexport const useFeedContext = () => {\n  const context = useContext(FeedContext)\n  if (!context) {\n    throw new Error('useFeedContext must be used within a FeedProvider')\n  }\n  return context\n}\n"],"names":["createContext","useGetActivityUsersQuery","useScopedDetailsPanel","useCreateEntityActivityMutation","useUpdateActivityMutation","useDeleteActivityMutation","useCreateReactionToActivityMutation","useDeleteReactionToActivityMutation","getFilterActivityTypes","useState","useGetEntityTooltipQuery","useGetEntityMentionsQuery","jsx","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,mBAAmB;AAgEhC,MAAM,cAAcA,oBAA2C,MAAS;AAEjE,MAAM,eAAe,CAAC,EAAE,UAAU,GAAG,YAA8B;;AACxE,QAAM,EAAE,MAAM,QAAQ,CAAA,MAAOC,cAAAA,yBAAyB,EAAE,UAAU,CAAC,MAAM,WAAW,GAAG;AACvF,QAAM,EAAE,WAAe,IAAAC,0CAAsB,MAAM,KAAK;AAGxD,QAAM,CAAC,8BAA8B,EAAE,WAAW,gBAAiB,CAAA,IACjEC,iBAAAA,gCAAgC;AAClC,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAIC,iBAAAA,0BAA0B;AAC3F,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAIC,iBAAAA,0BAA0B;AACrF,QAAA,qBAAqB,mBAAmB,mBAAmB;AAEjE,QAAM,uBAAgE,OAAO,SAC3E,MAAM,6BAA6B,IAAI,EAAE,OAAO;AAClD,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAC5C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAEtC,QAAA,CAAC,wBAAwB,IAAIC,mDAAoC;AACjE,QAAA,CAAC,wBAAwB,IAAIC,mDAAoC;AAEvE,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAC9C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAExC,QAAA,gBAAgBC,yCAAuB,UAAU;AAEvD,QAAM,sBAAsB,yBAAyB;AAAA,IACnD,UAAU,MAAM;AAAA,IAChB,QAAQ;AAAA,IACR;AAAA,IACA,aAAa,MAAM;AAAA,IACnB,YAAY,MAAM;AAAA,EAAA,CACnB;AAED,QAAM,CAAC,YAAY,aAAa,IAAIC,MAAAA,SAA4B,IAAI;AAC9D,QAAA,OAAO,CAAC,MAAM,eAAe,EAAC,yCAAY,OAAM,WAAW,SAAS;AAC1E,QAAM,EAAE,MAAM,mBAAmB,YAAY,kBAAsB,IAAAC,cAAA;AAAA,IACjE,EAAE,YAAY,yCAAY,MAAM,UAAU,yCAAY,IAAI,aAAa,MAAM,YAAY;AAAA,IACzF,EAAE,KAAW;AAAA,EACf;AAGA,QAAM,EAAE,MAAM,yBAAyB,CAAA,EAAO,IAAAC,YAAA;AAAA,IAC5C;AAAA,MACE,gBAAgB;AAAA,QACd,YAAY,MAAM;AAAA,QAClB,WAAU,WAAM,SAAS,CAAC,MAAhB,mBAAmB;AAAA,MAC/B;AAAA,MACA,aAAa,MAAM;AAAA,IACrB;AAAA,IACA,EAAE,MAAM,CAAC,MAAM,UAAU;AAAA,EAC3B;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAAC,YAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;AAEO,MAAM,iBAAiB,MAAM;AAC5B,QAAA,UAAUC,iBAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,mDAAmD;AAAA,EAAA;AAE9D,SAAA;AACT;;;;"}
+{"version":3,"file":"FeedContext.cjs.js","sources":["../../../../../../src/containers/Feed/context/FeedContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useState } from 'react'\nimport useGetFeedActivitiesData from '../hooks/useGetFeedActivitiesData'\n\n// Queries\nimport {\n  useCreateEntityActivityMutation,\n  useDeleteActivityMutation,\n  useUpdateActivityMutation,\n  useCreateReactionToActivityMutation,\n  useDeleteReactionToActivityMutation,\n  useGetActivityUsersQuery,\n  useGetEntityMentionsQuery,\n  useGetEntityTooltipQuery,\n} from '@shared/api'\nimport type { SuggestRequest, SuggestResponse } from '@shared/api'\nimport { ActivityUser } from '../helpers/groupMinorActivities'\nimport { DetailsPanelTab, useScopedDetailsPanel } from '@shared/context'\nimport { getFilterActivityTypes } from '@shared/api'\n\nexport const FEED_NEW_COMMENT = '__new__' as const\n\nexport type EditingState = null | typeof FEED_NEW_COMMENT | string\n\n// Add type for the refTooltip\nexport interface RefTooltip {\n  id: string | null\n  type: string\n  name: string\n  label: string\n  pos: {\n    top: number\n    left: number\n  }\n}\n\nexport type FeedContextProps = {\n  children: React.ReactNode\n  projectName: string\n  entityType: string\n  activityTypes?: string[] | null\n  entities: any[]\n  projectInfo: any\n  scope: string\n  userName: string\n  userFullName: string\n\n  // annotations\n  annotations?: Record<string, any>\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n  // editingId state and functions\n  editingId: EditingState\n  setEditingId: (id: EditingState) => void\n}\n\ninterface FeedContextType extends Omit<FeedContextProps, 'children'> {\n  currentTab: DetailsPanelTab\n  // activities data props\n  activitiesData: any[]\n  isLoadingActivities: boolean\n  isLoadingNew: boolean\n  isLoadingNextPage: boolean\n  hasNextPage: boolean\n  loadNextPage?: () => Promise<any>\n  // refTooltip state and functions\n  refTooltip: RefTooltip | null\n  setRefTooltip: (tooltip: RefTooltip | null) => void\n  // tooltip data\n  entityTooltipData: any\n  isFetchingTooltip: boolean\n  // query functions\n  createEntityActivity: (args: any) => Promise<any>\n  updateActivity: (args: any) => Promise<any>\n  deleteActivity: (args: any) => Promise<any>\n  createReaction: (args: any) => Promise<any>\n  deleteReaction: (args: any) => Promise<any>\n  isUpdatingActivity: boolean\n  // users data\n  users: ActivityUser[]\n  // mentions data\n  mentionSuggestionsData: SuggestResponse\n}\n\nconst FeedContext = createContext<FeedContextType | undefined>(undefined)\n\nexport const FeedProvider = ({ children, ...props }: FeedContextProps) => {\n  const { data: users = [] } = useGetActivityUsersQuery({ projects: [props.projectName] })\n  const { currentTab } = useScopedDetailsPanel(props.scope)\n\n  //   queries\n  const [createEntityActivityMutation, { isLoading: isLoadingCreate }] =\n    useCreateEntityActivityMutation()\n  const [updateActivityMutation, { isLoading: isLoadingUpdate }] = useUpdateActivityMutation()\n  const [deleteActivityMutation, { isLoading: isLoadingDelete }] = useDeleteActivityMutation()\n  const isUpdatingActivity = isLoadingCreate || isLoadingUpdate || isLoadingDelete\n\n  const createEntityActivity: FeedContextType['createEntityActivity'] = async (args) =>\n    await createEntityActivityMutation(args).unwrap()\n  const updateActivity: FeedContextType['updateActivity'] = async (args) =>\n    await updateActivityMutation(args).unwrap()\n  const deleteActivity: FeedContextType['deleteActivity'] = async (args) =>\n    await deleteActivityMutation(args).unwrap()\n\n  const [createReactionToActivity] = useCreateReactionToActivityMutation()\n  const [deleteReactionToActivity] = useDeleteReactionToActivityMutation()\n\n  const createReaction: FeedContextType['createReaction'] = async (args) =>\n    await createReactionToActivity(args).unwrap()\n  const deleteReaction: FeedContextType['deleteReaction'] = async (args) =>\n    await deleteReactionToActivity(args).unwrap()\n\n  const activityTypes = getFilterActivityTypes(currentTab)\n\n  const activitiesDataProps = useGetFeedActivitiesData({\n    entities: props.entities,\n    filter: currentTab,\n    activityTypes: activityTypes,\n    projectName: props.projectName,\n    entityType: props.entityType,\n  })\n\n  const [refTooltip, setRefTooltip] = useState<RefTooltip | null>(null)\n  const skip = !props.projectName || !refTooltip?.id || refTooltip.type === 'user'\n  const { data: entityTooltipData, isFetching: isFetchingTooltip } = useGetEntityTooltipQuery(\n    { entityType: refTooltip?.type, entityId: refTooltip?.id, projectName: props.projectName },\n    { skip: skip },\n  )\n\n  // get all versions that can be mentioned\n  const { data: mentionSuggestionsData = {} } = useGetEntityMentionsQuery(\n    {\n      suggestRequest: {\n        entityType: props.entityType as SuggestRequest['entityType'],\n        entityId: props.entities[0]?.id,\n      },\n      projectName: props.projectName,\n    },\n    { skip: !props.editingId },\n  )\n\n  return (\n    <FeedContext.Provider\n      value={{\n        ...props,\n        ...activitiesDataProps,\n        mentionSuggestionsData,\n        users,\n        isUpdatingActivity,\n        entityTooltipData,\n        isFetchingTooltip,\n        refTooltip,\n        activityTypes,\n        currentTab,\n        setRefTooltip,\n        // Query functions\n        createEntityActivity,\n        updateActivity,\n        deleteActivity,\n        createReaction,\n        deleteReaction,\n      }}\n    >\n      {children}\n    </FeedContext.Provider>\n  )\n}\n\nexport const useFeedContext = () => {\n  const context = useContext(FeedContext)\n  if (!context) {\n    throw new Error('useFeedContext must be used within a FeedProvider')\n  }\n  return context\n}\n"],"names":["createContext","useGetActivityUsersQuery","useScopedDetailsPanel","useCreateEntityActivityMutation","useUpdateActivityMutation","useDeleteActivityMutation","useCreateReactionToActivityMutation","useDeleteReactionToActivityMutation","getFilterActivityTypes","useState","useGetEntityTooltipQuery","useGetEntityMentionsQuery","jsx","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,mBAAmB;AAgEhC,MAAM,cAAcA,oBAA2C,MAAS;AAEjE,MAAM,eAAe,CAAC,EAAE,UAAU,GAAG,YAA8B;;AACxE,QAAM,EAAE,MAAM,QAAQ,CAAA,MAAOC,cAAAA,yBAAyB,EAAE,UAAU,CAAC,MAAM,WAAW,GAAG;AACvF,QAAM,EAAE,WAAe,IAAAC,0CAAsB,MAAM,KAAK;AAGxD,QAAM,CAAC,8BAA8B,EAAE,WAAW,gBAAiB,CAAA,IACjEC,iBAAAA,gCAAgC;AAClC,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAIC,iBAAAA,0BAA0B;AAC3F,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAIC,iBAAAA,0BAA0B;AACrF,QAAA,qBAAqB,mBAAmB,mBAAmB;AAEjE,QAAM,uBAAgE,OAAO,SAC3E,MAAM,6BAA6B,IAAI,EAAE,OAAO;AAClD,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAC5C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAEtC,QAAA,CAAC,wBAAwB,IAAIC,mDAAoC;AACjE,QAAA,CAAC,wBAAwB,IAAIC,mDAAoC;AAEvE,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAC9C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAExC,QAAA,gBAAgBC,yCAAuB,UAAU;AAEvD,QAAM,sBAAsB,yBAAyB;AAAA,IACnD,UAAU,MAAM;AAAA,IAChB,QAAQ;AAAA,IACR;AAAA,IACA,aAAa,MAAM;AAAA,IACnB,YAAY,MAAM;AAAA,EAAA,CACnB;AAED,QAAM,CAAC,YAAY,aAAa,IAAIC,MAAAA,SAA4B,IAAI;AAC9D,QAAA,OAAO,CAAC,MAAM,eAAe,EAAC,yCAAY,OAAM,WAAW,SAAS;AAC1E,QAAM,EAAE,MAAM,mBAAmB,YAAY,kBAAsB,IAAAC,cAAA;AAAA,IACjE,EAAE,YAAY,yCAAY,MAAM,UAAU,yCAAY,IAAI,aAAa,MAAM,YAAY;AAAA,IACzF,EAAE,KAAW;AAAA,EACf;AAGA,QAAM,EAAE,MAAM,yBAAyB,CAAA,EAAO,IAAAC,YAAA;AAAA,IAC5C;AAAA,MACE,gBAAgB;AAAA,QACd,YAAY,MAAM;AAAA,QAClB,WAAU,WAAM,SAAS,CAAC,MAAhB,mBAAmB;AAAA,MAC/B;AAAA,MACA,aAAa,MAAM;AAAA,IACrB;AAAA,IACA,EAAE,MAAM,CAAC,MAAM,UAAU;AAAA,EAC3B;AAGE,SAAAC,2BAAA,kBAAA;AAAA,IAAC,YAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;AAEO,MAAM,iBAAiB,MAAM;AAC5B,QAAA,UAAUC,iBAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,mDAAmD;AAAA,EAAA;AAE9D,SAAA;AACT;;;;"}

package/dist/shared/src/containers/Feed/context/FeedContext.es.js

@@ -36,6 +36,7 @@ import "../../../api/generated/users.es.js";
 import "../../../api/generated/versions.es.js";
 import "../../../api/generated/workfiles.es.js";
 import "../../../api/generated/ynputCloud.es.js";
+import "../../../api/generated/grouping.es.js";
 import "../../../api/queries/actions/getActions.es.js";
 import { useGetActivityUsersQuery, useGetEntityTooltipQuery } from "../../../api/queries/activities/getActivities.es.js";
 import { useCreateEntityActivityMutation, useUpdateActivityMutation, useDeleteActivityMutation } from "../../../api/queries/activities/updateActivities.es.js";
@@ -67,6 +68,7 @@ import "../../../api/queries/users/getUsers.es.js";
 import "../../../api/queries/users/updateUsers.es.js";
 import "../../../api/queries/watchers/getWatchers.es.js";
 import "../../../api/queries/permissions/getPermissions.es.js";
+import "../../../api/queries/grouping/getGrouping.es.js";
 import "../../../context/RemoteModulesContext.es.js";
 import { useScopedDetailsPanel } from "../../../context/DetailsPanelContext.es.js";
 import "../../../context/ThumbnailUploaderContext.es.js";

package/dist/shared/src/containers/Feed/context/FeedContext.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeedContext.es.js","sources":["../../../../../../src/containers/Feed/context/FeedContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useState } from 'react'\nimport useGetFeedActivitiesData from '../hooks/useGetFeedActivitiesData'\n\n// Queries\nimport {\n  useCreateEntityActivityMutation,\n  useDeleteActivityMutation,\n  useUpdateActivityMutation,\n  useCreateReactionToActivityMutation,\n  useDeleteReactionToActivityMutation,\n  useGetActivityUsersQuery,\n  useGetEntityMentionsQuery,\n  useGetEntityTooltipQuery,\n} from '@shared/api'\nimport type { SuggestRequest, SuggestResponse } from '@shared/api'\nimport { ActivityUser } from '../helpers/groupMinorActivities'\nimport { DetailsPanelTab, useScopedDetailsPanel } from '@shared/context'\nimport { getFilterActivityTypes } from '@shared/api'\n\nexport const FEED_NEW_COMMENT = '__new__' as const\n\nexport type EditingState = null | typeof FEED_NEW_COMMENT | string\n\n// Add type for the refTooltip\nexport interface RefTooltip {\n  id: string | null\n  type: string\n  name: string\n  label: string\n  pos: {\n    top: number\n    left: number\n  }\n}\n\nexport type FeedContextProps = {\n  children: React.ReactNode\n  projectName: string\n  entityType: string\n  activityTypes?: string[] | null\n  entities: any[]\n  projectInfo: any\n  scope: string\n  userName: string\n  userFullName: string\n\n  // annotations\n  annotations?: Record<string, any>\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n  // editingId state and functions\n  editingId: EditingState\n  setEditingId: (id: EditingState) => void\n}\n\ninterface FeedContextType extends Omit<FeedContextProps, 'children'> {\n  currentTab: DetailsPanelTab\n  // activities data props\n  activitiesData: any[]\n  isLoadingActivities: boolean\n  isLoadingNew: boolean\n  isLoadingNextPage: boolean\n  hasNextPage: boolean\n  loadNextPage?: () => Promise<any>\n  // refTooltip state and functions\n  refTooltip: RefTooltip | null\n  setRefTooltip: (tooltip: RefTooltip | null) => void\n  // tooltip data\n  entityTooltipData: any\n  isFetchingTooltip: boolean\n  // query functions\n  createEntityActivity: (args: any) => Promise<any>\n  updateActivity: (args: any) => Promise<any>\n  deleteActivity: (args: any) => Promise<any>\n  createReaction: (args: any) => Promise<any>\n  deleteReaction: (args: any) => Promise<any>\n  isUpdatingActivity: boolean\n  // users data\n  users: ActivityUser[]\n  // mentions data\n  mentionSuggestionsData: SuggestResponse\n}\n\nconst FeedContext = createContext<FeedContextType | undefined>(undefined)\n\nexport const FeedProvider = ({ children, ...props }: FeedContextProps) => {\n  const { data: users = [] } = useGetActivityUsersQuery({ projects: [props.projectName] })\n  const { currentTab } = useScopedDetailsPanel(props.scope)\n\n  //   queries\n  const [createEntityActivityMutation, { isLoading: isLoadingCreate }] =\n    useCreateEntityActivityMutation()\n  const [updateActivityMutation, { isLoading: isLoadingUpdate }] = useUpdateActivityMutation()\n  const [deleteActivityMutation, { isLoading: isLoadingDelete }] = useDeleteActivityMutation()\n  const isUpdatingActivity = isLoadingCreate || isLoadingUpdate || isLoadingDelete\n\n  const createEntityActivity: FeedContextType['createEntityActivity'] = async (args) =>\n    await createEntityActivityMutation(args).unwrap()\n  const updateActivity: FeedContextType['updateActivity'] = async (args) =>\n    await updateActivityMutation(args).unwrap()\n  const deleteActivity: FeedContextType['deleteActivity'] = async (args) =>\n    await deleteActivityMutation(args).unwrap()\n\n  const [createReactionToActivity] = useCreateReactionToActivityMutation()\n  const [deleteReactionToActivity] = useDeleteReactionToActivityMutation()\n\n  const createReaction: FeedContextType['createReaction'] = async (args) =>\n    await createReactionToActivity(args).unwrap()\n  const deleteReaction: FeedContextType['deleteReaction'] = async (args) =>\n    await deleteReactionToActivity(args).unwrap()\n\n  const activityTypes = getFilterActivityTypes(currentTab)\n\n  const activitiesDataProps = useGetFeedActivitiesData({\n    entities: props.entities,\n    filter: currentTab,\n    activityTypes: activityTypes,\n    projectName: props.projectName,\n    entityType: props.entityType,\n  })\n\n  const [refTooltip, setRefTooltip] = useState<RefTooltip | null>(null)\n  const skip = !props.projectName || !refTooltip?.id || refTooltip.type === 'user'\n  const { data: entityTooltipData, isFetching: isFetchingTooltip } = useGetEntityTooltipQuery(\n    { entityType: refTooltip?.type, entityId: refTooltip?.id, projectName: props.projectName },\n    { skip: skip },\n  )\n\n  // get all versions that can be mentioned\n  const { data: mentionSuggestionsData = {} } = useGetEntityMentionsQuery(\n    {\n      suggestRequest: {\n        entityType: props.entityType as SuggestRequest['entityType'],\n        entityId: props.entities[0]?.id,\n      },\n      projectName: props.projectName,\n    },\n    { skip: !props.editingId },\n  )\n\n  return (\n    <FeedContext.Provider\n      value={{\n        ...props,\n        ...activitiesDataProps,\n        mentionSuggestionsData,\n        users,\n        isUpdatingActivity,\n        entityTooltipData,\n        isFetchingTooltip,\n        refTooltip,\n        activityTypes,\n        currentTab,\n        setRefTooltip,\n        // Query functions\n        createEntityActivity,\n        updateActivity,\n        deleteActivity,\n        createReaction,\n        deleteReaction,\n      }}\n    >\n      {children}\n    </FeedContext.Provider>\n  )\n}\n\nexport const useFeedContext = () => {\n  const context = useContext(FeedContext)\n  if (!context) {\n    throw new Error('useFeedContext must be used within a FeedProvider')\n  }\n  return context\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,mBAAmB;AAgEhC,MAAM,cAAc,cAA2C,MAAS;AAEjE,MAAM,eAAe,CAAC,EAAE,UAAU,GAAG,YAA8B;;AACxE,QAAM,EAAE,MAAM,QAAQ,CAAA,MAAO,yBAAyB,EAAE,UAAU,CAAC,MAAM,WAAW,GAAG;AACvF,QAAM,EAAE,WAAe,IAAA,sBAAsB,MAAM,KAAK;AAGxD,QAAM,CAAC,8BAA8B,EAAE,WAAW,gBAAiB,CAAA,IACjE,gCAAgC;AAClC,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAI,0BAA0B;AAC3F,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAI,0BAA0B;AACrF,QAAA,qBAAqB,mBAAmB,mBAAmB;AAEjE,QAAM,uBAAgE,OAAO,SAC3E,MAAM,6BAA6B,IAAI,EAAE,OAAO;AAClD,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAC5C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAEtC,QAAA,CAAC,wBAAwB,IAAI,oCAAoC;AACjE,QAAA,CAAC,wBAAwB,IAAI,oCAAoC;AAEvE,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAC9C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAExC,QAAA,gBAAgB,uBAAuB,UAAU;AAEvD,QAAM,sBAAsB,yBAAyB;AAAA,IACnD,UAAU,MAAM;AAAA,IAChB,QAAQ;AAAA,IACR;AAAA,IACA,aAAa,MAAM;AAAA,IACnB,YAAY,MAAM;AAAA,EAAA,CACnB;AAED,QAAM,CAAC,YAAY,aAAa,IAAI,SAA4B,IAAI;AAC9D,QAAA,OAAO,CAAC,MAAM,eAAe,EAAC,yCAAY,OAAM,WAAW,SAAS;AAC1E,QAAM,EAAE,MAAM,mBAAmB,YAAY,kBAAsB,IAAA;AAAA,IACjE,EAAE,YAAY,yCAAY,MAAM,UAAU,yCAAY,IAAI,aAAa,MAAM,YAAY;AAAA,IACzF,EAAE,KAAW;AAAA,EACf;AAGA,QAAM,EAAE,MAAM,yBAAyB,CAAA,EAAO,IAAA;AAAA,IAC5C;AAAA,MACE,gBAAgB;AAAA,QACd,YAAY,MAAM;AAAA,QAClB,WAAU,WAAM,SAAS,CAAC,MAAhB,mBAAmB;AAAA,MAC/B;AAAA,MACA,aAAa,MAAM;AAAA,IACrB;AAAA,IACA,EAAE,MAAM,CAAC,MAAM,UAAU;AAAA,EAC3B;AAGE,SAAAA,kCAAA;AAAA,IAAC,YAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;AAEO,MAAM,iBAAiB,MAAM;AAC5B,QAAA,UAAU,WAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,mDAAmD;AAAA,EAAA;AAE9D,SAAA;AACT;"}
+{"version":3,"file":"FeedContext.es.js","sources":["../../../../../../src/containers/Feed/context/FeedContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useState } from 'react'\nimport useGetFeedActivitiesData from '../hooks/useGetFeedActivitiesData'\n\n// Queries\nimport {\n  useCreateEntityActivityMutation,\n  useDeleteActivityMutation,\n  useUpdateActivityMutation,\n  useCreateReactionToActivityMutation,\n  useDeleteReactionToActivityMutation,\n  useGetActivityUsersQuery,\n  useGetEntityMentionsQuery,\n  useGetEntityTooltipQuery,\n} from '@shared/api'\nimport type { SuggestRequest, SuggestResponse } from '@shared/api'\nimport { ActivityUser } from '../helpers/groupMinorActivities'\nimport { DetailsPanelTab, useScopedDetailsPanel } from '@shared/context'\nimport { getFilterActivityTypes } from '@shared/api'\n\nexport const FEED_NEW_COMMENT = '__new__' as const\n\nexport type EditingState = null | typeof FEED_NEW_COMMENT | string\n\n// Add type for the refTooltip\nexport interface RefTooltip {\n  id: string | null\n  type: string\n  name: string\n  label: string\n  pos: {\n    top: number\n    left: number\n  }\n}\n\nexport type FeedContextProps = {\n  children: React.ReactNode\n  projectName: string\n  entityType: string\n  activityTypes?: string[] | null\n  entities: any[]\n  projectInfo: any\n  scope: string\n  userName: string\n  userFullName: string\n\n  // annotations\n  annotations?: Record<string, any>\n  removeAnnotation?: (id: string) => void\n  exportAnnotationComposite?: (id: string) => Promise<Blob | null>\n  // editingId state and functions\n  editingId: EditingState\n  setEditingId: (id: EditingState) => void\n}\n\ninterface FeedContextType extends Omit<FeedContextProps, 'children'> {\n  currentTab: DetailsPanelTab\n  // activities data props\n  activitiesData: any[]\n  isLoadingActivities: boolean\n  isLoadingNew: boolean\n  isLoadingNextPage: boolean\n  hasNextPage: boolean\n  loadNextPage?: () => Promise<any>\n  // refTooltip state and functions\n  refTooltip: RefTooltip | null\n  setRefTooltip: (tooltip: RefTooltip | null) => void\n  // tooltip data\n  entityTooltipData: any\n  isFetchingTooltip: boolean\n  // query functions\n  createEntityActivity: (args: any) => Promise<any>\n  updateActivity: (args: any) => Promise<any>\n  deleteActivity: (args: any) => Promise<any>\n  createReaction: (args: any) => Promise<any>\n  deleteReaction: (args: any) => Promise<any>\n  isUpdatingActivity: boolean\n  // users data\n  users: ActivityUser[]\n  // mentions data\n  mentionSuggestionsData: SuggestResponse\n}\n\nconst FeedContext = createContext<FeedContextType | undefined>(undefined)\n\nexport const FeedProvider = ({ children, ...props }: FeedContextProps) => {\n  const { data: users = [] } = useGetActivityUsersQuery({ projects: [props.projectName] })\n  const { currentTab } = useScopedDetailsPanel(props.scope)\n\n  //   queries\n  const [createEntityActivityMutation, { isLoading: isLoadingCreate }] =\n    useCreateEntityActivityMutation()\n  const [updateActivityMutation, { isLoading: isLoadingUpdate }] = useUpdateActivityMutation()\n  const [deleteActivityMutation, { isLoading: isLoadingDelete }] = useDeleteActivityMutation()\n  const isUpdatingActivity = isLoadingCreate || isLoadingUpdate || isLoadingDelete\n\n  const createEntityActivity: FeedContextType['createEntityActivity'] = async (args) =>\n    await createEntityActivityMutation(args).unwrap()\n  const updateActivity: FeedContextType['updateActivity'] = async (args) =>\n    await updateActivityMutation(args).unwrap()\n  const deleteActivity: FeedContextType['deleteActivity'] = async (args) =>\n    await deleteActivityMutation(args).unwrap()\n\n  const [createReactionToActivity] = useCreateReactionToActivityMutation()\n  const [deleteReactionToActivity] = useDeleteReactionToActivityMutation()\n\n  const createReaction: FeedContextType['createReaction'] = async (args) =>\n    await createReactionToActivity(args).unwrap()\n  const deleteReaction: FeedContextType['deleteReaction'] = async (args) =>\n    await deleteReactionToActivity(args).unwrap()\n\n  const activityTypes = getFilterActivityTypes(currentTab)\n\n  const activitiesDataProps = useGetFeedActivitiesData({\n    entities: props.entities,\n    filter: currentTab,\n    activityTypes: activityTypes,\n    projectName: props.projectName,\n    entityType: props.entityType,\n  })\n\n  const [refTooltip, setRefTooltip] = useState<RefTooltip | null>(null)\n  const skip = !props.projectName || !refTooltip?.id || refTooltip.type === 'user'\n  const { data: entityTooltipData, isFetching: isFetchingTooltip } = useGetEntityTooltipQuery(\n    { entityType: refTooltip?.type, entityId: refTooltip?.id, projectName: props.projectName },\n    { skip: skip },\n  )\n\n  // get all versions that can be mentioned\n  const { data: mentionSuggestionsData = {} } = useGetEntityMentionsQuery(\n    {\n      suggestRequest: {\n        entityType: props.entityType as SuggestRequest['entityType'],\n        entityId: props.entities[0]?.id,\n      },\n      projectName: props.projectName,\n    },\n    { skip: !props.editingId },\n  )\n\n  return (\n    <FeedContext.Provider\n      value={{\n        ...props,\n        ...activitiesDataProps,\n        mentionSuggestionsData,\n        users,\n        isUpdatingActivity,\n        entityTooltipData,\n        isFetchingTooltip,\n        refTooltip,\n        activityTypes,\n        currentTab,\n        setRefTooltip,\n        // Query functions\n        createEntityActivity,\n        updateActivity,\n        deleteActivity,\n        createReaction,\n        deleteReaction,\n      }}\n    >\n      {children}\n    </FeedContext.Provider>\n  )\n}\n\nexport const useFeedContext = () => {\n  const context = useContext(FeedContext)\n  if (!context) {\n    throw new Error('useFeedContext must be used within a FeedProvider')\n  }\n  return context\n}\n"],"names":["jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,mBAAmB;AAgEhC,MAAM,cAAc,cAA2C,MAAS;AAEjE,MAAM,eAAe,CAAC,EAAE,UAAU,GAAG,YAA8B;;AACxE,QAAM,EAAE,MAAM,QAAQ,CAAA,MAAO,yBAAyB,EAAE,UAAU,CAAC,MAAM,WAAW,GAAG;AACvF,QAAM,EAAE,WAAe,IAAA,sBAAsB,MAAM,KAAK;AAGxD,QAAM,CAAC,8BAA8B,EAAE,WAAW,gBAAiB,CAAA,IACjE,gCAAgC;AAClC,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAI,0BAA0B;AAC3F,QAAM,CAAC,wBAAwB,EAAE,WAAW,gBAAiB,CAAA,IAAI,0BAA0B;AACrF,QAAA,qBAAqB,mBAAmB,mBAAmB;AAEjE,QAAM,uBAAgE,OAAO,SAC3E,MAAM,6BAA6B,IAAI,EAAE,OAAO;AAClD,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAC5C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,uBAAuB,IAAI,EAAE,OAAO;AAEtC,QAAA,CAAC,wBAAwB,IAAI,oCAAoC;AACjE,QAAA,CAAC,wBAAwB,IAAI,oCAAoC;AAEvE,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAC9C,QAAM,iBAAoD,OAAO,SAC/D,MAAM,yBAAyB,IAAI,EAAE,OAAO;AAExC,QAAA,gBAAgB,uBAAuB,UAAU;AAEvD,QAAM,sBAAsB,yBAAyB;AAAA,IACnD,UAAU,MAAM;AAAA,IAChB,QAAQ;AAAA,IACR;AAAA,IACA,aAAa,MAAM;AAAA,IACnB,YAAY,MAAM;AAAA,EAAA,CACnB;AAED,QAAM,CAAC,YAAY,aAAa,IAAI,SAA4B,IAAI;AAC9D,QAAA,OAAO,CAAC,MAAM,eAAe,EAAC,yCAAY,OAAM,WAAW,SAAS;AAC1E,QAAM,EAAE,MAAM,mBAAmB,YAAY,kBAAsB,IAAA;AAAA,IACjE,EAAE,YAAY,yCAAY,MAAM,UAAU,yCAAY,IAAI,aAAa,MAAM,YAAY;AAAA,IACzF,EAAE,KAAW;AAAA,EACf;AAGA,QAAM,EAAE,MAAM,yBAAyB,CAAA,EAAO,IAAA;AAAA,IAC5C;AAAA,MACE,gBAAgB;AAAA,QACd,YAAY,MAAM;AAAA,QAClB,WAAU,WAAM,SAAS,CAAC,MAAhB,mBAAmB;AAAA,MAC/B;AAAA,MACA,aAAa,MAAM;AAAA,IACrB;AAAA,IACA,EAAE,MAAM,CAAC,MAAM,UAAU;AAAA,EAC3B;AAGE,SAAAA,kCAAA;AAAA,IAAC,YAAY;AAAA,IAAZ;AAAA,MACC,OAAO;AAAA,QACL,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;AAEO,MAAM,iBAAiB,MAAM;AAC5B,QAAA,UAAU,WAAW,WAAW;AACtC,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,mDAAmD;AAAA,EAAA;AAE9D,SAAA;AACT;"}

package/dist/shared/src/containers/Feed/hooks/useGetFeedActivitiesData.cjs.js

@@ -34,6 +34,7 @@ require("../../../api/generated/users.cjs.js");
 require("../../../api/generated/versions.cjs.js");
 require("../../../api/generated/workfiles.cjs.js");
 require("../../../api/generated/ynputCloud.cjs.js");
+require("../../../api/generated/grouping.cjs.js");
 require("../../../api/queries/actions/getActions.cjs.js");
 const getActivities = require("../../../api/queries/activities/getActivities.cjs.js");
 require("../../../api/queries/activities/updateActivities.cjs.js");
@@ -64,6 +65,7 @@ require("../../../api/queries/users/getUsers.cjs.js");
 require("../../../api/queries/users/updateUsers.cjs.js");
 require("../../../api/queries/watchers/getWatchers.cjs.js");
 require("../../../api/queries/permissions/getPermissions.cjs.js");
+require("../../../api/queries/grouping/getGrouping.cjs.js");
 const lodash = require("lodash");
 const React = require("react");
 const useGetFeedActivitiesData = ({

package/dist/shared/src/containers/Feed/hooks/useGetFeedActivitiesData.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGetFeedActivitiesData.cjs.js","sources":["../../../../../../src/containers/Feed/hooks/useGetFeedActivitiesData.ts"],"sourcesContent":["import { GetActivitiesQueryVariables, PageInfo } from '@shared/api'\nimport { useGetActivitiesInfiniteInfiniteQuery } from '@shared/api'\nimport { isEqual, union } from 'lodash'\nimport { useMemo } from 'react'\n\nexport type UseGetActivitiesInfiniteInfiniteQuery = (\n  queryArgs: Omit<GetActivitiesQueryVariables, 'last' | 'first' | 'cursor'> & { filter?: string },\n  options: { skip: boolean },\n) => {\n  data: { pages: { activities: any[] }[] } & { pageInfo: PageInfo }\n  isLoading: boolean\n  isFetchingNextPage: boolean\n  currentData: ({ pages: { activities: any[] }[] } & { pageInfo: PageInfo }) | undefined\n  fetchNextPage: () => Promise<any>\n  hasNextPage: boolean\n}\n\ntype Props = {\n  entities: Array<{ id: string; projectName: string }>\n  filter: string\n  activityTypes?: string[] | null\n  projectName: string\n  entityType: string\n}\n\nconst useGetFeedActivitiesData = ({\n  entities,\n  filter,\n  activityTypes,\n  projectName,\n  entityType,\n}: Props) => {\n  const entitiesToQuery = useMemo(\n    () =>\n      entities.map((entity) => ({ id: entity.id, projectName: entity.projectName, entityType })),\n    [entities],\n  )\n  const entityIds = entitiesToQuery.map((entity) => entity.id)\n\n  const skip = !entities.length || !filter || !activityTypes || !projectName\n  // QUERY MADE TO GET ACTIVITIES\n\n  const queryArgs = {\n    entityIds: entityIds,\n    projectName: projectName,\n    referenceTypes: ['origin', 'mention', 'relation'],\n    activityTypes: activityTypes,\n    filter,\n  }\n\n  let {\n    data: activitiesInfiniteData,\n    isLoading: isFetchingActivities,\n    isFetchingNextPage,\n    currentData,\n    fetchNextPage,\n    hasNextPage,\n  } = useGetActivitiesInfiniteInfiniteQuery(queryArgs, { skip: skip })\n\n  // Extract tasks from infinite query data correctly\n  const activitiesList = useMemo(() => {\n    if (!activitiesInfiniteData?.pages) return []\n    return activitiesInfiniteData.pages.flatMap((page) => page.activities || [])\n  }, [activitiesInfiniteData?.pages])\n\n  const currentActivitiesList = useMemo(() => {\n    if (!currentData?.pages) return []\n    return currentData.pages.flatMap((page) => page.activities || [])\n  }, [currentData?.pages])\n\n  const loadNextPage = async () => {\n    if (!hasNextPage) {\n      console.log('No more activities to load')\n      return undefined\n    }\n    console.log('loading next page...')\n    const result = await fetchNextPage()\n\n    return result\n  }\n\n  // check if currentData matches all the entityIds\n  // if not, this means we are loading new entity\n  const isLoadingNew = useMemo(() => {\n    if (!isFetchingActivities) return false\n\n    const currentEntityIds = union(\n      currentActivitiesList?.flatMap((activity) => (activity.entityId ? activity.entityId : [])),\n    )\n\n    return !isEqual(currentEntityIds, entityIds)\n  }, [currentActivitiesList, entityIds, isFetchingActivities])\n\n  if (skip) {\n    isFetchingActivities = true\n  }\n\n  return {\n    activitiesData: activitiesList,\n    isLoadingActivities: isFetchingActivities,\n    isLoadingNew,\n    isLoadingNextPage: isFetchingNextPage,\n    hasNextPage,\n    loadNextPage,\n  }\n}\n\nexport default useGetFeedActivitiesData\n"],"names":["useMemo","useGetActivitiesInfiniteInfiniteQuery","union","isEqual"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;AACX,QAAM,kBAAkBA,MAAA;AAAA,IACtB,MACE,SAAS,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,aAAa,WAAa,EAAA;AAAA,IAC3F,CAAC,QAAQ;AAAA,EACX;AACA,QAAM,YAAY,gBAAgB,IAAI,CAAC,WAAW,OAAO,EAAE;AAErD,QAAA,OAAO,CAAC,SAAS,UAAU,CAAC,UAAU,CAAC,iBAAiB,CAAC;AAG/D,QAAM,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA,gBAAgB,CAAC,UAAU,WAAW,UAAU;AAAA,IAChD;AAAA,IACA;AAAA,EACF;AAEI,MAAA;AAAA,IACF,MAAM;AAAA,IACN,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACE,IAAAC,oDAAsC,WAAW,EAAE,MAAY;AAG7D,QAAA,iBAAiBD,MAAAA,QAAQ,MAAM;AACnC,QAAI,EAAC,iEAAwB,OAAO,QAAO,CAAC;AACrC,WAAA,uBAAuB,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC1E,CAAC,iEAAwB,KAAK,CAAC;AAE5B,QAAA,wBAAwBA,MAAAA,QAAQ,MAAM;AAC1C,QAAI,EAAC,2CAAa,OAAO,QAAO,CAAC;AAC1B,WAAA,YAAY,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC/D,CAAC,2CAAa,KAAK,CAAC;AAEvB,QAAM,eAAe,YAAY;AAC/B,QAAI,CAAC,aAAa;AAChB,cAAQ,IAAI,4BAA4B;AACjC,aAAA;AAAA,IAAA;AAET,YAAQ,IAAI,sBAAsB;AAC5B,UAAA,SAAS,MAAM,cAAc;AAE5B,WAAA;AAAA,EACT;AAIM,QAAA,eAAeA,MAAAA,QAAQ,MAAM;AAC7B,QAAA,CAAC,qBAA6B,QAAA;AAElC,UAAM,mBAAmBE,OAAA;AAAA,MACvB,+DAAuB,QAAQ,CAAC,aAAc,SAAS,WAAW,SAAS,WAAW,CAAG;AAAA,IAC3F;AAEO,WAAA,CAACC,OAAAA,QAAQ,kBAAkB,SAAS;AAAA,EAC1C,GAAA,CAAC,uBAAuB,WAAW,oBAAoB,CAAC;AAE3D,MAAI,MAAM;AACe,2BAAA;AAAA,EAAA;AAGlB,SAAA;AAAA,IACL,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB;AAAA,IACA,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;;"}
+{"version":3,"file":"useGetFeedActivitiesData.cjs.js","sources":["../../../../../../src/containers/Feed/hooks/useGetFeedActivitiesData.ts"],"sourcesContent":["import { GetActivitiesQueryVariables, PageInfo } from '@shared/api'\nimport { useGetActivitiesInfiniteInfiniteQuery } from '@shared/api'\nimport { isEqual, union } from 'lodash'\nimport { useMemo } from 'react'\n\nexport type UseGetActivitiesInfiniteInfiniteQuery = (\n  queryArgs: Omit<GetActivitiesQueryVariables, 'last' | 'first' | 'cursor'> & { filter?: string },\n  options: { skip: boolean },\n) => {\n  data: { pages: { activities: any[] }[] } & { pageInfo: PageInfo }\n  isLoading: boolean\n  isFetchingNextPage: boolean\n  currentData: ({ pages: { activities: any[] }[] } & { pageInfo: PageInfo }) | undefined\n  fetchNextPage: () => Promise<any>\n  hasNextPage: boolean\n}\n\ntype Props = {\n  entities: Array<{ id: string; projectName: string }>\n  filter: string\n  activityTypes?: string[] | null\n  projectName: string\n  entityType: string\n}\n\nconst useGetFeedActivitiesData = ({\n  entities,\n  filter,\n  activityTypes,\n  projectName,\n  entityType,\n}: Props) => {\n  const entitiesToQuery = useMemo(\n    () =>\n      entities.map((entity) => ({ id: entity.id, projectName: entity.projectName, entityType })),\n    [entities],\n  )\n  const entityIds = entitiesToQuery.map((entity) => entity.id)\n\n  const skip = !entities.length || !filter || !activityTypes || !projectName\n  // QUERY MADE TO GET ACTIVITIES\n\n  const queryArgs = {\n    entityIds: entityIds,\n    projectName: projectName,\n    referenceTypes: ['origin', 'mention', 'relation'],\n    activityTypes: activityTypes,\n    filter,\n  }\n\n  let {\n    data: activitiesInfiniteData,\n    isLoading: isFetchingActivities,\n    isFetchingNextPage,\n    currentData,\n    fetchNextPage,\n    hasNextPage,\n  } = useGetActivitiesInfiniteInfiniteQuery(queryArgs, { skip: skip })\n\n  // Extract tasks from infinite query data correctly\n  const activitiesList = useMemo(() => {\n    if (!activitiesInfiniteData?.pages) return []\n    return activitiesInfiniteData.pages.flatMap((page) => page.activities || [])\n  }, [activitiesInfiniteData?.pages])\n\n  const currentActivitiesList = useMemo(() => {\n    if (!currentData?.pages) return []\n    return currentData.pages.flatMap((page) => page.activities || [])\n  }, [currentData?.pages])\n\n  const loadNextPage = async () => {\n    if (!hasNextPage) {\n      console.log('No more activities to load')\n      return undefined\n    }\n    console.log('loading next page...')\n    const result = await fetchNextPage()\n\n    return result\n  }\n\n  // check if currentData matches all the entityIds\n  // if not, this means we are loading new entity\n  const isLoadingNew = useMemo(() => {\n    if (!isFetchingActivities) return false\n\n    const currentEntityIds = union(\n      currentActivitiesList?.flatMap((activity) => (activity.entityId ? activity.entityId : [])),\n    )\n\n    return !isEqual(currentEntityIds, entityIds)\n  }, [currentActivitiesList, entityIds, isFetchingActivities])\n\n  if (skip) {\n    isFetchingActivities = true\n  }\n\n  return {\n    activitiesData: activitiesList,\n    isLoadingActivities: isFetchingActivities,\n    isLoadingNew,\n    isLoadingNextPage: isFetchingNextPage,\n    hasNextPage,\n    loadNextPage,\n  }\n}\n\nexport default useGetFeedActivitiesData\n"],"names":["useMemo","useGetActivitiesInfiniteInfiniteQuery","union","isEqual"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;AACX,QAAM,kBAAkBA,MAAA;AAAA,IACtB,MACE,SAAS,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,aAAa,WAAa,EAAA;AAAA,IAC3F,CAAC,QAAQ;AAAA,EACX;AACA,QAAM,YAAY,gBAAgB,IAAI,CAAC,WAAW,OAAO,EAAE;AAErD,QAAA,OAAO,CAAC,SAAS,UAAU,CAAC,UAAU,CAAC,iBAAiB,CAAC;AAG/D,QAAM,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA,gBAAgB,CAAC,UAAU,WAAW,UAAU;AAAA,IAChD;AAAA,IACA;AAAA,EACF;AAEI,MAAA;AAAA,IACF,MAAM;AAAA,IACN,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACE,IAAAC,oDAAsC,WAAW,EAAE,MAAY;AAG7D,QAAA,iBAAiBD,MAAAA,QAAQ,MAAM;AACnC,QAAI,EAAC,iEAAwB,OAAO,QAAO,CAAC;AACrC,WAAA,uBAAuB,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC1E,CAAC,iEAAwB,KAAK,CAAC;AAE5B,QAAA,wBAAwBA,MAAAA,QAAQ,MAAM;AAC1C,QAAI,EAAC,2CAAa,OAAO,QAAO,CAAC;AAC1B,WAAA,YAAY,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC/D,CAAC,2CAAa,KAAK,CAAC;AAEvB,QAAM,eAAe,YAAY;AAC/B,QAAI,CAAC,aAAa;AAChB,cAAQ,IAAI,4BAA4B;AACjC,aAAA;AAAA,IAAA;AAET,YAAQ,IAAI,sBAAsB;AAC5B,UAAA,SAAS,MAAM,cAAc;AAE5B,WAAA;AAAA,EACT;AAIM,QAAA,eAAeA,MAAAA,QAAQ,MAAM;AAC7B,QAAA,CAAC,qBAA6B,QAAA;AAElC,UAAM,mBAAmBE,OAAA;AAAA,MACvB,+DAAuB,QAAQ,CAAC,aAAc,SAAS,WAAW,SAAS,WAAW,CAAG;AAAA,IAC3F;AAEO,WAAA,CAACC,OAAAA,QAAQ,kBAAkB,SAAS;AAAA,EAC1C,GAAA,CAAC,uBAAuB,WAAW,oBAAoB,CAAC;AAE3D,MAAI,MAAM;AACe,2BAAA;AAAA,EAAA;AAGlB,SAAA;AAAA,IACL,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB;AAAA,IACA,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;;"}

package/dist/shared/src/containers/Feed/hooks/useGetFeedActivitiesData.es.js

@@ -33,6 +33,7 @@ import "../../../api/generated/users.es.js";
 import "../../../api/generated/versions.es.js";
 import "../../../api/generated/workfiles.es.js";
 import "../../../api/generated/ynputCloud.es.js";
+import "../../../api/generated/grouping.es.js";
 import "../../../api/queries/actions/getActions.es.js";
 import { useGetActivitiesInfiniteInfiniteQuery } from "../../../api/queries/activities/getActivities.es.js";
 import "../../../api/queries/activities/updateActivities.es.js";
@@ -63,6 +64,7 @@ import "../../../api/queries/users/getUsers.es.js";
 import "../../../api/queries/users/updateUsers.es.js";
 import "../../../api/queries/watchers/getWatchers.es.js";
 import "../../../api/queries/permissions/getPermissions.es.js";
+import "../../../api/queries/grouping/getGrouping.es.js";
 import { union, isEqual } from "lodash";
 import { useMemo } from "react";
 const useGetFeedActivitiesData = ({

package/dist/shared/src/containers/Feed/hooks/useGetFeedActivitiesData.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGetFeedActivitiesData.es.js","sources":["../../../../../../src/containers/Feed/hooks/useGetFeedActivitiesData.ts"],"sourcesContent":["import { GetActivitiesQueryVariables, PageInfo } from '@shared/api'\nimport { useGetActivitiesInfiniteInfiniteQuery } from '@shared/api'\nimport { isEqual, union } from 'lodash'\nimport { useMemo } from 'react'\n\nexport type UseGetActivitiesInfiniteInfiniteQuery = (\n  queryArgs: Omit<GetActivitiesQueryVariables, 'last' | 'first' | 'cursor'> & { filter?: string },\n  options: { skip: boolean },\n) => {\n  data: { pages: { activities: any[] }[] } & { pageInfo: PageInfo }\n  isLoading: boolean\n  isFetchingNextPage: boolean\n  currentData: ({ pages: { activities: any[] }[] } & { pageInfo: PageInfo }) | undefined\n  fetchNextPage: () => Promise<any>\n  hasNextPage: boolean\n}\n\ntype Props = {\n  entities: Array<{ id: string; projectName: string }>\n  filter: string\n  activityTypes?: string[] | null\n  projectName: string\n  entityType: string\n}\n\nconst useGetFeedActivitiesData = ({\n  entities,\n  filter,\n  activityTypes,\n  projectName,\n  entityType,\n}: Props) => {\n  const entitiesToQuery = useMemo(\n    () =>\n      entities.map((entity) => ({ id: entity.id, projectName: entity.projectName, entityType })),\n    [entities],\n  )\n  const entityIds = entitiesToQuery.map((entity) => entity.id)\n\n  const skip = !entities.length || !filter || !activityTypes || !projectName\n  // QUERY MADE TO GET ACTIVITIES\n\n  const queryArgs = {\n    entityIds: entityIds,\n    projectName: projectName,\n    referenceTypes: ['origin', 'mention', 'relation'],\n    activityTypes: activityTypes,\n    filter,\n  }\n\n  let {\n    data: activitiesInfiniteData,\n    isLoading: isFetchingActivities,\n    isFetchingNextPage,\n    currentData,\n    fetchNextPage,\n    hasNextPage,\n  } = useGetActivitiesInfiniteInfiniteQuery(queryArgs, { skip: skip })\n\n  // Extract tasks from infinite query data correctly\n  const activitiesList = useMemo(() => {\n    if (!activitiesInfiniteData?.pages) return []\n    return activitiesInfiniteData.pages.flatMap((page) => page.activities || [])\n  }, [activitiesInfiniteData?.pages])\n\n  const currentActivitiesList = useMemo(() => {\n    if (!currentData?.pages) return []\n    return currentData.pages.flatMap((page) => page.activities || [])\n  }, [currentData?.pages])\n\n  const loadNextPage = async () => {\n    if (!hasNextPage) {\n      console.log('No more activities to load')\n      return undefined\n    }\n    console.log('loading next page...')\n    const result = await fetchNextPage()\n\n    return result\n  }\n\n  // check if currentData matches all the entityIds\n  // if not, this means we are loading new entity\n  const isLoadingNew = useMemo(() => {\n    if (!isFetchingActivities) return false\n\n    const currentEntityIds = union(\n      currentActivitiesList?.flatMap((activity) => (activity.entityId ? activity.entityId : [])),\n    )\n\n    return !isEqual(currentEntityIds, entityIds)\n  }, [currentActivitiesList, entityIds, isFetchingActivities])\n\n  if (skip) {\n    isFetchingActivities = true\n  }\n\n  return {\n    activitiesData: activitiesList,\n    isLoadingActivities: isFetchingActivities,\n    isLoadingNew,\n    isLoadingNextPage: isFetchingNextPage,\n    hasNextPage,\n    loadNextPage,\n  }\n}\n\nexport default useGetFeedActivitiesData\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;AACX,QAAM,kBAAkB;AAAA,IACtB,MACE,SAAS,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,aAAa,WAAa,EAAA;AAAA,IAC3F,CAAC,QAAQ;AAAA,EACX;AACA,QAAM,YAAY,gBAAgB,IAAI,CAAC,WAAW,OAAO,EAAE;AAErD,QAAA,OAAO,CAAC,SAAS,UAAU,CAAC,UAAU,CAAC,iBAAiB,CAAC;AAG/D,QAAM,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA,gBAAgB,CAAC,UAAU,WAAW,UAAU;AAAA,IAChD;AAAA,IACA;AAAA,EACF;AAEI,MAAA;AAAA,IACF,MAAM;AAAA,IACN,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACE,IAAA,sCAAsC,WAAW,EAAE,MAAY;AAG7D,QAAA,iBAAiB,QAAQ,MAAM;AACnC,QAAI,EAAC,iEAAwB,OAAO,QAAO,CAAC;AACrC,WAAA,uBAAuB,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC1E,CAAC,iEAAwB,KAAK,CAAC;AAE5B,QAAA,wBAAwB,QAAQ,MAAM;AAC1C,QAAI,EAAC,2CAAa,OAAO,QAAO,CAAC;AAC1B,WAAA,YAAY,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC/D,CAAC,2CAAa,KAAK,CAAC;AAEvB,QAAM,eAAe,YAAY;AAC/B,QAAI,CAAC,aAAa;AAChB,cAAQ,IAAI,4BAA4B;AACjC,aAAA;AAAA,IAAA;AAET,YAAQ,IAAI,sBAAsB;AAC5B,UAAA,SAAS,MAAM,cAAc;AAE5B,WAAA;AAAA,EACT;AAIM,QAAA,eAAe,QAAQ,MAAM;AAC7B,QAAA,CAAC,qBAA6B,QAAA;AAElC,UAAM,mBAAmB;AAAA,MACvB,+DAAuB,QAAQ,CAAC,aAAc,SAAS,WAAW,SAAS,WAAW,CAAG;AAAA,IAC3F;AAEO,WAAA,CAAC,QAAQ,kBAAkB,SAAS;AAAA,EAC1C,GAAA,CAAC,uBAAuB,WAAW,oBAAoB,CAAC;AAE3D,MAAI,MAAM;AACe,2BAAA;AAAA,EAAA;AAGlB,SAAA;AAAA,IACL,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB;AAAA,IACA,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;"}
+{"version":3,"file":"useGetFeedActivitiesData.es.js","sources":["../../../../../../src/containers/Feed/hooks/useGetFeedActivitiesData.ts"],"sourcesContent":["import { GetActivitiesQueryVariables, PageInfo } from '@shared/api'\nimport { useGetActivitiesInfiniteInfiniteQuery } from '@shared/api'\nimport { isEqual, union } from 'lodash'\nimport { useMemo } from 'react'\n\nexport type UseGetActivitiesInfiniteInfiniteQuery = (\n  queryArgs: Omit<GetActivitiesQueryVariables, 'last' | 'first' | 'cursor'> & { filter?: string },\n  options: { skip: boolean },\n) => {\n  data: { pages: { activities: any[] }[] } & { pageInfo: PageInfo }\n  isLoading: boolean\n  isFetchingNextPage: boolean\n  currentData: ({ pages: { activities: any[] }[] } & { pageInfo: PageInfo }) | undefined\n  fetchNextPage: () => Promise<any>\n  hasNextPage: boolean\n}\n\ntype Props = {\n  entities: Array<{ id: string; projectName: string }>\n  filter: string\n  activityTypes?: string[] | null\n  projectName: string\n  entityType: string\n}\n\nconst useGetFeedActivitiesData = ({\n  entities,\n  filter,\n  activityTypes,\n  projectName,\n  entityType,\n}: Props) => {\n  const entitiesToQuery = useMemo(\n    () =>\n      entities.map((entity) => ({ id: entity.id, projectName: entity.projectName, entityType })),\n    [entities],\n  )\n  const entityIds = entitiesToQuery.map((entity) => entity.id)\n\n  const skip = !entities.length || !filter || !activityTypes || !projectName\n  // QUERY MADE TO GET ACTIVITIES\n\n  const queryArgs = {\n    entityIds: entityIds,\n    projectName: projectName,\n    referenceTypes: ['origin', 'mention', 'relation'],\n    activityTypes: activityTypes,\n    filter,\n  }\n\n  let {\n    data: activitiesInfiniteData,\n    isLoading: isFetchingActivities,\n    isFetchingNextPage,\n    currentData,\n    fetchNextPage,\n    hasNextPage,\n  } = useGetActivitiesInfiniteInfiniteQuery(queryArgs, { skip: skip })\n\n  // Extract tasks from infinite query data correctly\n  const activitiesList = useMemo(() => {\n    if (!activitiesInfiniteData?.pages) return []\n    return activitiesInfiniteData.pages.flatMap((page) => page.activities || [])\n  }, [activitiesInfiniteData?.pages])\n\n  const currentActivitiesList = useMemo(() => {\n    if (!currentData?.pages) return []\n    return currentData.pages.flatMap((page) => page.activities || [])\n  }, [currentData?.pages])\n\n  const loadNextPage = async () => {\n    if (!hasNextPage) {\n      console.log('No more activities to load')\n      return undefined\n    }\n    console.log('loading next page...')\n    const result = await fetchNextPage()\n\n    return result\n  }\n\n  // check if currentData matches all the entityIds\n  // if not, this means we are loading new entity\n  const isLoadingNew = useMemo(() => {\n    if (!isFetchingActivities) return false\n\n    const currentEntityIds = union(\n      currentActivitiesList?.flatMap((activity) => (activity.entityId ? activity.entityId : [])),\n    )\n\n    return !isEqual(currentEntityIds, entityIds)\n  }, [currentActivitiesList, entityIds, isFetchingActivities])\n\n  if (skip) {\n    isFetchingActivities = true\n  }\n\n  return {\n    activitiesData: activitiesList,\n    isLoadingActivities: isFetchingActivities,\n    isLoadingNew,\n    isLoadingNextPage: isFetchingNextPage,\n    hasNextPage,\n    loadNextPage,\n  }\n}\n\nexport default useGetFeedActivitiesData\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAa;AACX,QAAM,kBAAkB;AAAA,IACtB,MACE,SAAS,IAAI,CAAC,YAAY,EAAE,IAAI,OAAO,IAAI,aAAa,OAAO,aAAa,WAAa,EAAA;AAAA,IAC3F,CAAC,QAAQ;AAAA,EACX;AACA,QAAM,YAAY,gBAAgB,IAAI,CAAC,WAAW,OAAO,EAAE;AAErD,QAAA,OAAO,CAAC,SAAS,UAAU,CAAC,UAAU,CAAC,iBAAiB,CAAC;AAG/D,QAAM,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA,gBAAgB,CAAC,UAAU,WAAW,UAAU;AAAA,IAChD;AAAA,IACA;AAAA,EACF;AAEI,MAAA;AAAA,IACF,MAAM;AAAA,IACN,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACE,IAAA,sCAAsC,WAAW,EAAE,MAAY;AAG7D,QAAA,iBAAiB,QAAQ,MAAM;AACnC,QAAI,EAAC,iEAAwB,OAAO,QAAO,CAAC;AACrC,WAAA,uBAAuB,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC1E,CAAC,iEAAwB,KAAK,CAAC;AAE5B,QAAA,wBAAwB,QAAQ,MAAM;AAC1C,QAAI,EAAC,2CAAa,OAAO,QAAO,CAAC;AAC1B,WAAA,YAAY,MAAM,QAAQ,CAAC,SAAS,KAAK,cAAc,EAAE;AAAA,EAAA,GAC/D,CAAC,2CAAa,KAAK,CAAC;AAEvB,QAAM,eAAe,YAAY;AAC/B,QAAI,CAAC,aAAa;AAChB,cAAQ,IAAI,4BAA4B;AACjC,aAAA;AAAA,IAAA;AAET,YAAQ,IAAI,sBAAsB;AAC5B,UAAA,SAAS,MAAM,cAAc;AAE5B,WAAA;AAAA,EACT;AAIM,QAAA,eAAe,QAAQ,MAAM;AAC7B,QAAA,CAAC,qBAA6B,QAAA;AAElC,UAAM,mBAAmB;AAAA,MACvB,+DAAuB,QAAQ,CAAC,aAAc,SAAS,WAAW,SAAS,WAAW,CAAG;AAAA,IAC3F;AAEO,WAAA,CAAC,QAAQ,kBAAkB,SAAS;AAAA,EAC1C,GAAA,CAAC,uBAAuB,WAAW,oBAAoB,CAAC;AAE3D,MAAI,MAAM;AACe,2BAAA;AAAA,EAAA;AAGlB,SAAA;AAAA,IACL,gBAAgB;AAAA,IAChB,qBAAqB;AAAA,IACrB;AAAA,IACA,mBAAmB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;"}