bump version to 1.5

components/ServerInfo.tsx

@@ -32,6 +32,8 @@ export default function ServerInfo({ data }: { data: ServerData }) {
             Internal Network
           </h2>
         </div>
+
+        {data.ip && (
           <div className="flex items-center space-x-3">
             <ServerIcon className="w-6 h-6 text-yellow-400 flex-shrink-0" />
             <div>
@@ -39,6 +41,17 @@ export default function ServerInfo({ data }: { data: ServerData }) {
               <p className="font-medium">{data.ip}</p>
             </div>
           </div>
+        )}
+
+        {data.hostname && (
+          <div className="flex items-center space-x-3">
+            <LinkIcon className="w-6 h-6 text-green-400 flex-shrink-0" />
+            <div>
+              <p className="text-sm text-gray-400">Hostname</p>
+              <p className="font-medium break-all">{data.hostname}</p>
+            </div>
+          </div>
+        )}
       </div>
     );
   }

hooks/useTabData.ts

@@ -1,7 +1,11 @@
-import { useState, useEffect } from 'react';
-import browser from 'webextension-polyfill';
-import { isPrivateIP } from '@/utils';
-import { FetchServerInfoRequest, FetchServerInfoResponse, ServerData } from '@/utils/model';
+import { useState, useEffect } from 'react'
+import { isPrivateIP } from '@/utils'
+import {
+  FetchServerInfoRequest,
+  FetchServerInfoResponse,
+  ServerData,
+} from '@/utils/model'
+import browser from 'webextension-polyfill'
 
 export function useTabData() {
   const [data, setData] = useState<ServerData | null>(null)
@@ -39,7 +43,7 @@ export function useTabData() {
           return setData({
             origin: '',
             ip: hostname,
-            hostname: url.href,
+            hostname: '',
             country: '',
             city: '',
             org: '',
@@ -48,7 +52,10 @@ export function useTabData() {
           })
         }
 
-        const response = await browser.runtime.sendMessage<FetchServerInfoRequest, FetchServerInfoResponse>({
+        const response = await browser.runtime.sendMessage<
+          FetchServerInfoRequest,
+          FetchServerInfoResponse
+        >({
           type: 'FETCH_SERVER_INFO',
           hostname: hostname,
         })
@@ -58,7 +65,16 @@ export function useTabData() {
         }
 
         if (response.error) {
-          throw new Error(response.error)
+          return setData({
+            origin: '',
+            ip: '',
+            hostname: hostname,
+            country: '',
+            city: '',
+            org: '',
+            isLocal: true,
+            isBrowserResource: false,
+          })
         }
 
         if (!response.data?.ip) {
@@ -68,7 +84,7 @@ export function useTabData() {
         setData(response.data)
         setError(null)
       } catch (err) {
-        setError(err instanceof Error ? err.message : 'Failed to fetch data')
+        setError(err instanceof Error ? err.message : 'No data found')
         setData(null)
       } finally {
         setLoading(false)

package.json

@@ -2,7 +2,7 @@
   "name": "hostinfo",
   "description": "Receive information of a domain directly in the browser when browsing a website",
   "private": true,
-  "version": "1.3",
+  "version": "1.5",
   "type": "module",
   "scripts": {
     "dev": "wxt",

wxt.config.ts

@@ -2,11 +2,13 @@ import { defineConfig } from 'wxt'
 import tailwindcss from '@tailwindcss/vite'
 
 export default defineConfig({
-  extensionApi: 'webextension-polyfill',
   modules: ['@wxt-dev/module-react'],
   manifest: {
-    permissions: ['tabs', 'activeTab', 'webRequest'],
-    host_permissions: ['https://ip.albert.lol/*', 'https://dns.google/*'],
+    permissions: ['tabs', 'activeTab'],
+    host_permissions: [
+      'https://ip.albert.lol/*',
+      'https://cloudflare-dns.com/*',
+    ],
     action: {
       default_title: 'Host Info',
     },