feat: VersionGate in notice.mdx

portone-io · Mar 13, 2024 · 5ef459d · 5ef459d
1 parent fcec547
commit 5ef459d
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 3 deletions.
diff --git a/src/components/gitbook/VersionGate.tsx b/src/components/gitbook/VersionGate.tsx
@@ -7,6 +7,7 @@ interface Props {
   default: "v1" | "v2";
   v1?: React.ReactNode;
   v2?: React.ReactNode;
+  exactMatch?: boolean;
   children?: React.ReactNode;
 }
 
@@ -18,10 +19,14 @@ export default function VersionGate(props: Props) {
   const v2Content =
     props.default === "v2" ? props.v2 ?? props.children : props.v2;
 
+  const exactMatch = props.exactMatch ?? false;
+
   return (
     <>
-      {systemVersion !== "v1" && v2Content}
-      {systemVersion !== "v2" && v1Content}
+      {(exactMatch ? systemVersion === "v2" : systemVersion !== "v1") &&
+        v2Content}
+      {(exactMatch ? systemVersion === "v1" : systemVersion !== "v2") &&
+        v1Content}
     </>
   );
 }
diff --git a/src/content/docs/ko/result/notice.mdx b/src/content/docs/ko/result/notice.mdx
@@ -4,6 +4,7 @@ description: PG사별 입금통보 설정을 통해 가상계좌 결제를 사
 ---
 
 import Figure from "~/components/Figure.astro";
+import VersionGate from "~/components/gitbook/VersionGate";
 import tosspayments_image1 from "./_assets/tosspayments/tosspayments-webhook-guide-1.png";
 import tosspayments_image2 from "./_assets/tosspayments/tosspayments-webhook-guide-2.png";
 import smartro_image1 from "./_assets/smartro/smartro-webhook-guide-1.png";
@@ -18,6 +19,7 @@ import welcome_image2 from "./_assets/welcome/welcome-webhook-guide-2.png";
 
 ## PG사별 가상계좌 입금통보 URL
 
+<VersionGate client:idle default="v1">
 | PG                  | 입금통보 주소                                                                                                                                                 |
 | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | KG이니시스          | https://service.iamport.kr/inicis_payments/notice_vbank                                                                                                       |
@@ -26,39 +28,59 @@ import welcome_image2 from "./_assets/welcome/welcome-webhook-guide-2.png";
 | KICC                | https://service.iamport.kr/kicc_payments/notice_vbank                                                                                                         |
 | 헥토파이낸셜        | https://service.iamport.kr/settle_payments/notice_vbank                                                                                                       |
 | 키움페이            | <ul><li>발행 통지 URL: https://service.iamport.kr/daou_payments/result</li><li>결과 통지 URL: https://service.iamport.kr/daou_payments/notice_vbank</li></ul> |
-| (산) 토스페이먼츠   | https://tx-gateway-service.prod.iamport.co/virtual-account/webhook-event/tosspayments                                                                         |
+| (신) 토스페이먼츠   | https://tx-gateway-service.prod.iamport.co/virtual-account/webhook-event/tosspayments                                                                         |
 | KSNET               | https://tx-gateway-service.prod.iamport.co/ksnet                                                                                                              |
 | (신) 스마트로       | 입금 통보, 환불이체 URL 동일: https://tx-gateway-service.prod.iamport.co/smartro-v2                                                                           |
 | (신) 나이스페이먼츠 | https://tx-gateway-service.prod.iamport.co/nicepay-v2                                                                                                         |
 | 웰컴페이먼츠        | https://tx-gateway-service.prod.iamport.co/welcome                                                                                                            |
