feat(xbridge-test): xbridge-test 이미지 로직 변경 (#22)

* feat(xbridge-test): xbridge test service 추가 * feat(xbridge): docker file 변경 * feat(xbridge-test): xbridge test image 로직 변경
team-xquare · Jun 7, 2022 · cb5a6dc · cb5a6dc
1 parent 1c0eb78
commit cb5a6dc
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 9 deletions.
diff --git a/services/xbridge-test/common/XbridgeImage.tsx b/services/xbridge-test/common/XbridgeImage.tsx
@@ -0,0 +1,16 @@
+import { ButtonProps } from '@semicolondsm/ui/dist/components/Button/types';
+import { sendBridgeEvent } from '@shared/xbridge';
+import React, { FC, HTMLProps, ReactPropTypes } from 'react';
+
+interface Props {
+    src: string;
+}
+const XbridgeImage = ({ src }: Props) => {
+    return (
+        <img
+            src={src}
+            onClick={() => sendBridgeEvent('image-detail', [src], () => console.log(src))}></img>
+    );
+};
+
+export default XbridgeImage;
diff --git a/services/xbridge-test/src/pages/index.tsx b/services/xbridge-test/src/pages/index.tsx
@@ -2,19 +2,13 @@ import type { NextPage } from 'next';
 import { Button } from '@semicolondsm/ui';
 import { sendBridgeEvent } from '@shared/xbridge';
 import { useRouter } from 'next/router';
+import XbridgeImage from '../../common/XbridgeImage';
 const Home: NextPage = () => {
     const router = useRouter();
     return (
         <div>
-            <Button
-                onClick={() =>
-                    sendBridgeEvent('image-detail', [
-                        'https://cdnimg.melon.co.kr/cm2/artistcrop/images/002/61/143/261143_20210325180240_500.jpg?61e575e8653e5920470a38d1482d7312/melon/resize/416/quality/80/optimize',
-                        'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKS1BGRjgU289BZuhSFI4V7GBh6Ny_UzgH6A&usqp=CAU',
-                    ])
-                }>
-                이미지 상세보기
-            </Button>
+            <XbridgeImage src="https://cdnimg.melon.co.kr/cm2/artistcrop/images/002/61/143/261143_20210325180240_500.jpg?61e575e8653e5920470a38d1482d7312/melon/resize/416/quality/80/optimize" />
+            <XbridgeImage src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKS1BGRjgU289BZuhSFI4V7GBh6Ny_UzgH6A&usqp=CAU" />
             <Button
                 onClick={() =>
                     sendBridgeEvent('navigate', '/back', ({ data }) => router.push(data))