@corva/ui 3.73.0-7 → 3.74.0-0

package/components/Annotations/components/AnnotationsList/components/Annotation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/Annotation/index.js"],"sourcesContent":["import { useState } from 'react';\nimport classNames from 'classnames';\nimport { shape, string, arrayOf, func, node, oneOf, number } from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { flowRight } from 'lodash';\nimport withWidth, { isWidthUp } from '@material-ui/core/withWidth';\nimport moment from 'moment';\nimport { Paper, Typography, Divider, MenuItem, IconButton, Menu } from '@material-ui/core';\nimport grey from '@material-ui/core/colors/grey';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\n\nimport AnnotationComments from '../AnnotationComments';\nimport { useAnnotationsDispatch } from '../../../../AnnotationsContext';\nimport { DELETE_ANNOTATION, EDIT_ANNOTATION } from '../../../../constants';\nimport AnnotationInput from '../AnnotationInput';\n\nimport styles from './style.css';\n\nimport Avatar from '~components/Avatar';\nimport UserCardPopover from '~components/UserCardPopover';\nimport ConfirmationDialog from '~components/ConfirmationDialog';\nimport CommentsInfo from '~components/CommentsInfo';\nimport { formatMentionText } from '~components/UserMention/utils';\nimport Attachment from '~components/Attachment';\nimport { isNativeDetected as isNative } from '~/utils/mobileDetect';\nimport { deleteAnnotation, patchAnnotation } from '~/clients/jsonApi';\n\nconst PAGE_NAME = 'AppAnnotationItemPo';\n\nconst CREATED_AT_FORMAT = 'MM/DD/YY H:mm';\n\nconst muiStyles = theme => ({\n  container: { backgroundColor: '#3b3b3be6', marginBottom: 16, marginLeft: 26 },\n  headerDividerRoot: { margin: '10px 0' },\n  createdAt: { color: theme.palette.grey[700], marginLeft: 5 },\n  link: { cursor: 'pointer' },\n  iconButtonRoot: {\n    height: 24,\n    width: 24,\n    padding: 0,\n    margin: '0 -10px 0 5px',\n  },\n});\n\nconst UserAvatar = ({ user, currentUser, classes }) => (\n  <div className={styles.cAnnotationUserAvatar}>\n    {isNative ? (\n      <Avatar\n        // eslint-disable-next-line camelcase\n        displayName={`${user.first_name} ${user.last_name}`}\n        imgSrc={user.profile_photo}\n        size={38}\n        className={classes.avatar}\n      />\n    ) : (\n      <UserCardPopover user={user} currentUser={currentUser}>\n        <Avatar\n          displayName={`${user.first_name} ${user.last_name}`}\n          imgSrc={user.profile_photo}\n          size={38}\n          className={classes.avatar}\n        />\n      </UserCardPopover>\n    )}\n  </div>\n);\n\nconst MenuButton = ({\n  actionsMenuAnchorEl,\n  handleToggleActionsMenu,\n  classes,\n  handleEdit,\n  handleDelete,\n}) => (\n  <>\n    <IconButton\n      data-testid={`${PAGE_NAME}_menuButton`}\n      aria-label=\"Actions\"\n      aria-owns={actionsMenuAnchorEl ? styles.cAnnotationContainerActionsMenu : undefined}\n      aria-haspopup=\"true\"\n      className={classes.iconButtonRoot}\n      onClick={handleToggleActionsMenu}\n    >\n      <MoreVertIcon htmlColor={grey[400]} />\n    </IconButton>\n\n    <Menu\n      id=\"cAnnotationContainerActionsMenu\"\n      anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\n      transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n      anchorEl={actionsMenuAnchorEl}\n      open={!!actionsMenuAnchorEl}\n      onClick={handleToggleActionsMenu}\n    >\n      <MenuItem data-testid={`${PAGE_NAME}_editMenuItem`} onClick={handleEdit}>\n        Edit\n      </MenuItem>\n      <MenuItem data-testid={`${PAGE_NAME}_deleteMenuItem`} onClick={handleDelete}>\n        Delete\n      </MenuItem>\n    </Menu>\n  </>\n);\n\nconst Annotation = ({\n  included,\n  annotation,\n  assetCompanyId,\n  classes,\n  showSuccessNotification,\n  width,\n}) => {\n  const [commentInputIsOpen, setCommentInputIsOpen] = useState(false);\n  const [actionsMenuAnchorEl, setActionsMenuAnchorEl] = useState(null);\n  const [isEdit, setIsEdit] = useState(false);\n  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);\n  const isSmallScreen = !isWidthUp('sm', width);\n\n  const initialCommentsCount = annotation.attributes.comments_count || 0;\n  const [commentsCount, setCommentsCount] = useState(initialCommentsCount);\n\n  const dispatch = useAnnotationsDispatch();\n\n  const activeUsersList = annotation.relationships.comment_users.data.reduce((users, { id }) => {\n    const userData = included.find(user => user.id === id);\n    if (userData) {\n      users.push(userData.attributes);\n    }\n    return users;\n  }, []);\n\n  const userWhoCommented = activeUsersList.map(\n    // eslint-disable-next-line camelcase\n    ({ last_name, first_name }) => `${first_name} ${last_name}`\n  );\n\n  const handleToggleActionsMenu = event => {\n    const currentT = event.currentTarget;\n    setActionsMenuAnchorEl(actionsMenuAnchorEl ? null : currentT);\n  };\n\n  const handleDelete = async () => {\n    try {\n      const response = await deleteAnnotation(annotation.id);\n      if (response) {\n        dispatch({ type: DELETE_ANNOTATION, id: annotation.id });\n        showSuccessNotification('Annotation has been deleted');\n      }\n    } catch (e) {\n      console.error(e);\n    }\n  };\n\n  const handleEdit = async (body, period, attachment) => {\n    try {\n      const changedAnnotation = {\n        body,\n        active_until: period,\n        attachment: {\n          file_name: attachment && attachment.attachmentName,\n          signed_url: attachment && attachment.attachmentUrl,\n        },\n      };\n      const updatedAnnotation = await patchAnnotation(annotation.id, changedAnnotation);\n      dispatch({ type: EDIT_ANNOTATION, annotation: updatedAnnotation, id: annotation.id });\n    } catch (e) {\n      console.error(e);\n      return;\n    }\n\n    showSuccessNotification('Annotation has been changed');\n    setIsEdit(false);\n  };\n\n  const userId = annotation.relationships.user.data.id;\n  const currentUser = included.find(({ type, id }) => type === 'user' && id === userId);\n  const userData = currentUser.attributes;\n  const { attachment } = annotation.attributes;\n\n  return (\n    <Paper className={classes.container} elevation={0}>\n      <div\n        data-testid={`${PAGE_NAME}_annotation_${annotation.attributes.body}`}\n        className={styles.cAnnotationContainer}\n      >\n        <UserAvatar\n          user={userData}\n          classes={classes}\n          isNative={isNative}\n          currentUser={currentUser}\n        />\n\n        <div className={styles.cAnnotationContainerTop}>\n          <div className={styles.cAnnotationContainerTopMainInfo}>\n            <Typography variant=\"body2\" data-testid={`${PAGE_NAME}_userName`}>\n              {`${userData.first_name} ${userData.last_name}`}\n            </Typography>\n            <Typography\n              data-testid={`${PAGE_NAME}_addDate`}\n              variant=\"caption\"\n              className={classes.createdAt}\n            >\n              {moment(annotation.attributes.created_at).format(CREATED_AT_FORMAT)}\n            </Typography>\n          </div>\n          <div\n            className={classNames(styles.cAnnotationContainerTopMenu, {\n              [styles.cAnnotationContainerTopMenuSmall]: isSmallScreen,\n            })}\n          >\n            <MenuButton\n              actionsMenuAnchorEl={actionsMenuAnchorEl}\n              handleToggleActionsMenu={handleToggleActionsMenu}\n              handleEdit={() => setIsEdit(true)}\n              handleDelete={() => setDeleteDialogOpen(true)}\n              classes={classes}\n            />\n          </div>\n        </div>\n\n        <Divider className={classes.headerDividerRoot} />\n\n        <div data-testid={`${PAGE_NAME}_message`} className={styles.cAnnotationContainerContent}>\n          {isEdit ? (\n            <AnnotationInput\n              initialText={annotation.attributes.body}\n              assetCompanyId={assetCompanyId}\n              initialPeriod={annotation.attributes.created_at}\n              initialAttachment={attachment}\n              onSend={handleEdit}\n              onClose={() => setIsEdit(false)}\n              closeOnEsc\n            />\n          ) : (\n            <>\n              {formatMentionText(\n                annotation.attributes.body,\n                annotation.relationships.mentioned_users.data,\n                isNative,\n                null,\n                currentUser\n              )}\n              {attachment && attachment.signed_url && (\n                <Attachment\n                  attachmentUrl={attachment.signed_url}\n                  fileName={attachment.file_name}\n                  size=\"small\"\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      <div\n        data-testid={`${PAGE_NAME}_comments_${annotation.attributes.body}`}\n        className={styles.cAnnotationComments}\n      >\n        <div className={styles.cAnnotationCommentsInfo}>\n          <Typography\n            data-testid={`${PAGE_NAME}_commentButton`}\n            variant=\"caption\"\n            color=\"primary\"\n            className={classes.link}\n            onClick={() => setCommentInputIsOpen(true)}\n          >\n            Comment\n          </Typography>\n          <CommentsInfo\n            commentsCount={commentsCount}\n            usersWhoCommented={userWhoCommented}\n            activeUsersList={activeUsersList}\n            currentUser={currentUser}\n            small\n          />\n        </div>\n        <AnnotationComments\n          annotationId={annotation.id}\n          commentInputIsOpen={commentInputIsOpen}\n          setCommentInputIsOpen={setCommentInputIsOpen}\n          commentsCount={commentsCount}\n          initialCommentsCount={initialCommentsCount}\n          assetCompanyId={assetCompanyId}\n          setCommentsCount={setCommentsCount}\n          currentUser={currentUser}\n        />\n      </div>\n      {deleteDialogOpen && (\n        <ConfirmationDialog\n          open={deleteDialogOpen}\n          text=\"Do you really want to delete annotation?\"\n          handleClose={() => setDeleteDialogOpen(false)}\n          handleOk={handleDelete}\n          okText=\"Delete\"\n        />\n      )}\n    </Paper>\n  );\n};\n\nUserAvatar.propTypes = {\n  user: shape({\n    id: number.isRequired,\n    first_name: string.isRequired,\n    last_name: string.isRequired,\n    profile_photo: string.isRequired,\n  }).isRequired,\n  currentUser: shape({}).isRequired,\n  classes: shape({}).isRequired,\n};\n\nMenuButton.propTypes = {\n  actionsMenuAnchorEl: oneOf([node, null]).isRequired,\n  handleToggleActionsMenu: func.isRequired,\n  classes: shape({}).isRequired,\n  handleDelete: func.isRequired,\n  handleEdit: func.isRequired,\n};\n\nAnnotation.propTypes = {\n  included: arrayOf(shape({})).isRequired,\n  annotation: shape({\n    relationships: shape({\n      user: shape({ data: shape({ id: string.isRequired }).isRequired }).isRequired,\n      mentioned_users: shape({ data: arrayOf(shape({})).isRequired }).isRequired,\n    }).isRequired,\n    attributes: shape({ body: string.isRequired, created_at: string.isRequired }),\n  }).isRequired,\n  classes: shape({}).isRequired,\n  showSuccessNotification: func,\n  width: string.isRequired,\n  assetCompanyId: number.isRequired,\n};\n\nAnnotation.defaultProps = {\n  showSuccessNotification: () => undefined,\n};\n\nexport default flowRight([withStyles(muiStyles), withWidth()])(Annotation);\n"],"names":["PAGE_NAME","UserAvatar","_ref","user","currentUser","classes","_jsx","className","styles","cAnnotationUserAvatar","children","isNative","Avatar","displayName","concat","first_name","last_name","imgSrc","profile_photo","size","avatar","UserCardPopover","MenuButton","_ref2","actionsMenuAnchorEl","handleToggleActionsMenu","handleEdit","handleDelete","_jsxs","_Fragment","IconButton","cAnnotationContainerActionsMenu","undefined","iconButtonRoot","onClick","MoreVertIcon","htmlColor","grey","Menu","id","anchorOrigin","vertical","horizontal","transformOrigin","anchorEl","open","MenuItem","Annotation","_ref3","_ref6","_ref7","included","annotation","assetCompanyId","showSuccessNotification","width","useState","_useState2","_slicedToArray","_useState","commentInputIsOpen","setCommentInputIsOpen","_useState4","_useState3","setActionsMenuAnchorEl","_useState6","_useState5","isEdit","setIsEdit","_useState8","_useState7","deleteDialogOpen","setDeleteDialogOpen","isSmallScreen","isWidthUp","initialCommentsCount","attributes","comments_count","_useState10","_useState9","commentsCount","setCommentsCount","dispatch","useAnnotationsDispatch","activeUsersList","relationships","comment_users","data","reduce","users","_ref4","userData","find","push","userWhoCommented","map","_ref5","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_context","prev","next","deleteAnnotation","sent","type","DELETE_ANNOTATION","t0","console","error","stop","apply","this","arguments","body","period","attachment","changedAnnotation","updatedAnnotation","_context2","active_until","file_name","attachmentName","signed_url","attachmentUrl","patchAnnotation","EDIT_ANNOTATION","abrupt","_callee2","_x","_x2","_x3","userId","_ref8","Paper","container","elevation","cAnnotationContainer","cAnnotationContainerTop","cAnnotationContainerTopMainInfo","Typography","variant","createdAt","moment","created_at","format","classNames","cAnnotationContainerTopMenu","cAnnotationContainerTopMenuSmall","event","currentT","currentTarget","Divider","headerDividerRoot","cAnnotationContainerContent","AnnotationInput","initialText","initialPeriod","initialAttachment","onSend","onClose","closeOnEsc","formatMentionText","mentioned_users","Attachment","fileName","cAnnotationComments","cAnnotationCommentsInfo","color","link","CommentsInfo","usersWhoCommented","small","AnnotationComments","annotationId","ConfirmationDialog","text","handleClose","handleOk","okText","propTypes","shape","number","isRequired","string","oneOf","node","func","arrayOf","defaultProps","Annotation$1","flowRight","withStyles","theme","backgroundColor","marginBottom","marginLeft","margin","palette","cursor","height","padding","withWidth"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/Annotation/index.js"],"sourcesContent":["import { useState } from 'react';\nimport classNames from 'classnames';\nimport { shape, string, arrayOf, func, node, oneOf, number } from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { flowRight } from 'lodash';\nimport withWidth, { isWidthUp } from '@material-ui/core/withWidth';\nimport moment from 'moment';\nimport { Paper, Typography, Divider, MenuItem, IconButton, Menu } from '@material-ui/core';\nimport grey from '@material-ui/core/colors/grey';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\n\nimport AnnotationComments from '../AnnotationComments';\nimport { useAnnotationsDispatch } from '../../../../AnnotationsContext';\nimport { DELETE_ANNOTATION, EDIT_ANNOTATION } from '../../../../constants';\nimport AnnotationInput from '../AnnotationInput';\n\nimport styles from './style.css';\n\nimport Avatar from '~components/Avatar';\nimport UserCardPopover from '~components/UserCardPopover';\nimport ConfirmationDialog from '~components/ConfirmationDialog';\nimport CommentsInfo from '~components/CommentsInfo';\nimport { formatMentionText } from '~components/UserMention/utils';\nimport Attachment from '~components/Attachment';\nimport { isNativeDetected as isNative } from '~/utils/mobileDetect';\nimport { deleteAnnotation, patchAnnotation } from '~/clients/jsonApi';\n\nconst PAGE_NAME = 'AppAnnotationItemPo';\n\nconst CREATED_AT_FORMAT = 'MM/DD/YY H:mm';\n\nconst muiStyles = theme => ({\n  container: { backgroundColor: '#3b3b3be6', marginBottom: 16, marginLeft: 26 },\n  headerDividerRoot: { margin: '10px 0' },\n  createdAt: { color: theme.palette.grey[700], marginLeft: 5 },\n  link: { cursor: 'pointer' },\n  iconButtonRoot: {\n    height: 24,\n    width: 24,\n    padding: 0,\n    margin: '0 -10px 0 5px',\n  },\n});\n\nconst UserAvatar = ({ user, currentUser, classes }) => (\n  <div className={styles.cAnnotationUserAvatar}>\n    {isNative ? (\n      <Avatar\n        // eslint-disable-next-line camelcase\n        displayName={`${user.first_name} ${user.last_name}`}\n        imgSrc={user.profile_photo}\n        size={38}\n        className={classes.avatar}\n      />\n    ) : (\n      <UserCardPopover user={user} currentUser={currentUser}>\n        <Avatar\n          displayName={`${user.first_name} ${user.last_name}`}\n          imgSrc={user.profile_photo}\n          size={38}\n          className={classes.avatar}\n        />\n      </UserCardPopover>\n    )}\n  </div>\n);\n\nconst MenuButton = ({\n  actionsMenuAnchorEl,\n  handleToggleActionsMenu,\n  classes,\n  handleEdit,\n  handleDelete,\n}) => (\n  <>\n    <IconButton\n      data-testid={`${PAGE_NAME}_menuButton`}\n      aria-label=\"Actions\"\n      aria-owns={actionsMenuAnchorEl ? styles.cAnnotationContainerActionsMenu : undefined}\n      aria-haspopup=\"true\"\n      className={classes.iconButtonRoot}\n      onClick={handleToggleActionsMenu}\n    >\n      <MoreVertIcon htmlColor={grey[400]} />\n    </IconButton>\n\n    <Menu\n      id=\"cAnnotationContainerActionsMenu\"\n      anchorOrigin={{ vertical: 'top', horizontal: 'right' }}\n      transformOrigin={{ vertical: 'top', horizontal: 'right' }}\n      anchorEl={actionsMenuAnchorEl}\n      open={!!actionsMenuAnchorEl}\n      onClick={handleToggleActionsMenu}\n    >\n      <MenuItem data-testid={`${PAGE_NAME}_editMenuItem`} onClick={handleEdit}>\n        Edit\n      </MenuItem>\n      <MenuItem data-testid={`${PAGE_NAME}_deleteMenuItem`} onClick={handleDelete}>\n        Delete\n      </MenuItem>\n    </Menu>\n  </>\n);\n\nconst Annotation = ({\n  included,\n  annotation,\n  assetCompanyId,\n  classes,\n  showSuccessNotification = DEFAULT_ANNOTATION_SHOW_SUCCESS_NOTIFICATION,\n  width,\n}) => {\n  const [commentInputIsOpen, setCommentInputIsOpen] = useState(false);\n  const [actionsMenuAnchorEl, setActionsMenuAnchorEl] = useState(null);\n  const [isEdit, setIsEdit] = useState(false);\n  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);\n  const isSmallScreen = !isWidthUp('sm', width);\n\n  const initialCommentsCount = annotation.attributes.comments_count || 0;\n  const [commentsCount, setCommentsCount] = useState(initialCommentsCount);\n\n  const dispatch = useAnnotationsDispatch();\n\n  const activeUsersList = annotation.relationships.comment_users.data.reduce((users, { id }) => {\n    const userData = included.find(user => user.id === id);\n    if (userData) {\n      users.push(userData.attributes);\n    }\n    return users;\n  }, []);\n\n  const userWhoCommented = activeUsersList.map(\n    // eslint-disable-next-line camelcase\n    ({ last_name, first_name }) => `${first_name} ${last_name}`\n  );\n\n  const handleToggleActionsMenu = event => {\n    const currentT = event.currentTarget;\n    setActionsMenuAnchorEl(actionsMenuAnchorEl ? null : currentT);\n  };\n\n  const handleDelete = async () => {\n    try {\n      const response = await deleteAnnotation(annotation.id);\n      if (response) {\n        dispatch({ type: DELETE_ANNOTATION, id: annotation.id });\n        showSuccessNotification('Annotation has been deleted');\n      }\n    } catch (e) {\n      console.error(e);\n    }\n  };\n\n  const handleEdit = async (body, period, attachment) => {\n    try {\n      const changedAnnotation = {\n        body,\n        active_until: period,\n        attachment: {\n          file_name: attachment && attachment.attachmentName,\n          signed_url: attachment && attachment.attachmentUrl,\n        },\n      };\n      const updatedAnnotation = await patchAnnotation(annotation.id, changedAnnotation);\n      dispatch({ type: EDIT_ANNOTATION, annotation: updatedAnnotation, id: annotation.id });\n    } catch (e) {\n      console.error(e);\n      return;\n    }\n\n    showSuccessNotification('Annotation has been changed');\n    setIsEdit(false);\n  };\n\n  const userId = annotation.relationships.user.data.id;\n  const currentUser = included.find(({ type, id }) => type === 'user' && id === userId);\n  const userData = currentUser.attributes;\n  const { attachment } = annotation.attributes;\n\n  return (\n    <Paper className={classes.container} elevation={0}>\n      <div\n        data-testid={`${PAGE_NAME}_annotation_${annotation.attributes.body}`}\n        className={styles.cAnnotationContainer}\n      >\n        <UserAvatar\n          user={userData}\n          classes={classes}\n          isNative={isNative}\n          currentUser={currentUser}\n        />\n\n        <div className={styles.cAnnotationContainerTop}>\n          <div className={styles.cAnnotationContainerTopMainInfo}>\n            <Typography variant=\"body2\" data-testid={`${PAGE_NAME}_userName`}>\n              {`${userData.first_name} ${userData.last_name}`}\n            </Typography>\n            <Typography\n              data-testid={`${PAGE_NAME}_addDate`}\n              variant=\"caption\"\n              className={classes.createdAt}\n            >\n              {moment(annotation.attributes.created_at).format(CREATED_AT_FORMAT)}\n            </Typography>\n          </div>\n          <div\n            className={classNames(styles.cAnnotationContainerTopMenu, {\n              [styles.cAnnotationContainerTopMenuSmall]: isSmallScreen,\n            })}\n          >\n            <MenuButton\n              actionsMenuAnchorEl={actionsMenuAnchorEl}\n              handleToggleActionsMenu={handleToggleActionsMenu}\n              handleEdit={() => setIsEdit(true)}\n              handleDelete={() => setDeleteDialogOpen(true)}\n              classes={classes}\n            />\n          </div>\n        </div>\n\n        <Divider className={classes.headerDividerRoot} />\n\n        <div data-testid={`${PAGE_NAME}_message`} className={styles.cAnnotationContainerContent}>\n          {isEdit ? (\n            <AnnotationInput\n              initialText={annotation.attributes.body}\n              assetCompanyId={assetCompanyId}\n              initialPeriod={annotation.attributes.created_at}\n              initialAttachment={attachment}\n              onSend={handleEdit}\n              onClose={() => setIsEdit(false)}\n              closeOnEsc\n            />\n          ) : (\n            <>\n              {formatMentionText(\n                annotation.attributes.body,\n                annotation.relationships.mentioned_users.data,\n                isNative,\n                null,\n                currentUser\n              )}\n              {attachment && attachment.signed_url && (\n                <Attachment\n                  attachmentUrl={attachment.signed_url}\n                  fileName={attachment.file_name}\n                  size=\"small\"\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      <div\n        data-testid={`${PAGE_NAME}_comments_${annotation.attributes.body}`}\n        className={styles.cAnnotationComments}\n      >\n        <div className={styles.cAnnotationCommentsInfo}>\n          <Typography\n            data-testid={`${PAGE_NAME}_commentButton`}\n            variant=\"caption\"\n            color=\"primary\"\n            className={classes.link}\n            onClick={() => setCommentInputIsOpen(true)}\n          >\n            Comment\n          </Typography>\n          <CommentsInfo\n            commentsCount={commentsCount}\n            usersWhoCommented={userWhoCommented}\n            activeUsersList={activeUsersList}\n            currentUser={currentUser}\n            small\n          />\n        </div>\n        <AnnotationComments\n          annotationId={annotation.id}\n          commentInputIsOpen={commentInputIsOpen}\n          setCommentInputIsOpen={setCommentInputIsOpen}\n          commentsCount={commentsCount}\n          initialCommentsCount={initialCommentsCount}\n          assetCompanyId={assetCompanyId}\n          setCommentsCount={setCommentsCount}\n          currentUser={currentUser}\n        />\n      </div>\n      {deleteDialogOpen && (\n        <ConfirmationDialog\n          open={deleteDialogOpen}\n          text=\"Do you really want to delete annotation?\"\n          handleClose={() => setDeleteDialogOpen(false)}\n          handleOk={handleDelete}\n          okText=\"Delete\"\n        />\n      )}\n    </Paper>\n  );\n};\n\nUserAvatar.propTypes = {\n  user: shape({\n    id: number.isRequired,\n    first_name: string.isRequired,\n    last_name: string.isRequired,\n    profile_photo: string.isRequired,\n  }).isRequired,\n  currentUser: shape({}).isRequired,\n  classes: shape({}).isRequired,\n};\n\nMenuButton.propTypes = {\n  actionsMenuAnchorEl: oneOf([node, null]).isRequired,\n  handleToggleActionsMenu: func.isRequired,\n  classes: shape({}).isRequired,\n  handleDelete: func.isRequired,\n  handleEdit: func.isRequired,\n};\n\nAnnotation.propTypes = {\n  included: arrayOf(shape({})).isRequired,\n  annotation: shape({\n    relationships: shape({\n      user: shape({ data: shape({ id: string.isRequired }).isRequired }).isRequired,\n      mentioned_users: shape({ data: arrayOf(shape({})).isRequired }).isRequired,\n    }).isRequired,\n    attributes: shape({ body: string.isRequired, created_at: string.isRequired }),\n  }).isRequired,\n  classes: shape({}).isRequired,\n  showSuccessNotification: func,\n  width: string.isRequired,\n  assetCompanyId: number.isRequired,\n};\n\nconst DEFAULT_ANNOTATION_SHOW_SUCCESS_NOTIFICATION = () => undefined;\n\nexport default flowRight([withStyles(muiStyles), withWidth()])(Annotation);\n"],"names":["PAGE_NAME","UserAvatar","_ref","user","currentUser","classes","_jsx","className","styles","cAnnotationUserAvatar","children","isNative","Avatar","displayName","concat","first_name","last_name","imgSrc","profile_photo","size","avatar","UserCardPopover","MenuButton","_ref2","actionsMenuAnchorEl","handleToggleActionsMenu","handleEdit","handleDelete","_jsxs","_Fragment","IconButton","cAnnotationContainerActionsMenu","undefined","iconButtonRoot","onClick","MoreVertIcon","htmlColor","grey","Menu","id","anchorOrigin","vertical","horizontal","transformOrigin","anchorEl","open","MenuItem","Annotation","_ref3","_ref6","_ref7","included","annotation","assetCompanyId","_ref3$showSuccessNoti","showSuccessNotification","DEFAULT_ANNOTATION_SHOW_SUCCESS_NOTIFICATION","width","useState","_useState2","_slicedToArray","_useState","commentInputIsOpen","setCommentInputIsOpen","_useState4","_useState3","setActionsMenuAnchorEl","_useState6","_useState5","isEdit","setIsEdit","_useState8","_useState7","deleteDialogOpen","setDeleteDialogOpen","isSmallScreen","isWidthUp","initialCommentsCount","attributes","comments_count","_useState10","_useState9","commentsCount","setCommentsCount","dispatch","useAnnotationsDispatch","activeUsersList","relationships","comment_users","data","reduce","users","_ref4","userData","find","push","userWhoCommented","map","_ref5","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_context","prev","next","deleteAnnotation","sent","type","DELETE_ANNOTATION","t0","console","error","stop","apply","this","arguments","body","period","attachment","changedAnnotation","updatedAnnotation","_context2","active_until","file_name","attachmentName","signed_url","attachmentUrl","patchAnnotation","EDIT_ANNOTATION","abrupt","_callee2","_x","_x2","_x3","userId","_ref8","Paper","container","elevation","cAnnotationContainer","cAnnotationContainerTop","cAnnotationContainerTopMainInfo","Typography","variant","createdAt","moment","created_at","format","classNames","cAnnotationContainerTopMenu","cAnnotationContainerTopMenuSmall","event","currentT","currentTarget","Divider","headerDividerRoot","cAnnotationContainerContent","AnnotationInput","initialText","initialPeriod","initialAttachment","onSend","onClose","closeOnEsc","formatMentionText","mentioned_users","Attachment","fileName","cAnnotationComments","cAnnotationCommentsInfo","color","link","CommentsInfo","usersWhoCommented","small","AnnotationComments","annotationId","ConfirmationDialog","text","handleClose","handleOk","okText","propTypes","shape","number","isRequired","string","oneOf","node","func","arrayOf","Annotation$1","flowRight","withStyles","theme","backgroundColor","marginBottom","marginLeft","margin","palette","cursor","height","padding","withWidth"],"mappings":"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"}

package/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.d.ts

@@ -1,62 +1,17 @@
-declare const _default: import("react").ComponentType<Pick<Pick<Pick<{
+declare const DEFAULT_ANNOTATION_INPUT_ON_SEND: () => undefined;
+declare const DEFAULT_ANNOTATION_INPUT_ON_CLOSE: () => undefined;
+declare const _default: import("react").ComponentType<Pick<import("@material-ui/types").ConsistentWith<{
     assetCompanyId: any;
     classes: any;
-    closeOnEsc: any;
+    closeOnEsc?: boolean | undefined;
     currentUser: any;
-    initialAttachment: any;
+    initialAttachment?: null | undefined;
     initialPeriod: any;
-    initialText: any;
-    onClose: any;
-    onSend: any;
-}, never> & Pick<import("prop-types").InferProps<{
-    initialText: import("prop-types").Requireable<string>;
-    initialPeriod: import("prop-types").Requireable<string>;
-    initialAttachment: import("prop-types").Requireable<import("prop-types").InferProps<{
-        file_name: import("prop-types").Requireable<string>;
-        s3_link: import("prop-types").Requireable<string>;
-    }>>;
-    onSend: import("prop-types").Requireable<(...args: any[]) => any>;
-    onClose: import("prop-types").Requireable<(...args: any[]) => any>;
-    closeOnEsc: import("prop-types").Requireable<boolean>;
-    assetCompanyId: import("prop-types").Validator<number>;
-    currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-    classes: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-}>, "closeOnEsc" | "initialAttachment" | "initialPeriod" | "initialText" | "onClose" | "onSend" | import("prop-types").RequiredKeys<{
-    initialText: import("prop-types").Requireable<string>;
-    initialPeriod: import("prop-types").Requireable<string>;
-    initialAttachment: import("prop-types").Requireable<import("prop-types").InferProps<{
-        file_name: import("prop-types").Requireable<string>;
-        s3_link: import("prop-types").Requireable<string>;
-    }>>;
-    onSend: import("prop-types").Requireable<(...args: any[]) => any>;
-    onClose: import("prop-types").Requireable<(...args: any[]) => any>;
-    closeOnEsc: import("prop-types").Requireable<boolean>;
-    assetCompanyId: import("prop-types").Validator<number>;
-    currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-    classes: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-}>>, import("prop-types").RequiredKeys<{
-    initialText: import("prop-types").Requireable<string>;
-    initialPeriod: import("prop-types").Requireable<string>;
-    initialAttachment: import("prop-types").Requireable<import("prop-types").InferProps<{
-        file_name: import("prop-types").Requireable<string>;
-        s3_link: import("prop-types").Requireable<string>;
-    }>>;
-    onSend: import("prop-types").Requireable<(...args: any[]) => any>;
-    onClose: import("prop-types").Requireable<(...args: any[]) => any>;
-    closeOnEsc: import("prop-types").Requireable<boolean>;
-    assetCompanyId: import("prop-types").Validator<number>;
-    currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-    classes: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-}>> & {
-    initialText?: string | null | undefined;
-    initialPeriod?: string | null | undefined;
-    initialAttachment?: import("prop-types").InferProps<{
-        file_name: import("prop-types").Requireable<string>;
-        s3_link: import("prop-types").Requireable<string>;
-    }> | null | undefined;
-    onSend?: ((...args: any[]) => any) | null | undefined;
-    onClose?: ((...args: any[]) => any) | null | undefined;
-    closeOnEsc?: boolean | null | undefined;
-} & {}, "assetCompanyId" | "closeOnEsc" | "currentUser" | "initialAttachment" | "initialPeriod" | "initialText" | "onClose" | "onSend"> & import("@material-ui/styles").StyledComponentProps<"inputLabel" | "inputRoot" | "labelHighlighter" | "selectLabel" | "sendButton" | "sendLabel" | "uploadingError">>;
+    initialText?: string | undefined;
+    onClose?: typeof DEFAULT_ANNOTATION_INPUT_ON_CLOSE | undefined;
+    onSend?: typeof DEFAULT_ANNOTATION_INPUT_ON_SEND | undefined;
+}, {
+    classes: import("@material-ui/styles").ClassNameMap<"inputLabel" | "inputRoot" | "labelHighlighter" | "selectLabel" | "sendButton" | "sendLabel" | "uploadingError">;
+}>, "assetCompanyId" | "closeOnEsc" | "currentUser" | "initialAttachment" | "initialPeriod" | "initialText" | "onClose" | "onSend"> & import("@material-ui/styles").StyledComponentProps<"inputLabel" | "inputRoot" | "labelHighlighter" | "selectLabel" | "sendButton" | "sendLabel" | "uploadingError">>;
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js"],"names":[],"mappings":""}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js"],"names":[],"mappings":"AAkRA,QAAA,MAAM,gCAAgC,iBAAkB,CAAC;AACzD,QAAA,MAAM,iCAAiC,iBAAkB,CAAC"}

package/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js

@@ -1,2 +1,2 @@
-import t from"@babel/runtime/helpers/slicedToArray";import{useState as e}from"react";import n from"moment";import{string as i,shape as o,func as a,bool as l,number as r}from"prop-types";import{withStyles as c}from"@material-ui/core/styles";import{Paper as s,Input as m,Tooltip as d,FormControl as p,InputLabel as u,MenuItem as f,Typography as h,IconButton as g}from"@material-ui/core";import v from"@material-ui/icons/Send";import b from"@material-ui/core/colors/grey";import{ANNOTATION_ACTIVE_PERIODS as y}from"../../../../constants.js";import A from"./StyledSelect.js";import N from"./style.css.js";import j from"../../../../../UserMention/index.js";import C from"../../../../../EmojiIconButton.js";import I from"../../../../../FileUploadIconButton.js";import U from"../../../../../FailedFileUploading.js";import S from"../../../../../FilePreview/index.js";import{isSuggestionsListOpened as E}from"../../../../../UserMention/utils/index.js";import _ from"../../../../../../effects/useEscPress.js";import{jsxs as x,jsx as P}from"react/jsx-runtime";var k="AppAnnotationsPo",B=Object.keys(y),F=function(i){var o=i.initialText,a=i.initialPeriod,l=i.onSend,r=i.onClose,c=i.closeOnEsc,F=i.classes,T=i.initialAttachment,w=i.assetCompanyId,R=i.currentUser,L=e(o),D=t(L,2),O=D[0],z=D[1],H=e((function(){return T?{attachmentName:T.file_name,attachmentUrl:T.signed_url||T.s3_link}:null})),M=t(H,2),W=M[0],q=M[1],K=e(null),G=t(K,2),J=G[0],Q=G[1],V=e(!1),X=t(V,2),Y=X[0],Z=X[1],$=e(B[0]),tt=t($,2),et=tt[0],nt=tt[1];_((function(){c&&r()}));var it=function(){if(O){var t=function(t,e){if("forever"===t)return null;var i=y[t];return n(e).add(i.time.amount,i.time.key).format()}(et,a);l(O,t,W)}};return x("div",{className:N.cAnnotationInput,children:[x(s,{className:N.cAnnotationInputContent,children:[P(m,{"data-testid":"".concat(k,"_annotationsInput"),inputComponent:j,inputProps:{withLightTheme:!1,onChange:function(t){return z(t)},onKeyDown:function(t){"Shift"===t.key&&Z(!0),"Enter"!==t.key||Y||E()||(t.preventDefault(),it())},onKeyUp:function(t){"Shift"===t.key&&Z(!1)},companyId:w,currentUser:R},placeholder:"Type annotation here",fullWidth:!0,disableUnderline:!0,multiline:!0,rows:"3",className:F.inputRoot,value:O}),x("div",{className:N.cAnnotationInputContentActions,children:[P(d,{title:"Attach File",placement:"bottom",children:P("div",{className:N.cAnnotationInputContentActionsButton,children:P(I,{"data-testid":"".concat(k,"_attachFileButton"),openPreviewDialogOnUpload:!1,disableRipple:!0,onFinish:function(t,e,n){q({attachmentUrl:t,attachmentName:e,attachmentSize:n}),Q(null)},onError:function(t){q(null),Q(t)},htmlColor:"action"})})}),P(d,{title:"Add Emoji",placement:"bottom",children:P("div",{className:N.cAnnotationInputContentActionsButton,children:P(C,{"data-testid":"".concat(k,"_emojiButton"),htmlColor:b[400],handleSelectEmoji:function(t){return z("".concat(O).concat(t.native))}})})})]})]}),J&&P(U,{className:F.uploadingError,errorMessage:J}),W&&W.attachmentUrl&&P(S,{fileName:W.attachmentName,fileUrl:W.attachmentUrl,handleFileDelete:function(){q(null),Q(null)}}),x("div",{className:N.cAnnotationInputActions,children:[x(p,{className:F.formControl,children:[P(u,{shrink:!0,id:"periods-label-label",className:F.selectLabel,children:"Active"}),P(A,{"data-testid":"".concat(k,"_periodDropdown"),labelId:"periods-label-label",id:"periods-label",value:et,disableUnderline:!0,onChange:function(t){return nt(t.target.value)},children:B.map((function(t){return P(f,{"data-testid":"".concat(k,"_period_").concat(y[t].label,"MenuItem"),value:t,children:y[t].label},t)}))})]}),x("div",{className:N.cAnnotationInputActionsSend,children:[x(h,{variant:"caption",className:F.sendLabel,children:["Press ",P(h,{variant:"caption",color:"primary",component:"span",className:F.labelHighlighter,children:"Enter "}),"to send "]}),P(d,{title:"Send",placement:"bottom",children:P("div",{children:P(g,{"data-testid":"".concat(k,"_sendButton"),className:F.sendButton,onClick:it,disabled:!O,children:P(v,{color:"primary"})})})})]})]})]})};F.propTypes={initialText:i,initialPeriod:i,initialAttachment:o({file_name:i,s3_link:i}),onSend:a,onClose:a,closeOnEsc:l,assetCompanyId:r.isRequired,currentUser:o().isRequired,classes:o().isRequired},F.defaultProps={initialText:"",initialPeriod:void 0,initialAttachment:null,onSend:function(){},onClose:function(){},closeOnEsc:!1};var T=c((function(t){return{inputLabel:{color:t.palette.grey[700],fontWeight:200,width:"100%"},inputRoot:{lineHeight:15},sendLabel:{display:"flex",alignItems:"center",fontWeight:200,color:t.palette.grey[700],marginRight:22,fontSize:10},sendButton:{padding:5},labelHighlighter:{fontWeight:200,fontSize:10},selectLabel:{fontSize:10,lineHeight:"14px",color:t.palette.grey[500]},uploadingError:{paddingTop:"10px"}}}))(F);export{T as default};
+import t from"@babel/runtime/helpers/slicedToArray";import{useState as e}from"react";import n from"moment";import{string as i,shape as o,func as a,bool as r,number as l}from"prop-types";import{withStyles as c}from"@material-ui/core/styles";import{Paper as s,Input as m,Tooltip as d,FormControl as p,InputLabel as u,MenuItem as f,Typography as h,IconButton as v}from"@material-ui/core";import g from"@material-ui/icons/Send";import b from"@material-ui/core/colors/grey";import{ANNOTATION_ACTIVE_PERIODS as y}from"../../../../constants.js";import A from"./StyledSelect.js";import N from"./style.css.js";import j from"../../../../../UserMention/index.js";import I from"../../../../../EmojiIconButton.js";import U from"../../../../../FileUploadIconButton.js";import C from"../../../../../FailedFileUploading.js";import S from"../../../../../FilePreview/index.js";import{isSuggestionsListOpened as _}from"../../../../../UserMention/utils/index.js";import E from"../../../../../../effects/useEscPress.js";import{jsxs as x,jsx as k}from"react/jsx-runtime";var B="AppAnnotationsPo",F=Object.keys(y),P=function(i){var o=i.initialText,a=void 0===o?"":o,r=i.initialPeriod,l=i.onSend,c=void 0===l?w:l,P=i.onClose,T=void 0===P?R:P,L=i.closeOnEsc,D=void 0!==L&&L,z=i.classes,H=i.initialAttachment,M=void 0===H?null:H,O=i.assetCompanyId,W=i.currentUser,q=e(a),K=t(q,2),G=K[0],J=K[1],Q=e((function(){return M?{attachmentName:M.file_name,attachmentUrl:M.signed_url||M.s3_link}:null})),V=t(Q,2),X=V[0],Y=V[1],Z=e(null),$=t(Z,2),tt=$[0],et=$[1],nt=e(!1),it=t(nt,2),ot=it[0],at=it[1],rt=e(F[0]),lt=t(rt,2),ct=lt[0],st=lt[1];E((function(){D&&T()}));var mt=function(){if(G){var t=function(t,e){if("forever"===t)return null;var i=y[t];return n(e).add(i.time.amount,i.time.key).format()}(ct,r);c(G,t,X)}};return x("div",{className:N.cAnnotationInput,children:[x(s,{className:N.cAnnotationInputContent,children:[k(m,{"data-testid":"".concat(B,"_annotationsInput"),inputComponent:j,inputProps:{withLightTheme:!1,onChange:function(t){return J(t)},onKeyDown:function(t){"Shift"===t.key&&at(!0),"Enter"!==t.key||ot||_()||(t.preventDefault(),mt())},onKeyUp:function(t){"Shift"===t.key&&at(!1)},companyId:O,currentUser:W},placeholder:"Type annotation here",fullWidth:!0,disableUnderline:!0,multiline:!0,rows:"3",className:z.inputRoot,value:G}),x("div",{className:N.cAnnotationInputContentActions,children:[k(d,{title:"Attach File",placement:"bottom",children:k("div",{className:N.cAnnotationInputContentActionsButton,children:k(U,{"data-testid":"".concat(B,"_attachFileButton"),openPreviewDialogOnUpload:!1,disableRipple:!0,onFinish:function(t,e,n){Y({attachmentUrl:t,attachmentName:e,attachmentSize:n}),et(null)},onError:function(t){Y(null),et(t)},htmlColor:"action"})})}),k(d,{title:"Add Emoji",placement:"bottom",children:k("div",{className:N.cAnnotationInputContentActionsButton,children:k(I,{"data-testid":"".concat(B,"_emojiButton"),htmlColor:b[400],handleSelectEmoji:function(t){return J("".concat(G).concat(t.native))}})})})]})]}),tt&&k(C,{className:z.uploadingError,errorMessage:tt}),X&&X.attachmentUrl&&k(S,{fileName:X.attachmentName,fileUrl:X.attachmentUrl,handleFileDelete:function(){Y(null),et(null)}}),x("div",{className:N.cAnnotationInputActions,children:[x(p,{className:z.formControl,children:[k(u,{shrink:!0,id:"periods-label-label",className:z.selectLabel,children:"Active"}),k(A,{"data-testid":"".concat(B,"_periodDropdown"),labelId:"periods-label-label",id:"periods-label",value:ct,disableUnderline:!0,onChange:function(t){return st(t.target.value)},children:F.map((function(t){return k(f,{"data-testid":"".concat(B,"_period_").concat(y[t].label,"MenuItem"),value:t,children:y[t].label},t)}))})]}),x("div",{className:N.cAnnotationInputActionsSend,children:[x(h,{variant:"caption",className:z.sendLabel,children:["Press ",k(h,{variant:"caption",color:"primary",component:"span",className:z.labelHighlighter,children:"Enter "}),"to send "]}),k(d,{title:"Send",placement:"bottom",children:k("div",{children:k(v,{"data-testid":"".concat(B,"_sendButton"),className:z.sendButton,onClick:mt,disabled:!G,children:k(g,{color:"primary"})})})})]})]})]})};P.propTypes={initialText:i,initialPeriod:i,initialAttachment:o({file_name:i,s3_link:i}),onSend:a,onClose:a,closeOnEsc:r,assetCompanyId:l.isRequired,currentUser:o().isRequired,classes:o().isRequired};var w=function(){},R=function(){},T=c((function(t){return{inputLabel:{color:t.palette.grey[700],fontWeight:200,width:"100%"},inputRoot:{lineHeight:15},sendLabel:{display:"flex",alignItems:"center",fontWeight:200,color:t.palette.grey[700],marginRight:22,fontSize:10},sendButton:{padding:5},labelHighlighter:{fontWeight:200,fontSize:10},selectLabel:{fontSize:10,lineHeight:"14px",color:t.palette.grey[500]},uploadingError:{paddingTop:"10px"}}}))(P);export{T as default};
 //# sourceMappingURL=index.js.map

package/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js"],"sourcesContent":["import { useState } from 'react';\nimport moment from 'moment';\nimport { string, bool, shape, func, number } from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport {\n  Paper,\n  Input,\n  Tooltip,\n  Typography,\n  IconButton,\n  FormControl,\n  InputLabel,\n  MenuItem,\n} from '@material-ui/core';\nimport SendIcon from '@material-ui/icons/Send';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { ANNOTATION_ACTIVE_PERIODS } from '../../../../constants';\n\nimport StyledSelect from './StyledSelect';\n\nimport styles from './style.css';\n\nimport UserMention from '~components/UserMention';\nimport EmojiIconButton from '~components/EmojiIconButton';\nimport FileUploadIconButton from '~components/FileUploadIconButton';\nimport FailedFileUploading from '~components/FailedFileUploading';\nimport FilePreview from '~components/FilePreview';\nimport { isSuggestionsListOpened } from '~components/UserMention/utils';\nimport useEscPress from '~/effects/useEscPress';\n\nconst PAGE_NAME = 'AppAnnotationsPo';\n\nconst ANNOTATION_ACTIVE_PERIODS_KEYS = Object.keys(ANNOTATION_ACTIVE_PERIODS);\nconst ANNOTATION_PLACEHOLDER = 'Type annotation here';\n\nconst muiStyles = theme => ({\n  inputLabel: {\n    color: theme.palette.grey[700],\n    fontWeight: 200,\n    width: '100%',\n  },\n  inputRoot: {\n    lineHeight: 15,\n  },\n  sendLabel: {\n    display: 'flex',\n    alignItems: 'center',\n    fontWeight: 200,\n    color: theme.palette.grey[700],\n    marginRight: 22,\n    fontSize: 10,\n  },\n  sendButton: {\n    padding: 5,\n  },\n  labelHighlighter: {\n    fontWeight: 200,\n    fontSize: 10,\n  },\n  selectLabel: {\n    fontSize: 10,\n    lineHeight: '14px',\n    color: theme.palette.grey[500],\n  },\n  uploadingError: {\n    paddingTop: '10px',\n  },\n});\n\nconst getAnnotationActiveUntil = (value, initialPeriod) => {\n  if (value === 'forever') return null;\n\n  const period = ANNOTATION_ACTIVE_PERIODS[value];\n  return moment(initialPeriod).add(period.time.amount, period.time.key).format();\n};\n\nconst AnnotationInput = ({\n  initialText,\n  initialPeriod,\n  onSend,\n  onClose,\n  closeOnEsc,\n  classes,\n  initialAttachment,\n  assetCompanyId,\n  currentUser,\n}) => {\n  const [annotationText, setAnnotationText] = useState(initialText);\n  const [attachment, setAttachment] = useState(() =>\n    initialAttachment\n      ? {\n          attachmentName: initialAttachment.file_name,\n          attachmentUrl: initialAttachment.signed_url || initialAttachment.s3_link,\n        }\n      : null\n  );\n  const [uploadError, setUploadError] = useState(null);\n  const [isShiftKeyDown, setIsShiftKeyDown] = useState(false);\n  const [period, setPeriod] = useState(ANNOTATION_ACTIVE_PERIODS_KEYS[0]);\n\n  useEscPress(() => {\n    if (closeOnEsc) onClose();\n  });\n\n  const handleSend = () => {\n    if (annotationText) {\n      const formattedPeriod = getAnnotationActiveUntil(period, initialPeriod);\n      onSend(annotationText, formattedPeriod, attachment);\n    }\n  };\n\n  const handlePeriodChange = e => setPeriod(e.target.value);\n\n  const handleKeyDown = e => {\n    if (e.key === 'Shift') setIsShiftKeyDown(true);\n\n    if (e.key === 'Enter' && !isShiftKeyDown && !isSuggestionsListOpened()) {\n      e.preventDefault(); // NOTE: Don't add linebreak to the post\n      handleSend();\n    }\n  };\n\n  const handleKeyUp = e => {\n    if (e.key === 'Shift') setIsShiftKeyDown(false);\n  };\n\n  const handleSelectEmoji = emoji => setAnnotationText(`${annotationText}${emoji.native}`);\n\n  const handleAnnotationTextChange = text => setAnnotationText(text);\n\n  const onFileUploaded = (attachmentUrl, attachmentName, attachmentSize) => {\n    setAttachment({ attachmentUrl, attachmentName, attachmentSize });\n    setUploadError(null);\n  };\n\n  const onUploadingError = error => {\n    setAttachment(null);\n    setUploadError(error);\n  };\n\n  const onAttachmentDelete = () => {\n    setAttachment(null);\n    setUploadError(null);\n  };\n\n  return (\n    <div className={styles.cAnnotationInput}>\n      <Paper className={styles.cAnnotationInputContent}>\n        <Input\n          data-testid={`${PAGE_NAME}_annotationsInput`}\n          inputComponent={UserMention}\n          inputProps={{\n            withLightTheme: false,\n            onChange: handleAnnotationTextChange,\n            onKeyDown: handleKeyDown,\n            onKeyUp: handleKeyUp,\n            companyId: assetCompanyId,\n            currentUser,\n          }}\n          placeholder={ANNOTATION_PLACEHOLDER}\n          fullWidth\n          disableUnderline\n          multiline\n          rows=\"3\"\n          className={classes.inputRoot}\n          value={annotationText}\n        />\n        <div className={styles.cAnnotationInputContentActions}>\n          <Tooltip title=\"Attach File\" placement=\"bottom\">\n            <div className={styles.cAnnotationInputContentActionsButton}>\n              <FileUploadIconButton\n                data-testid={`${PAGE_NAME}_attachFileButton`}\n                openPreviewDialogOnUpload={false}\n                disableRipple\n                onFinish={onFileUploaded}\n                onError={onUploadingError}\n                htmlColor=\"action\"\n              />\n            </div>\n          </Tooltip>\n          <Tooltip title=\"Add Emoji\" placement=\"bottom\">\n            <div className={styles.cAnnotationInputContentActionsButton}>\n              <EmojiIconButton\n                data-testid={`${PAGE_NAME}_emojiButton`}\n                htmlColor={grey[400]}\n                handleSelectEmoji={handleSelectEmoji}\n              />\n            </div>\n          </Tooltip>\n        </div>\n      </Paper>\n      {uploadError && (\n        <FailedFileUploading className={classes.uploadingError} errorMessage={uploadError} />\n      )}\n      {attachment && attachment.attachmentUrl && (\n        <FilePreview\n          fileName={attachment.attachmentName}\n          fileUrl={attachment.attachmentUrl}\n          handleFileDelete={onAttachmentDelete}\n        />\n      )}\n      <div className={styles.cAnnotationInputActions}>\n        <FormControl className={classes.formControl}>\n          <InputLabel shrink id=\"periods-label-label\" className={classes.selectLabel}>\n            Active\n          </InputLabel>\n          <StyledSelect\n            data-testid={`${PAGE_NAME}_periodDropdown`}\n            labelId=\"periods-label-label\"\n            id=\"periods-label\"\n            value={period}\n            disableUnderline\n            onChange={handlePeriodChange}\n          >\n            {ANNOTATION_ACTIVE_PERIODS_KEYS.map(key => (\n              <MenuItem\n                data-testid={`${PAGE_NAME}_period_${ANNOTATION_ACTIVE_PERIODS[key].label}MenuItem`}\n                key={key}\n                value={key}\n              >\n                {ANNOTATION_ACTIVE_PERIODS[key].label}\n              </MenuItem>\n            ))}\n          </StyledSelect>\n        </FormControl>\n        <div className={styles.cAnnotationInputActionsSend}>\n          <Typography variant=\"caption\" className={classes.sendLabel}>\n            Press&nbsp;\n            <Typography\n              variant=\"caption\"\n              color=\"primary\"\n              component=\"span\"\n              className={classes.labelHighlighter}\n            >\n              Enter&nbsp;\n            </Typography>\n            to send&nbsp;\n          </Typography>\n          <Tooltip title=\"Send\" placement=\"bottom\">\n            <div>\n              {/* div to display label since button is disabled */}\n              <IconButton\n                data-testid={`${PAGE_NAME}_sendButton`}\n                className={classes.sendButton}\n                onClick={handleSend}\n                disabled={!annotationText}\n              >\n                <SendIcon color=\"primary\" />\n              </IconButton>\n            </div>\n          </Tooltip>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nAnnotationInput.propTypes = {\n  initialText: string,\n  initialPeriod: string,\n  initialAttachment: shape({\n    file_name: string,\n    s3_link: string,\n  }),\n  onSend: func,\n  onClose: func,\n  closeOnEsc: bool,\n  assetCompanyId: number.isRequired,\n  currentUser: shape().isRequired,\n\n  classes: shape().isRequired,\n};\n\nAnnotationInput.defaultProps = {\n  initialText: '',\n  initialPeriod: undefined,\n  initialAttachment: null,\n  onSend: () => undefined,\n  onClose: () => undefined,\n  closeOnEsc: false,\n};\n\nexport default withStyles(muiStyles)(AnnotationInput);\n"],"names":["PAGE_NAME","ANNOTATION_ACTIVE_PERIODS_KEYS","Object","keys","ANNOTATION_ACTIVE_PERIODS","AnnotationInput","_ref","initialText","initialPeriod","onSend","onClose","closeOnEsc","classes","initialAttachment","assetCompanyId","currentUser","useState","_useState2","_slicedToArray","_useState","annotationText","setAnnotationText","_useState3","attachmentName","file_name","attachmentUrl","signed_url","s3_link","_useState4","attachment","setAttachment","_useState6","_useState5","uploadError","setUploadError","_useState8","_useState7","isShiftKeyDown","setIsShiftKeyDown","_useState9","_useState10","period","setPeriod","useEscPress","handleSend","formattedPeriod","value","moment","add","time","amount","key","format","getAnnotationActiveUntil","_jsxs","className","styles","cAnnotationInput","children","Paper","cAnnotationInputContent","_jsx","Input","concat","inputComponent","UserMention","inputProps","withLightTheme","onChange","text","onKeyDown","e","isSuggestionsListOpened","preventDefault","onKeyUp","companyId","placeholder","fullWidth","disableUnderline","multiline","rows","inputRoot","cAnnotationInputContentActions","Tooltip","title","placement","cAnnotationInputContentActionsButton","FileUploadIconButton","openPreviewDialogOnUpload","disableRipple","onFinish","attachmentSize","onError","error","htmlColor","EmojiIconButton","grey","handleSelectEmoji","emoji","native","FailedFileUploading","uploadingError","errorMessage","FilePreview","fileName","fileUrl","handleFileDelete","cAnnotationInputActions","FormControl","formControl","InputLabel","shrink","id","selectLabel","StyledSelect","labelId","target","map","MenuItem","label","cAnnotationInputActionsSend","Typography","variant","sendLabel","color","component","labelHighlighter","IconButton","sendButton","onClick","disabled","SendIcon","propTypes","string","shape","func","bool","number","isRequired","defaultProps","undefined","AnnotationInput$1","withStyles","theme","inputLabel","palette","fontWeight","width","lineHeight","display","alignItems","marginRight","fontSize","padding","paddingTop"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/Annotations/components/AnnotationsList/components/AnnotationInput/index.js"],"sourcesContent":["import { useState } from 'react';\nimport moment from 'moment';\nimport { string, bool, shape, func, number } from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport {\n  Paper,\n  Input,\n  Tooltip,\n  Typography,\n  IconButton,\n  FormControl,\n  InputLabel,\n  MenuItem,\n} from '@material-ui/core';\nimport SendIcon from '@material-ui/icons/Send';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { ANNOTATION_ACTIVE_PERIODS } from '../../../../constants';\n\nimport StyledSelect from './StyledSelect';\n\nimport styles from './style.css';\n\nimport UserMention from '~components/UserMention';\nimport EmojiIconButton from '~components/EmojiIconButton';\nimport FileUploadIconButton from '~components/FileUploadIconButton';\nimport FailedFileUploading from '~components/FailedFileUploading';\nimport FilePreview from '~components/FilePreview';\nimport { isSuggestionsListOpened } from '~components/UserMention/utils';\nimport useEscPress from '~/effects/useEscPress';\n\nconst PAGE_NAME = 'AppAnnotationsPo';\n\nconst ANNOTATION_ACTIVE_PERIODS_KEYS = Object.keys(ANNOTATION_ACTIVE_PERIODS);\nconst ANNOTATION_PLACEHOLDER = 'Type annotation here';\n\nconst muiStyles = theme => ({\n  inputLabel: {\n    color: theme.palette.grey[700],\n    fontWeight: 200,\n    width: '100%',\n  },\n  inputRoot: {\n    lineHeight: 15,\n  },\n  sendLabel: {\n    display: 'flex',\n    alignItems: 'center',\n    fontWeight: 200,\n    color: theme.palette.grey[700],\n    marginRight: 22,\n    fontSize: 10,\n  },\n  sendButton: {\n    padding: 5,\n  },\n  labelHighlighter: {\n    fontWeight: 200,\n    fontSize: 10,\n  },\n  selectLabel: {\n    fontSize: 10,\n    lineHeight: '14px',\n    color: theme.palette.grey[500],\n  },\n  uploadingError: {\n    paddingTop: '10px',\n  },\n});\n\nconst getAnnotationActiveUntil = (value, initialPeriod) => {\n  if (value === 'forever') return null;\n\n  const period = ANNOTATION_ACTIVE_PERIODS[value];\n  return moment(initialPeriod).add(period.time.amount, period.time.key).format();\n};\n\nconst AnnotationInput = ({\n  initialText = '',\n  initialPeriod,\n  onSend = DEFAULT_ANNOTATION_INPUT_ON_SEND,\n  onClose = DEFAULT_ANNOTATION_INPUT_ON_CLOSE,\n  closeOnEsc = false,\n  classes,\n  initialAttachment = null,\n  assetCompanyId,\n  currentUser,\n}) => {\n  const [annotationText, setAnnotationText] = useState(initialText);\n  const [attachment, setAttachment] = useState(() =>\n    initialAttachment\n      ? {\n          attachmentName: initialAttachment.file_name,\n          attachmentUrl: initialAttachment.signed_url || initialAttachment.s3_link,\n        }\n      : null\n  );\n  const [uploadError, setUploadError] = useState(null);\n  const [isShiftKeyDown, setIsShiftKeyDown] = useState(false);\n  const [period, setPeriod] = useState(ANNOTATION_ACTIVE_PERIODS_KEYS[0]);\n\n  useEscPress(() => {\n    if (closeOnEsc) onClose();\n  });\n\n  const handleSend = () => {\n    if (annotationText) {\n      const formattedPeriod = getAnnotationActiveUntil(period, initialPeriod);\n      onSend(annotationText, formattedPeriod, attachment);\n    }\n  };\n\n  const handlePeriodChange = e => setPeriod(e.target.value);\n\n  const handleKeyDown = e => {\n    if (e.key === 'Shift') setIsShiftKeyDown(true);\n\n    if (e.key === 'Enter' && !isShiftKeyDown && !isSuggestionsListOpened()) {\n      e.preventDefault(); // NOTE: Don't add linebreak to the post\n      handleSend();\n    }\n  };\n\n  const handleKeyUp = e => {\n    if (e.key === 'Shift') setIsShiftKeyDown(false);\n  };\n\n  const handleSelectEmoji = emoji => setAnnotationText(`${annotationText}${emoji.native}`);\n\n  const handleAnnotationTextChange = text => setAnnotationText(text);\n\n  const onFileUploaded = (attachmentUrl, attachmentName, attachmentSize) => {\n    setAttachment({ attachmentUrl, attachmentName, attachmentSize });\n    setUploadError(null);\n  };\n\n  const onUploadingError = error => {\n    setAttachment(null);\n    setUploadError(error);\n  };\n\n  const onAttachmentDelete = () => {\n    setAttachment(null);\n    setUploadError(null);\n  };\n\n  return (\n    <div className={styles.cAnnotationInput}>\n      <Paper className={styles.cAnnotationInputContent}>\n        <Input\n          data-testid={`${PAGE_NAME}_annotationsInput`}\n          inputComponent={UserMention}\n          inputProps={{\n            withLightTheme: false,\n            onChange: handleAnnotationTextChange,\n            onKeyDown: handleKeyDown,\n            onKeyUp: handleKeyUp,\n            companyId: assetCompanyId,\n            currentUser,\n          }}\n          placeholder={ANNOTATION_PLACEHOLDER}\n          fullWidth\n          disableUnderline\n          multiline\n          rows=\"3\"\n          className={classes.inputRoot}\n          value={annotationText}\n        />\n        <div className={styles.cAnnotationInputContentActions}>\n          <Tooltip title=\"Attach File\" placement=\"bottom\">\n            <div className={styles.cAnnotationInputContentActionsButton}>\n              <FileUploadIconButton\n                data-testid={`${PAGE_NAME}_attachFileButton`}\n                openPreviewDialogOnUpload={false}\n                disableRipple\n                onFinish={onFileUploaded}\n                onError={onUploadingError}\n                htmlColor=\"action\"\n              />\n            </div>\n          </Tooltip>\n          <Tooltip title=\"Add Emoji\" placement=\"bottom\">\n            <div className={styles.cAnnotationInputContentActionsButton}>\n              <EmojiIconButton\n                data-testid={`${PAGE_NAME}_emojiButton`}\n                htmlColor={grey[400]}\n                handleSelectEmoji={handleSelectEmoji}\n              />\n            </div>\n          </Tooltip>\n        </div>\n      </Paper>\n      {uploadError && (\n        <FailedFileUploading className={classes.uploadingError} errorMessage={uploadError} />\n      )}\n      {attachment && attachment.attachmentUrl && (\n        <FilePreview\n          fileName={attachment.attachmentName}\n          fileUrl={attachment.attachmentUrl}\n          handleFileDelete={onAttachmentDelete}\n        />\n      )}\n      <div className={styles.cAnnotationInputActions}>\n        <FormControl className={classes.formControl}>\n          <InputLabel shrink id=\"periods-label-label\" className={classes.selectLabel}>\n            Active\n          </InputLabel>\n          <StyledSelect\n            data-testid={`${PAGE_NAME}_periodDropdown`}\n            labelId=\"periods-label-label\"\n            id=\"periods-label\"\n            value={period}\n            disableUnderline\n            onChange={handlePeriodChange}\n          >\n            {ANNOTATION_ACTIVE_PERIODS_KEYS.map(key => (\n              <MenuItem\n                data-testid={`${PAGE_NAME}_period_${ANNOTATION_ACTIVE_PERIODS[key].label}MenuItem`}\n                key={key}\n                value={key}\n              >\n                {ANNOTATION_ACTIVE_PERIODS[key].label}\n              </MenuItem>\n            ))}\n          </StyledSelect>\n        </FormControl>\n        <div className={styles.cAnnotationInputActionsSend}>\n          <Typography variant=\"caption\" className={classes.sendLabel}>\n            Press&nbsp;\n            <Typography\n              variant=\"caption\"\n              color=\"primary\"\n              component=\"span\"\n              className={classes.labelHighlighter}\n            >\n              Enter&nbsp;\n            </Typography>\n            to send&nbsp;\n          </Typography>\n          <Tooltip title=\"Send\" placement=\"bottom\">\n            <div>\n              {/* div to display label since button is disabled */}\n              <IconButton\n                data-testid={`${PAGE_NAME}_sendButton`}\n                className={classes.sendButton}\n                onClick={handleSend}\n                disabled={!annotationText}\n              >\n                <SendIcon color=\"primary\" />\n              </IconButton>\n            </div>\n          </Tooltip>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nAnnotationInput.propTypes = {\n  initialText: string,\n  initialPeriod: string,\n  initialAttachment: shape({\n    file_name: string,\n    s3_link: string,\n  }),\n  onSend: func,\n  onClose: func,\n  closeOnEsc: bool,\n  assetCompanyId: number.isRequired,\n  currentUser: shape().isRequired,\n\n  classes: shape().isRequired,\n};\n\nconst DEFAULT_ANNOTATION_INPUT_ON_SEND = () => undefined;\nconst DEFAULT_ANNOTATION_INPUT_ON_CLOSE = () => undefined;\n\nexport default withStyles(muiStyles)(AnnotationInput);\n"],"names":["PAGE_NAME","ANNOTATION_ACTIVE_PERIODS_KEYS","Object","keys","ANNOTATION_ACTIVE_PERIODS","AnnotationInput","_ref","_ref$initialText","initialText","initialPeriod","_ref$onSend","onSend","DEFAULT_ANNOTATION_INPUT_ON_SEND","_ref$onClose","onClose","DEFAULT_ANNOTATION_INPUT_ON_CLOSE","_ref$closeOnEsc","closeOnEsc","classes","_ref$initialAttachmen","initialAttachment","assetCompanyId","currentUser","useState","_useState2","_slicedToArray","_useState","annotationText","setAnnotationText","_useState3","attachmentName","file_name","attachmentUrl","signed_url","s3_link","_useState4","attachment","setAttachment","_useState6","_useState5","uploadError","setUploadError","_useState8","_useState7","isShiftKeyDown","setIsShiftKeyDown","_useState9","_useState10","period","setPeriod","useEscPress","handleSend","formattedPeriod","value","moment","add","time","amount","key","format","getAnnotationActiveUntil","_jsxs","className","styles","cAnnotationInput","children","Paper","cAnnotationInputContent","_jsx","Input","concat","inputComponent","UserMention","inputProps","withLightTheme","onChange","text","onKeyDown","e","isSuggestionsListOpened","preventDefault","onKeyUp","companyId","placeholder","fullWidth","disableUnderline","multiline","rows","inputRoot","cAnnotationInputContentActions","Tooltip","title","placement","cAnnotationInputContentActionsButton","FileUploadIconButton","openPreviewDialogOnUpload","disableRipple","onFinish","attachmentSize","onError","error","htmlColor","EmojiIconButton","grey","handleSelectEmoji","emoji","native","FailedFileUploading","uploadingError","errorMessage","FilePreview","fileName","fileUrl","handleFileDelete","cAnnotationInputActions","FormControl","formControl","InputLabel","shrink","id","selectLabel","StyledSelect","labelId","target","map","MenuItem","label","cAnnotationInputActionsSend","Typography","variant","sendLabel","color","component","labelHighlighter","IconButton","sendButton","onClick","disabled","SendIcon","propTypes","string","shape","func","bool","number","isRequired","AnnotationInput$1","withStyles","theme","inputLabel","palette","fontWeight","width","lineHeight","display","alignItems","marginRight","fontSize","padding","paddingTop"],"mappings":"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"}

package/components/Annotations/components/AnnotationsList/index.d.ts

@@ -1,15 +1,15 @@
-declare const _default: import("react").ComponentType<Pick<Pick<Pick<{
+declare const _default: import("react").ComponentType<Pick<Pick<{
     appId: any;
-    appSettings: any;
+    appSettings?: {} | undefined;
     appTitle: any;
     assetCompanyId: any;
     assetId: any;
     classes: any;
     currentUser: any;
-    dashboardType: any;
-    isNative: any;
+    dashboardType?: null | undefined;
+    isNative?: boolean | undefined;
     onClose: any;
-}, never> & Pick<import("prop-types").InferProps<{
+}, "appSettings" | "dashboardType" | "isNative"> & Pick<import("prop-types").InferProps<{
     appId: import("prop-types").Validator<number>;
     appTitle: import("prop-types").Validator<string>;
     assetId: import("prop-types").Validator<number>;
@@ -20,7 +20,7 @@ declare const _default: import("react").ComponentType<Pick<Pick<Pick<{
     currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<{}>>>;
     isNative: import("prop-types").Requireable<boolean>;
     dashboardType: import("prop-types").Requireable<string>;
-}>, "appSettings" | "dashboardType" | "isNative" | import("prop-types").RequiredKeys<{
+}>, import("prop-types").RequiredKeys<{
     appId: import("prop-types").Validator<number>;
     appTitle: import("prop-types").Validator<string>;
     assetId: import("prop-types").Validator<number>;
@@ -31,21 +31,17 @@ declare const _default: import("react").ComponentType<Pick<Pick<Pick<{
     currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<{}>>>;
     isNative: import("prop-types").Requireable<boolean>;
     dashboardType: import("prop-types").Requireable<string>;
-}>>, import("prop-types").RequiredKeys<{
-    appId: import("prop-types").Validator<number>;
-    appTitle: import("prop-types").Validator<string>;
-    assetId: import("prop-types").Validator<number>;
-    assetCompanyId: import("prop-types").Validator<number>;
-    appSettings: import("prop-types").Requireable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>;
-    classes: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<import("prop-types").ValidationMap<any>>>>;
-    onClose: import("prop-types").Validator<(...args: any[]) => any>;
-    currentUser: import("prop-types").Validator<NonNullable<import("prop-types").InferProps<{}>>>;
-    isNative: import("prop-types").Requireable<boolean>;
-    dashboardType: import("prop-types").Requireable<string>;
-}>> & {
-    appSettings?: import("prop-types").InferProps<import("prop-types").ValidationMap<any>> | null | undefined;
-    isNative?: boolean | null | undefined;
-    dashboardType?: string | null | undefined;
-} & {}, "appId" | "appSettings" | "appTitle" | "assetCompanyId" | "assetId" | "currentUser" | "dashboardType" | "isNative" | "onClose"> & import("@material-ui/styles").StyledComponentProps<"annotateIcon" | "backIcon" | "noAnnotations" | "secondaryTitle" | "title">>;
+}>> & Pick<{
+    appId: any;
+    appSettings?: {} | undefined;
+    appTitle: any;
+    assetCompanyId: any;
+    assetId: any;
+    classes: any;
+    currentUser: any;
+    dashboardType?: null | undefined;
+    isNative?: boolean | undefined;
+    onClose: any;
+}, never>, "appId" | "appSettings" | "appTitle" | "assetCompanyId" | "assetId" | "currentUser" | "dashboardType" | "isNative" | "onClose"> & import("@material-ui/styles").StyledComponentProps<"annotateIcon" | "backIcon" | "noAnnotations" | "secondaryTitle" | "title">>;
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/components/Annotations/components/AnnotationsList/index.js

@@ -1,2 +1,2 @@
-import t from"@babel/runtime/helpers/defineProperty";import e from"@babel/runtime/helpers/asyncToGenerator";import n from"@babel/runtime/helpers/slicedToArray";import o from"@babel/runtime/regenerator";import{memo as r,useRef as a,useState as i,useEffect as s}from"react";import{number as c,string as p,shape as d,func as m,bool as l}from"prop-types";import u from"classnames";import{withStyles as f}from"@material-ui/core/styles";import{RootRef as h,Paper as y,Typography as b,Tooltip as g,IconButton as A}from"@material-ui/core";import v from"@material-ui/icons/ChevronLeft";import{getAnnotations as I}from"../../../../clients/jsonApi/index.js";import{useAnnotationsState as C,useAnnotationsDispatch as T}from"../../AnnotationsContext.js";import{SET_ANNOTATIONS as N,APPEND_ANNOTATIONS as x}from"../../constants.js";import j from"./components/AddAnnotationForm/index.js";import L from"./components/Annotation/index.js";import k from"./style.css.js";import"../../../../utils/index.js";import{isNativeDetected as R}from"../../../../utils/mobileDetect.js";import _ from"../../../InfiniteList/index.js";import q from"../../../../effects/useOutsideClick.js";import{jsx as w,jsxs as S,Fragment as H}from"react/jsx-runtime";import{showSuccessNotification as U}from"../../../../utils/notificationToasts.js";var F="AppAnnotationsPo",O=function(r){var c,p=r.appId,d=r.appTitle,m=r.assetId,l=r.assetCompanyId,f=r.appSettings,R=r.currentUser,O=r.onClose,P=r.isNative,W=r.classes,B=r.dashboardType,D=C().annotations,E=T(),G=a(),M=a();q(G,O);var z=i(!1),J=n(z,2),K=J[0],Q=J[1],V=i(!0),X=n(V,2),Y=X[0],Z=X[1],$=i(!0),tt=n($,2),et=tt[0],nt=tt[1],ot=i(1),rt=n(ot,2),at=rt[0],it=rt[1];function st(){return(st=e(o.mark((function t(){var e,n,r;return o.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(p&&m){t.next=2;break}return t.abrupt("return");case 2:return Z(!0),t.prev=3,n={page:at,per_page:4,sort:"created_at",order:"desc"},B&&(n.dashboard_type=B),t.next=8,I(p,m,n);case 8:e=t.sent,E({type:1===at?N:x,annotations:e}),t.next=15;break;case 12:t.prev=12,t.t0=t.catch(3),console.error(t.t0);case 15:r=e&&e.data.length<4,it(at+1),nt(!r),Z(!1);case 19:case"end":return t.stop()}}),t,null,[[3,12]])})))).apply(this,arguments)}return s((function(){Q(!0)}),[]),w(h,{rootRef:G,children:S(y,{className:u(k.cAnnotationsList,(c={},t(c,k.cAnnotationsListOpen,K),t(c,k.cAnnotationsListOpenNative,P),c)),children:[w(_,{infiniteClassName:k.cAnnotationsListContentContainer,headerComponent:S(H,{children:[w(b,{"data-testid":"".concat(F,"_appTitle"),variant:"body1",className:W.title,children:d}),w("div",{className:k.cAnnotationsListContentTop,children:S(b,{"data-testid":"".concat(F,"_annotationsTitle"),variant:"caption",className:W.secondaryTitle,children:["Annotations (",D.data?D.data.length:0,")"]})}),w(j,{appId:p,assetId:m,assetCompanyId:l,appSettings:f,currentUser:R,dashboardType:B})]}),useWindow:P,items:D.data||[],showNoItemsFound:!(D.data&&0!==D.data.length||Y),noItemsFoundLabel:w(b,{variant:"body2","data-testid":"".concat(F,"_noAnnotations"),className:W.noAnnotations,children:"No Annotations yet"}),threshold:50,infiniteContainerHeight:G.current&&M.current?G.current.clientHeight-M.current.clientHeight:null,moreItemsMayExist:et,pathToCreatedAt:["attributes","created_at"],renderItem:function(t){return w(L,{isNative:P,annotation:t,assetCompanyId:l,included:D.included,currentUser:R,showSuccessNotification:U},t.id)},loadItems:function(){return st.apply(this,arguments)}}),w("div",{className:k.cAnnotationsListActions,ref:M,children:w(g,{title:"Hide",placement:"bottom",children:w(A,{"data-testid":"".concat(F,"_hideButton"),onClick:O,className:W.backIcon,children:w(v,{})})})})]})})};O.propTypes={appId:c.isRequired,appTitle:p.isRequired,assetId:c.isRequired,assetCompanyId:c.isRequired,appSettings:d(),classes:d().isRequired,onClose:m.isRequired,currentUser:d({}).isRequired,isNative:l,dashboardType:p},O.defaultProps={appSettings:{},isNative:R,dashboardType:null};var P=f((function(t){return{title:{fontWeight:200,marginBottom:20},secondaryTitle:{fontWeight:200,textTransform:"uppercase",color:t.palette.grey[600]},annotateIcon:{padding:0,"&:hover":{backgroundColor:"transparent",boxShadow:"none"}},noAnnotations:{marginTop:16},backIcon:{cursor:"pointer",color:t.palette.grey[600],padding:5}}}))(r(O));export{P as default};
+import t from"@babel/runtime/helpers/defineProperty";import e from"@babel/runtime/helpers/asyncToGenerator";import n from"@babel/runtime/helpers/slicedToArray";import o from"@babel/runtime/regenerator";import{memo as r,useRef as a,useState as i,useEffect as s}from"react";import{number as c,string as d,shape as p,func as m,bool as l}from"prop-types";import u from"classnames";import{withStyles as f}from"@material-ui/core/styles";import{RootRef as h,Paper as y,Typography as b,Tooltip as v,IconButton as g}from"@material-ui/core";import A from"@material-ui/icons/ChevronLeft";import{getAnnotations as I}from"../../../../clients/jsonApi/index.js";import{useAnnotationsState as C,useAnnotationsDispatch as T}from"../../AnnotationsContext.js";import{SET_ANNOTATIONS as x,APPEND_ANNOTATIONS as N}from"../../constants.js";import j from"./components/AddAnnotationForm/index.js";import L from"./components/Annotation/index.js";import k from"./style.css.js";import"../../../../utils/index.js";import{isNativeDetected as R}from"../../../../utils/mobileDetect.js";import _ from"../../../InfiniteList/index.js";import q from"../../../../effects/useOutsideClick.js";import{jsx as w,jsxs as S,Fragment as H}from"react/jsx-runtime";import{showSuccessNotification as U}from"../../../../utils/notificationToasts.js";var F="AppAnnotationsPo",O=function(r){var c,d=r.appId,p=r.appTitle,m=r.assetId,l=r.assetCompanyId,f=r.appSettings,R=void 0===f?W:f,O=r.currentUser,P=r.onClose,D=r.isNative,E=void 0===D?B:D,G=r.classes,M=r.dashboardType,z=void 0===M?null:M,J=C().annotations,K=T(),Q=a(),V=a();q(Q,P);var X=i(!1),Y=n(X,2),Z=Y[0],$=Y[1],tt=i(!0),et=n(tt,2),nt=et[0],ot=et[1],rt=i(!0),at=n(rt,2),it=at[0],st=at[1],ct=i(1),dt=n(ct,2),pt=dt[0],mt=dt[1];function lt(){return(lt=e(o.mark((function t(){var e,n,r;return o.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(d&&m){t.next=2;break}return t.abrupt("return");case 2:return ot(!0),t.prev=3,n={page:pt,per_page:4,sort:"created_at",order:"desc"},z&&(n.dashboard_type=z),t.next=8,I(d,m,n);case 8:e=t.sent,K({type:1===pt?x:N,annotations:e}),t.next=15;break;case 12:t.prev=12,t.t0=t.catch(3),console.error(t.t0);case 15:r=e&&e.data.length<4,mt(pt+1),st(!r),ot(!1);case 19:case"end":return t.stop()}}),t,null,[[3,12]])})))).apply(this,arguments)}return s((function(){$(!0)}),[]),w(h,{rootRef:Q,children:S(y,{className:u(k.cAnnotationsList,(c={},t(c,k.cAnnotationsListOpen,Z),t(c,k.cAnnotationsListOpenNative,E),c)),children:[w(_,{infiniteClassName:k.cAnnotationsListContentContainer,headerComponent:S(H,{children:[w(b,{"data-testid":"".concat(F,"_appTitle"),variant:"body1",className:G.title,children:p}),w("div",{className:k.cAnnotationsListContentTop,children:S(b,{"data-testid":"".concat(F,"_annotationsTitle"),variant:"caption",className:G.secondaryTitle,children:["Annotations (",J.data?J.data.length:0,")"]})}),w(j,{appId:d,assetId:m,assetCompanyId:l,appSettings:R,currentUser:O,dashboardType:z})]}),useWindow:E,items:J.data||[],showNoItemsFound:!(J.data&&0!==J.data.length||nt),noItemsFoundLabel:w(b,{variant:"body2","data-testid":"".concat(F,"_noAnnotations"),className:G.noAnnotations,children:"No Annotations yet"}),threshold:50,infiniteContainerHeight:Q.current&&V.current?Q.current.clientHeight-V.current.clientHeight:null,moreItemsMayExist:it,pathToCreatedAt:["attributes","created_at"],renderItem:function(t){return w(L,{isNative:E,annotation:t,assetCompanyId:l,included:J.included,currentUser:O,showSuccessNotification:U},t.id)},loadItems:function(){return lt.apply(this,arguments)}}),w("div",{className:k.cAnnotationsListActions,ref:V,children:w(v,{title:"Hide",placement:"bottom",children:w(g,{"data-testid":"".concat(F,"_hideButton"),onClick:P,className:G.backIcon,children:w(A,{})})})})]})})};O.propTypes={appId:c.isRequired,appTitle:d.isRequired,assetId:c.isRequired,assetCompanyId:c.isRequired,appSettings:p(),classes:p().isRequired,onClose:m.isRequired,currentUser:p({}).isRequired,isNative:l,dashboardType:d};var W={},B=R,P=f((function(t){return{title:{fontWeight:200,marginBottom:20},secondaryTitle:{fontWeight:200,textTransform:"uppercase",color:t.palette.grey[600]},annotateIcon:{padding:0,"&:hover":{backgroundColor:"transparent",boxShadow:"none"}},noAnnotations:{marginTop:16},backIcon:{cursor:"pointer",color:t.palette.grey[600],padding:5}}}))(r(O));export{P as default};
 //# sourceMappingURL=index.js.map

