From 937670bfea8a4e3f7f2ef2d20a115949d156f2bd Mon Sep 17 00:00:00 2001
From: p-sw <shinwoo.park@psw.kr>
Date: Tue, 11 Jun 2024 19:31:25 +0900
Subject: [PATCH] style(react): update Code component styling

Changed the styling of Code component in the 'LoadedCode.tsx' file. Specifically, the scrollbar was removed, and the types for the forwardRef function were restructured for improved code readability.
---
 packages/react/src/components/LoadedCode.tsx | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/react/src/components/LoadedCode.tsx b/packages/react/src/components/LoadedCode.tsx
index 56e0203..4363438 100644
--- a/packages/react/src/components/LoadedCode.tsx
+++ b/packages/react/src/components/LoadedCode.tsx
@@ -1,4 +1,4 @@
-import {forwardRef, useEffect, useState} from "react";
+import { forwardRef, useEffect, useState } from "react";
 import SyntaxHighlighter from "react-syntax-highlighter";
 import { gruvboxDark } from "react-syntax-highlighter/dist/cjs/styles/hljs";
 import { Button } from "@components/Button";
@@ -63,7 +63,7 @@ export const LoadedCode = ({
       <SyntaxHighlighter
         language="typescript"
         style={gruvboxDark}
-        className={`w-full h-64 rounded-lg ${!state ? "animate-pulse" : ""}`}
+        className={`w-full h-64 rounded-lg ${!state ? "animate-pulse" : ""} scrollbar-none`}
         customStyle={{ padding: "1rem" }}
       >
         {state ?? ""}
@@ -72,11 +72,10 @@ export const LoadedCode = ({
   );
 };
 
-export const Code = forwardRef<HTMLDivElement, { children: string; className?: string; language: string }>(({
-  children,
-  className,
-  language,
-}, ref) => {
+export const Code = forwardRef<
+  HTMLDivElement,
+  { children: string; className?: string; language: string }
+>(({ children, className, language }, ref) => {
   const { toast } = useToast();
 
   return (
@@ -109,7 +108,7 @@ export const Code = forwardRef<HTMLDivElement, { children: string; className?: s
       <SyntaxHighlighter
         language={language}
         style={gruvboxDark}
-        className={`w-full h-auto max-h-64 rounded-lg`}
+        className={`w-full h-auto max-h-64 rounded-lg scrollbar-none`}
         customStyle={{ padding: "1rem" }}
       >
         {children}