{"version":3,"file":"static/chunks/pages/mypage/coupons-ef08f7a7b680b05c.js","mappings":"AACA","sources":["webpack://_N_E/?0aba","webpack://_N_E/./src/components/Coupons/Coupon.tsx","webpack://_N_E/./src/components/Coupons/Mypage/index.tsx","webpack://_N_E/./src/pages/mypage/coupons/index.tsx","webpack://_N_E/./src/utils/formatting.ts","webpack://_N_E/"],"sourcesContent":["\n (window.__NEXT_P = window.__NEXT_P || []).push([\n \"/mypage/coupons\",\n function () {\n return require(\"private-next-pages/mypage/coupons/index.tsx\");\n }\n ]);\n if(module.hot) {\n module.hot.dispose(function () {\n window.__NEXT_P.push([\"/mypage/coupons\"])\n });\n }\n ","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n height: 142px;\\n gap: 8px;\\n justify-content: space-between;\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n width: 100%;\\n display: flex;\\n flex-direction: column;\\n justify-content: space-between;\\n flex: 1;\\n padding: 16px;\\n border-radius: 6px;\\n border: 1px solid \",\n \";\\n background-color: \",\n \";\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n font-size: 16px;\\n font-style: normal;\\n font-weight: 600;\\n line-height: 24px;\\n letter-spacing: -0.16px;\\n margin-bottom: 4px;\\n color: \",\n \";\\n text-overflow: ellipsis;\\n overflow: hidden;\\n display: -webkit-box;\\n -webkit-line-clamp: 1;\\n -webkit-box-orient: vertical;\\n word-break: break-all;\\n\"\n ]);\n _templateObject2 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject3() {\n const data = _tagged_template_literal([\n \"\\n font-size: 14px;\\n font-style: normal;\\n font-weight: 400;\\n line-height: 22px; /* 157.143% */\\n letter-spacing: -0.14px;\\n color: \",\n \";\\n\"\n ]);\n _templateObject3 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject4() {\n const data = _tagged_template_literal([\n \"\\n font-size: 14px;\\n font-style: normal;\\n font-weight: 400;\\n line-height: 22px; /* 157.143% */\\n letter-spacing: -0.14px;\\n color: \",\n \";\\n\"\n ]);\n _templateObject4 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject5() {\n const data = _tagged_template_literal([\n \"\\n font-size: 14px;\\n font-style: normal;\\n font-weight: 400;\\n line-height: 22px; /* 157.143% */\\n letter-spacing: -0.14px;\\n color: \",\n \";\\n\"\n ]);\n _templateObject5 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject6() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n width: 64px;\\n align-items: center;\\n\\n /* flex-shrink: 0; */\\n /* padding: 0 11px; */\\n justify-content: center;\\n border-radius: 6px;\\n background-color: \",\n \";\\n\\n :hover {\\n cursor: pointer;\\n background-color: \",\n \";\\n }\\n\\n &.status-isMine {\\n background-color: \",\n \";\\n\\n p {\\n color: \",\n \";\\n }\\n\\n :hover {\\n cursor: default;\\n }\\n }\\n\"\n ]);\n _templateObject6 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject7() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n flex-direction: column;\\n align-items: center;\\n\"\n ]);\n _templateObject7 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject8() {\n const data = _tagged_template_literal([\n \"\\n font-size: 16px;\\n font-style: normal;\\n font-weight: 600;\\n line-height: 24px; /* 150% */\\n letter-spacing: -0.16px;\\n\\n color: \",\n \";\\n\"\n ]);\n _templateObject8 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport styled from \"styled-components\";\nimport Icon from \"../icon/Icon\";\nimport { Check_Thin, CouponDownload } from \"../icon/IconList\";\nconst Coupon = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(CouponBox, {\n role: \"listitem\",\n children: children\n });\n};\nconst Content = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(CouponContents, {\n children: children\n });\n};\nconst CouponTitle = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(CouponTitleText, {\n children: children\n });\n};\nconst CouponMaxDiscount = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(MaxDiscountText, {\n children: children\n });\n};\nconst CouponCondition = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(ConditionText, {\n children: children\n });\n};\nconst ExpireDate = (param)=>{\n let { children } = param;\n return /*#__PURE__*/ _jsx(ExpireDateText, {\n children: children\n });\n};\nconst Possession = (param)=>{\n let { status , onHandleClick } = param;\n return /*#__PURE__*/ _jsx(IsOwnedStateArea, {\n role: \"button\",\n className: status ? \"status-isMine\" : \"\",\n onClick: onHandleClick,\n children: status ? /*#__PURE__*/ _jsxs(StateIcon, {\n children: [\n /*#__PURE__*/ _jsx(Icon, {\n icon: Check_Thin,\n color: \"#A9AFC7\"\n }),\n /*#__PURE__*/ _jsx(IconWithText, {\n children: \"보유중\"\n })\n ]\n }) : /*#__PURE__*/ _jsxs(StateIcon, {\n children: [\n /*#__PURE__*/ _jsx(Icon, {\n icon: CouponDownload,\n color: \"#513CBA\"\n }),\n /*#__PURE__*/ _jsx(IconWithText, {\n children: \"받기\"\n })\n ]\n })\n });\n};\nCoupon.Content = Content;\nCoupon.Title = CouponTitle;\nCoupon.MaxDiscount = CouponMaxDiscount;\nCoupon.Condition = CouponCondition;\nCoupon.ExpireDate = ExpireDate;\nCoupon.Possession = Possession;\nconst CouponBox = styled.div.withConfig({\n componentId: \"sc-b21a8b79-0\"\n})(_templateObject());\nconst CouponContents = styled.div.withConfig({\n componentId: \"sc-b21a8b79-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.sol_gray_100, (props)=>props.theme.new.colors.white);\nconst CouponTitleText = styled.p.withConfig({\n componentId: \"sc-b21a8b79-2\"\n})(_templateObject2(), (props)=>props.theme.new.colors.sol_gray_900);\nconst MaxDiscountText = styled.p.withConfig({\n componentId: \"sc-b21a8b79-3\"\n})(_templateObject3(), (props)=>props.theme.new.colors.sol_red_400);\nconst ConditionText = styled.p.withConfig({\n componentId: \"sc-b21a8b79-4\"\n})(_templateObject4(), (props)=>props.theme.new.colors.sol_gray_500);\nconst ExpireDateText = styled.p.withConfig({\n componentId: \"sc-b21a8b79-5\"\n})(_templateObject5(), (props)=>props.theme.new.colors.sol_gray_300);\nconst IsOwnedStateArea = styled.div.withConfig({\n componentId: \"sc-b21a8b79-6\"\n})(_templateObject6(), (props)=>props.theme.new.colors.sol_indigo_100, (props)=>props.theme.new.colors.sol_indigo_200, (props)=>props.theme.new.colors.sol_gray_50, (props)=>props.theme.new.colors.sol_gray_300);\nconst StateIcon = styled.div.withConfig({\n componentId: \"sc-b21a8b79-7\"\n})(_templateObject7());\nconst IconWithText = styled.p.withConfig({\n componentId: \"sc-b21a8b79-8\"\n})(_templateObject8(), (props)=>props.theme.new.colors.sol_indigo_600);\nexport default Coupon;\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n flex-direction: column;\\n gap: 15px;\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n justify-content: space-between;\\n border-radius: 6px;\\n border: 1px solid \",\n \";\\n background-color: \",\n \";\\n padding: 9px 12px;\\n\\n :hover {\\n background-color: \",\n \";\\n }\\n\\n @media (max-width: 1200px) {\\n margin-top: 24px;\\n }\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n align-items: center;\\n gap: 8px;\\n font-size: 14px;\\n font-style: normal;\\n font-weight: 600;\\n line-height: 22px; /* 157.143% */\\n letter-spacing: -0.14px;\\n color: \",\n \";\\n\"\n ]);\n _templateObject2 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject3() {\n const data = _tagged_template_literal([\n \"\\n display: flex;\\n align-items: center;\\n gap: 4px;\\n\\n font-size: 14px;\\n font-style: normal;\\n font-weight: 600;\\n line-height: 22px; /* 157.143% */\\n letter-spacing: -0.14px;\\n color: \",\n \";\\n\"\n ]);\n _templateObject3 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject4() {\n const data = _tagged_template_literal([\n \"\\n font-size: 16px;\\n font-style: normal;\\n font-weight: 700;\\n line-height: 150%; /* 24px */\\n\\n span {\\n color: \",\n \";\\n }\\n\"\n ]);\n _templateObject4 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject5() {\n const data = _tagged_template_literal([\n \"\\n display: grid;\\n gap: 16px;\\n grid-template-columns: 1fr 1fr;\\n\\n @media (max-width: 768px) {\\n grid-template-columns: 1fr;\\n }\\n\"\n ]);\n _templateObject5 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport Icon from \"@/components/icon/Icon\";\nimport { ArrowRight, CouponFilled, Sizes } from \"@/components/icon/IconList\";\nimport { COUPONS_LANDING } from \"@/settings/constant\";\nimport { useQuery } from \"@tanstack/react-query\";\nimport Link from \"next/link\";\nimport { getMyCoupons } from \"src/api/coupon\";\nimport { formatDateToDot } from \"src/utils/formatting\";\nimport styled from \"styled-components\";\nimport Coupon from \"../Coupon\";\nimport React from \"react\";\nimport { EmptyWrapper } from \"./EmptyWrapper\";\nconst MyCoupons = ()=>{\n var _myCoupons_items, _myCoupons_items1, _myCoupons_items2;\n const { data: myCoupons , isSuccess } = useQuery([\n \"myCoupons\"\n ], ()=>{\n return getMyCoupons();\n }, {\n retry: 3\n });\n return /*#__PURE__*/ _jsxs(CouponContainer, {\n children: [\n (myCoupons === null || myCoupons === void 0 ? void 0 : myCoupons.isMoreCoupon) && /*#__PURE__*/ _jsx(Link, {\n href: COUPONS_LANDING,\n children: /*#__PURE__*/ _jsxs(LinkToMoreCoupons, {\n children: [\n /*#__PURE__*/ _jsxs(InfoText, {\n children: [\n /*#__PURE__*/ _jsx(Icon, {\n icon: CouponFilled,\n size: Sizes.xmedium\n }),\n \"할인쿠폰이 더 있는지 확인해보세요!\"\n ]\n }),\n /*#__PURE__*/ _jsxs(MoreCouponText, {\n children: [\n \"쿠폰보기 \",\n /*#__PURE__*/ _jsx(ArrowRight, {\n size: Sizes.small,\n color: \"#6950E5\"\n })\n ]\n })\n ]\n })\n }),\n /*#__PURE__*/ _jsxs(MyCouponCount, {\n children: [\n \"내 쿠폰 \",\n /*#__PURE__*/ _jsx(\"span\", {\n children: myCoupons === null || myCoupons === void 0 ? void 0 : (_myCoupons_items = myCoupons.items) === null || _myCoupons_items === void 0 ? void 0 : _myCoupons_items.length\n })\n ]\n }),\n (myCoupons === null || myCoupons === void 0 ? void 0 : (_myCoupons_items1 = myCoupons.items) === null || _myCoupons_items1 === void 0 ? void 0 : _myCoupons_items1.length) === 0 ? /*#__PURE__*/ _jsx(EmptyWrapper, {\n description: \"내가 받은 쿠폰이 없어요.\"\n }) : /*#__PURE__*/ _jsx(CouponList, {\n role: \"list\",\n children: myCoupons === null || myCoupons === void 0 ? void 0 : (_myCoupons_items2 = myCoupons.items) === null || _myCoupons_items2 === void 0 ? void 0 : _myCoupons_items2.map((coupon)=>/*#__PURE__*/ _jsxs(Coupon, {\n children: [\n /*#__PURE__*/ _jsxs(Coupon.Content, {\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n children: [\n /*#__PURE__*/ _jsx(Coupon.Title, {\n children: coupon.title\n }),\n /*#__PURE__*/ _jsx(Coupon.MaxDiscount, {\n children: coupon.discountMaximumPriceText\n }),\n /*#__PURE__*/ _jsx(Coupon.Condition, {\n children: coupon.minimumPriceText\n })\n ]\n }),\n /*#__PURE__*/ _jsx(Coupon.ExpireDate, {\n children: \"\".concat(coupon.expiredAt ? formatDateToDot(coupon.expiredAt) + \"까지\" : \"\")\n })\n ]\n }),\n /*#__PURE__*/ _jsx(Coupon.Possession, {\n status: true\n })\n ]\n }, coupon.id))\n })\n ]\n });\n};\nconst CouponContainer = styled.section.withConfig({\n componentId: \"sc-1227d640-0\"\n})(_templateObject());\nconst LinkToMoreCoupons = styled.div.withConfig({\n componentId: \"sc-1227d640-1\"\n})(_templateObject1(), (props)=>props.theme.new.colors.sol_gray_200, (props)=>props.theme.new.colors.white, (props)=>props.theme.new.colors.sol_gray_50);\nconst InfoText = styled.div.withConfig({\n componentId: \"sc-1227d640-2\"\n})(_templateObject2(), (props)=>props.theme.new.colors.sol_red_400);\nconst MoreCouponText = styled.p.withConfig({\n componentId: \"sc-1227d640-3\"\n})(_templateObject3(), (props)=>props.theme.new.colors.sol_indigo_500);\nconst MyCouponCount = styled.p.withConfig({\n componentId: \"sc-1227d640-4\"\n})(_templateObject4(), (props)=>props.theme.new.colors.sol_blue_400);\nconst CouponList = styled.div.withConfig({\n componentId: \"sc-1227d640-5\"\n})(_templateObject5());\nexport default MyCoupons;\n","import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport MyCoupons from \"@/components/Coupons/Mypage\";\nimport { MyPageLayout } from \"@/containers/Layout/MyPage/Layout\";\nimport { MySolvookLayout } from \"@/containers/Layout/MyPage/MySolvookLayout\";\nimport { CategoryName } from \"@/modules/mypages/libraries/views/LibraryListView\";\nimport { MyPageWrapper } from \"..\";\nconst MypageCouponsNextPage = ()=>{\n return /*#__PURE__*/ _jsx(MyPageWrapper, {\n children: /*#__PURE__*/ _jsx(MyPageLayout, {\n children: /*#__PURE__*/ _jsxs(MySolvookLayout, {\n children: [\n /*#__PURE__*/ _jsx(CategoryName, {\n children: \"쿠폰 관리\"\n }),\n /*#__PURE__*/ _jsx(MyCoupons, {})\n ]\n })\n })\n });\n};\nexport default MypageCouponsNextPage;\n","export function formatDateToDashed(d) {\n return d.split(\"T\")[0];\n}\nexport function formatDateToDot(d) {\n return d.split(\"T\")[0].split(\"-\").join(\".\");\n}\nexport function formatDateToDashedYYYYMMDDHHMM(d) {\n return d.split(\"T\")[0] + \" \" + d.split(\"T\")[1].split(\".\")[0].slice(0, 5);\n}\n"],"names":[],"sourceRoot":""}