package/components/Annotations/components/AnnotationsList/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/Annotations/components/AnnotationsList/index.js"],"sourcesContent":["import { memo, useState, useEffect, useRef } from 'react';\nimport { func, bool, shape, number, string } from 'prop-types';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Paper, Typography, IconButton, Tooltip, RootRef } from '@material-ui/core';\nimport BackIcon from '@material-ui/icons/ChevronLeft';\n\nimport { getAnnotations } from '../../../../clients/jsonApi';\nimport { useAnnotationsState, useAnnotationsDispatch } from '../../AnnotationsContext';\nimport { SET_ANNOTATIONS, APPEND_ANNOTATIONS } from '../../constants';\n\nimport AddAnnotationForm from './components/AddAnnotationForm';\nimport Annotation from './components/Annotation';\n\nimport styles from './style.css';\n\nimport { showSuccessNotification } from '~/utils';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport InfiniteList from '~components/InfiniteList';\nimport useOutsideClick from '~effects/useOutsideClick';\n\nconst PAGE_NAME = 'AppAnnotationsPo';\n\nconst muiStyles = theme => ({\n  title: { fontWeight: 200, marginBottom: 20 },\n  secondaryTitle: {\n    fontWeight: 200,\n    textTransform: 'uppercase',\n    color: theme.palette.grey[600],\n  },\n  annotateIcon: {\n    padding: 0,\n    '&:hover': {\n      backgroundColor: 'transparent',\n      boxShadow: 'none',\n    },\n  },\n  noAnnotations: { marginTop: 16 },\n  backIcon: { cursor: 'pointer', color: theme.palette.grey[600], padding: 5 },\n});\n\nconst PER_PAGE = 4;\n\nconst AnnotationsList = ({\n  appId,\n  appTitle,\n  assetId,\n  assetCompanyId,\n  appSettings,\n  currentUser,\n  onClose,\n  isNative,\n  classes,\n  dashboardType,\n}) => {\n  const { annotations } = useAnnotationsState();\n  const dispatch = useAnnotationsDispatch();\n\n  const rootRef = useRef();\n  const footerRef = useRef();\n\n  const infiniteContainerHeight = () => {\n    if (rootRef.current && footerRef.current)\n      return rootRef.current.clientHeight - footerRef.current.clientHeight;\n    return null;\n  };\n\n  useOutsideClick(rootRef, onClose);\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [isInfiniteLoading, setIsInfiniteLoading] = useState(true);\n  const [moreItemsMayExist, setMoreItemsMayExist] = useState(true);\n  const [page, setPage] = useState(1);\n\n  async function handleFetchAnnotations() {\n    if (!(appId && assetId)) return;\n    setIsInfiniteLoading(true);\n\n    let response;\n    try {\n      const options = {\n        page,\n        per_page: PER_PAGE,\n        sort: 'created_at',\n        order: 'desc',\n      };\n      if (dashboardType) options.dashboard_type = dashboardType;\n\n      response = await getAnnotations(appId, assetId, options);\n      dispatch({\n        type: page === 1 ? SET_ANNOTATIONS : APPEND_ANNOTATIONS,\n        annotations: response,\n      });\n    } catch (e) {\n      console.error(e);\n    }\n\n    const lessThanPerPage = response && response.data.length < PER_PAGE;\n\n    setPage(page + 1);\n    setMoreItemsMayExist(!lessThanPerPage);\n    setIsInfiniteLoading(false);\n  }\n\n  useEffect(() => {\n    setIsOpen(true); // NOTE: Opens here because of for the sliding effect on open\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <RootRef rootRef={rootRef}>\n      <Paper\n        className={classNames(styles.cAnnotationsList, {\n          [styles.cAnnotationsListOpen]: isOpen,\n          [styles.cAnnotationsListOpenNative]: isNative,\n        })}\n      >\n        <InfiniteList\n          infiniteClassName={styles.cAnnotationsListContentContainer}\n          headerComponent={\n            <>\n              <Typography\n                data-testid={`${PAGE_NAME}_appTitle`}\n                variant=\"body1\"\n                className={classes.title}\n              >\n                {appTitle}\n              </Typography>\n\n              <div className={styles.cAnnotationsListContentTop}>\n                <Typography\n                  data-testid={`${PAGE_NAME}_annotationsTitle`}\n                  variant=\"caption\"\n                  className={classes.secondaryTitle}\n                >\n                  Annotations ({annotations.data ? annotations.data.length : 0})\n                </Typography>\n              </div>\n\n              <AddAnnotationForm\n                appId={appId}\n                assetId={assetId}\n                assetCompanyId={assetCompanyId}\n                appSettings={appSettings}\n                currentUser={currentUser}\n                dashboardType={dashboardType}\n              />\n            </>\n          }\n          useWindow={isNative}\n          items={annotations.data || []}\n          showNoItemsFound={\n            (!annotations.data || annotations.data.length === 0) && !isInfiniteLoading\n          }\n          noItemsFoundLabel={\n            <Typography\n              variant=\"body2\"\n              data-testid={`${PAGE_NAME}_noAnnotations`}\n              className={classes.noAnnotations}\n            >\n              No Annotations yet\n            </Typography>\n          }\n          threshold={50}\n          infiniteContainerHeight={infiniteContainerHeight()}\n          moreItemsMayExist={moreItemsMayExist}\n          pathToCreatedAt={['attributes', 'created_at']}\n          renderItem={item => (\n            <Annotation\n              key={item.id}\n              isNative={isNative}\n              annotation={item}\n              assetCompanyId={assetCompanyId}\n              included={annotations.included}\n              currentUser={currentUser}\n              showSuccessNotification={showSuccessNotification}\n            />\n          )}\n          loadItems={handleFetchAnnotations}\n        />\n        <div className={styles.cAnnotationsListActions} ref={footerRef}>\n          <Tooltip title=\"Hide\" placement=\"bottom\">\n            <IconButton\n              data-testid={`${PAGE_NAME}_hideButton`}\n              onClick={onClose}\n              className={classes.backIcon}\n            >\n              <BackIcon />\n            </IconButton>\n          </Tooltip>\n        </div>\n      </Paper>\n    </RootRef>\n  );\n};\n\nAnnotationsList.propTypes = {\n  appId: number.isRequired,\n  appTitle: string.isRequired,\n  assetId: number.isRequired,\n  assetCompanyId: number.isRequired,\n  appSettings: shape(),\n  classes: shape().isRequired,\n  onClose: func.isRequired,\n  currentUser: shape({}).isRequired,\n  isNative: bool,\n  dashboardType: string,\n};\n\nAnnotationsList.defaultProps = {\n  appSettings: {},\n  isNative: isNativeDetected,\n  dashboardType: null,\n};\n\nexport default withStyles(muiStyles)(memo(AnnotationsList));\n"],"names":["PAGE_NAME","AnnotationsList","_ref","_classNames","appId","appTitle","assetId","assetCompanyId","appSettings","currentUser","onClose","isNative","classes","dashboardType","annotations","useAnnotationsState","dispatch","useAnnotationsDispatch","rootRef","useRef","footerRef","useOutsideClick","useState","_useState2","_slicedToArray","_useState","isOpen","setIsOpen","_useState4","_useState3","isInfiniteLoading","setIsInfiniteLoading","_useState6","_useState5","moreItemsMayExist","setMoreItemsMayExist","_useState8","_useState7","page","setPage","_handleFetchAnnotations","_asyncToGenerator","_regeneratorRuntime","mark","_callee","response","options","lessThanPerPage","wrap","_context","prev","next","abrupt","per_page","sort","order","dashboard_type","getAnnotations","sent","type","SET_ANNOTATIONS","APPEND_ANNOTATIONS","t0","console","error","data","length","stop","apply","this","arguments","useEffect","_jsx","RootRef","children","_jsxs","Paper","className","classNames","styles","cAnnotationsList","cAnnotationsListOpen","cAnnotationsListOpenNative","InfiniteList","infiniteClassName","cAnnotationsListContentContainer","headerComponent","_Fragment","Typography","concat","variant","title","cAnnotationsListContentTop","secondaryTitle","AddAnnotationForm","useWindow","items","showNoItemsFound","noItemsFoundLabel","noAnnotations","threshold","infiniteContainerHeight","current","clientHeight","pathToCreatedAt","renderItem","item","Annotation","annotation","included","showSuccessNotification","id","loadItems","cAnnotationsListActions","ref","Tooltip","placement","IconButton","onClick","backIcon","BackIcon","propTypes","number","isRequired","string","shape","func","bool","defaultProps","isNativeDetected","withStyles","theme","fontWeight","marginBottom","textTransform","color","palette","grey","annotateIcon","padding","backgroundColor","boxShadow","marginTop","cursor","memo"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/Annotations/components/AnnotationsList/index.js"],"sourcesContent":["import { memo, useState, useEffect, useRef } from 'react';\nimport { func, bool, shape, number, string } from 'prop-types';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Paper, Typography, IconButton, Tooltip, RootRef } from '@material-ui/core';\nimport BackIcon from '@material-ui/icons/ChevronLeft';\n\nimport { getAnnotations } from '../../../../clients/jsonApi';\nimport { useAnnotationsState, useAnnotationsDispatch } from '../../AnnotationsContext';\nimport { SET_ANNOTATIONS, APPEND_ANNOTATIONS } from '../../constants';\n\nimport AddAnnotationForm from './components/AddAnnotationForm';\nimport Annotation from './components/Annotation';\n\nimport styles from './style.css';\n\nimport { showSuccessNotification } from '~/utils';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport InfiniteList from '~components/InfiniteList';\nimport useOutsideClick from '~effects/useOutsideClick';\n\nconst PAGE_NAME = 'AppAnnotationsPo';\n\nconst muiStyles = theme => ({\n  title: { fontWeight: 200, marginBottom: 20 },\n  secondaryTitle: {\n    fontWeight: 200,\n    textTransform: 'uppercase',\n    color: theme.palette.grey[600],\n  },\n  annotateIcon: {\n    padding: 0,\n    '&:hover': {\n      backgroundColor: 'transparent',\n      boxShadow: 'none',\n    },\n  },\n  noAnnotations: { marginTop: 16 },\n  backIcon: { cursor: 'pointer', color: theme.palette.grey[600], padding: 5 },\n});\n\nconst PER_PAGE = 4;\n\nconst AnnotationsList = ({\n  appId,\n  appTitle,\n  assetId,\n  assetCompanyId,\n  appSettings = DEFAULT_ANNOTATIONS_LIST_APP_SETTINGS,\n  currentUser,\n  onClose,\n  isNative = DEFAULT_ANNOTATIONS_LIST_IS_NATIVE,\n  classes,\n  dashboardType = null,\n}) => {\n  const { annotations } = useAnnotationsState();\n  const dispatch = useAnnotationsDispatch();\n\n  const rootRef = useRef();\n  const footerRef = useRef();\n\n  const infiniteContainerHeight = () => {\n    if (rootRef.current && footerRef.current)\n      return rootRef.current.clientHeight - footerRef.current.clientHeight;\n    return null;\n  };\n\n  useOutsideClick(rootRef, onClose);\n\n  const [isOpen, setIsOpen] = useState(false);\n  const [isInfiniteLoading, setIsInfiniteLoading] = useState(true);\n  const [moreItemsMayExist, setMoreItemsMayExist] = useState(true);\n  const [page, setPage] = useState(1);\n\n  async function handleFetchAnnotations() {\n    if (!(appId && assetId)) return;\n    setIsInfiniteLoading(true);\n\n    let response;\n    try {\n      const options = {\n        page,\n        per_page: PER_PAGE,\n        sort: 'created_at',\n        order: 'desc',\n      };\n      if (dashboardType) options.dashboard_type = dashboardType;\n\n      response = await getAnnotations(appId, assetId, options);\n      dispatch({\n        type: page === 1 ? SET_ANNOTATIONS : APPEND_ANNOTATIONS,\n        annotations: response,\n      });\n    } catch (e) {\n      console.error(e);\n    }\n\n    const lessThanPerPage = response && response.data.length < PER_PAGE;\n\n    setPage(page + 1);\n    setMoreItemsMayExist(!lessThanPerPage);\n    setIsInfiniteLoading(false);\n  }\n\n  useEffect(() => {\n    setIsOpen(true); // NOTE: Opens here because of for the sliding effect on open\n  }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n  return (\n    <RootRef rootRef={rootRef}>\n      <Paper\n        className={classNames(styles.cAnnotationsList, {\n          [styles.cAnnotationsListOpen]: isOpen,\n          [styles.cAnnotationsListOpenNative]: isNative,\n        })}\n      >\n        <InfiniteList\n          infiniteClassName={styles.cAnnotationsListContentContainer}\n          headerComponent={\n            <>\n              <Typography\n                data-testid={`${PAGE_NAME}_appTitle`}\n                variant=\"body1\"\n                className={classes.title}\n              >\n                {appTitle}\n              </Typography>\n\n              <div className={styles.cAnnotationsListContentTop}>\n                <Typography\n                  data-testid={`${PAGE_NAME}_annotationsTitle`}\n                  variant=\"caption\"\n                  className={classes.secondaryTitle}\n                >\n                  Annotations ({annotations.data ? annotations.data.length : 0})\n                </Typography>\n              </div>\n\n              <AddAnnotationForm\n                appId={appId}\n                assetId={assetId}\n                assetCompanyId={assetCompanyId}\n                appSettings={appSettings}\n                currentUser={currentUser}\n                dashboardType={dashboardType}\n              />\n            </>\n          }\n          useWindow={isNative}\n          items={annotations.data || []}\n          showNoItemsFound={\n            (!annotations.data || annotations.data.length === 0) && !isInfiniteLoading\n          }\n          noItemsFoundLabel={\n            <Typography\n              variant=\"body2\"\n              data-testid={`${PAGE_NAME}_noAnnotations`}\n              className={classes.noAnnotations}\n            >\n              No Annotations yet\n            </Typography>\n          }\n          threshold={50}\n          infiniteContainerHeight={infiniteContainerHeight()}\n          moreItemsMayExist={moreItemsMayExist}\n          pathToCreatedAt={['attributes', 'created_at']}\n          renderItem={item => (\n            <Annotation\n              key={item.id}\n              isNative={isNative}\n              annotation={item}\n              assetCompanyId={assetCompanyId}\n              included={annotations.included}\n              currentUser={currentUser}\n              showSuccessNotification={showSuccessNotification}\n            />\n          )}\n          loadItems={handleFetchAnnotations}\n        />\n        <div className={styles.cAnnotationsListActions} ref={footerRef}>\n          <Tooltip title=\"Hide\" placement=\"bottom\">\n            <IconButton\n              data-testid={`${PAGE_NAME}_hideButton`}\n              onClick={onClose}\n              className={classes.backIcon}\n            >\n              <BackIcon />\n            </IconButton>\n          </Tooltip>\n        </div>\n      </Paper>\n    </RootRef>\n  );\n};\n\nAnnotationsList.propTypes = {\n  appId: number.isRequired,\n  appTitle: string.isRequired,\n  assetId: number.isRequired,\n  assetCompanyId: number.isRequired,\n  appSettings: shape(),\n  classes: shape().isRequired,\n  onClose: func.isRequired,\n  currentUser: shape({}).isRequired,\n  isNative: bool,\n  dashboardType: string,\n};\n\nconst DEFAULT_ANNOTATIONS_LIST_APP_SETTINGS = {};\nconst DEFAULT_ANNOTATIONS_LIST_IS_NATIVE = isNativeDetected;\n\nexport default withStyles(muiStyles)(memo(AnnotationsList));\n"],"names":["PAGE_NAME","AnnotationsList","_ref","_classNames","appId","appTitle","assetId","assetCompanyId","_ref$appSettings","appSettings","DEFAULT_ANNOTATIONS_LIST_APP_SETTINGS","currentUser","onClose","_ref$isNative","isNative","DEFAULT_ANNOTATIONS_LIST_IS_NATIVE","classes","_ref$dashboardType","dashboardType","annotations","useAnnotationsState","dispatch","useAnnotationsDispatch","rootRef","useRef","footerRef","useOutsideClick","useState","_useState2","_slicedToArray","_useState","isOpen","setIsOpen","_useState4","_useState3","isInfiniteLoading","setIsInfiniteLoading","_useState6","_useState5","moreItemsMayExist","setMoreItemsMayExist","_useState8","_useState7","page","setPage","_handleFetchAnnotations","_asyncToGenerator","_regeneratorRuntime","mark","_callee","response","options","lessThanPerPage","wrap","_context","prev","next","abrupt","per_page","sort","order","dashboard_type","getAnnotations","sent","type","SET_ANNOTATIONS","APPEND_ANNOTATIONS","t0","console","error","data","length","stop","apply","this","arguments","useEffect","_jsx","RootRef","children","_jsxs","Paper","className","classNames","styles","cAnnotationsList","cAnnotationsListOpen","cAnnotationsListOpenNative","InfiniteList","infiniteClassName","cAnnotationsListContentContainer","headerComponent","_Fragment","Typography","concat","variant","title","cAnnotationsListContentTop","secondaryTitle","AddAnnotationForm","useWindow","items","showNoItemsFound","noItemsFoundLabel","noAnnotations","threshold","infiniteContainerHeight","current","clientHeight","pathToCreatedAt","renderItem","item","Annotation","annotation","included","showSuccessNotification","id","loadItems","cAnnotationsListActions","ref","Tooltip","placement","IconButton","onClick","backIcon","BackIcon","propTypes","number","isRequired","string","shape","func","bool","isNativeDetected","withStyles","theme","fontWeight","marginBottom","textTransform","color","palette","grey","annotateIcon","padding","backgroundColor","boxShadow","marginTop","cursor","memo"],"mappings":"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"}

package/components/Annotations/components/LastAnnotation/index.js

@@ -1,2 +1,2 @@
-import e from"@babel/runtime/helpers/asyncToGenerator";import t from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/regenerator";import{memo as i,useMemo as a}from"react";import{number as n,shape as s,arrayOf as o,string as c,bool as m,func as u}from"prop-types";import d from"classnames";import{flowRight as l}from"lodash";import{withStyles as p}from"@material-ui/core/styles";import f,{isWidthUp as h}from"@material-ui/core/withWidth";import v from"@material-ui/core/Paper";import b from"@material-ui/core/Typography";import y from"@material-ui/icons/Comment";import N from"@material-ui/icons/Close";import{closeLastAnnotation as A}from"../../../../clients/jsonApi/index.js";import R from"./style.css.js";import g from"../../../UserCardPopover.js";import{AvatarComponent as x}from"../../../Avatar/index.js";import{formatMentionText as q}from"../../../UserMention/utils/index.js";import{isNativeDetected as _}from"../../../../utils/mobileDetect.js";import{jsxs as U,jsx as C}from"react/jsx-runtime";var j="lastAnnotation",L=function(e){var t=e.user,r=e.currentUser,i=e.isNative,a=e.className,n=e.size,s=C(x,{displayName:"".concat(t.first_name," ").concat(t.last_name),imgSrc:t.profile_photo,size:n,className:a});return i?s:C(g,{user:t,currentUser:r,children:s})},T=function(e){var r=e.commentsCount,i=e.commentUsers,a=e.isSmallScreen,n=e.isNative,s=e.currentUser,o=e.classes;return r?U("div",{className:R.cTopAnnotationAdditionalReactions,children:[C(y,{className:o.commentIcon}),!a&&U(b,{variant:"body2","data-testid":"".concat(j,"_comments"),noWrap:!0,className:o.commentText,component:"div",children:["Comments ",r]}),C("div",{className:R.cTopAnnotationAdditionalReactionsList,children:i.map((function(e,r){var i=e.attributes;return C(L,{user:i,currentUser:s,isNative:n,className:d(o.avatar,t({},o.avatarInList,0!==r)),size:25},i.id)}))})]}):null},w=function(t){var i,n=t.isNative,s=t.appId,o=t.annotation,c=t.openAnnotationsList,m=t.currentUser,u=t.updateCurrentDashboardAppLastAnnotation,d=t.width,l=t.classes,p=o.data,f=o.included,y=f.find((function(e){var t=e.id,r=e.type;return t===p.relationships.user.data.id&&"user"===r})),g=a((function(){return p.relationships.mentioned_users.data.map((function(e){var t=e.id;return f.find((function(e){return e.id===t}))}))}),[p.relationships.mentioned_users.data,f]),x=a((function(){return p.relationships.comment_users.data.map((function(e){var t=e.id;return f.find((function(e){return e.id===t}))}))}),[p.relationships.comment_users.data,f]),_=!h("sm",d),w=(i=e(r.mark((function e(t){var i;return r.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t.stopPropagation(),e.prev=1,e.next=4,A(p.id);case 4:i=e.sent,u(p.id,s,i),e.next=11;break;case 8:e.prev=8,e.t0=e.catch(1),console.error(e.t0);case 11:case"end":return e.stop()}}),e,null,[[1,8]])}))),function(e){return i.apply(this,arguments)});return U(v,{"data-testid":"".concat(j,"_lastAnnotation"),className:l.container,onClick:c,children:[U("div",{className:R.cTopAnnotationMain,children:[C(L,{user:y.attributes,currentUser:m,isNative:n,className:l.avatar,size:38}),C(b,{variant:"body2","data-testid":"".concat(j,"_message"),noWrap:!0,className:l.body,children:q(p.attributes.body,g,n,null,m)})]}),U("div",{className:R.cTopAnnotationAdditional,children:[C(T,{commentsCount:p.attributes.comments_count,commentUsers:x,classes:l,isSmallScreen:_,currentUser:m}),C(N,{"data-testid":"".concat(j,"_closeButton"),fontSize:"small",className:l.closeButton,onClick:w})]})]})};w.propTypes={appId:n.isRequired,annotation:s({included:o(s({})).isRequired,data:s({relationships:s({user:s({data:s({id:c.isRequired}).isRequired}).isRequired,mentioned_users:s({data:o(s()).isRequired}).isRequired}).isRequired,attributes:s({body:c.isRequired,created_at:c.isRequired})}).isRequired}).isRequired,classes:s({}).isRequired,isNative:m,width:c.isRequired,openAnnotationsList:u.isRequired,updateCurrentDashboardAppLastAnnotation:u,currentUser:s({})},w.defaultProps={isNative:_,updateCurrentDashboardAppLastAnnotation:function(){},currentUser:{}};var I=l([p((function(e){return{container:{height:56,margin:"10px 0",padding:"0 20px",display:"flex",alignItems:"center",justifyContent:"space-between",flex:"auto 1",width:"100%",cursor:"pointer"},body:{margin:"0 16px ",minWidth:100},avatar:{border:"1px solid #909090"},commentIcon:{marginRight:16,color:e.palette.grey[500]},commentText:{marginRight:16,color:e.palette.grey[500]},closeButton:{color:e.palette.grey[500]},avatarInList:{marginLeft:-4}}})),f()])(i(w));export{I as default};
+import e from"@babel/runtime/helpers/asyncToGenerator";import t from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/regenerator";import{memo as i,useMemo as n}from"react";import{number as a,shape as o,arrayOf as s,string as c,bool as m,func as d}from"prop-types";import u from"classnames";import{flowRight as l}from"lodash";import{withStyles as p}from"@material-ui/core/styles";import f,{isWidthUp as v}from"@material-ui/core/withWidth";import h from"@material-ui/core/Paper";import b from"@material-ui/core/Typography";import y from"@material-ui/icons/Comment";import N from"@material-ui/icons/Close";import{closeLastAnnotation as R}from"../../../../clients/jsonApi/index.js";import g from"./style.css.js";import A from"../../../UserCardPopover.js";import{AvatarComponent as x}from"../../../Avatar/index.js";import{formatMentionText as q}from"../../../UserMention/utils/index.js";import{isNativeDetected as _}from"../../../../utils/mobileDetect.js";import{jsxs as U,jsx as C}from"react/jsx-runtime";var j="lastAnnotation",T=function(e){var t=e.user,r=e.currentUser,i=e.isNative,n=e.className,a=e.size,o=C(x,{displayName:"".concat(t.first_name," ").concat(t.last_name),imgSrc:t.profile_photo,size:a,className:n});return i?o:C(A,{user:t,currentUser:r,children:o})},L=function(e){var r=e.commentsCount,i=e.commentUsers,n=e.isSmallScreen,a=e.isNative,o=e.currentUser,s=e.classes;return r?U("div",{className:g.cTopAnnotationAdditionalReactions,children:[C(y,{className:s.commentIcon}),!n&&U(b,{variant:"body2","data-testid":"".concat(j,"_comments"),noWrap:!0,className:s.commentText,component:"div",children:["Comments ",r]}),C("div",{className:g.cTopAnnotationAdditionalReactionsList,children:i.map((function(e,r){var i=e.attributes;return C(T,{user:i,currentUser:o,isNative:a,className:u(s.avatar,t({},s.avatarInList,0!==r)),size:25},i.id)}))})]}):null},w=function(t){var i,a=t.isNative,o=void 0===a?I:a,s=t.appId,c=t.annotation,m=t.openAnnotationsList,d=t.currentUser,u=void 0===d?z:d,l=t.updateCurrentDashboardAppLastAnnotation,p=void 0===l?S:l,f=t.width,y=t.classes,A=c.data,x=c.included,_=x.find((function(e){var t=e.id,r=e.type;return t===A.relationships.user.data.id&&"user"===r})),w=n((function(){return A.relationships.mentioned_users.data.map((function(e){var t=e.id;return x.find((function(e){return e.id===t}))}))}),[A.relationships.mentioned_users.data,x]),k=n((function(){return A.relationships.comment_users.data.map((function(e){var t=e.id;return x.find((function(e){return e.id===t}))}))}),[A.relationships.comment_users.data,x]),P=!v("sm",f),W=(i=e(r.mark((function e(t){var i;return r.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t.stopPropagation(),e.prev=1,e.next=4,R(A.id);case 4:i=e.sent,p(A.id,s,i),e.next=11;break;case 8:e.prev=8,e.t0=e.catch(1),console.error(e.t0);case 11:case"end":return e.stop()}}),e,null,[[1,8]])}))),function(e){return i.apply(this,arguments)});return U(h,{"data-testid":"".concat(j,"_lastAnnotation"),className:y.container,onClick:m,children:[U("div",{className:g.cTopAnnotationMain,children:[C(T,{user:_.attributes,currentUser:u,isNative:o,className:y.avatar,size:38}),C(b,{variant:"body2","data-testid":"".concat(j,"_message"),noWrap:!0,className:y.body,children:q(A.attributes.body,w,o,null,u)})]}),U("div",{className:g.cTopAnnotationAdditional,children:[C(L,{commentsCount:A.attributes.comments_count,commentUsers:k,classes:y,isSmallScreen:P,currentUser:u}),C(N,{"data-testid":"".concat(j,"_closeButton"),fontSize:"small",className:y.closeButton,onClick:W})]})]})};w.propTypes={appId:a.isRequired,annotation:o({included:s(o({})).isRequired,data:o({relationships:o({user:o({data:o({id:c.isRequired}).isRequired}).isRequired,mentioned_users:o({data:s(o()).isRequired}).isRequired}).isRequired,attributes:o({body:c.isRequired,created_at:c.isRequired})}).isRequired}).isRequired,classes:o({}).isRequired,isNative:m,width:c.isRequired,openAnnotationsList:d.isRequired,updateCurrentDashboardAppLastAnnotation:d,currentUser:o({})};var I=_,S=function(){},z={},k=l([p((function(e){return{container:{height:56,margin:"10px 0",padding:"0 20px",display:"flex",alignItems:"center",justifyContent:"space-between",flex:"auto 1",width:"100%",cursor:"pointer"},body:{margin:"0 16px ",minWidth:100},avatar:{border:"1px solid #909090"},commentIcon:{marginRight:16,color:e.palette.grey[500]},commentText:{marginRight:16,color:e.palette.grey[500]},closeButton:{color:e.palette.grey[500]},avatarInList:{marginLeft:-4}}})),f()])(i(w));export{k as default};
 //# sourceMappingURL=index.js.map

package/components/Annotations/components/LastAnnotation/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/Annotations/components/LastAnnotation/index.js"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport { shape, string, bool, arrayOf, func, number } from 'prop-types';\nimport classNames from 'classnames';\nimport { flowRight } from 'lodash';\nimport { withStyles } from '@material-ui/core/styles';\nimport withWidth, { isWidthUp } from '@material-ui/core/withWidth';\nimport Paper from '@material-ui/core/Paper';\nimport Typography from '@material-ui/core/Typography';\nimport CommentIcon from '@material-ui/icons/Comment';\nimport CloseButton from '@material-ui/icons/Close';\n\nimport { closeLastAnnotation } from '../../../../clients/jsonApi';\n\nimport styles from './style.css';\n\nimport UserCardPopover from '~/components/UserCardPopover';\nimport Avatar from '~/components/Avatar';\nimport { formatMentionText } from '~/components/UserMention/utils';\nimport { isNativeDetected } from '~/utils/mobileDetect';\n\nconst PAGE_NAME = 'lastAnnotation';\n\nconst muiStyles = theme => ({\n  container: {\n    height: 56,\n    margin: '10px 0',\n    padding: '0 20px',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flex: 'auto 1',\n    width: '100%',\n    cursor: 'pointer',\n  },\n  body: { margin: '0 16px ', minWidth: 100 },\n  avatar: { border: '1px solid #909090' },\n  commentIcon: { marginRight: 16, color: theme.palette.grey[500] },\n  commentText: { marginRight: 16, color: theme.palette.grey[500] },\n  closeButton: { color: theme.palette.grey[500] },\n  avatarInList: { marginLeft: -4 },\n});\n\n/* eslint-disable react/prop-types */\nconst CreatorAvatar = ({ user, currentUser, isNative, className, size }) => {\n  const children = (\n    <Avatar\n      displayName={`${user.first_name} ${user.last_name}`}\n      imgSrc={user.profile_photo}\n      size={size}\n      className={className}\n    />\n  );\n\n  if (isNative) return children;\n  return (\n    <UserCardPopover user={user} currentUser={currentUser}>\n      {children}\n    </UserCardPopover>\n  );\n};\n\nconst Reactions = ({\n  commentsCount,\n  commentUsers,\n  isSmallScreen,\n  isNative,\n  currentUser,\n  classes,\n}) => {\n  if (!commentsCount) return null;\n\n  return (\n    <div className={styles.cTopAnnotationAdditionalReactions}>\n      <CommentIcon className={classes.commentIcon} />\n      {!isSmallScreen && (\n        <Typography\n          variant=\"body2\"\n          data-testid={`${PAGE_NAME}_comments`}\n          noWrap\n          className={classes.commentText}\n          component=\"div\"\n        >\n          Comments {commentsCount}\n        </Typography>\n      )}\n\n      <div className={styles.cTopAnnotationAdditionalReactionsList}>\n        {commentUsers.map(({ attributes }, index) => (\n          <CreatorAvatar\n            key={attributes.id}\n            user={attributes}\n            currentUser={currentUser}\n            isNative={isNative}\n            className={classNames(classes.avatar, { [classes.avatarInList]: index !== 0 })}\n            size={25}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n/* eslint-enable */\n\nconst LastAnnotation = ({\n  isNative,\n  appId,\n  annotation,\n  openAnnotationsList,\n  currentUser,\n  updateCurrentDashboardAppLastAnnotation: updateLastAnnotation,\n  width,\n  classes,\n}) => {\n  const { data, included } = annotation;\n  const creator = included.find(\n    ({ id, type }) => id === data.relationships.user.data.id && type === 'user'\n  );\n\n  const mentionedUsers = useMemo(\n    () =>\n      data.relationships.mentioned_users.data.map(({ id: mentionedUserId }) =>\n        included.find(({ id }) => id === mentionedUserId)\n      ),\n    [data.relationships.mentioned_users.data, included]\n  );\n\n  const commentUsers = useMemo(\n    () =>\n      data.relationships.comment_users.data.map(({ id: commentUserId }) =>\n        included.find(({ id }) => id === commentUserId)\n      ),\n    [data.relationships.comment_users.data, included]\n  );\n\n  const isSmallScreen = !isWidthUp('sm', width);\n\n  const handleCloseClick = async e => {\n    e.stopPropagation();\n\n    try {\n      const response = await closeLastAnnotation(data.id);\n      updateLastAnnotation(data.id, appId, response);\n    } catch (error) {\n      console.error(error);\n    }\n  };\n\n  return (\n    <Paper\n      data-testid={`${PAGE_NAME}_lastAnnotation`}\n      className={classes.container}\n      onClick={openAnnotationsList}\n    >\n      <div className={styles.cTopAnnotationMain}>\n        <CreatorAvatar\n          user={creator.attributes}\n          currentUser={currentUser}\n          isNative={isNative}\n          className={classes.avatar}\n          size={38}\n        />\n        <Typography\n          variant=\"body2\"\n          data-testid={`${PAGE_NAME}_message`}\n          noWrap\n          className={classes.body}\n        >\n          {formatMentionText(data.attributes.body, mentionedUsers, isNative, null, currentUser)}\n        </Typography>\n      </div>\n      <div className={styles.cTopAnnotationAdditional}>\n        <Reactions\n          commentsCount={data.attributes.comments_count}\n          commentUsers={commentUsers}\n          classes={classes}\n          isSmallScreen={isSmallScreen}\n          currentUser={currentUser}\n        />\n        <CloseButton\n          data-testid={`${PAGE_NAME}_closeButton`}\n          fontSize=\"small\"\n          className={classes.closeButton}\n          onClick={handleCloseClick}\n        />\n      </div>\n    </Paper>\n  );\n};\n\nLastAnnotation.propTypes = {\n  appId: number.isRequired,\n  annotation: shape({\n    included: arrayOf(shape({})).isRequired,\n    data: shape({\n      relationships: shape({\n        user: shape({ data: shape({ id: string.isRequired }).isRequired }).isRequired,\n        mentioned_users: shape({ data: arrayOf(shape()).isRequired }).isRequired,\n      }).isRequired,\n      attributes: shape({ body: string.isRequired, created_at: string.isRequired }),\n    }).isRequired,\n  }).isRequired,\n  classes: shape({}).isRequired,\n  isNative: bool,\n  width: string.isRequired,\n  openAnnotationsList: func.isRequired,\n  updateCurrentDashboardAppLastAnnotation: func,\n  currentUser: shape({}),\n};\n\nLastAnnotation.defaultProps = {\n  isNative: isNativeDetected,\n  updateCurrentDashboardAppLastAnnotation: () => undefined,\n  currentUser: {},\n};\n\nexport default flowRight([withStyles(muiStyles), withWidth()])(memo(LastAnnotation));\n"],"names":["PAGE_NAME","CreatorAvatar","_ref","user","currentUser","isNative","className","size","children","_jsx","Avatar","displayName","concat","first_name","last_name","imgSrc","profile_photo","UserCardPopover","Reactions","_ref2","commentsCount","commentUsers","isSmallScreen","classes","_jsxs","styles","cTopAnnotationAdditionalReactions","CommentIcon","commentIcon","Typography","variant","noWrap","commentText","component","cTopAnnotationAdditionalReactionsList","map","index","attributes","classNames","avatar","_defineProperty","avatarInList","id","LastAnnotation","_ref4","_ref10","appId","annotation","openAnnotationsList","updateLastAnnotation","updateCurrentDashboardAppLastAnnotation","width","data","included","creator","find","_ref5","type","relationships","mentionedUsers","useMemo","mentioned_users","_ref6","mentionedUserId","_ref7","comment_users","_ref8","commentUserId","_ref9","isWidthUp","handleCloseClick","_asyncToGenerator","_regeneratorRuntime","mark","e","response","wrap","_context","prev","next","stopPropagation","closeLastAnnotation","sent","t0","console","error","stop","_callee","_x","apply","this","arguments","Paper","container","onClick","cTopAnnotationMain","body","formatMentionText","cTopAnnotationAdditional","comments_count","CloseButton","fontSize","closeButton","propTypes","number","isRequired","shape","arrayOf","string","created_at","bool","func","defaultProps","isNativeDetected","LastAnnotation$1","flowRight","withStyles","theme","height","margin","padding","display","alignItems","justifyContent","flex","cursor","minWidth","border","marginRight","color","palette","grey","marginLeft","withWidth","memo"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/Annotations/components/LastAnnotation/index.js"],"sourcesContent":["import { memo, useMemo } from 'react';\nimport { shape, string, bool, arrayOf, func, number } from 'prop-types';\nimport classNames from 'classnames';\nimport { flowRight } from 'lodash';\nimport { withStyles } from '@material-ui/core/styles';\nimport withWidth, { isWidthUp } from '@material-ui/core/withWidth';\nimport Paper from '@material-ui/core/Paper';\nimport Typography from '@material-ui/core/Typography';\nimport CommentIcon from '@material-ui/icons/Comment';\nimport CloseButton from '@material-ui/icons/Close';\n\nimport { closeLastAnnotation } from '../../../../clients/jsonApi';\n\nimport styles from './style.css';\n\nimport UserCardPopover from '~/components/UserCardPopover';\nimport Avatar from '~/components/Avatar';\nimport { formatMentionText } from '~/components/UserMention/utils';\nimport { isNativeDetected } from '~/utils/mobileDetect';\n\nconst PAGE_NAME = 'lastAnnotation';\n\nconst muiStyles = theme => ({\n  container: {\n    height: 56,\n    margin: '10px 0',\n    padding: '0 20px',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    flex: 'auto 1',\n    width: '100%',\n    cursor: 'pointer',\n  },\n  body: { margin: '0 16px ', minWidth: 100 },\n  avatar: { border: '1px solid #909090' },\n  commentIcon: { marginRight: 16, color: theme.palette.grey[500] },\n  commentText: { marginRight: 16, color: theme.palette.grey[500] },\n  closeButton: { color: theme.palette.grey[500] },\n  avatarInList: { marginLeft: -4 },\n});\n\n/* eslint-disable react/prop-types */\nconst CreatorAvatar = ({ user, currentUser, isNative, className, size }) => {\n  const children = (\n    <Avatar\n      displayName={`${user.first_name} ${user.last_name}`}\n      imgSrc={user.profile_photo}\n      size={size}\n      className={className}\n    />\n  );\n\n  if (isNative) return children;\n  return (\n    <UserCardPopover user={user} currentUser={currentUser}>\n      {children}\n    </UserCardPopover>\n  );\n};\n\nconst Reactions = ({\n  commentsCount,\n  commentUsers,\n  isSmallScreen,\n  isNative,\n  currentUser,\n  classes,\n}) => {\n  if (!commentsCount) return null;\n\n  return (\n    <div className={styles.cTopAnnotationAdditionalReactions}>\n      <CommentIcon className={classes.commentIcon} />\n      {!isSmallScreen && (\n        <Typography\n          variant=\"body2\"\n          data-testid={`${PAGE_NAME}_comments`}\n          noWrap\n          className={classes.commentText}\n          component=\"div\"\n        >\n          Comments {commentsCount}\n        </Typography>\n      )}\n\n      <div className={styles.cTopAnnotationAdditionalReactionsList}>\n        {commentUsers.map(({ attributes }, index) => (\n          <CreatorAvatar\n            key={attributes.id}\n            user={attributes}\n            currentUser={currentUser}\n            isNative={isNative}\n            className={classNames(classes.avatar, { [classes.avatarInList]: index !== 0 })}\n            size={25}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n/* eslint-enable */\n\nconst LastAnnotation = ({\n  isNative = DEFAULT_LAST_ANNOTATION_IS_NATIVE,\n  appId,\n  annotation,\n  openAnnotationsList,\n  currentUser = DEFAULT_LAST_ANNOTATION_CURRENT_USER,\n  updateCurrentDashboardAppLastAnnotation:\n    updateLastAnnotation = DEFAULT_LAST_ANNOTATION_UPDATE_CURRENT_DASHBOARD_APP_LAST_ANNOTATION,\n  width,\n  classes,\n}) => {\n  const { data, included } = annotation;\n  const creator = included.find(\n    ({ id, type }) => id === data.relationships.user.data.id && type === 'user'\n  );\n\n  const mentionedUsers = useMemo(\n    () =>\n      data.relationships.mentioned_users.data.map(({ id: mentionedUserId }) =>\n        included.find(({ id }) => id === mentionedUserId)\n      ),\n    [data.relationships.mentioned_users.data, included]\n  );\n\n  const commentUsers = useMemo(\n    () =>\n      data.relationships.comment_users.data.map(({ id: commentUserId }) =>\n        included.find(({ id }) => id === commentUserId)\n      ),\n    [data.relationships.comment_users.data, included]\n  );\n\n  const isSmallScreen = !isWidthUp('sm', width);\n\n  const handleCloseClick = async e => {\n    e.stopPropagation();\n\n    try {\n      const response = await closeLastAnnotation(data.id);\n      updateLastAnnotation(data.id, appId, response);\n    } catch (error) {\n      console.error(error);\n    }\n  };\n\n  return (\n    <Paper\n      data-testid={`${PAGE_NAME}_lastAnnotation`}\n      className={classes.container}\n      onClick={openAnnotationsList}\n    >\n      <div className={styles.cTopAnnotationMain}>\n        <CreatorAvatar\n          user={creator.attributes}\n          currentUser={currentUser}\n          isNative={isNative}\n          className={classes.avatar}\n          size={38}\n        />\n        <Typography\n          variant=\"body2\"\n          data-testid={`${PAGE_NAME}_message`}\n          noWrap\n          className={classes.body}\n        >\n          {formatMentionText(data.attributes.body, mentionedUsers, isNative, null, currentUser)}\n        </Typography>\n      </div>\n      <div className={styles.cTopAnnotationAdditional}>\n        <Reactions\n          commentsCount={data.attributes.comments_count}\n          commentUsers={commentUsers}\n          classes={classes}\n          isSmallScreen={isSmallScreen}\n          currentUser={currentUser}\n        />\n        <CloseButton\n          data-testid={`${PAGE_NAME}_closeButton`}\n          fontSize=\"small\"\n          className={classes.closeButton}\n          onClick={handleCloseClick}\n        />\n      </div>\n    </Paper>\n  );\n};\n\nLastAnnotation.propTypes = {\n  appId: number.isRequired,\n  annotation: shape({\n    included: arrayOf(shape({})).isRequired,\n    data: shape({\n      relationships: shape({\n        user: shape({ data: shape({ id: string.isRequired }).isRequired }).isRequired,\n        mentioned_users: shape({ data: arrayOf(shape()).isRequired }).isRequired,\n      }).isRequired,\n      attributes: shape({ body: string.isRequired, created_at: string.isRequired }),\n    }).isRequired,\n  }).isRequired,\n  classes: shape({}).isRequired,\n  isNative: bool,\n  width: string.isRequired,\n  openAnnotationsList: func.isRequired,\n  updateCurrentDashboardAppLastAnnotation: func,\n  currentUser: shape({}),\n};\n\nconst DEFAULT_LAST_ANNOTATION_IS_NATIVE = isNativeDetected;\nconst DEFAULT_LAST_ANNOTATION_UPDATE_CURRENT_DASHBOARD_APP_LAST_ANNOTATION = () => undefined;\nconst DEFAULT_LAST_ANNOTATION_CURRENT_USER = {};\n\nexport default flowRight([withStyles(muiStyles), withWidth()])(memo(LastAnnotation));\n"],"names":["PAGE_NAME","CreatorAvatar","_ref","user","currentUser","isNative","className","size","children","_jsx","Avatar","displayName","concat","first_name","last_name","imgSrc","profile_photo","UserCardPopover","Reactions","_ref2","commentsCount","commentUsers","isSmallScreen","classes","_jsxs","styles","cTopAnnotationAdditionalReactions","CommentIcon","commentIcon","Typography","variant","noWrap","commentText","component","cTopAnnotationAdditionalReactionsList","map","index","attributes","classNames","avatar","_defineProperty","avatarInList","id","LastAnnotation","_ref4","_ref10","_ref4$isNative","DEFAULT_LAST_ANNOTATION_IS_NATIVE","appId","annotation","openAnnotationsList","_ref4$currentUser","DEFAULT_LAST_ANNOTATION_CURRENT_USER","_ref4$updateCurrentDa","updateCurrentDashboardAppLastAnnotation","updateLastAnnotation","DEFAULT_LAST_ANNOTATION_UPDATE_CURRENT_DASHBOARD_APP_LAST_ANNOTATION","width","data","included","creator","find","_ref5","type","relationships","mentionedUsers","useMemo","mentioned_users","_ref6","mentionedUserId","_ref7","comment_users","_ref8","commentUserId","_ref9","isWidthUp","handleCloseClick","_asyncToGenerator","_regeneratorRuntime","mark","e","response","wrap","_context","prev","next","stopPropagation","closeLastAnnotation","sent","t0","console","error","stop","_callee","_x","apply","this","arguments","Paper","container","onClick","cTopAnnotationMain","body","formatMentionText","cTopAnnotationAdditional","comments_count","CloseButton","fontSize","closeButton","propTypes","number","isRequired","shape","arrayOf","string","created_at","bool","func","isNativeDetected","LastAnnotation$1","flowRight","withStyles","theme","height","margin","padding","display","alignItems","justifyContent","flex","cursor","minWidth","border","marginRight","color","palette","grey","marginLeft","withWidth","memo"],"mappings":"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"}