+</VersionGate>
+<VersionGate client:idle default="v2" exactMatch="true">
+| PG                  | 입금통보 주소                                                                                                                                                 |
+| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| (신) 토스페이먼츠   | https://tx-gateway-service.prod.iamport.co/virtual-account/webhook-event/tosspayments                                                                         |
+| KSNET               | https://tx-gateway-service.prod.iamport.co/ksnet                                                                                                              |
+| (신) 스마트로       | 입금 통보, 환불이체 URL 동일: https://tx-gateway-service.prod.iamport.co/smartro-v2                                                                           |
+| (신) 나이스페이먼츠 | https://tx-gateway-service.prod.iamport.co/nicepay-v2                                                                                                         |
+| 웰컴페이먼츠        | https://tx-gateway-service.prod.iamport.co/welcome                                                                                                            |
+</VersionGate>
 
+<VersionGate client:idle default="v1">
 ### KG 이니시스
 
 "KG이니시스" > "포트원 서버"로 이루어지는 통지는 **KG이니시스 상점관리자 페이지**에서 다음과 같은 추가 설정이 필요합니다.
 "상점정보" > "결제수단정보" 메뉴에서, "입금통보 URL(IP)"를 `https://service.iamport.kr/inicis_payments/notice_vbank` 로 설정해주세요.
 
 <img src="https://djqafk2qzyjhg.cloudfront.net/img/inicis_vbank.png" />
+</VersionGate>
 
+<VersionGate client:idle default="v1">
 ### KCP
 
 "KCP" > "포트원 서버"로 이루어지는 통지는 **KCP 상점관리자 페이지**에서 다음과 같은 추가 설정이 필요합니다.\
 "상점정보관리" > "정보변경" > "공통URL정보" 메뉴에서, "공통 URL" `https://service.iamport.kr/kcp_payments/notice_vbank` 로 설정해주세요.
 
 <Figure src="https://djqafk2qzyjhg.cloudfront.net/img/kcp_vbank.png" />
+</VersionGate>
 
+<VersionGate client:idle default="v1">
 ### (구) 나이스페이먼츠
 
 "나이스페이먼츠" > "포트원 서버"로 이루어지는 통지는 **나이스페이 상점관리자 페이지**에서 다음과 같은 추가 설정이 필요합니다.
 "가맹점정보" > "기본정보" 메뉴에서, "결제데이터 통보의 가상계좌" 부분을 `https://service.iamport.kr/nice_payments/notice_vbank` 로 설정해주세요.
 (OK체크를 체크해주시고, 재전송 횟수는 1혹은 그 이상으로 해주세요.)
 
 <Figure src={nice_v1_image1} />
+</VersionGate>
 
+<VersionGate client:idle default="v1">
 ### KICC
 
 > "KICC서버" > "포트원 서버"로 이루어지는 통지는 MID 발급 시 자동으로 등록됩니다.
 > 만약, 입금통보가 수신되지 않는다면 KICC 영업담당자 혹은 대표 연락처(1644-2004, [[email protected]](mailto:[email protected]))로 연락하셔서 "가상계좌 입금통보 URL" 설정 확인을 요청주세요.
 
+</VersionGate>
+
+<VersionGate client:idle default="v1">
 ### 헥토파이낸셜
 
 "헥토파이낸셜 서버" > "포트원 서버"로 이루어지는 통지는 **헥토파이낸셜 담당자 및 기술팀**에 메일로 요청해주셔야 합니다.
@@ -72,6 +94,9 @@ [email protected](개발팀) 에 발급받으신 MID와 함께 아
 >
 > 설정이 완료되면 회신 부탁드립니다.
 
+</VersionGate>
+
+<VersionGate client:idle default="v1">
 ### 키움페이
 
 <Figure src="/gitbook-assets/ko/image (184) (1).png" />
@@ -82,6 +107,7 @@ [email protected](개발팀) 에 발급받으신 MID와 함께 아
 
 - 발행 통지 URL: https://service.iamport.kr/daou_payments/result
 - 결과 통지 URL: https://service.iamport.kr/daou_payments/notice_vbank
+</VersionGate>
 
 ### (신) 토스페이먼츠