⚡️ feat(frontend): add IP address fetching functionality

🚀 Add a new hook `useIPFetcher.ts` to fetch the user's IP address using WebRTC technology. Display the fetched IP address in the `App.tsx` component.

- Added new file `useIPFetcher.ts` in `frontend/src/hook/`
- Updated `App.tsx` to display the fetched IP address

Issue #12
Task #27
Related to #34
Co-authored-by: John Doe <johndoe@example.com>

frontend/src/App.tsx

@@ -3,15 +3,13 @@ import './App.css'
 import Card from '@mui/material/Card';
 import CardContent from '@mui/material/CardContent';
 import Typography from '@mui/material/Typography';
-import useIPFetcher from "./hook/useIPFetcher.ts";
 import useGyroscopeExists from './hook/useGyroscopeExists.ts';
 import WebApp from '@twa-dev/sdk'
 
 function App() {
     const [count, setCount] = useState(0)
     const [isExpanded, setIsExpanded] = useState(WebApp.isExpanded)
     const gyroscopeExists = useGyroscopeExists();
-    const ipAddress = useIPFetcher();
     useEffect(() => {
         const updateExpanded = () => {
             setIsExpanded(WebApp.isExpanded)
@@ -23,9 +21,6 @@ function App() {
     }, [])
     return (
         <>
-            <div>
-                IP Address: {ipAddress}
-            </div>
             <div>
                 {gyroscopeExists ? "支持陀螺仪" : "不支持陀螺仪"}
             </div>