try entertain match

src/api/mycard/match.ts

@@ -2,18 +2,18 @@ import axios from "axios";
 
 const API_URL = "https://sapi.moecube.com:444/ygopro/match";
 
-interface MatchInfo {
-  ip: string;
+export interface MatchInfo {
+  address: string;
   port: number;
   password: string;
 }
 
 export async function match(
-  userName: string,
+  username: string,
   extraId: number,
   arena: string = "entertain"
 ): Promise<MatchInfo | undefined> {
-  const headers = { Authorization: "Basic " + btoa(userName + ":" + extraId) };
+  const headers = { Authorization: "Basic " + btoa(username + ":" + extraId) };
   const response = await axios
     .post(API_URL, undefined, {
       headers: headers,
@@ -28,5 +28,5 @@ export async function match(
       return undefined;
     });
 
-  return response ? JSON.parse(response.data) : undefined;
+  return response ? response.data : undefined;
 }

src/ui/Sso.tsx

-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
+
+import { match, MatchInfo } from "@/api";
 
 interface SSOParams {
   id: string;
@@ -7,6 +9,7 @@ interface SSOParams {
   email: string;
   return_sso_url: string;
   token: string;
+  external_id: number;
 }
 
 const Sso: React.FC = () => {
@@ -14,6 +17,12 @@ const Sso: React.FC = () => {
   const ssoParams: SSOParams | undefined = sso
     ? getSSOParams(new URLSearchParams(atob(sso)))
     : undefined;
+  const [matchInfo, setMatchInfo] = useState<MatchInfo | undefined>(undefined);
+  const onMatch = async () => {
+    if (ssoParams) {
+      setMatchInfo(await match(ssoParams.username, ssoParams.external_id));
+    }
+  };
 
   useEffect(() => {
     if (!sso) {
@@ -28,6 +37,11 @@ const Sso: React.FC = () => {
       <p>username={ssoParams?.username}</p>
       <p>name={ssoParams?.name}</p>
       <p>email={ssoParams?.email}</p>
+      <button onClick={onMatch}>match</button>
+      <p>match info</p>
+      <p>address={matchInfo?.address}</p>
+      <p>port={matchInfo?.port}</p>
+      <p>password={matchInfo?.password}</p>
     </div>
   );
 };