{"version":3,"mappings":";qbACA,MAAMA,EAAYC,GAA0BC,EAAmB,cAAC,MAAO,CAAE,MAAO,6BAA8B,QAAS,cAAe,GAAGD,CAAO,EAAkBC,gBAAoB,OAAQ,CAAE,EAAG,wkBAAwkB,CAAE,CAAC,ECIxwBC,EAAaC,EAAA,KAAK,UAAM,OAAO,0BAA6B,EAAC,gFAEnE,SAAwBC,EAAmB,CACzC,UAAAC,EACA,SAAAC,CACF,EAGG,CACD,KAAM,CAACC,EAAWC,CAAY,EAAIC,WAAS,EAAK,EAE5C,OAAAH,EAAS,aAAe,EACnB,GAIPI,EAAA,KAAC,MAAI,WAAU,gBACb,UAAAA,EAAA,KAAC,UACC,KAAK,SACL,UAAU,0BACV,QAAS,IAAMF,EAAa,EAAI,EAE/B,UAAAF,EAAS,WAAW,eAAe,EAAG,IACtCK,EAAU,OAAQL,EAAS,UAAU,GACxC,EACCD,SACE,MAAI,WAAU,gCACZ,SAASC,EAAA,MAAM,IAAKM,GACnBC,EAAA,IAACC,EAAA,CAEC,MAAOF,EAAa,KAAK,MACzB,KAAK,KACL,IAAK,IAAIA,EAAa,KAAK,QAAQ,IAH9B,QAAQA,EAAa,KAAK,EAAE,IAAIA,EAAa,UAAU,IAAIA,EAAa,YAAY,EAK5F,GACH,EAEDL,SACEQ,WACC,UAAAF,EAAA,IAACX,EAAA,CACC,KAAMK,EACN,SAAAD,EACA,QAAS,IAAME,EAAa,EAAK,IAErC,CAEJ,GAEJ,CC7CA,SAAwBQ,EAAoB,CAC1C,UAAAX,EACA,SAAAC,CACF,EAGG,CACD,MAAMW,EAAWC,IAEXC,EAAaC,GAAY,CAC7BA,EAAE,eAAe,EACRH,EAAAI,EAAU,mBAAmB,OAAO,CAAC,GAI9C,OAAAX,EAAA,KAAC,OAAI,UAAU,8BAA8B,MAAO,CAAE,UAAW,MAC/D,YAAAG,EAAA,IAACS,EAAA,CACC,aAAW,gBACX,QAASH,EACT,UAAU,mCAEV,SAACN,EAAA,IAAAU,EAAA,CAAK,KAAMC,EAAgB,KAAK,KAAK,EACxC,EAEAX,MAACT,EAAmB,WAAAC,EAAsB,SAAAC,CAAoB,EAChE,GAEJ,CCjCA,MAAAmB,EAAeC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECAfC,EAAeD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,ECITxB,EAAaC,EAAA,KAAK,UAAM,OAAO,0BAA6B,EAAC,gFAEnE,SAAwByB,EAAkB,CACxC,UAAAvB,EACA,SAAAC,EACA,iBAAAuB,EACA,WAAAC,CACF,EAKG,CACD,KAAM,CAACvB,EAAWC,CAAY,EAAIC,WAAS,EAAK,EAEhD,OAAIqB,IAAe,EACV,GAIPpB,EAAA,KAAC,MAAI,WAAU,gBACb,UAAAA,EAAA,KAAC,UACC,KAAK,SACL,UAAWqB,EACT,+EACAF,EAAmB,eAAiB,EACtC,EACA,QAAS,IAAMrB,EAAa,EAAI,EAE/B,UAAAsB,EAAW,eAAe,EAAE,IAAEnB,EAAU,OAAQmB,CAAU,EAC1DzB,SACE,MAAI,WAAU,gCACZ,SAASC,EAAA,MAAM,IAAKM,GACnBC,EAAA,IAACC,EAAA,CAEC,MAAOF,EAAa,KAAK,MACzB,KAAK,KACL,IAAK,IAAIA,EAAa,KAAK,QAAQ,IAH9B,QAAQA,EAAa,KAAK,EAAE,IAAIA,EAAa,UAAU,IAAIA,EAAa,YAAY,EAK5F,GACH,EACC,KACL,EACCL,SACEQ,WACC,UAAAF,EAAA,IAACX,EAAA,CACC,KAAMK,EACN,SAAAD,EACA,QAAS,IAAME,EAAa,EAAK,IAErC,CAEJ,GAEJ,CClCA,SAAwBwB,EAAmB,CAAE,SAAA1B,EAAU,UAAAD,GAAoB,CACnE,MAAA4B,EAAUC,EAAW5B,CAAQ,EAC7BW,EAAWC,IAEX,CAACY,EAAYK,CAAa,EAAI1B,WAASH,EAAS,UAAU,EAC1D,CAAC8B,EAAM,CAAE,QAASC,EAAQ,EAC9BC,EAA4Bb,CAAoB,EAC5C,CAACc,EAAQ,CAAE,QAASC,CAAA,CAAU,EAAIF,EACtCX,CAAA,EAGIc,EAAe,IACZL,EAAK,CACV,UAAW,CACT,WAAY9B,EAAS,GACrB,aAAcA,EAAS,UACzB,EACD,EAGGoC,EAAiB,IACdH,EAAO,CACZ,UAAW,CACT,WAAYjC,EAAS,GACrB,aAAcA,EAAS,UACzB,EACD,EAGGqC,EAAmBvB,GAAY,CACnCA,EAAE,eAAe,GACFa,EAAUS,EAAiBD,GACnC,EAAE,KAAMG,GAAW,CACVT,EAAAS,EAAO,KAAK,WAAW,UAAU,EAC/C3B,EAAS4B,EAAW,CAAE,SAAAvC,CAAmB,CAAC,CAAC,EAC5C,GAID,OAAAI,EAAA,KAAC,OAAI,UAAU,0BAA0B,MAAO,CAAE,UAAW,MAC3D,YAAAG,EAAA,IAACS,EAAA,CACC,aAAW,iBACX,QAASqB,EACT,UAAWZ,EACTE,EACI,oDACA,oDACN,EAEC,YAAUO,EACT3B,EAAA,IAACiC,EAAY,WAAU,8BAA+B,GAEtDjC,EAAA,IAACU,EAAA,CACC,KAAMU,EAAUc,EAAUvB,EAC1B,KAAK,KACL,UAAWO,EACTE,EACI,mDACA,2GACN,EACF,EAEJ,EACCH,EAAa,EACZjB,EAAA,IAACe,EAAA,CACC,iBAAkBK,EAClB,SAAA3B,EACA,UAAAD,EACA,WAAAyB,CAAA,GAGAjB,EAAA,IAAAmC,EAAA,YAEN,GAEJ,CC3FA,SAAwBC,EAAW,CAAE,SAAA3C,EAAU,UAAAD,EAAY,IAAQ,CAGjE,OAFsB6C,IAOpBrC,EAAA,IAACmB,EAAA,CACC,UAAA3B,EACA,SAAAC,CAAA,GANKO,EAAA,IAACG,EAAoB,WAAAX,EAAsB,SAAAC,CAAoB,EAS1E","names":["SvgHeart","props","React.createElement","LikesModal","lazy","LoggedOutItemLikes","showLikes","likeable","showModal","setShowModal","useState","jsxs","pluralize","activityLike","jsx","Avatar","Suspense","LoggedOutLikeButton","dispatch","useDispatch","showLogin","e","uiActions","Button","Icon","faHeartOutline","likeActivityMutation","gql","unlikeActivityMutation","LoggedInItemLikes","currentUserLiked","likesCount","classNames","LoggedInLikeButton","isLiked","useIsLiked","setLikesCount","like","liking","useMutation","unlike","unliking","likeActivity","unlikeActivity","toggleLikeState","result","toggleLike","RefreshIcon","faHeart","Fragment","LikeButton","useCurrentUserId"],"ignoreList":[],"sources":["../../../app/javascript/icons/regular/heart.svg","../../../app/javascript/components/likes/LoggedOutItemLikes.tsx","../../../app/javascript/components/likes/LoggedOutLikeButton.tsx","../../../app/javascript/queries/likes/likeActivityMutation.ts","../../../app/javascript/queries/likes/unlikeActivityMutation.ts","../../../app/javascript/components/likes/LoggedInItemLikes.tsx","../../../app/javascript/components/likes/LoggedInLikeButton.tsx","../../../app/javascript/components/likes/LikeButton.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgHeart = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", viewBox: \"0 0 512 512\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"m225.8 468.2-2.5-2.3L48.1 303.2A150.6 150.6 0 0 1 0 192.8v-3.3c0-70.4 50-130.8 119.2-144A146.2 146.2 0 0 1 256 91.9c4.2-4.8 8.7-9.2 13.5-13.3a146.67 146.67 0 0 1 123.3-33.2A146.7 146.7 0 0 1 512 189.5v3.3c0 41.9-17.4 81.9-48.1 110.4L288.7 465.9l-2.5 2.3c-8.2 7.6-19 11.9-30.2 11.9s-22-4.2-30.2-11.9M239.1 145c-.4-.3-.7-.7-1-1.1l-17.8-20-.1-.1a98.4 98.4 0 0 0-92-31.2A98.6 98.6 0 0 0 48 189.5v3.3c0 28.5 11.9 55.8 32.8 75.2L256 430.7 431.2 268a102.7 102.7 0 0 0 32.8-75.2v-3.3c0-47.3-33.6-88-80.1-96.9-34-6.5-69 5.4-92 31.2l-.1.1-.1.1-17.8 20c-.3.4-.7.7-1 1.1a23.9 23.9 0 0 1-33.8 0z\" }));\nexport default SvgHeart;\n","import { Suspense, lazy, useState } from \"react\";\nimport pluralize from \"lib/pluralize\";\nimport Avatar from \"hardcover-ui/components/Avatar\";\nimport LikeableType from \"types/LikeableType\";\n\nconst LikesModal = lazy(() => import(\"components/likes/LikesModal\"));\n\nexport default function LoggedOutItemLikes({\n  showLikes,\n  likeable,\n}: {\n  showLikes: boolean;\n  likeable: LikeableType;\n}) {\n  const [showModal, setShowModal] = useState(false);\n\n  if (likeable.likesCount === 0) {\n    return false;\n  }\n\n  return (\n    <div className=\"flex flex-row\">\n      <button\n        type=\"button\"\n        className=\"hover:underline text-sm\"\n        onClick={() => setShowModal(true)}\n      >\n        {likeable.likesCount.toLocaleString()}{\" \"}\n        {pluralize(\"like\", likeable.likesCount)}\n      </button>\n      {showLikes && (\n        <div className=\"flex flex-row -space-x-2 ml-2\">\n          {likeable.likes.map((activityLike) => (\n            <Avatar\n              key={`like-${activityLike.user.id}-${activityLike.likeableId}-${activityLike.likeableType}`}\n              image={activityLike.user.image}\n              size=\"sm\"\n              alt={`@${activityLike.user.username}`}\n            />\n          ))}\n        </div>\n      )}\n      {showModal && (\n        <Suspense>\n          <LikesModal\n            open={showModal}\n            likeable={likeable}\n            onClose={() => setShowModal(false)}\n          />\n        </Suspense>\n      )}\n    </div>\n  );\n}\n","import Icon from \"hardcover-ui/components/Icon\";\nimport faHeartOutline from \"icons/regular/heart.svg\";\nimport { uiActions } from \"store/ui/uiSlice\";\nimport { useDispatch } from \"react-redux\";\nimport LikeableType from \"types/LikeableType\";\nimport Button from \"hardcover-ui/components/Button\";\nimport LoggedOutItemLikes from \"./LoggedOutItemLikes\";\n\nexport default function LoggedOutLikeButton({\n  showLikes,\n  likeable,\n}: {\n  showLikes: boolean;\n  likeable: LikeableType;\n}) {\n  const dispatch = useDispatch();\n\n  const showLogin = (e): void => {\n    e.preventDefault();\n    dispatch(uiActions.toggleLoginVisible(\"Login\"));\n  };\n\n  return (\n    <div className=\"flex items-center space-x-4\" style={{ minHeight: \"24px\" }}>\n      <Button\n        aria-label=\"Login to like\"\n        onClick={showLogin}\n        className=\"text-gray-700 dark:text-gray-300\"\n      >\n        <Icon icon={faHeartOutline} size=\"lg\" />\n      </Button>\n\n      <LoggedOutItemLikes showLikes={showLikes} likeable={likeable} />\n    </div>\n  );\n}\n","import { gql } from \"graphql-tag\";\n\nexport default gql`\n  mutation CreateLike($likeableId: Int!, $likeableType: String!) {\n    likeResult: upsert_like(\n      likeable_id: $likeableId\n      likeable_type: $likeableType\n    ) {\n      likesCount: likes_count\n      like {\n        ...LikeFragment\n      }\n    }\n  }\n`;\n","import { gql } from \"graphql-tag\";\n\nexport default gql`\n  mutation DeleteLike($likeableId: Int!, $likeableType: String!) {\n    likeResult: delete_like(\n      likeable_id: $likeableId\n      likeable_type: $likeableType\n    ) {\n      likesCount: likes_count\n    }\n  }\n`;\n","import { Suspense, lazy, useState } from \"react\";\nimport pluralize from \"lib/pluralize\";\nimport Avatar from \"hardcover-ui/components/Avatar\";\nimport classNames from \"lib/classNames\";\nimport LikeableType from \"types/LikeableType\";\n\nconst LikesModal = lazy(() => import(\"components/likes/LikesModal\"));\n\nexport default function LoggedInItemLikes({\n  showLikes,\n  likeable,\n  currentUserLiked,\n  likesCount,\n}: {\n  showLikes: boolean;\n  likeable: LikeableType;\n  currentUserLiked: boolean;\n  likesCount: number;\n}) {\n  const [showModal, setShowModal] = useState(false);\n\n  if (likesCount === 0) {\n    return false;\n  }\n\n  return (\n    <div className=\"flex flex-row\">\n      <button\n        type=\"button\"\n        className={classNames(\n          \"flex items-center gap-1 hover:underline text-sm font-semibold transition-all\",\n          currentUserLiked ? \"text-red-500\" : \"\"\n        )}\n        onClick={() => setShowModal(true)}\n      >\n        {likesCount.toLocaleString()} {pluralize(\"like\", likesCount)}\n        {showLikes && (\n          <div className=\"flex flex-row -space-x-2 ml-2\">\n            {likeable.likes.map((activityLike) => (\n              <Avatar\n                key={`like-${activityLike.user.id}-${activityLike.likeableId}-${activityLike.likeableType}`}\n                image={activityLike.user.image}\n                size=\"sm\"\n                alt={`@${activityLike.user.username}`}\n              />\n            ))}\n          </div>\n        )}{\" \"}\n      </button>\n      {showModal && (\n        <Suspense>\n          <LikesModal\n            open={showModal}\n            likeable={likeable}\n            onClose={() => setShowModal(false)}\n          />\n        </Suspense>\n      )}\n    </div>\n  );\n}\n","import { useState } from \"react\";\nimport { useMutation } from \"lib/apollo/client\";\nimport Icon from \"hardcover-ui/components/Icon\";\nimport faHeart from \"icons/solid/heart.svg\";\nimport faHeartOutline from \"icons/regular/heart.svg\";\nimport classNames from \"lib/classNames\";\nimport Button from \"hardcover-ui/components/Button\";\nimport LikeableType from \"types/LikeableType\";\nimport likeActivityMutation from \"queries/likes/likeActivityMutation\";\nimport unlikeActivityMutation from \"queries/likes/unlikeActivityMutation\";\nimport { RefreshIcon } from \"@heroicons/react/outline\";\nimport LoggedInItemLikes from \"./LoggedInItemLikes\";\nimport { useIsLiked } from \"store/currentUser/currentUserSelector\";\nimport { useDispatch } from \"react-redux\";\nimport { toggleLike } from \"store/currentUser/currentUserSlice\";\n\nexport interface Props {\n  likeable: LikeableType;\n  showLikes: boolean;\n}\n\ninterface LikeResultType {\n  likeResult: {\n    likesCount: number;\n  };\n}\nexport default function LoggedInLikeButton({ likeable, showLikes }: Props) {\n  const isLiked = useIsLiked(likeable);\n  const dispatch = useDispatch();\n\n  const [likesCount, setLikesCount] = useState(likeable.likesCount);\n  const [like, { loading: liking }] =\n    useMutation<LikeResultType>(likeActivityMutation);\n  const [unlike, { loading: unliking }] = useMutation<LikeResultType>(\n    unlikeActivityMutation\n  );\n\n  const likeActivity = () => {\n    return like({\n      variables: {\n        likeableId: likeable.id,\n        likeableType: likeable.objectType,\n      },\n    });\n  };\n\n  const unlikeActivity = () => {\n    return unlike({\n      variables: {\n        likeableId: likeable.id,\n        likeableType: likeable.objectType,\n      },\n    });\n  };\n\n  const toggleLikeState = (e): void => {\n    e.preventDefault();\n    const action = isLiked ? unlikeActivity : likeActivity;\n    action().then((result) => {\n      setLikesCount(result.data.likeResult.likesCount);\n      dispatch(toggleLike({ likeable: likeable }));\n    });\n  };\n\n  return (\n    <div className=\"flex items-center gap-2\" style={{ minHeight: \"24px\" }}>\n      <Button\n        aria-label=\"Like or Unlike\"\n        onClick={toggleLikeState}\n        className={classNames(\n          isLiked\n            ? \"text-red-500 hover:text-red-300 transition-colors\"\n            : \"text-primary dark:text-gray-300 hover:text-red-500\"\n        )}\n      >\n        {liking || unliking ? (\n          <RefreshIcon className=\"animate-spin-reverse w-5 h-5\" />\n        ) : (\n          <Icon\n            icon={isLiked ? faHeart : faHeartOutline}\n            size=\"lg\"\n            className={classNames(\n              isLiked\n                ? \"fill-red-500 hover:opacity-70 transition-opacity\"\n                : \"fill-gray-700 dark:fill-gray-300 hover:fill-red-500 dark:hover:fill-red-500 hover:rotate-3 transition-all\"\n            )}\n          />\n        )}\n      </Button>\n      {likesCount > 0 ? (\n        <LoggedInItemLikes\n          currentUserLiked={isLiked}\n          likeable={likeable}\n          showLikes={showLikes}\n          likesCount={likesCount}\n        />\n      ) : (\n        <></>\n      )}\n    </div>\n  );\n}\n","import LikeableType from \"types/LikeableType\";\nimport LoggedOutLikeButton from \"./LoggedOutLikeButton\";\nimport useCurrentUserId from \"hooks/user/useCurrentUserId\";\nimport LoggedInLikeButton from \"./LoggedInLikeButton\";\n\nexport interface Props {\n  likeable: LikeableType;\n  showLikes?: boolean;\n}\n\nexport default function LikeButton({ likeable, showLikes = true }) {\n  const currentUserId = useCurrentUserId();\n\n  if (!currentUserId) {\n    return <LoggedOutLikeButton showLikes={showLikes} likeable={likeable} />;\n  }\n\n  return (\n    <LoggedInLikeButton\n      showLikes={showLikes}\n      likeable={likeable}\n    />\n  );\n}\n"],"file":"assets/LikeButton-C6XuDjBg.js"}