Merge pull request #229 from 100-hours-a-week/feature/lucy

Feature/lucy
100-hours-a-week · Sep 29, 2024 · 098915b · 098915b
2 parents 9c7ce5d + 3237e81
commit 098915b
Show file tree

Hide file tree

Showing 31 changed files with 988 additions and 805 deletions.
diff --git a/src/Component/Button/button.tsx b/src/Component/Button/button.tsx
@@ -4,20 +4,21 @@ import { buttonSize, buttonType } from "../../Styles/button";
 import { ButtonStyleProps, ButtonProps } from "../../constants/interface";
 
 const ButtonStyle = styled.button<ButtonStyleProps>`
-    border-radius: 10px;
+  border-radius: 10px;
+  cursor: pointer;
 
-    ${(props) => buttonSize[props.$size]}
-    ${(props) => buttonType[props.$colorType]?.[props.$state]}
+  ${(props) => buttonSize[props.$size]}
+  ${(props) => buttonType[props.$colorType]?.[props.$state]}
 `;
 
 const Button = ({ onClick, children, ...styleprops }: ButtonProps) => {
-    return (
-        <>
-            <ButtonStyle {...styleprops} onClick={onClick}>
-                {children}
-            </ButtonStyle>
-        </>
-    );
+  return (
+    <>
+      <ButtonStyle {...styleprops} onClick={onClick}>
+        {children}
+      </ButtonStyle>
+    </>
+  );
 };
 
 export default Button;

diff --git a/src/Component/Chart/chart.tsx b/src/Component/Chart/chart.tsx
@@ -3,6 +3,7 @@ import ApexCharts from "apexcharts";
 import { ChartStyle } from "./chartStyle"; // Assuming you have the styles defined in this file
 import { formatPrice } from "../../util/util";
 import ModalOpen from "../Modal/modal";
+import { HiOutlineExternalLink } from "react-icons/hi";
 
 // import { HiOutlineArrowTopRightOnSquare } from "react-icons/hi2";
 
@@ -178,9 +179,7 @@ const Chart = ({ data }: CandleData) => {
                 fontSize: "15px",
               }}
             >
-              <div dangerouslySetInnerHTML={{ __html: newsHtml }}>
-                {/* <HiOutlineArrowTopRightOnSquare /> */}
-              </div>
+              <div dangerouslySetInnerHTML={{ __html: newsHtml }}></div>
             </span>
           </p>
         </ModalOpen>

diff --git a/src/Component/Dropdown/Dropdown.tsx b/src/Component/Dropdown/Dropdown.tsx
@@ -4,78 +4,78 @@ import { useState } from "react";
 import { DropdownProps } from "../../constants/interface";
 
 const DropdownContainer = styled.div`
-    display: flex;
-    flex-direction: row;
-    gap: 5px;
+  display: flex;
+  flex-direction: row;
 `;
 
 const DropdownBox = styled.option`
-    width: 75px;
-    font-size: 10px;
-    color: black;
-    text-align: start;
-    padding: 8px;
+  width: 75px;
+  font-size: 10px;
+  color: black;
+  text-align: start;
+  padding: 8px;
 
-    &:hover {
-        color: ${Colors.main};
-        background-color: #f5f4fb;
-    }
+  &:hover {
+    color: ${Colors.main};
+    background-color: #f5f4fb;
+  }
 `;
 
 const DropdownListBox = styled.select`
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    border: 1px solid ${Colors.main};
-    border-radius: 5px;
-    background-color: white;
-    top: 35px;
-    z-index: 1;
-    padding: 10px 5px;
-    height: 35px;
-    width: 85px;
-    text-align: center;
-    text-justify: center;
-    margin-bottom: 1rem;
-    font-size: 12px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  border: 1px solid ${Colors.main};
+  border-radius: 5px;
+  background-color: white;
+  top: 35px;
+  z-index: 1;
+  padding: 10px 5px;
+  height: 35px;
+  width: 85px;
+  text-align: center;
+  text-justify: center;
+  margin-bottom: 1rem;
+  font-size: 12px;
+  cursor: pointer;
 
-    &::-webkit-scrollbar {
-        display: none;
-    }
+  &::-webkit-scrollbar {
+    display: none;
+  }
 `;
 
 const Dropdown: React.FC<DropdownProps> = ({ dropList, onSelect }) => {
-    const [isOpen, setIsOpen] = useState(false);
-    const [value, setValue] = useState(dropList[0]);
+  const [isOpen, setIsOpen] = useState(false);
+  const [value, setValue] = useState(dropList[0]);
 
-    // const handleToggle = () => {
-    //     setIsOpen((prev) => !prev);
-    // };
+  // const handleToggle = () => {
+  //     setIsOpen((prev) => !prev);
+  // };
 
-    const handleSelect = (event: React.ChangeEvent<HTMLSelectElement>) => {
-        const selectedValue = event.target.value;
-        setValue(selectedValue);
-        setIsOpen(false);
-        onSelect(selectedValue);
-    };
+  const handleSelect = (event: React.ChangeEvent<HTMLSelectElement>) => {
+    const selectedValue = event.target.value;
+    setValue(selectedValue);
+    setIsOpen(false);
+    onSelect(selectedValue);
+  };
 
-    return (
-        <DropdownContainer>
-            <DropdownListBox onChange={handleSelect}>
-                {dropList.map((el) => (
-                    <DropdownBox key={el} value={el}>
-                        {el === "capital"
-                            ? "시가총액순"
-                            : el === "trade"
-                            ? "거래량순"
-                            : el === "change"
-                            ? "등락율순"
-                            : el}
-                    </DropdownBox>
-                ))}
-            </DropdownListBox>
-        </DropdownContainer>
-    );
+  return (
+    <DropdownContainer>
+      <DropdownListBox onChange={handleSelect}>
+        {dropList.map((el) => (
+          <DropdownBox key={el} value={el}>
+            {el === "capital"
+              ? "시가총액순"
+              : el === "trade"
+              ? "거래량순"
+              : el === "change"
+              ? "등락율순"
+              : el}
+          </DropdownBox>
+        ))}
+      </DropdownListBox>
+    </DropdownContainer>
+  );
 };
 
 export default Dropdown;
diff --git a/src/Component/Game/GameHeader.tsx b/src/Component/Game/GameHeader.tsx
@@ -25,7 +25,10 @@ const GameHeader: React.FC<GameHeaderProp> = ({ text }) => {
   return (
     <Container>
       <>{text}</>
-      {rule === "gameStocks" || rule === "total" || rule === "rank" ? (
+      {rule === "gameStocks" ||
+      rule === "result" ||
+      rule === "rank" ||
+      rule === "info" ? (
         <></>
       ) : (
         <RuleModal />