From 5835527a9ffe440414a90c389a0a6cc7a65c4b22 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Wed, 25 Oct 2023 03:34:50 +0900 Subject: [PATCH 1/3] =?UTF-8?q?chore:=20=EB=94=94=EC=8A=A4=EC=BD=94?= =?UTF-8?q?=EB=93=9C=20=EC=9B=B9=ED=9B=85=20=ED=8C=A8=ED=82=A4=EC=A7=80=20?= =?UTF-8?q?=EC=84=A4=EC=B9=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 19 ++++++++++++------- package.json | 1 + 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/package-lock.json b/package-lock.json index d6cf1d3..0885d46 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,6 +18,7 @@ "@types/styled-components": "^5.1.26", "autoprefixer": "10.4.15", "axios": "^1.5.0", + "discord-webhook-node": "^1.1.8", "eslint-config-next": "13.4.19", "fp-ts": "^2.16.1", "framer-motion": "^10.16.2", @@ -12242,6 +12243,15 @@ "node": ">=8" } }, + "node_modules/discord-webhook-node": { + "version": "1.1.8", + "resolved": "https://registry.npmjs.org/discord-webhook-node/-/discord-webhook-node-1.1.8.tgz", + "integrity": "sha512-3u0rrwywwYGc6HrgYirN/9gkBYqmdpvReyQjapoXARAHi0P0fIyf3W5tS5i3U3cc7e44E+e7dIHYUeec7yWaug==", + "dependencies": { + "form-data": "^3.0.0", + "node-fetch": "^2.6.0" + } + }, "node_modules/dlv": { "version": "1.1.3", "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", @@ -13983,7 +13993,6 @@ "version": "3.0.1", "resolved": "https://registry.npmjs.org/form-data/-/form-data-3.0.1.tgz", "integrity": "sha512-RHkBKtLWUVwd7SqRIvCZMEvAMoGUp0XU+seQiZejj0COz3RI3hWP4sCv3gZWWLjJTd7rGwcsF5eKZGii0r/hbg==", - "dev": true, "dependencies": { "asynckit": "^0.4.0", "combined-stream": "^1.0.8", @@ -16683,7 +16692,6 @@ "version": "2.6.12", "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.12.tgz", "integrity": "sha512-C/fGU2E8ToujUivIO0H+tpQ6HWo4eEmchoPIoXtxCrVghxdKq+QOHqEZW7tuP3KlV3bC8FRMO5nMCC7Zm1VP6g==", - "dev": true, "dependencies": { "whatwg-url": "^5.0.0" }, @@ -20500,8 +20508,7 @@ "node_modules/tr46": { "version": "0.0.3", "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz", - "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==", - "dev": true + "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==" }, "node_modules/trim-repeated": { "version": "2.0.0", @@ -21117,8 +21124,7 @@ "node_modules/webidl-conversions": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz", - "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==", - "dev": true + "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==" }, "node_modules/webpack": { "version": "5.88.2", @@ -21306,7 +21312,6 @@ "version": "5.0.0", "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz", "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==", - "dev": true, "dependencies": { "tr46": "~0.0.3", "webidl-conversions": "^3.0.0" diff --git a/package.json b/package.json index 8c1e2ee..472769e 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@types/styled-components": "^5.1.26", "autoprefixer": "10.4.15", "axios": "^1.5.0", + "discord-webhook-node": "^1.1.8", "eslint-config-next": "13.4.19", "fp-ts": "^2.16.1", "framer-motion": "^10.16.2", From f1d011f56e6afdee40e755a6db0e58f66209662a Mon Sep 17 00:00:00 2001 From: hamo-o Date: Wed, 25 Oct 2023 03:53:52 +0900 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20=EC=8B=A0=EA=B3=A0=20=EC=83=81?= =?UTF-8?q?=EC=84=B8=20UI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/BottomSheet/BottomSheet.tsx | 2 +- .../BottomSheet/children/Report.tsx | 48 ++++++++----------- .../BottomSheet/children/ReportBlock.tsx | 15 +++++- 3 files changed, 36 insertions(+), 29 deletions(-) diff --git a/src/components/BottomSheet/BottomSheet.tsx b/src/components/BottomSheet/BottomSheet.tsx index 336fd0a..45f8087 100644 --- a/src/components/BottomSheet/BottomSheet.tsx +++ b/src/components/BottomSheet/BottomSheet.tsx @@ -17,7 +17,7 @@ interface Props { } const COMPONENT_HEIGHT: any = { - report: 540 + 30, + report: 660, reportFriend: 331, reportBlock: 167, coin: 324 + 30, diff --git a/src/components/BottomSheet/children/Report.tsx b/src/components/BottomSheet/children/Report.tsx index 4cb179e..a49950b 100644 --- a/src/components/BottomSheet/children/Report.tsx +++ b/src/components/BottomSheet/children/Report.tsx @@ -1,5 +1,8 @@ "use client"; import styled from "styled-components"; +import Flex from "src/components/common/Flex"; +import Text from "src/components/common/Text"; +import { colors } from "styles/theme"; interface Props {} @@ -18,40 +21,31 @@ const ReportDatas = [ const Report = ({}: Props) => { return ( - - - 신고하기 - - {ReportDatas.map((data: string, idx: number) => { - return ( - - {data} - - ); - })} - + + + 신고하기 + + + {ReportDatas.map((data: string, idx: number) => { + return ( + + {data} + + ); + })} + + ); }; -const ReportWrapper = styled.div` +const Menu = styled.div<{ border?: boolean }>` width: 100%; -`; - -const ReportTitle = styled.div` - width: 100%; - height: 70px; - display: flex; -`; + padding: 1rem 0; -const ReportSelection = styled.div` - width: 100%; - height: 45px; display: flex; -`; + justify-content: center; -const Menu = styled.div` - margin: auto; - display: flex; + border-top: ${({ border }) => border && `1px solid ${colors.line_black_5}`}; `; export default Report; diff --git a/src/components/BottomSheet/children/ReportBlock.tsx b/src/components/BottomSheet/children/ReportBlock.tsx index 785ef2b..e8556e6 100644 --- a/src/components/BottomSheet/children/ReportBlock.tsx +++ b/src/components/BottomSheet/children/ReportBlock.tsx @@ -6,7 +6,10 @@ import { colors } from "styles/theme"; import useBlockFriendMutation from "src/hooks/account/useBlockFriendMutation"; import { useAppSelector, useAppDispatch } from "src/hooks/useReduxHooks"; -import { changeAction } from "src/reducer/slices/bottomSheet/bottomSheetSlice"; +import { + changeAction, + changeVisibleType +} from "src/reducer/slices/bottomSheet/bottomSheetSlice"; import { useRouter } from "next/navigation"; const ReportBlock = () => { @@ -40,6 +43,16 @@ const ReportBlock = () => { value: { on: false } }) ); + setTimeout( + () => + dispatch( + changeVisibleType({ + type: "bottomSheet", + value: [1, "report"] + }) + ), + 400 + ); }} > From 505f7fa060bf201d0c5d5b33fd9cd3922b7bbfc0 Mon Sep 17 00:00:00 2001 From: hamo-o Date: Wed, 25 Oct 2023 18:54:23 +0900 Subject: [PATCH 3/3] =?UTF-8?q?feat:=20=EA=B2=8C=EC=8B=9C=EA=B8=80=20?= =?UTF-8?q?=EC=8B=A0=EA=B3=A0=20=EC=9B=B9=ED=9B=85=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- next.config.js | 3 +- src/apis/discord/index.ts | 21 +++++++++ .../BottomSheet/children/Report.tsx | 46 +++++++++++++++---- 3 files changed, 60 insertions(+), 10 deletions(-) create mode 100644 src/apis/discord/index.ts diff --git a/next.config.js b/next.config.js index aef0e36..8018a62 100644 --- a/next.config.js +++ b/next.config.js @@ -2,7 +2,8 @@ const nextConfig = { reactStrictMode: false, experimental: { - appDir: true + appDir: true, + serverActions: true }, compiler: { styledComponents: true diff --git a/src/apis/discord/index.ts b/src/apis/discord/index.ts new file mode 100644 index 0000000..e8407da --- /dev/null +++ b/src/apis/discord/index.ts @@ -0,0 +1,21 @@ +import axios from "axios"; + +export const sendDiscordMessage = async (message: string) => { + try { + const response = await axios.post( + "https://discord.com/api/webhooks/" + + process.env.NEXT_PUBLIC_WEBHOOK_URL, + { + content: message + }, + { + headers: { + "Content-Type": "application/json" + } + } + ); + return response.data; + } catch (err: any) { + console.log(err.message); + } +}; diff --git a/src/components/BottomSheet/children/Report.tsx b/src/components/BottomSheet/children/Report.tsx index a49950b..469cb13 100644 --- a/src/components/BottomSheet/children/Report.tsx +++ b/src/components/BottomSheet/children/Report.tsx @@ -3,6 +3,10 @@ import styled from "styled-components"; import Flex from "src/components/common/Flex"; import Text from "src/components/common/Text"; import { colors } from "styles/theme"; +import { usePathname } from "next/navigation"; +import { sendDiscordMessage } from "src/apis/discord"; +import { useAppDispatch } from "src/hooks/useReduxHooks"; +import { changeAction } from "src/reducer/slices/bottomSheet/bottomSheetSlice"; interface Props {} @@ -20,32 +24,56 @@ const ReportDatas = [ ]; const Report = ({}: Props) => { + const pathName = usePathname(); + const dispatch = useAppDispatch(); + + const handleClickReport = async (reason: string) => { + const id = pathName.split("question/")[1]; + await sendDiscordMessage( + `> **[게시글 신고]** + > + > 게시글 Id: ${id} + > 신고사유: ${reason}` + ); + return null; + }; return ( 신고하기 - {ReportDatas.map((data: string, idx: number) => { - return ( - - {data} - - ); - })} + {ReportDatas.map((data: string, idx: number) => ( + { + handleClickReport(data); + dispatch( + changeAction({ + type: "bottomSheet", + value: { on: false } + }) + ); + }} + > + {data} + + ))} ); }; -const Menu = styled.div<{ border?: boolean }>` +const Menu = styled.div<{ $border?: boolean }>` width: 100%; padding: 1rem 0; display: flex; justify-content: center; - border-top: ${({ border }) => border && `1px solid ${colors.line_black_5}`}; + border-top: ${({ $border }) => + $border && `1px solid ${colors.line_black_5}`}; `; export default Report;