@teamsparta/blog-system
Version:
124 lines • 8.64 kB
JavaScript
"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importStar(require("react"));
var image_1 = __importDefault(require("next/image"));
var html_react_parser_1 = __importDefault(require("html-react-parser"));
var S = __importStar(require("./StoryContent.style"));
var PopularPosts_1 = __importDefault(require("../PopularPosts"));
var contentStyle_1 = require("../../style/contentStyle");
var dto_1 = require("../../dto");
var shareFunctions_1 = require("../../shareFunctions");
var variables_1 = require("../../style/variables");
var logs_1 = require("../../logs");
function StoryContent(_a) {
var blogPost = _a.blogPost, bannerAlt = _a.bannerAlt, popularList = _a.popularList, currentUrl = _a.currentUrl, increaseStroyView = _a.increaseStroyView, serviceType = _a.serviceType, nextVersion = _a.nextVersion, sendLog = _a.sendLog;
var banner_url = blogPost.banner_url, title = blogPost.title, category = blogPost.category, view = blogPost.view, readingTime = blogPost.readingTime, created_at = blogPost.created_at, content = blogPost.content, ogimg = blogPost.ogimg, url_title = blogPost.url_title;
(0, react_1.useEffect)(function () {
increaseStroyView(url_title);
}, []);
var kakaoShareInfo = {
storyTitle: title,
ogImage: ogimg,
storyCategory: dto_1.categoryTitle[serviceType][category],
url: currentUrl,
};
function getBlogUploadDateText(date) {
var now = new Date();
var delta = now.getTime() - date.getTime();
var passedMinutes = Math.floor(delta / 1000 / 60);
if (passedMinutes < 61) {
return "".concat(passedMinutes, "\uBD84 \uC804");
}
var passedHours = Math.floor(delta / 1000 / 60 / 60);
if (passedHours < 25) {
return "".concat(passedHours, "\uC2DC\uAC04 \uC804");
}
var passedDays = Math.floor(delta / 1000 / 60 / 60 / 24);
if (passedDays < 8) {
return "".concat(passedDays, "\uC77C \uC804");
}
return "".concat(date.getFullYear(), ". ").concat(date.getMonth() + 1, ". ").concat(date.getDate(), ".");
}
function handleAtagClick(event) {
var target = event.target;
if (target.tagName === "A") {
var url = target.href;
var content_1 = target.textContent ? target.textContent : "";
(0, logs_1.sendClickDetailPageBtnLog)(serviceType, content_1, "outlink", url, "", "outlink", sendLog);
}
}
function clickCopyUrl() {
(0, shareFunctions_1.copyUrl)(currentUrl);
(0, logs_1.sendClickDetailPageBtnLog)(serviceType, "링크복사", "share_copy", "", "", "copy", sendLog);
}
function clickKaKaoShare() {
(0, logs_1.sendClickDetailPageBtnLog)(serviceType, "카카오공유", "share", "", "", "share", sendLog);
(0, shareFunctions_1.shareStoryWithKakao)(kakaoShareInfo);
}
function clickFacebookShare() {
(0, logs_1.sendClickDetailPageBtnLog)(serviceType, "페이스북공유", "share", "", "", "share", sendLog);
(0, shareFunctions_1.shareFacebook)(currentUrl);
}
return (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(S.BlogContentWrapper, null,
react_1.default.createElement(S.BlogContent, null,
banner_url && (react_1.default.createElement(S.BannerSection, null, nextVersion >= 13 ? (react_1.default.createElement(image_1.default, { fill: true, style: { objectFit: "cover" }, src: banner_url, alt: bannerAlt, priority: true })) : (react_1.default.createElement(image_1.default, { layout: "fill", objectFit: "cover", src: banner_url, alt: bannerAlt, priority: true })))),
react_1.default.createElement(S.ContentSection, null,
react_1.default.createElement(S.ContentSectionCategory, { color: variables_1.strongTextColor[serviceType] }, dto_1.categoryTitle[serviceType][category]),
react_1.default.createElement(S.ContentSectionTitle, null, title),
react_1.default.createElement(S.Info, null,
react_1.default.createElement(S.InfoContainer, null,
react_1.default.createElement(S.InfoElement, null, "\uC870\uD68C ".concat(view !== null && view !== void 0 ? view : 0)),
readingTime && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(S.InfoElement, null, "\u00B7"),
react_1.default.createElement(S.InfoElement, null,
readingTime,
"\uBD84 \uBD84\uB7C9")))),
react_1.default.createElement(S.InfoElement, null, getBlogUploadDateText(new Date(created_at)))),
react_1.default.createElement(contentStyle_1.Content, { serviceType: serviceType, onClick: function (e) { return handleAtagClick(e); } }, content && (0, html_react_parser_1.default)(content)),
react_1.default.createElement(S.BlogFooter, null,
react_1.default.createElement(S.BlogCopyrightInfo, null,
"- \uD574\uB2F9 \uCF58\uD150\uCE20\uB294 \uC800\uC791\uAD8C\uBC95\uC5D0 \uC758\uD574 \uBCF4\uD638\uBC1B\uB294 \uC800\uC791\uBB3C\uB85C \uC2A4\uD30C\uB974\uD0C0\uCF54\uB529\uD074\uB7FD\uC5D0 \uC800\uC791\uAD8C\uC774 \uC788\uC2B5\uB2C8\uB2E4.",
react_1.default.createElement("br", null),
"- \uD574\uB2F9 \uCF58\uD150\uCE20\uB294 \uC0AC\uC804 \uB3D9\uC758 \uC5C6\uC774 2\uCC28 \uAC00\uACF5 \uBC0F \uC601\uB9AC\uC801\uC778 \uC774\uC6A9\uC744 \uAE08\uD558\uACE0 \uC788\uC2B5\uB2C8\uB2E4."),
react_1.default.createElement(S.BlogShareContainer, null,
react_1.default.createElement(S.BlogShareText, null,
"\uB0B4\uC6A9\uC774 \uC720\uC775\uD558\uC168\uB2E4\uBA74? ",
react_1.default.createElement("strong", null, "\uACF5\uC720\uD558\uAE30")),
react_1.default.createElement(S.BlogShareBtnContainer, null,
react_1.default.createElement(S.ShareBtnWrapper, { onClick: clickCopyUrl },
react_1.default.createElement(image_1.default, { width: "50", height: "50", src: "https://static.spartacodingclub.kr/hanghae99/copyLinkBtn.png", alt: "copy_link_icon" })),
react_1.default.createElement(S.ShareBtnWrapper, { onClick: clickKaKaoShare },
react_1.default.createElement(image_1.default, { width: "50", height: "50", src: "https://static.spartacodingclub.kr/hanghae99/shareViaKakao.png", alt: "share_kakao_icon" })),
react_1.default.createElement(S.ShareBtnWrapper, { onClick: clickFacebookShare },
react_1.default.createElement(image_1.default, { width: "50", height: "50", src: "https://static.spartacodingclub.kr/hanghae99/shareViaFb.png", alt: "share_fb_icon" })))))))),
react_1.default.createElement(PopularPosts_1.default, { popularList: popularList, serviceType: serviceType, nextVersion: nextVersion, sendLog: sendLog })));
}
exports.default = StoryContent;
//# sourceMappingURL=StoryContent.js.map