fix: fix ip string isn't pure

src/pages/Requests/components/RequestModal.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback } from 'react'
+import React, { useCallback, useMemo } from 'react'
 import { toast } from 'react-hot-toast'
 import { useTranslation } from 'react-i18next'
 import { css } from '@emotion/react'
@@ -25,7 +25,7 @@ import {
   TabsTrigger,
 } from '@/components/ui/tabs'
 import { RequestItem } from '@/types'
-import { isFalsy, isTruthy } from '@/utils'
+import { isFalsy, isTruthy, onlyIP } from '@/utils'
 import fetcher from '@/utils/fetcher'
 
 import MethodBadge from './MethodBadge'
@@ -66,6 +66,11 @@ const RequestModal: React.FC<RequestModalProps> = ({ req, ...props }) => {
     [t],
   )
 
+  const pureIP = useMemo(
+    () => req?.remoteAddress && onlyIP(req.remoteAddress),
+    [req?.remoteAddress],
+  )
+
   const content = req ? (
     <>
       <DialogHeader>
@@ -153,7 +158,7 @@ const RequestModal: React.FC<RequestModalProps> = ({ req, ...props }) => {
                     <div>{t('requests.remote_ip')}</div>
                     <div>
                       <a
-                        href={`https://ip.sb/ip/${req.remoteAddress}`}
+                        href={`https://ip.sb/ip/${pureIP}`}
                         target="_blank"
                         rel="noreferrer noopener"
                       >

src/pages/Scripting/Evaluate/index.tsx

@@ -1,7 +1,6 @@
 import React, { lazy, Suspense, useCallback, useState } from 'react'
 import { toast } from 'react-hot-toast'
 import { useTranslation } from 'react-i18next'
-import { css } from '@emotion/react'
 import { LifeBuoy } from 'lucide-react'
 
 import CodeContent from '@/components/CodeContent'

src/utils/index.ts

@@ -16,3 +16,17 @@ export const forceRefresh = async (): Promise<void> => {
 
   window.location.reload()
 }
+
+/**
+ *  The following IP formats can be handled:
+ *  1.1.1.1(Proxy),
+ *  1.1.1.1 (Proxy),
+ *  2001:0db8:85a3:0000:0000:8a2e:0370:7334(Proxy),
+ *  2001:0db8:85a3:0000:0000:8a2e:0370:7334 (Proxy),
+ */
+export const onlyIP = (ip: string) => {
+  const ipAddressRegex =
+    /(?:\d{1,3}\.){3}\d{1,3}|(?:[0-9a-fA-F]{1,4}:){7}[0-9a-fA-F]{1,4}/g
+  const matchArray = ip.match(ipAddressRegex)
+  return matchArray?.length ? matchArray[0] : ip
+}