@ynput/ayon-frontend-shared 0.2.37 → 0.2.39

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

@@ -1 +1 @@
-{"version":3,"file":"ActivityComment.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { useBlendedCategoryColor } from '../CommentInput/hooks/useBlendedCategoryColor'\nimport { CategoryTag } from '../ActivityCategorySelect/CategoryTag'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: (value: any, files: any, refs?: any, data?: any) => Promise<void>\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction, editingId, setEditingId, categories, isGuest } =\n    useFeedContext()\n\n  const categoryData = useMemo(() => {\n    return categories.find((cat) => cat.name === activity.activityData?.category) || null\n  }, [activity?.activityData?.category, categories])\n  // Compute blended background color for category\n  const blendedCategoryColor = useBlendedCategoryColor(categoryData?.color)\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any, data?: any) => {\n    await onUpdate?.(value, files, undefined, data)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', {\n          isOwner,\n          isEditing,\n          isHighlighted,\n          category: !!categoryData && !isGuest,\n        })}\n        id={activityId}\n        $categoryPrimary={categoryData?.color}\n        $categoryTertiary={blendedCategoryColor.primary}\n        $categorySecondary={blendedCategoryColor.secondary}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && isOwner ? (\n            <Styled.Tools className={'tools'}>\n              {onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                  variant=\"text\"\n                />\n              )}\n              {handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} variant=\"text\" />\n              )}\n            </Styled.Tools>\n          ) : (\n            <div className=\"tools\"></div>\n          )}\n\n          {!isEditing && !isGuest && categoryData && (\n            <CategoryTag\n              value={categoryData.name}\n              color={categoryData.color}\n              style={{\n                top: -4,\n                left: -4,\n              }}\n              isCompact\n            />\n          )}\n\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              initCategory={categoryData?.name}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                        categoryPrimary: categoryData?.color,\n                        categorySecondary: blendedCategoryColor.secondary,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                  category={categoryData && !isGuest ? categoryData.name : undefined}\n                  categoryPrimary={categoryData?.color}\n                  categorySecondary={blendedCategoryColor.secondary}\n                  categoryTertiary={blendedCategoryColor.primary}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","statuses","userName","createReaction","deleteReaction","editingId","setEditingId","categories","isGuest","useFeedContext","categoryData","useMemo","cat","_a","blendedCategoryColor","useBlendedCategoryColor","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","data","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CategoryTag","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"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"}
+{"version":3,"file":"ActivityComment.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo, useRef } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport { MenuContainer } from '@shared/components'\nimport { useMenuContext } from '@shared/context'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { useBlendedCategoryColor } from '../CommentInput/hooks/useBlendedCategoryColor'\nimport { CategoryTag } from '../ActivityCategorySelect/CategoryTag'\nimport ActivityCommentMenu from './ActivityCommentMenu'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: (value: any, files: any, refs?: any, data?: any) => Promise<void>\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  isSlideOut?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  isSlideOut,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction, editingId, setEditingId, categories, isGuest } =\n    useFeedContext()\n\n  const moreRef = useRef<HTMLButtonElement>(null)\n  const { toggleMenuOpen, menuOpen } = useMenuContext()\n\n  const categoryData = useMemo(() => {\n    return categories.find((cat) => cat.name === activity.activityData?.category) || null\n  }, [activity?.activityData?.category, categories])\n  // Compute blended background color for category\n  const blendedCategoryColor = useBlendedCategoryColor(categoryData?.color)\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const menuId = `activity-comment-menu-${activityId}-${isSlideOut ? 'slideout' : 'normal'}`\n  const isMenuOpen = menuOpen === menuId\n\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any, data?: any) => {\n    await onUpdate?.(value, files, undefined, data)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', {\n          isOwner,\n          isEditing,\n          isHighlighted,\n          category: !!categoryData && !isGuest,\n          menuOpen: isMenuOpen,\n        })}\n        id={activityId}\n        $categoryPrimary={categoryData?.color}\n        $categoryTertiary={blendedCategoryColor.primary}\n        $categorySecondary={blendedCategoryColor.secondary}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && (\n            <Styled.Tools className={'tools'}>\n              {isOwner && handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} variant=\"text\" />\n              )}\n              <Styled.ToolButton\n                icon=\"more_horiz\"\n                ref={moreRef}\n                onClick={(e) => {\n                  e.stopPropagation()\n                  toggleMenuOpen(menuId)\n                }}\n                className={isMenuOpen ? 'active' : ''}\n              />\n            </Styled.Tools>\n          )}\n\n          {!isEditing && !isGuest && categoryData && (\n            <CategoryTag\n              value={categoryData.name}\n              color={categoryData.color}\n              style={{\n                top: -4,\n                left: -4,\n              }}\n              isCompact\n            />\n          )}\n\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              initCategory={categoryData?.name}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                        categoryPrimary: categoryData?.color,\n                        categorySecondary: blendedCategoryColor.secondary,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                  category={categoryData && !isGuest ? categoryData.name : undefined}\n                  categoryPrimary={categoryData?.color}\n                  categorySecondary={blendedCategoryColor.secondary}\n                  categoryTertiary={blendedCategoryColor.primary}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n\n      <MenuContainer\n        target={moreRef.current}\n        id={menuId}\n        align=\"right\"\n        onClose={(e: any) => {\n          e?.stopPropagation()\n          toggleMenuOpen(false)\n        }}\n      >\n        <ActivityCommentMenu\n          onDelete={isOwner && onDelete ? deleteConfirmation : undefined}\n          onEdit={isOwner && handleEditComment}\n          activityId={activityId}\n          onSelect={() => toggleMenuOpen(false)}\n          projectName={projectName}\n        />\n      </MenuContainer>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","isSlideOut","statuses","userName","createReaction","deleteReaction","editingId","setEditingId","categories","isGuest","useFeedContext","moreRef","useRef","toggleMenuOpen","menuOpen","useMenuContext","categoryData","useMemo","cat","_a","blendedCategoryColor","useBlendedCategoryColor","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","menuId","isMenuOpen","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","data","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsxs","Fragment","Styled.Comment","clsx","jsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CategoryTag","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions","MenuContainer","ActivityCommentMenu"],"mappings":"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"}