"Fix JS icon 404 issue and add copy button to homepage code display"

docs/start/usage.md

@@ -9,7 +9,7 @@ sidebar_position: 1
 ```java
 import java.util.List;
 import java.util.Arrays;
-import io.fury.*;
+import org.apache.fury.*;
 
 public class Example {
   public static void main(String[] args) {
@@ -36,7 +36,7 @@ public class Example {
 
 ```java
 import com.google.common.collect.ImmutableMap;
-import io.fury.*;
+import org.apache.fury.*;
 
 import java.util.Map;
 

src/components/HomePageLanguageCard/index.tsx

@@ -15,44 +15,63 @@ export const HomePageLanguageCard = () => (
         boxShadow: "0 4px 8px rgba(0, 0, 0, 0.1)",
       }}
     >
-      <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href =
-          "https://fury.apache.org/docs/start/usage/#java-serialization";
-      }}>
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#java-serialization";
+        }}
+      >
         <img src="..//java.svg" style={imageStyle} />
         Java
       </Card.Grid>
-      <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href =
-          "https://fury.apache.org/docs/start/usage/#python";
-      }}>
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#python";
+        }}
+      >
         <img src="..//python.svg" style={imageStyle} />
         Python
       </Card.Grid>
-        <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href =
-          "https://fury.apache.org/docs/start/usage/#golang";
-      }}>
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#golang";
+        }}
+      >
         <img src="..//golang.svg" style={imageStyle} />
         Golang
       </Card.Grid>
-        <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href =
-          "https://fury.apache.org/docs/start/usage/#javascript";
-      }}>
-        <img src="..//javascript.svg" style={imageStyle} />
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#javascript";
+        }}
+      >
+        <img src="..//JavaScript.svg" style={imageStyle} />
         JavaScript
       </Card.Grid>
-        <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href = "https://fury.apache.org/docs/start/usage/#rust";
-      }}>
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#rust";
+        }}
+      >
         <img src="..//Rust.svg" style={imageStyle} />
         Rust
       </Card.Grid>
-      <Card.Grid style={gridStyle} onClick={() => {
-        window.location.href =
-          "https://fury.apache.org/docs/start/usage/#crosslanguage-serialization";
-      }}>
+      <Card.Grid
+        style={gridStyle}
+        onClick={() => {
+          window.location.href =
+            "https://fury.apache.org/docs/start/usage/#crosslanguage-serialization";
+        }}
+      >
         <img src="..//more.svg" style={imageStyle} />
         More
       </Card.Grid>

src/components/HomepageCode/index.tsx

@@ -1,8 +1,9 @@
-import React from "react";
+import React, { useState } from "react";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { dracula } from "react-syntax-highlighter/dist/esm/styles/prism";
 
 export const HomepageCodeDisplay = () => {
+  const [copySuccess, setCopySuccess] = useState("");
   const codeString = `import java.util.List;
 import java.util.Arrays;
 import org.apache.fury.*;
@@ -28,6 +29,18 @@ public class Example {
 }
   `;
 
+  const copyToClipboard = () => {
+    navigator.clipboard.writeText(codeString).then(
+      () => {
+        setCopySuccess("Copied!");
+        setTimeout(() => setCopySuccess(""), 2000); // 清除复制成功的提示
+      },
+      (err) => {
+        setCopySuccess("Failed to copy!");
+      }
+    );
+  };
+
   return (
     <>
       <div
@@ -49,14 +62,32 @@ public class Example {
         </div>
         <div
           style={{
+            position: "relative", // 为绝对定位的按钮提供相对参考
             padding: "12px",
             justifyContent: "flex-end",
             backgroundColor: "#2d2d2d",
             borderRadius: "5px",
-            width: "50%", 
-            height: "auto", 
+            width: "50%",
+            height: "auto",
           }}
         >
+          {/* 复制按钮 */}
+          <button
+            onClick={copyToClipboard}
+            style={{
+              position: "absolute",
+              top: "10px",
+              right: "10px",
+              backgroundColor: "#444",
+              color: "#fff",
+              border: "none",
+              borderRadius: "5px",
+              padding: "5px 10px",
+              cursor: "pointer",
+            }}
+          >
+            {copySuccess ? copySuccess : "Copy"}
+          </button>
           <SyntaxHighlighter
             language="java"
             style={dracula}