From 6281a0d467e61bd7543edbc5d6df945faa39f61f Mon Sep 17 00:00:00 2001
From: suvodip ghosh <suvodip@cs1.hz>
Date: Thu, 26 Jun 2025 14:22:38 +0000
Subject: [PATCH 1/2] add live record function in speech to text

---
 .gitignore                                    |   2 +
 astro.config.mjs                              |   6 +-
 edit.js                                       |  25 +
 env_sample.txt                                |  24 +
 fix-php-tags-and-decode.cjs                   |  59 ++
 package-lock.json                             | 673 ++++++++++++++++++
 package.json                                  |   3 +-
 src/components/AvatarUpload.tsx               |   7 +-
 src/components/BillingInfo.jsx                |   4 +-
 src/components/BuyServices/BuyVPN.jsx         |   8 +-
 src/components/BuyServices/NewDroplet.jsx     |   3 +-
 .../BuyServices/NewHetznerCloudInstance.jsx   |  16 +-
 .../BuyServices/NewKubernetisUtho.jsx         |  10 +-
 .../BuyServices/NewUthoCloudInstance.jsx      |  12 +-
 src/components/BuyServices/STTStreaming.jsx   |   4 +-
 src/components/CommentWithMD.jsx              |   6 +-
 src/components/ContactForm.jsx                |   5 +-
 src/components/DomainSetupForm.jsx            |  11 +-
 src/components/DomainSetupForm_old.jsx        |  13 +-
 src/components/Login.tsx                      |  10 +-
 src/components/MakePayment.jsx                |   8 +-
 src/components/Manager/AllCustomerList.jsx    |   8 +-
 src/components/Manager/AllSellingList.jsx     |  10 +-
 src/components/Manager/HetznerList.jsx        |   8 +-
 src/components/Manager/ViewAsUser.jsx         |   5 +-
 src/components/MyTopic.jsx                    |   3 +-
 src/components/NewTopic copy.jsx              |   8 +-
 src/components/NewTopic.jsx                   |   9 +-
 src/components/PasswordUpdateCard.tsx         |   3 +-
 src/components/PaymentSuccessfully.jsx        |   9 +-
 src/components/SignupPage.tsx                 |   6 +-
 src/components/Ticket.tsx                     |  14 +-
 src/components/Tools/AudioToText.jsx          | 564 +++++++++++++--
 src/components/TopicEdit.jsx                  |  11 +-
 src/components/Topics.jsx                     |   7 +-
 src/components/UserProfile.tsx                |  13 +-
 src/lib/isLoggedIn.jsx                        |   5 +-
 src/pages/login_old.astro                     |   2 +-
 src/pages/services/index.astro                |   5 +-
 src/pages/test.astro                          |   9 +
 ...dio-to-text.astro => speech-to-text.astro} |   3 +-
 yarn.lock                                     | 396 ++++++++++-
 42 files changed, 1825 insertions(+), 182 deletions(-)
 create mode 100644 edit.js
 create mode 100644 env_sample.txt
 create mode 100644 fix-php-tags-and-decode.cjs
 create mode 100644 src/pages/test.astro
 rename src/pages/web-tools/{audio-to-text.astro => speech-to-text.astro} (99%)

diff --git a/.gitignore b/.gitignore
index 6965039..c88a975 100644
--- a/.gitignore
+++ b/.gitignore
@@ -25,3 +25,5 @@ pnpm-debug.log*
 .idea/
 
 .vscode/
+
+.env
diff --git a/astro.config.mjs b/astro.config.mjs
index 9bb85e6..570f7b4 100644
--- a/astro.config.mjs
+++ b/astro.config.mjs
@@ -4,13 +4,13 @@ import tailwind from '@astrojs/tailwind';
 import react from '@astrojs/react';
 
 export default defineConfig({
-  site: 'https://siliconpin.cs1.hz.siliconpin.com',
+  site: 'https://sp-dev-h1-astgsbchdykdvtf.siliconpin.com',
   integrations: [tailwind(), react()],
   
   // Vite-specific settings (including proxy)
   vite: {
     server: {
-      allowedHosts: ['siliconpin.cs1.hz.siliconpin.com'],
+      allowedHosts: ['sp-dev-h1-astgsbchdykdvtf.siliconpin.com'],
       proxy: {
         '/api': {
           target: 'http://localhost:8080',  // Your backend server
@@ -21,7 +21,7 @@ export default defineConfig({
       }
     },
     preview: {
-      allowedHosts: ['siliconpin.cs1.hz.siliconpin.com'],
+      allowedHosts: ['sp-dev-h1-astgsbchdykdvtf.siliconpin.com'],
     }
   },
 
diff --git a/edit.js b/edit.js
new file mode 100644
index 0000000..fb1955c
--- /dev/null
+++ b/edit.js
@@ -0,0 +1,25 @@
+<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="generator" content="Astro v5.5.2"><!-- SEO Meta Tags --><title>Profile Page</title><meta name="description"><meta name="keywords" content="hosting, PHP hosting, Node.js hosting, Python hosting, Kubernetes, K8s, K3s, cloud services, web hosting, application hosting, server hosting, India hosting"><meta name="author" content="SiliconPin"><link rel="canonical" href="https://siliconpin.cs1.hz.siliconpin.com/profile/"><meta name="keywords"><!-- Open Graph / Facebook --><meta property="og:type" content="website"><meta property="og:url" content="https://siliconpin.cs1.hz.siliconpin.com/profile/"><meta property="og:title" content="Profile Page"><meta property="og:description"><meta property="og:image"><meta property="og:site_name" content="SiliconPin"><!-- Twitter --><meta property="twitter:card" content="summary_large_image"><meta property="twitter:url" content="https://siliconpin.cs1.hz.siliconpin.com/profile/"><meta property="twitter:title" content="Profile Page"><meta property="twitter:description"><meta property="twitter:image"><!-- Favicon --><link rel="icon" type="image/svg+xml" href="https://siliconpin.com/assets/logo.svg"><link rel="apple-touch-icon" href="https://siliconpin.com/assets/logo.svg"><!-- Structured Data --><script type="application/ld+json"></script><script type="application/ld+json"></script><script type="application/ld+json"></script><script type="application/ld+json"></script><script type="application/ld+json"></script><!-- For markdown editor css --><link rel="stylesheet" href="/assets/md-editor/mdeditor.css"><link rel="stylesheet" href="/_astro/about-us.aZrR1fYk.css">
+    <link rel="stylesheet" href="/_astro/about-us.Dc7kD0_k.css"></head> <body class="min-h-screen flex flex-col"> <!-- Top header - visible on all devices --> <header class="py-3 sm:py-4 px-4 sm:px-6 border-b border-neutral-700" style="background-color: #262626;"> <div class="container mx-auto flex justify-between items-center"> <a href="/" class="flex items-center gap-2" aria-label="SiliconPin Home"> <img src="https://siliconpin.com/assets/logo.svg" alt="SiliconPin Logo" class="w-6 h-6 sm:w-8 sm:h-8"> <span class="text-lg sm:text-xl font-bold text-[#6d9e37]">SiliconPin</span> </a> <!-- Desktop navigation --> <nav class="hidden md:flex items-center gap-6" aria-label="Main Navigation"> <a href="/" class="hover:text-[#6d9e37] transition-colors">Home</a> <!-- <a href="/services" class="hover:text-[#6d9e37] transition-colors">Services</a> --> <a href="/topic" class="hover:text-[#6d9e37] transition-colors">Topic</a> <a href="/contact" class="hover:text-[#6d9e37] transition-colors">Contact</a> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();;(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>1/0*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><astro-island uid="RPciP" prefix="r1" component-url="/_astro/LoginOrProfile.DD-S8988.js" component-export="default" renderer-url="/_astro/client.DIT5wkbX.js" props="{&quot;deviceType&quot;:[0,&quot;desktop&quot;]}" ssr client="load" opts="{&quot;name&quot;:&quot;LoginProfile&quot;,&quot;value&quot;:true}" await-children><p class="w-6 animate-pulse hover:text-[#6d9e37] transition-colors"></p><!--astro:end--></astro-island> <!-- <a href="/profile" class="hover:text-[#6d9e37] transition-colors"></a> --> <a href="/services" class="inline-flex items-center justify-center rounded-md bg-[#6d9e37] px-4 py-2 text-sm font-medium text-white hover:bg-[#598035] transition-colors">Services</a> </nav> <!-- Mobile menu button --> <div class="md:hidden relative"> <button id="mobileMenuBtn" class="text-[#c7ccd5] p-1 hover:text-white" aria-label="Toggle Menu"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" y1="12" x2="20" y2="12"></line><line x1="4" y1="6" x2="20" y2="6"></line><line x1="4" y1="18" x2="20" y2="18"></line></svg> </button> <!-- Mobile dropdown menu --> <div id="mobileMenu" class="absolute right-0 mt-2 w-48 bg-neutral-800 rounded-md shadow-lg py-1 z-50 hidden border border-neutral-700"> <a href="/" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Home</a> <!-- <a href="/services" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Services</a> --> <a href="/topic" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Topic</a> <a href="/contact" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Contact</a> <a href="/about-us" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">About Us</a> <a href="/services" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700 font-medium text-[#6d9e37]">Services</a> <a href="/suggestion-or-report" class="block px-4 py-2 text-sm text-white hover:bg-neutral-700">Suggestion or Report</a> </div> </div> </div> </header> <main class="flex-grow pb-16 md:pb-0">  <astro-island uid="2hgm7z" prefix="r0" component-url="/_astro/UserProfile.BaBrrD3Q.js" component-export="default" renderer-url="/_astro/client.DIT5wkbX.js" props="{}" ssr client="load" opts="{&quot;name&quot;:&quot;UserProfile&quot;,&quot;value&quot;:true}" await-children><div style="display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;width:100%"><div style="display:flex;justify-content:center;align-items:center;margin-bottom:16px"><div style="width:12px;height:12px;margin:0 4px;background-color:#6d9e37;border-radius:50%;display:inline-block;animation:bounce 1.4s infinite ease-in-out both;animation-delay:-0.32s"></div><div style="width:12px;height:12px;margin:0 4px;background-color:#6d9e37;border-radius:50%;display:inline-block;animation:bounce 1.4s infinite ease-in-out both;animation-delay:-0.16s"></div><div style="width:12px;height:12px;margin:0 4px;background-color:#6d9e37;border-radius:50%;display:inline-block;animation:bounce 1.4s infinite ease-in-out both"></div></div><p style="color:#6d9e37;font-size:1rem;font-weight:500">Loading...</p></div><!--astro:end--></astro-island>  </main> <footer class="border-t border-neutral-700 mt-8 sm:mt-12 md:mb-0 mb-16"> <!-- Copyright and social links section with #262626 background --> <div class="py-6 sm:py-8 px-4 sm:px-6" style="background-color: #262626;"> <div class="container mx-auto"> <div class="flex flex-col sm:flex-row justify-between items-center gap-4"> <div class="flex items-center gap-3"> <img src="https://siliconpin.com/assets/logo.svg" alt="SiliconPin Logo" class="w-7 h-7 sm:w-8 sm:h-8"> <span class="text-sm sm:text-base">&copy; 2025 SiliconPin. All rights reserved.</span> </div> <div class="hidden sm:block"> <a href="/suggestion-or-report" class="text-[#6d9e37] hover:text-white transition-colors">Suggestion or Report</a> </div> <div class="flex gap-5 mt-4 sm:mt-0"> <a href="https://www.linkedin.com/company/siliconpin" aria-label="LinkedIn" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect x="2" y="9" width="4" height="12"></rect><circle cx="4" cy="4" r="2"></circle></svg> </a> <a href="https://x.com/dwd_consultancy?t=MBvjcclvVgCPdIHspV9HWQ&s=09" aria-label="X (Twitter)" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <path d="M4 4l11.733 16h4.267l-11.733 -16z"></path> <path d="M4 20l6.768 -6.768m2.46 -2.46l6.772 -6.772"></path> </svg> </a> <a href="https://www.facebook.com/profile.php?id=100088549643337&mibextid=ZbWKwL" aria-label="Facebook" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg> </a> <a href="https://instagram.com/siliconpin.com_?igshid=OGQ5ZDc2ODk2ZA==" aria-label="Instagram" class="text-[#6d9e37] hover:text-white transition-colors" target="_blank" rel="noopener"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect><path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path><line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line></svg> </a> </div> </div> </div> </div> <!-- Footer links section with main background --> <div class="py-10 px-4 sm:px-6"> <div class="container mx-auto"> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6"> <!-- Services column - Card Style --> <div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg"> <h3 class="font-medium text-lg text-[#6d9e37] mb-4 pb-2 border-b border-[#6d9e37]">Services</h3> <ul class="space-y-2 text-neutral-400"> <!-- <li class="flex items-center gap-2">📦 <a href="/services" class="hover:text-[#6d9e37] transition-colors">All Services</a></li> --> <li class="flex items-center gap-2">🚀 <a href="/services" class="hover:text-[#6d9e37] transition-colors">Services</a></li> <li class="flex items-center gap-2">👨‍💻 <a href="/hire-developer" class="hover:text-[#6d9e37] transition-colors">Hire a Human Developer</a></li> <li class="flex items-center gap-2">🤖 <a href="/hire-ai-agent" class="hover:text-[#6d9e37] transition-colors">Hire an AI Agent</a></li> </ul> </div> <!-- Company column - Card Style --> <div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg"> <h3 class="font-medium text-lg text-[#6d9e37] mb-4 pb-2 border-b border-[#6d9e37]">Company</h3> <ul class="space-y-2 text-neutral-400"> <li class="flex items-center gap-2">🏢 <a href="/about-us" class="hover:text-[#6d9e37] transition-colors">About Us</a></li> <li class="flex items-center gap-2">📞 <a href="/contact" class="hover:text-[#6d9e37] transition-colors">Contact</a></li> <li class="flex items-center gap-2">💼 <a href="/careers" class="hover:text-[#6d9e37] transition-colors">Careers</a></li> <li class="flex items-center gap-2">🤝 <a href="/partners" class="hover:text-[#6d9e37] transition-colors">Partners</a></li> </ul> </div> <!-- Legal column - Card Style --> <div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg"> <h3 class="font-medium text-lg text-[#6d9e37] mb-4 pb-2 border-b border-[#6d9e37]">Legal</h3> <ul class="space-y-2 text-neutral-400"> <li class="flex items-center gap-2">🔒 <a href="/privacy-policy" class="hover:text-[#6d9e37] transition-colors">Privacy Policy</a></li> <li class="flex items-center gap-2">📜 <a href="/terms-and-conditions" class="hover:text-[#6d9e37] transition-colors">Terms & Conditions</a></li> <li class="flex items-center gap-2">💸 <a href="/refund-policy" class="hover:text-[#6d9e37] transition-colors">Refund Policy</a></li> <li class="flex items-center gap-2">⚖️ <a href="/legal-agreement" class="hover:text-[#6d9e37] transition-colors">Legal Agreement</a></li> <li class="flex items-center gap-2">📢 <a href="/suggestion-or-report" class="hover:text-[#6d9e37] transition-colors">Suggestion or Report</a></li> </ul> </div> <!-- Contact column - Card Style --> <div class="bg-neutral-800 p-5 rounded-lg border border-neutral-700 shadow-lg"> <h3 class="font-medium text-lg text-[#6d9e37] mb-4 pb-2 border-b border-[#6d9e37]">Contact Us</h3> <address class="not-italic space-y-2 text-neutral-400"> <p class="flex items-center gap-2">📍 121 Lalbari, GourBongo Road</p> <p class="flex items-center gap-2">🏠 Habra, W.B. 743271, India</p> <p class="flex items-center gap-2">📞 <a href="tel:+917001601485" class="text-[#6d9e37] hover:underline">+91-700-160-1485</a></p> <p class="flex items-center gap-2">✉️ <a href="mailto:contact@siliconpin.com" class="text-[#6d9e37] hover:underline">contact@siliconpin.com</a></p> </address> </div> </div> </div> </div> </footer> <!-- Mobile bottom navigation - positioned last in the DOM --> <nav class="fixed bottom-0 left-0 right-0 md:hidden bg-[#262626] border-t border-neutral-700 shadow-lg z-50"> <div class="flex justify-around items-center h-16"> <a href="/" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg> <span class="text-xs mt-1">Home</span> </a> <a href="/topic" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors"> <!-- <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg> --> <svg fill="#6d9e37" width="20" height="20" viewBox="-4 -2 24 24" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin" class="jam jam-document-f"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M3 0h10a3 3 0 0 1 3 3v14a3 3 0 0 1-3 3H3a3 3 0 0 1-3-3V3a3 3 0 0 1 3-3zm1 7a1 1 0 1 0 0 2h8a1 1 0 0 0 0-2H4zm0 8a1 1 0 0 0 0 2h5a1 1 0 0 0 0-2H4zM4 3a1 1 0 1 0 0 2h8a1 1 0 0 0 0-2H4zm0 8a1 1 0 0 0 0 2h8a1 1 0 0 0 0-2H4z"></path></g></svg> <span class="text-xs mt-1">Topic</span> </a> <a href="/services" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors"> <div class="w-10 h-10 rounded-full bg-[#6d9e37] flex items-center justify-center -mt-5 shadow-lg"> <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg> </div> <span class="text-xs mt-1">Services</span> </a> <a href="/about-us" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors"> <svg width="20px" height="20px" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="#6d9e37"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title>about</title> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="about-white" fill="#6d9e37" transform="translate(42.666667, 42.666667)"> <path d="M213.333333,3.55271368e-14 C95.51296,3.55271368e-14 3.55271368e-14,95.51168 3.55271368e-14,213.333333 C3.55271368e-14,331.153707 95.51296,426.666667 213.333333,426.666667 C331.154987,426.666667 426.666667,331.153707 426.666667,213.333333 C426.666667,95.51168 331.154987,3.55271368e-14 213.333333,3.55271368e-14 Z M213.333333,384 C119.227947,384 42.6666667,307.43872 42.6666667,213.333333 C42.6666667,119.227947 119.227947,42.6666667 213.333333,42.6666667 C307.44,42.6666667 384,119.227947 384,213.333333 C384,307.43872 307.44,384 213.333333,384 Z M240.04672,128 C240.04672,143.46752 228.785067,154.666667 213.55008,154.666667 C197.698773,154.666667 186.713387,143.46752 186.713387,127.704107 C186.713387,112.5536 197.99616,101.333333 213.55008,101.333333 C228.785067,101.333333 240.04672,112.5536 240.04672,128 Z M192.04672,192 L234.713387,192 L234.713387,320 L192.04672,320 L192.04672,192 Z" id="Shape"></path> </g> </g> </g></svg> <span class="text-xs mt-1">About</span> </a> <div class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors"> <astro-island uid="13QXw5" prefix="r2" component-url="/_astro/LoginOrProfile.DD-S8988.js" component-export="default" renderer-url="/_astro/client.DIT5wkbX.js" props="{&quot;deviceType&quot;:[0,&quot;mobile&quot;]}" ssr client="load" opts="{&quot;name&quot;:&quot;LoginProfile&quot;,&quot;value&quot;:true}" await-children><svg class="animate-spin flex flex-col items-center justify-center w-[45px] h-[45px] text-[#6d9e37] hover:text-white transition-colors" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="64px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve" fill="#6d9e37"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <g id="Download_x5F_25_x25_"> </g> <g id="Download_x5F_50_x25_"> </g> <g id="Download_x5F_75_x25_"> </g> <g id="Download_x5F_100_x25_"> </g> <g id="Upload"> </g> <g id="Next"> </g> <g id="Last"> </g> <g id="OK"> </g> <g id="Fail"> </g> <g id="Add"> </g> <g id="Spinner_x5F_0_x25_"> </g> <g id="Spinner_x5F_25_x25_"> <g> <path fill="none" stroke="#6d9e37" stroke-width="4" stroke-linejoin="round" stroke-miterlimit="10" d="M50.188,26.812 c12.806,0,23.188,10.381,23.188,23.188"></path> <g> <circle cx="73.375" cy="50" r="1.959"></circle> <circle cx="72.029" cy="57.704" r="1.959"></circle> <circle cx="68.237" cy="64.579" r="1.959"></circle> <circle cx="62.324" cy="69.759" r="1.959"></circle> <circle cx="55.013" cy="72.699" r="1.959"></circle> </g> <g> <ellipse transform="matrix(0.9968 -0.0794 0.0794 0.9968 -4.0326 2.3121)" cx="27.045" cy="51.843" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9968 -0.0794 0.0794 0.9968 -4.628 2.4912)" cx="28.998" cy="59.416" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9968 -0.0794 0.0794 0.9968 -5.1348 2.8556)" cx="33.325" cy="65.967" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9968 -0.0794 0.0794 0.9968 -5.4877 3.3713)" cx="39.63" cy="70.661" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9968 -0.0794 0.0794 0.9968 -5.6506 3.9762)" cx="47.152" cy="73.012" rx="1.959" ry="1.959"></ellipse> </g> <g> <ellipse transform="matrix(0.9962 -0.0867 0.0867 0.9962 -3.713 2.567)" cx="27.71" cy="44.049" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9962 -0.0867 0.0867 0.9962 -3.079 2.8158)" cx="30.892" cy="36.872" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9962 -0.0867 0.0867 0.9962 -2.567 3.266)" cx="36.334" cy="31.199" rx="1.959" ry="1.959"></ellipse> <ellipse transform="matrix(0.9962 -0.0867 0.0867 0.9962 -2.2318 3.8617)" cx="43.363" cy="27.636" rx="1.959" ry="1.959"></ellipse> </g> </g> </g> <g id="Spinner_x5F_50_x25_"> </g> <g id="Spinner_x5F_75_x25_"> </g> <g id="Brightest_x5F_25_x25_"> </g> <g id="Brightest_x5F_50_x25_"> </g> <g id="Brightest_x5F_75_x25_"> </g> <g id="Brightest_x5F_100_x25_"> </g> <g id="Reload"> </g> <g id="Forbidden"> </g> <g id="Clock"> </g> <g id="Compass"> </g> <g id="World"> </g> <g id="Speed"> </g> <g id="Microphone"> </g> <g id="Options"> </g> <g id="Chronometer"> </g> <g id="Lock"> </g> <g id="User"> </g> <g id="Position"> </g> <g id="No_x5F_Signal"> </g> <g id="Low_x5F_Signal"> </g> <g id="Mid_x5F_Signal"> </g> <g id="High_x5F_Signal"> </g> <g id="Options_1_"> </g> <g id="Flash"> </g> <g id="No_x5F_Signal_x5F_02"> </g> <g id="Low_x5F_Signal_x5F_02"> </g> <g id="Mid_x5F_Signal_x5F_02"> </g> <g id="High_x5F_Signal_x5F_02"> </g> <g id="Favorite"> </g> <g id="Search"> </g> <g id="Stats_x5F_01"> </g> <g id="Stats_x5F_02"> </g> <g id="Turn_x5F_On_x5F_Off"> </g> <g id="Full_x5F_Height"> </g> <g id="Full_x5F_Width"> </g> <g id="Full_x5F_Screen"> </g> <g id="Compress_x5F_Screen"> </g> <g id="Chat"> </g> <g id="Bluetooth"> </g> <g id="Share_x5F_iOS"> </g> <g id="Share_x5F_Android"> </g> <g id="Love__x2F__Favorite"> </g> <g id="Hamburguer"> </g> <g id="Flying"> </g> <g id="Take_x5F_Off"> </g> <g id="Land"> </g> <g id="City"> </g> <g id="Nature"> </g> <g id="Pointer"> </g> <g id="Prize"> </g> <g id="Extract"> </g> <g id="Play"> </g> <g id="Pause"> </g> <g id="Stop"> </g> <g id="Forward"> </g> <g id="Reverse"> </g> <g id="Next_1_"> </g> <g id="Last_1_"> </g> <g id="Empty_x5F_Basket"> </g> <g id="Add_x5F_Basket"> </g> <g id="Delete_x5F_Basket"> </g> <g id="Error_x5F_Basket"> </g> <g id="OK_x5F_Basket"> </g> </g></svg><!--astro:end--></astro-island> </div> <!-- <a href="/profile" class="flex flex-col items-center justify-center w-full h-full text-[#6d9e37] hover:text-white transition-colors">
+              <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="10" r="3"></circle><path d="M7 20.662V19c0-1.18.822-2.2 2-2.5a5.5 5.5 0 0 1 6 0c1.178.3 2 1.323 2 2.5v1.662"></path></svg>
+              <span class="text-xs mt-1">Profile</span>
+            </a> </div> </nav> <script>
+    // Mobile menu toggle functionality
+    document.addEventListener('DOMContentLoaded', function() {
+      const menuBtn = document.getElementById('mobileMenuBtn');
+      const mobileMenu = document.getElementById('mobileMenu');
+    
+      if (menuBtn && mobileMenu) {
+        menuBtn.addEventListener('click', function() {
+          mobileMenu.classList.toggle('hidden');
+        });
+    
+        // Close menu when clicking outside
+        document.addEventListener('click', function(event) {
+          if (!menuBtn.contains(event.target) && !mobileMenu.contains(event.target)) {
+            mobileMenu.classList.add('hidden');
+          }
+        });
+      }
+    });
+    
+    </script> </body></html>
\ No newline at end of file
diff --git a/env_sample.txt b/env_sample.txt
new file mode 100644
index 0000000..65d4c23
--- /dev/null
+++ b/env_sample.txt
@@ -0,0 +1,24 @@
+PUBLIC_USER_API_URL=https://host-api-sxashuasysagibx.siliconpin.com/v1/users/
+
+PUBLIC_SERVICE_API_URL=https://host-api-sxashuasysagibx.siliconpin.com/v1/services/
+
+PUBLIC_INVOICE_API_URL=https://host-api-sxashuasysagibx.siliconpin.com/v1/invoice/
+
+PUBLIC_MINIO_UPLOAD_URL=https://hostapi2.cs1.hz.siliconpin.com/api/storage/upload
+
+PUBLIC_HOST_API2_USERS=https://hostapi2.cs1.hz.siliconpin.com/api/users
+
+PUBLIC_TOPIC_API_URL=https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/
+
+PUBLIC_TICKET_API_URL=https://host-api-sxashuasysagibx.siliconpin.com/v1/ticket/index.php
+
+PUBLIC_HETZNER_API_KEY=uMSBR9nxdtbuvazsVM8YMMDd0PvuynpgJbmzFIO47HblMlh7tlHT8wV05sQ28Squ
+
+PUBLIC_UTHO_API_KEY=IoNXhkRJsQPyOEqFMceSfzuKaDLrpxUCATgZjiVdvYlBHbwWmGtn
+
+PUBLIC_DIGITALOCEAN_API_KEY=dop_v1_b6a075ece5786faf7c58d21761dbf95d47af372da062d68a870ce2a0bae51adf
+
+PUBLIC_POCKETBASE_URL=https://tst-pb.s38.siliconpin.com
+
+
+ENV_TYPE=DEV
\ No newline at end of file
diff --git a/fix-php-tags-and-decode.cjs b/fix-php-tags-and-decode.cjs
new file mode 100644
index 0000000..de3c427
--- /dev/null
+++ b/fix-php-tags-and-decode.cjs
@@ -0,0 +1,59 @@
+const fs = require('fs');
+const path = require('path');
+
+const buildDir = path.join(__dirname, 'dist');
+
+// Basic HTML entity decode
+function decodeHtmlEntities(str) {
+  return str
+    .replace(/&#(\d+);/g, (_, dec) => String.fromCharCode(dec))
+    .replace(/&quot;/g, '"')
+    .replace(/&apos;/g, "'")
+    .replace(/&amp;/g, '&')
+    .replace(/&lt;/g, '<')
+    .replace(/&gt;/g, '>');
+}
+
+// Decode both URI and HTML entities inside <?php ... ?>
+function decodePhpBlocks(content) {
+  return content.replace(/<\?php([\s\S]*?)\?>/g, (match, code) => {
+    try {
+      let decoded = decodeURIComponent(code);         // %XX to characters
+      decoded = decodeHtmlEntities(decoded);          // &#39; to '
+      return `<?php${decoded}?>`;
+    } catch (e) {
+      console.warn('⚠️ Decode failed for block:', code.trim().slice(0, 50), '...');
+      return match;
+    }
+  });
+}
+
+function fixPhpTagsInFile(filePath) {
+  let content = fs.readFileSync(filePath, 'utf-8');
+
+  // Step 1: Replace escaped tags
+  content = content
+    .replace(/&lt;\?php/g, '<?php')
+    .replace(/\?&gt;/g, '?>');
+
+  // Step 2: Decode content inside <?php ... ?>
+  content = decodePhpBlocks(content);
+
+  fs.writeFileSync(filePath, content, 'utf-8');
+  console.log(`✅ Processed: ${filePath}`);
+}
+
+function walkDir(dir) {
+  const entries = fs.readdirSync(dir, { withFileTypes: true });
+  for (const entry of entries) {
+    const fullPath = path.join(dir, entry.name);
+    if (entry.isDirectory()) {
+      walkDir(fullPath);
+    } else if (fullPath.endsWith('.html') || fullPath.endsWith('.php')) {
+      fixPhpTagsInFile(fullPath);
+    }
+  }
+}
+
+walkDir(buildDir);
+console.log('🎉 All PHP tag fixes, URL decodes, and HTML entity decodes complete.');
diff --git a/package-lock.json b/package-lock.json
index f36f7b2..6362697 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -41,6 +41,7 @@
         "react-simplemde-editor": "^5.2.0",
         "react-to-print": "^3.0.5",
         "rehype-rewrite": "^4.0.2",
+        "serve": "^14.2.4",
         "shadcn": "^2.5.0",
         "simplemde": "^1.11.2",
         "tailwind-merge": "^3.0.2",
@@ -4502,6 +4503,12 @@
         "vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
       }
     },
+    "node_modules/@zeit/schemas": {
+      "version": "2.36.0",
+      "resolved": "https://registry.npmjs.org/@zeit/schemas/-/schemas-2.36.0.tgz",
+      "integrity": "sha512-7kjMwcChYEzMKjeex9ZFXkt1AyNov9R5HZtjBKVsmVpw7pa7ZtlCGvCBC2vnnXctaYN+aRI61HjIqeetZW5ROg==",
+      "license": "MIT"
+    },
     "node_modules/@zxing/text-encoding": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz",
@@ -4515,6 +4522,19 @@
       "integrity": "sha512-d8XPSGjfyzlXC3Xx891DJRyZfqk5JU0BJrDQcsWomFIV1/BIzPW5HDH5iDdWpqWaav0YVIEzT1RHTwWr0FFshA==",
       "license": "MIT"
     },
+    "node_modules/accepts": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
+      "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "~2.1.34",
+        "negotiator": "0.6.3"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/acorn": {
       "version": "8.14.1",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz",
@@ -4551,6 +4571,22 @@
         "node": ">= 14"
       }
     },
+    "node_modules/ajv": {
+      "version": "8.12.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz",
+      "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
     "node_modules/ansi-align": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz",
@@ -4683,6 +4719,26 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/arch": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz",
+      "integrity": "sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/arg": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
@@ -5209,6 +5265,15 @@
         "node": ">=8.0.0"
       }
     },
+    "node_modules/bytes": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
+      "integrity": "sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/cacheable-lookup": {
       "version": "5.0.4",
       "resolved": "https://registry.npmjs.org/cacheable-lookup/-/cacheable-lookup-5.0.4.tgz",
@@ -5386,6 +5451,52 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/chalk-template": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/chalk-template/-/chalk-template-0.4.0.tgz",
+      "integrity": "sha512-/ghrgmhfY8RaSdeo43hNXxpoHAtxdbskUHjPpfqUWGttFgycUhYPGx3YZBCnUCvOa7Doivn1IZec3DEGFoMgLg==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk-template?sponsor=1"
+      }
+    },
+    "node_modules/chalk-template/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/chalk-template/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
     "node_modules/character-entities-html4": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/character-entities-html4/-/character-entities-html4-2.1.0.tgz",
@@ -5527,6 +5638,139 @@
         "node": ">= 12"
       }
     },
+    "node_modules/clipboardy": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/clipboardy/-/clipboardy-3.0.0.tgz",
+      "integrity": "sha512-Su+uU5sr1jkUy1sGRpLKjKrvEOVXgSgiSInwa/qeID6aJ07yh+5NWc3h2QfjHjBnfX4LhtFcuAWKUsJ3r+fjbg==",
+      "license": "MIT",
+      "dependencies": {
+        "arch": "^2.2.0",
+        "execa": "^5.1.1",
+        "is-wsl": "^2.2.0"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/clipboardy/node_modules/execa": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz",
+      "integrity": "sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==",
+      "license": "MIT",
+      "dependencies": {
+        "cross-spawn": "^7.0.3",
+        "get-stream": "^6.0.0",
+        "human-signals": "^2.1.0",
+        "is-stream": "^2.0.0",
+        "merge-stream": "^2.0.0",
+        "npm-run-path": "^4.0.1",
+        "onetime": "^5.1.2",
+        "signal-exit": "^3.0.3",
+        "strip-final-newline": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/execa?sponsor=1"
+      }
+    },
+    "node_modules/clipboardy/node_modules/human-signals": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz",
+      "integrity": "sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=10.17.0"
+      }
+    },
+    "node_modules/clipboardy/node_modules/is-docker": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+      "integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
+      "license": "MIT",
+      "bin": {
+        "is-docker": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/clipboardy/node_modules/is-stream": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
+      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/clipboardy/node_modules/is-wsl": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+      "integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+      "license": "MIT",
+      "dependencies": {
+        "is-docker": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/clipboardy/node_modules/mimic-fn": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
+      "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/clipboardy/node_modules/npm-run-path": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
+      "integrity": "sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==",
+      "license": "MIT",
+      "dependencies": {
+        "path-key": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/clipboardy/node_modules/onetime": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
+      "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
+      "license": "MIT",
+      "dependencies": {
+        "mimic-fn": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/clipboardy/node_modules/strip-final-newline": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz",
+      "integrity": "sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/cliui": {
       "version": "8.0.1",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
@@ -5742,6 +5986,72 @@
       "integrity": "sha512-L3sHRo1pXXEqX8VU28kfgUY+YGsk09hPqZiZmLacNib6XNTCM8ubYeT7ryXQw8asB1sKgcU5lkB7ONug08aB8w==",
       "license": "ISC"
     },
+    "node_modules/compressible": {
+      "version": "2.0.18",
+      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
+      "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": ">= 1.43.0 < 2"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/compression": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz",
+      "integrity": "sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==",
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "~1.3.5",
+        "bytes": "3.0.0",
+        "compressible": "~2.0.16",
+        "debug": "2.6.9",
+        "on-headers": "~1.0.2",
+        "safe-buffer": "5.1.2",
+        "vary": "~1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/compression/node_modules/debug": {
+      "version": "2.6.9",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "license": "MIT",
+      "dependencies": {
+        "ms": "2.0.0"
+      }
+    },
+    "node_modules/compression/node_modules/ms": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
+      "license": "MIT"
+    },
+    "node_modules/compression/node_modules/safe-buffer": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
+      "license": "MIT"
+    },
+    "node_modules/concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
+      "license": "MIT"
+    },
+    "node_modules/content-disposition": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz",
+      "integrity": "sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -5961,6 +6271,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/deep-extend": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
+      "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0.0"
+      }
+    },
     "node_modules/deepmerge": {
       "version": "4.3.1",
       "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
@@ -7081,6 +7400,15 @@
         "uncrypto": "^0.1.3"
       }
     },
+    "node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/has-property-descriptors": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
@@ -7808,6 +8136,12 @@
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
       "license": "ISC"
     },
+    "node_modules/ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "license": "ISC"
+    },
     "node_modules/inline-style-parser": {
       "version": "0.2.4",
       "resolved": "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.2.4.tgz",
@@ -8092,6 +8426,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-port-reachable": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-port-reachable/-/is-port-reachable-4.0.0.tgz",
+      "integrity": "sha512-9UoipoxYmSk6Xy7QFgRv2HDyaysmgSG75TFQs6S+3pDM7ZhKTF/bskZV+0UlABHzKjNVhPjYCLfeZUEg1wXxig==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/is-regex": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
@@ -8273,6 +8619,12 @@
       "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
       "license": "MIT"
     },
+    "node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "license": "MIT"
+    },
     "node_modules/json-stringify-safe": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
@@ -13069,6 +13421,15 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/negotiator": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
+      "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/neotraverse": {
       "version": "0.6.18",
       "resolved": "https://registry.npmjs.org/neotraverse/-/neotraverse-0.6.18.tgz",
@@ -13270,6 +13631,15 @@
         "ufo": "^1.5.4"
       }
     },
+    "node_modules/on-headers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz",
+      "integrity": "sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/once": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
@@ -13509,6 +13879,12 @@
       "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
       "license": "MIT"
     },
+    "node_modules/path-is-inside": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz",
+      "integrity": "sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==",
+      "license": "(WTFPL OR MIT)"
+    },
     "node_modules/path-key": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
@@ -13940,6 +14316,30 @@
       "integrity": "sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==",
       "license": "MIT"
     },
+    "node_modules/range-parser": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz",
+      "integrity": "sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/rc": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
+      "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
+      "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
+      "dependencies": {
+        "deep-extend": "^0.6.0",
+        "ini": "~1.3.0",
+        "minimist": "^1.2.0",
+        "strip-json-comments": "~2.0.1"
+      },
+      "bin": {
+        "rc": "cli.js"
+      }
+    },
     "node_modules/react": {
       "version": "19.0.0",
       "resolved": "https://registry.npmjs.org/react/-/react-19.0.0.tgz",
@@ -14360,6 +14760,28 @@
       "integrity": "sha512-8VhliFJAWRaUiVvREIiW2NXXTmHs4vMNnSzuJVhscgmGav3g9VDxLrQndI3dZZVVdp0ZO/5v0xmX516/7M9cng==",
       "license": "MIT"
     },
+    "node_modules/registry-auth-token": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.2.tgz",
+      "integrity": "sha512-JL39c60XlzCVgNrO+qq68FoNb56w/m7JYvGR2jT5iR1xBrUA3Mfx5Twk5rqTThPmQKMWydGmq8oFtDlxfrmxnQ==",
+      "license": "MIT",
+      "dependencies": {
+        "rc": "^1.1.6",
+        "safe-buffer": "^5.0.1"
+      }
+    },
+    "node_modules/registry-url": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
+      "integrity": "sha512-ZbgR5aZEdf4UKZVBPYIgaglBmSF2Hi94s2PcIHhRGFjKYu+chjJdYfHn4rt3hB6eCKLJ8giVIIfgMa1ehDfZKA==",
+      "license": "MIT",
+      "dependencies": {
+        "rc": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/rehype": {
       "version": "12.0.1",
       "resolved": "https://registry.npmjs.org/rehype/-/rehype-12.0.1.tgz",
@@ -16309,6 +16731,208 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/serve": {
+      "version": "14.2.4",
+      "resolved": "https://registry.npmjs.org/serve/-/serve-14.2.4.tgz",
+      "integrity": "sha512-qy1S34PJ/fcY8gjVGszDB3EXiPSk5FKhUa7tQe0UPRddxRidc2V6cNHPNewbE1D7MAkgLuWEt3Vw56vYy73tzQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@zeit/schemas": "2.36.0",
+        "ajv": "8.12.0",
+        "arg": "5.0.2",
+        "boxen": "7.0.0",
+        "chalk": "5.0.1",
+        "chalk-template": "0.4.0",
+        "clipboardy": "3.0.0",
+        "compression": "1.7.4",
+        "is-port-reachable": "4.0.0",
+        "serve-handler": "6.1.6",
+        "update-check": "1.5.4"
+      },
+      "bin": {
+        "serve": "build/main.js"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/serve-handler": {
+      "version": "6.1.6",
+      "resolved": "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.6.tgz",
+      "integrity": "sha512-x5RL9Y2p5+Sh3D38Fh9i/iQ5ZK+e4xuXRd/pGbM4D13tgo/MGwbttUk8emytcr1YYzBYs+apnUngBDFYfpjPuQ==",
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "3.0.0",
+        "content-disposition": "0.5.2",
+        "mime-types": "2.1.18",
+        "minimatch": "3.1.2",
+        "path-is-inside": "1.0.2",
+        "path-to-regexp": "3.3.0",
+        "range-parser": "1.2.0"
+      }
+    },
+    "node_modules/serve-handler/node_modules/brace-expansion": {
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/serve-handler/node_modules/mime-db": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz",
+      "integrity": "sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/serve-handler/node_modules/mime-types": {
+      "version": "2.1.18",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz",
+      "integrity": "sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "~1.33.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/serve-handler/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/serve-handler/node_modules/path-to-regexp": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-3.3.0.tgz",
+      "integrity": "sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==",
+      "license": "MIT"
+    },
+    "node_modules/serve/node_modules/boxen": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/boxen/-/boxen-7.0.0.tgz",
+      "integrity": "sha512-j//dBVuyacJbvW+tvZ9HuH03fZ46QcaKvvhZickZqtB271DxJ7SNRSNxrV/dZX0085m7hISRZWbzWlJvx/rHSg==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-align": "^3.0.1",
+        "camelcase": "^7.0.0",
+        "chalk": "^5.0.1",
+        "cli-boxes": "^3.0.0",
+        "string-width": "^5.1.2",
+        "type-fest": "^2.13.0",
+        "widest-line": "^4.0.1",
+        "wrap-ansi": "^8.0.1"
+      },
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/serve/node_modules/camelcase": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-7.0.1.tgz",
+      "integrity": "sha512-xlx1yCK2Oc1APsPXDL2LdlNP6+uu8OCDdhOBSVT279M/S+y75O30C2VuD8T2ogdePBBl7PfPF4504tnLgX3zfw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/serve/node_modules/chalk": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.0.1.tgz",
+      "integrity": "sha512-Fo07WOYGqMfCWHOzSXOt2CxDbC6skS/jO9ynEcmpANMoPrD+W1r1K6Vx7iNm+AQmETU1Xr2t+n8nzkV9t6xh3w==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/serve/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "license": "MIT"
+    },
+    "node_modules/serve/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/serve/node_modules/type-fest": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz",
+      "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==",
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=12.20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/serve/node_modules/widest-line": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-4.0.1.tgz",
+      "integrity": "sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==",
+      "license": "MIT",
+      "dependencies": {
+        "string-width": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/serve/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/set-cookie-parser": {
       "version": "2.7.1",
       "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz",
@@ -16768,6 +17392,15 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/strip-json-comments": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
+      "integrity": "sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/strnum": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/strnum/-/strnum-1.1.2.tgz",
@@ -16842,6 +17475,18 @@
         "node": ">= 8.0"
       }
     },
+    "node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/supports-preserve-symlinks-flag": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
@@ -17621,6 +18266,25 @@
         "browserslist": ">= 4.21.0"
       }
     },
+    "node_modules/update-check": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/update-check/-/update-check-1.5.4.tgz",
+      "integrity": "sha512-5YHsflzHP4t1G+8WGPlvKbJEbAJGCgw+Em+dGR1KmBUbr1J36SJBqlHLjR7oob7sco5hWHGQVcr9B2poIVDDTQ==",
+      "license": "MIT",
+      "dependencies": {
+        "registry-auth-token": "3.3.2",
+        "registry-url": "3.1.0"
+      }
+    },
+    "node_modules/uri-js": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
+      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "punycode": "^2.1.0"
+      }
+    },
     "node_modules/url-parse": {
       "version": "1.5.10",
       "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
@@ -17711,6 +18375,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/vary": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/vfile": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
diff --git a/package.json b/package.json
index aac5da3..aff4ba7 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "build": "astro build",
     "preview": "astro preview --port 4000",
     "astro": "astro",
-    "push-prod": "rsync -rv --exclude .hta_config/conf.php dist/ u2@siliconpin.com:~/web/siliconpin.com/public_html/",
+    "push-prod": "rsync -rv --exclude .hta_config/conf.php dist/ sp@siliconpin.com:~/web/siliconpin.com/public_html/",
     "proxy": "http://localhost:8080"
   },
   "dependencies": {
@@ -44,6 +44,7 @@
     "react-simplemde-editor": "^5.2.0",
     "react-to-print": "^3.0.5",
     "rehype-rewrite": "^4.0.2",
+    "serve": "^14.2.4",
     "shadcn": "^2.5.0",
     "simplemde": "^1.11.2",
     "tailwind-merge": "^3.0.2",
diff --git a/src/components/AvatarUpload.tsx b/src/components/AvatarUpload.tsx
index eb5fa3b..5268a16 100644
--- a/src/components/AvatarUpload.tsx
+++ b/src/components/AvatarUpload.tsx
@@ -5,8 +5,9 @@ import { Label } from "./ui/label";
 import { X } from "lucide-react";
 import PocketBase from 'pocketbase';
 
-const pb = new PocketBase('https://tst-pb.s38.siliconpin.com');
-const INVOICE_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+const PUBLIC_POCKETBASE_URL = import.meta.env.PUBLIC_POCKETBASE_URL;
+const pb = new PocketBase(PUBLIC_POCKETBASE_URL);
 
 export function AvatarUpload({ userId }: { userId: string }) {
   const [selectedFile, setSelectedFile] = useState<File | null>(null);
@@ -45,7 +46,7 @@ export function AvatarUpload({ userId }: { userId: string }) {
       });
       
       // 2. Update PHP backend session
-      const response = await fetch(`${INVOICE_API_URL}?query=login`, {
+      const response = await fetch(`${PUBLIC_USER_API_URL}?query=login`, {
         method: 'POST',
         credentials: 'include', // Important for sessions to work
         headers: {
diff --git a/src/components/BillingInfo.jsx b/src/components/BillingInfo.jsx
index 7180e82..3767893 100644
--- a/src/components/BillingInfo.jsx
+++ b/src/components/BillingInfo.jsx
@@ -8,6 +8,7 @@ import { Button } from "./ui/button";
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "./ui/dialog";
 import * as XLSX from 'xlsx';
 export default function UserBillingList() {
+    const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
     const { isLoggedIn, loading, error, sessionData } = useIsLoggedIn();
     const [billingData, setBillingData] = useState([]);
     const [dataLoading, setDataLoading] = useState(true);
@@ -27,7 +28,6 @@ export default function UserBillingList() {
     const [currentPage, setCurrentPage] = useState(1);
     const [itemsPerPage] = useState(20);
 
-    const INVOICE_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
 
     useEffect(() => {
         if (isLoggedIn) {
@@ -38,7 +38,7 @@ export default function UserBillingList() {
 
     const fetchBillingData = async () => {
         try {
-            const res = await fetch(`${INVOICE_API_URL}?query=invoice-info`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}?query=invoice-info`, {
                 method: 'GET',
                 credentials: 'include',
                 headers: {
diff --git a/src/components/BuyServices/BuyVPN.jsx b/src/components/BuyServices/BuyVPN.jsx
index 5cdd971..b74c772 100644
--- a/src/components/BuyServices/BuyVPN.jsx
+++ b/src/components/BuyServices/BuyVPN.jsx
@@ -3,11 +3,9 @@ import { Button } from '../ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../ui/card";
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "../ui/select";
 import { Loader2 } from "lucide-react";
+const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
 
-export default function BuyVPN() {
-    // API URL - make sure to set this correctly
-    const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
-    
+export default function BuyVPN() {    
     // State for VPN configuration
     const [vpnContinent, setVpnContinent] = useState("");
     const [selectedCycle, setSelectedCycle] = useState("");
@@ -51,7 +49,7 @@ export default function BuyVPN() {
             formData.append('amount', selectedPrice.toString());
             formData.append('vpn_continent', vpnContinent);
             formData.append('service_type', 'vpn');
-            const response = await fetch(`${USER_API_URL}?query=initiate_payment`, {
+            const response = await fetch(`${PUBLIC_USER_API_URL}?query=initiate_payment`, {
                 method: 'POST',
                 body: formData,  // Using FormData instead of JSON
                 credentials: 'include'
diff --git a/src/components/BuyServices/NewDroplet.jsx b/src/components/BuyServices/NewDroplet.jsx
index 68accf6..ebb9576 100644
--- a/src/components/BuyServices/NewDroplet.jsx
+++ b/src/components/BuyServices/NewDroplet.jsx
@@ -8,6 +8,7 @@ import { Loader2 } from "lucide-react";
 import { useToast } from "../ui/toast";
 
 export default function NewDroplet() {
+  const PUBLIC_DIGITALOCEAN_API_KEY = import.meta.env.PUBLIC_DIGITALOCEAN_API_KEY;
   const { showToast } = useToast();
   const [isLoading, setIsLoading] = useState(false);
   const [formData, setFormData] = useState({
@@ -63,7 +64,7 @@ export default function NewDroplet() {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
-          "Authorization": "Bearer dop_v1_b6a075ece5786faf7c58d21761dbf95d47af372da062d68a870ce2a0bae51adf"
+          "Authorization": `Bearer ${PUBLIC_DIGITALOCEAN_API_KEY}`
         },
         body: JSON.stringify({
           ...formData,
diff --git a/src/components/BuyServices/NewHetznerCloudInstance.jsx b/src/components/BuyServices/NewHetznerCloudInstance.jsx
index 2aaad19..9c82451 100644
--- a/src/components/BuyServices/NewHetznerCloudInstance.jsx
+++ b/src/components/BuyServices/NewHetznerCloudInstance.jsx
@@ -19,7 +19,7 @@ export default function NewHetznerInstance() {
   const [images, setImages] = useState([]);
   const [sshKeys, setSshKeys] = useState([]);
   const [showAddSshKey, setShowAddSshKey] = useState(false);
-  const HETZNER_API_KEY = "uMSBR9nxdtbuvazsVM8YMMDd0PvuynpgJbmzFIO47HblMlh7tlHT8wV05sQ28Squ"; // Replace with your actual API key
+  const PUBLIC_HETZNER_API_KEY = import.meta.env.PUBLIC_HETZNER_API_KEY;
 
   const [formData, setFormData] = useState({
     name: "",
@@ -38,16 +38,16 @@ export default function NewHetznerInstance() {
         // Fetch all required data in parallel
         const [serverTypesResponse, locationsResponse, imagesResponse, sshKeysResponse] = await Promise.all([
           fetch("https://api.hetzner.cloud/v1/server_types", {
-            headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+            headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
           }),
           fetch("https://api.hetzner.cloud/v1/locations", {
-            headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+            headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
           }),
           fetch("https://api.hetzner.cloud/v1/images", {
-            headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+            headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
           }),
           fetch("https://api.hetzner.cloud/v1/ssh_keys", {
-            headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+            headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
           })
         ]);
 
@@ -97,7 +97,7 @@ export default function NewHetznerInstance() {
       const response = await fetch("https://api.hetzner.cloud/v1/servers", {
         method: "POST",
         headers: {
-          "Authorization": `Bearer ${HETZNER_API_KEY}`,
+          "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}`,
           "Content-Type": "application/json"
         },
         body: JSON.stringify(payload)
@@ -149,7 +149,7 @@ export default function NewHetznerInstance() {
       const response = await fetch('https://api.hetzner.cloud/v1/ssh_keys', {
         method: "POST",
         headers: {
-          "Authorization": `Bearer ${HETZNER_API_KEY}`,
+          "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}`,
           "Content-Type": "application/json"
         },
         body: JSON.stringify({
@@ -163,7 +163,7 @@ export default function NewHetznerInstance() {
       if (data.ssh_key) {
         // Refresh SSH keys list
         const sshResponse = await fetch("https://api.hetzner.cloud/v1/ssh_keys", {
-          headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+          headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
         });
         const sshData = await sshResponse.json();
         setSshKeys(sshData.ssh_keys || []);
diff --git a/src/components/BuyServices/NewKubernetisUtho.jsx b/src/components/BuyServices/NewKubernetisUtho.jsx
index 6fb023f..4d4b21e 100644
--- a/src/components/BuyServices/NewKubernetisUtho.jsx
+++ b/src/components/BuyServices/NewKubernetisUtho.jsx
@@ -15,7 +15,7 @@ export default function NewKubernetesService() {
   const [plans, setPlans] = useState([]);
   const [vpcs, setVpcs] = useState([]);
   const [subnets, setSubnets] = useState([]);
-  const UTHO_API_KEY = "Bearer IoNXhkRJsQPyOEqFMceSfzuKaDLrpxUCATgZjiVdvYlBHbwWmGtn";
+  const PUBLIC_UTHO_API_KEY = import.meta.env.PUBLIC_UTHO_API_KEY;
 
   const [formData, setFormData] = useState({
     dcslug: "innoida",
@@ -41,13 +41,13 @@ export default function NewKubernetesService() {
         const [plansResponse, vpcsResponse] = await Promise.all([
           fetch("https://api.utho.com/v2/plans", {
             headers: { 
-              "Authorization": UTHO_API_KEY,
+              "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
               "Content-Type": "application/json"
             }
           }),
           fetch("https://api.utho.com/v2/vpc", {
             headers: { 
-              "Authorization": UTHO_API_KEY,
+              "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
               "Content-Type": "application/json"
             }
           })
@@ -100,7 +100,7 @@ export default function NewKubernetesService() {
       // If no subnets in VPC data, try the subnets endpoint
       const response = await fetch(`https://api.utho.com/v2/vpc/${vpcId}/subnets`, {
         headers: { 
-          "Authorization": UTHO_API_KEY,
+          "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
           "Content-Type": "application/json"
         }
       });
@@ -161,7 +161,7 @@ export default function NewKubernetesService() {
       const response = await fetch("https://api.utho.com/v2/kubernetes/deploy", {
         method: "POST",
         headers: {
-          "Authorization": UTHO_API_KEY,
+          "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
           "Content-Type": "application/json"
         },
         body: JSON.stringify(payload)
diff --git a/src/components/BuyServices/NewUthoCloudInstance.jsx b/src/components/BuyServices/NewUthoCloudInstance.jsx
index d658cd4..70e55b8 100644
--- a/src/components/BuyServices/NewUthoCloudInstance.jsx
+++ b/src/components/BuyServices/NewUthoCloudInstance.jsx
@@ -11,13 +11,13 @@ import { Textarea } from "../ui/textarea";
 import { Switch } from "../ui/switch";
 
 export default function NewCloudInstance() {
+  const PUBLIC_UTHO_API_KEY = import.meta.env.PUBLIC_UTHO_API_KEY;
   const { showToast } = useToast();
   const [isLoading, setIsLoading] = useState(false);
   const [isFetchingData, setIsFetchingData] = useState(true);
   const [plans, setPlans] = useState([]);
   const [sshKeys, setSshKeys] = useState([]);
   const [showAddSshKey, setShowAddSshKey] = useState(false);
-  const UTHO_API_KEY = "Bearer IoNXhkRJsQPyOEqFMceSfzuKaDLrpxUCATgZjiVdvYlBHbwWmGtn";
 
   const [formData, setFormData] = useState({
     dcslug: "inmumbaizone2",
@@ -39,10 +39,10 @@ export default function NewCloudInstance() {
         // Fetch plans and SSH keys in parallel
         const [plansResponse, sshResponse] = await Promise.all([
           fetch("https://api.utho.com/v2/plans", {
-            headers: { "Authorization": UTHO_API_KEY }
+            headers: { "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}` }
           }),
           fetch("https://api.utho.com/v2/key", {
-            headers: { "Authorization": UTHO_API_KEY }
+            headers: { "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}` }
           })
         ]);
 
@@ -92,7 +92,7 @@ export default function NewCloudInstance() {
       const response = await fetch("https://api.utho.com/v2/cloud/deploy", {
         method: "POST",
         headers: {
-          "Authorization": UTHO_API_KEY,
+          "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
           "Content-Type": "application/json"
         },
         body: JSON.stringify(payload)
@@ -139,7 +139,7 @@ export default function NewCloudInstance() {
       const response = await fetch('https://api.utho.com/v2/key/import', {
         method: "POST",
         headers: {
-          "Authorization": UTHO_API_KEY,
+          "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}`,
           "Content-Type": "application/json"
         },
         body: JSON.stringify({
@@ -153,7 +153,7 @@ export default function NewCloudInstance() {
       if (data.status === 'success') {
         // Refresh SSH keys list
         const sshResponse = await fetch("https://api.utho.com/v2/key", {
-          headers: { "Authorization": UTHO_API_KEY }
+          headers: { "Authorization": `Bearer ${PUBLIC_UTHO_API_KEY}` }
         });
         const sshData = await sshResponse.json();
         setSshKeys(sshData.key || []);
diff --git a/src/components/BuyServices/STTStreaming.jsx b/src/components/BuyServices/STTStreaming.jsx
index b641fad..32a3f67 100644
--- a/src/components/BuyServices/STTStreaming.jsx
+++ b/src/components/BuyServices/STTStreaming.jsx
@@ -10,7 +10,7 @@ const PRICE_CONFIG = [
     {purchaseType: 'bulk', price: 1000, minute: 10000}
 ];
 export default function STTStreaming(){
-    const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+    const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
     const [purchaseType, setPurchaseType] = useState();
     const [amount, setAmount] = useState();
     const [dataError, setDataError] = useState();
@@ -38,7 +38,7 @@ export default function STTStreaming(){
             formData.append('cycle', 'monthly');
             formData.append('amount', amount.toString());
             formData.append('service_type', 'streaming_api');
-            const response = await fetch(`${USER_API_URL}?query=initiate_payment`, {
+            const response = await fetch(`${PUBLIC_USER_API_URL}?query=initiate_payment`, {
                 method: 'POST',
                 body: formData,  // Using FormData instead of JSON
                 credentials: 'include'
diff --git a/src/components/CommentWithMD.jsx b/src/components/CommentWithMD.jsx
index d44f38c..ae63411 100644
--- a/src/components/CommentWithMD.jsx
+++ b/src/components/CommentWithMD.jsx
@@ -1,14 +1,14 @@
 import React, { useEffect, useState } from 'react';
 import MDEditor, { commands } from '@uiw/react-md-editor';
 import { Card } from "./ui/card";
-import { Label } from "./ui/label";
+import { Label } from "./ui/label"; 
 import { Button } from "./ui/button";
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from "./ui/dialog";
 import { Input } from "./ui/input";
 import { useIsLoggedIn } from '../lib/isLoggedIn';
 
 const COMMENTS_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/comments/';
-const MINIO_UPLOAD_URL = 'https://hostapi2.cs1.hz.siliconpin.com/api/storage/upload';
+const PUBLIC_MINIO_UPLOAD_URL = import.meta.env.PUBLIC_MINIO_UPLOAD_URL;
 
 export default function Comment(props) {
   const [comments, setComments] = useState([]);
@@ -88,7 +88,7 @@ export default function Comment(props) {
     formData.append('api_key', 'wweifwehfwfhwhtuyegbvijvbfvegfreyf');
 
     try {
-      const response = await fetch(MINIO_UPLOAD_URL, {
+      const response = await fetch(PUBLIC_MINIO_UPLOAD_URL, {
         method: 'POST',
         body: formData,
         credentials: 'include'
diff --git a/src/components/ContactForm.jsx b/src/components/ContactForm.jsx
index 84b996f..8aa445b 100644
--- a/src/components/ContactForm.jsx
+++ b/src/components/ContactForm.jsx
@@ -7,7 +7,8 @@ import { Button } from './ui/button';
 export function ContactForm() {
   const [formState, setFormState] = useState({ name: '', email: '', company: '', service: '', message: '' });
   const [formStatus, setFormStatus] = useState('idle');
-  const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+  
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
 
   const handleInputChange = (e) => {
     const { name, value } = e.target;
@@ -32,7 +33,7 @@ export function ContactForm() {
             message: formState.message
         };
 
-        const response = await fetch(`${USER_API_URL}?query=contact-form`, {
+        const response = await fetch(`${PUBLIC_USER_API_URL}?query=contact-form`, {
             method: "POST",
             credentials: "include",
             headers: {
diff --git a/src/components/DomainSetupForm.jsx b/src/components/DomainSetupForm.jsx
index da932f9..9433c93 100644
--- a/src/components/DomainSetupForm.jsx
+++ b/src/components/DomainSetupForm.jsx
@@ -5,8 +5,9 @@ import { Button } from './ui/button';
 
 export const DomainSetupForm = ({ defaultSubdomain }) => {
   // API URLs
-  const API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
-  const SERVICES_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/services/';
+
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+  const PUBLIC_SERVICE_API_URL = import.meta.env.PUBLIC_SERVICE_API_URL;
 
   // State for deployment options
   const [deploymentType, setDeploymentType] = useState('app');
@@ -113,7 +114,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
       formData.append('cycle', selectedCycle);
       formData.append('amount', selectedPrice.toString());
 
-      const response = await fetch(`${API_URL}?query=initiate_payment`, {
+      const response = await fetch(`${PUBLIC_USER_API_URL}?query=initiate_payment`, {
         method: 'POST',
         body: formData,
         credentials: 'include'
@@ -166,7 +167,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
     setShowDnsConfig(false);
 
     try {
-      const response = await fetch(`${SERVICES_API_URL}?query=validate-domain`, {
+      const response = await fetch(`${PUBLIC_SERVICE_API_URL}?query=validate-domain`, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ domain })
@@ -208,7 +209,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
   const checkSubDomainCname = useCallback(() => {
     const domainToCheck = customDomain || customSubdomain;
     
-    fetch(`${SERVICES_API_URL}?query=check-c-name`, {
+    fetch(`${PUBLIC_SERVICE_API_URL}?query=check-c-name`, {
       method: 'POST',
       headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
       body: `domain=${encodeURIComponent(domainToCheck)}`
diff --git a/src/components/DomainSetupForm_old.jsx b/src/components/DomainSetupForm_old.jsx
index 539fbfa..a9cb778 100644
--- a/src/components/DomainSetupForm_old.jsx
+++ b/src/components/DomainSetupForm_old.jsx
@@ -38,9 +38,8 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
 
 
   const [vpnContinent, setVpnContinent] = useState('');
-  const API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
-  const SERVICES_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/services/';
-  // const BILLING_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/index.php';
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+  const PUBLIC_SERVICE_API_URL = import.meta.env.PUBLIC_SERVICE_API_URL;
 
   const [selectedcycle, setSelectedcycle] = useState('');
   const [selectedPrice, setSelectedPrice] = useState(0);
@@ -70,7 +69,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
         formData.append('cycle', selectedcycle);
         formData.append('amount', selectedPrice); //selectedPrice
         
-        fetch(`${API_URL}?query=initiate_payment`, {
+        fetch(`${PUBLIC_USER_API_URL}?query=initiate_payment`, {
           method: 'POST',
           body: formData,
           credentials: 'include'
@@ -105,7 +104,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
         formData.append('serviceId', 'vpnservices');
         formData.append('cycle', selectedcycle);
         formData.append('amount', selectedPrice);
-        fetch(`${API_URL}?query=initiate_payment`, {
+        fetch(`${PUBLIC_USER_API_URL}?query=initiate_payment`, {
           method: 'POST',
           body: formData,
           credentials: 'include'
@@ -295,7 +294,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
   
     try {
       // Make API call to validate domain
-      const response = await fetch(`${SERVICES_API_URL}?query=validate-domain`, {
+      const response = await fetch(`${PUBLIC_SERVICE_API_URL}?query=validate-domain`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json'
@@ -331,7 +330,7 @@ export const DomainSetupForm = ({ defaultSubdomain }) => {
   const checkSubDomainCname = () => {
     const domainToCheck = customDomain || customSubdomain;
     
-    fetch(`${SERVICES_API_URL}?query=check-c-name`, {
+    fetch(`${PUBLIC_SERVICE_API_URL}?query=check-c-name`, {
         method: 'POST',
         headers: {
             'Content-Type': 'application/x-www-form-urlencoded',
diff --git a/src/components/Login.tsx b/src/components/Login.tsx
index c813495..4a2abed 100644
--- a/src/components/Login.tsx
+++ b/src/components/Login.tsx
@@ -34,7 +34,11 @@ const LoginPage = () => {
   const [status, setStatus] = useState<AuthStatus>({ message: '', isError: false });
   const [isLoading, setIsLoading] = useState(false);
 
-  const pb = new PocketBase("https://tst-pb.s38.siliconpin.com");
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+  const PUBLIC_HOST_API2_USERS = import.meta.env.PUBLIC_HOST_API2_USERS;
+  const PUBLIC_POCKETBASE_URL = import.meta.env.PUBLIC_POCKETBASE_URL;
+  
+  const pb = new PocketBase(PUBLIC_POCKETBASE_URL);
 
   interface AuthResponse {
     token: string;
@@ -133,7 +137,7 @@ const LoginPage = () => {
 
   const handleCreateUserInMongo = async (siliconId: string) => {
     try {
-      const response = await fetch(`https://hostapi2.cs1.hz.siliconpin.com/api/users`, {
+      const response = await fetch(`${PUBLIC_HOST_API2_USERS}`, {
         method: 'POST',
         credentials: 'include',
         headers: {
@@ -165,7 +169,7 @@ const LoginPage = () => {
   const syncSessionWithBackend = async (authData: AuthResponse, avatarUrl: string) => {
     try {
       // Step 1: Sync with SiliconPin backend
-      const response = await fetch('https://host-api-sxashuasysagibx.siliconpin.com/v1/users/?query=login', {
+      const response = await fetch(`${PUBLIC_USER_API_URL}?query=login`, {
         method: 'POST',
         credentials: 'include',
         headers: { 
diff --git a/src/components/MakePayment.jsx b/src/components/MakePayment.jsx
index 840f272..0644175 100644
--- a/src/components/MakePayment.jsx
+++ b/src/components/MakePayment.jsx
@@ -7,7 +7,9 @@ import { Toast } from './Toast';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "./ui/card";
 import { FileX, Copy, CheckCircle2, AlertCircle, X  } from "lucide-react";
 import Loader from "./ui/loader";
-const API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+
+const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+
 export default function MakePayment(){
     const [initialOrderData, setInitialOrderData] = useState(null);
     const [isLoading, setIsLoading] = useState(true);
@@ -36,7 +38,7 @@ export default function MakePayment(){
             const formData = new FormData();
             formData.append('order_id', orderId);
             
-            fetch(`${API_URL}?query=get-initiated_payment`, {
+            fetch(`${PUBLIC_USER_API_URL}?query=get-initiated_payment`, {
                 method: 'POST',
                 body: formData,
                 credentials: 'include'
@@ -154,7 +156,7 @@ export default function MakePayment(){
 
     const handleSaveUPIPayment = async () => {
         try {
-          const response = await fetch(`${API_URL}?query=save-upi-payment`, {
+          const response = await fetch(`${PUBLIC_USER_API_URL}?query=save-upi-payment`, {
             method: 'POST',
             credentials: 'include',
             headers: {
diff --git a/src/components/Manager/AllCustomerList.jsx b/src/components/Manager/AllCustomerList.jsx
index 4460b3e..7f26828 100644
--- a/src/components/Manager/AllCustomerList.jsx
+++ b/src/components/Manager/AllCustomerList.jsx
@@ -5,7 +5,7 @@ import { ChevronUp, ChevronDown, Eye, Pencil, Trash2, Download, CircleArrowRight
 import { Button } from "../../components/ui/button";
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "../ui/dialog";
 export default function AllCustomerList() {
-    const API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+    const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
     const { isLoggedIn, loading, error, sessionData } = useIsLoggedIn();
     const [usersData, setUsersData] = useState([]);
     const [dataLoading, setDataLoading] = useState(true);
@@ -28,7 +28,7 @@ export default function AllCustomerList() {
     const fetchUsersData = async () => {
         setDataLoading(true);
         try {
-            const res = await fetch(`${API_URL}?query=get-all-users`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}?query=get-all-users`, {
                 method: 'GET',
                 credentials: 'include',
                 headers: {
@@ -76,7 +76,7 @@ export default function AllCustomerList() {
 
     const confirmDelete = async () => {
         try {
-            const res = await fetch(`${API_URL}${currentUser.id}`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}${currentUser.id}`, {
                 method: 'DELETE',
                 credentials: 'include',
                 headers: {
@@ -96,7 +96,7 @@ export default function AllCustomerList() {
 
     const saveUserChanges = async (updatedUser) => {
         try {
-            const res = await fetch(`${API_URL}${updatedUser.id}`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}${updatedUser.id}`, {
                 method: 'PUT',
                 credentials: 'include',
                 headers: {
diff --git a/src/components/Manager/AllSellingList.jsx b/src/components/Manager/AllSellingList.jsx
index 9e366ee..80685e7 100644
--- a/src/components/Manager/AllSellingList.jsx
+++ b/src/components/Manager/AllSellingList.jsx
@@ -37,7 +37,7 @@ export default function AllSellingList() {
     const [currentPage, setCurrentPage] = useState(1);
     const [itemsPerPage] = useState(10);
     
-    const INVOICE_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
+    const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
 
     useEffect(() => {
         if (isLoggedIn && sessionData?.user_type === 'admin') {
@@ -49,7 +49,7 @@ export default function AllSellingList() {
     const fetchBillingData = async () => {
         try {
             setDataLoading(true);
-            const res = await fetch(`${INVOICE_API_URL}?query=all-selling-list`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}?query=all-selling-list`, {
                 method: 'GET',
                 credentials: 'include',
                 headers: {
@@ -69,7 +69,7 @@ export default function AllSellingList() {
 
     const fetchUsersData = async () => {
         try {
-            const res = await fetch(`${INVOICE_API_URL}?query=get-all-users`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}?query=get-all-users`, {
                 method: 'GET',
                 credentials: 'include',
                 headers: {
@@ -122,7 +122,7 @@ export default function AllSellingList() {
         if (!window.confirm('Are you sure you want to delete this billing record?')) return;
         
         try {
-            const res = await fetch(`${INVOICE_API_URL}?query=delete-billing&billingId=${billingId}&serviceType=${serviceType}`, {
+            const res = await fetch(`${PUBLIC_USER_API_URL}?query=delete-billing&billingId=${billingId}&serviceType=${serviceType}`, {
                 method: 'DELETE',
                 credentials: 'include',
                 headers: {
@@ -150,7 +150,7 @@ export default function AllSellingList() {
     const handleSubmit = async (e) => {
         e.preventDefault();
         try {
-            const url = selectedItem ? `${INVOICE_API_URL}?query=update-billing&id=${selectedItem.id}` : `${INVOICE_API_URL}?query=create-billing`;
+            const url = selectedItem ? `${PUBLIC_USER_API_URL}?query=update-billing&id=${selectedItem.id}` : `${PUBLIC_USER_API_URL}?query=create-billing`;
             
             const method = selectedItem ? 'PUT' : 'POST';
             
diff --git a/src/components/Manager/HetznerList.jsx b/src/components/Manager/HetznerList.jsx
index 075ae97..dc0c316 100644
--- a/src/components/Manager/HetznerList.jsx
+++ b/src/components/Manager/HetznerList.jsx
@@ -11,13 +11,13 @@ export default function HetznerServicesList() {
   const { showToast } = useToast();
   const [isLoading, setIsLoading] = useState(true);
   const [servers, setServers] = useState([]);
-  const HETZNER_API_KEY = "uMSBR9nxdtbuvazsVM8YMMDd0PvuynpgJbmzFIO47HblMlh7tlHT8wV05sQ28Squ"; // Replace with your actual API key
+  const PUBLIC_HETZNER_API_KEY = import.meta.env.PUBLIC_HETZNER_API_KEY;
 
   // Define fetchServers outside useEffect so it can be reused
   const fetchServers = async () => {
     try {
       const response = await fetch("https://api.hetzner.cloud/v1/servers", {
-        headers: { "Authorization": `Bearer ${HETZNER_API_KEY}` }
+        headers: { "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}` }
       });
       const data = await response.json();
       setServers(data.servers || []);
@@ -42,7 +42,7 @@ export default function HetznerServicesList() {
       const response = await fetch(`https://api.hetzner.cloud/v1/servers/${serverId}/actions/${action}`, {
         method: "POST",
         headers: {
-          "Authorization": `Bearer ${HETZNER_API_KEY}`,
+          "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}`,
           "Content-Type": "application/json"
         }
       });
@@ -77,7 +77,7 @@ export default function HetznerServicesList() {
       const response = await fetch(`https://api.hetzner.cloud/v1/servers/${serverId}`, {
         method: "DELETE",
         headers: {
-          "Authorization": `Bearer ${HETZNER_API_KEY}`,
+          "Authorization": `Bearer ${PUBLIC_HETZNER_API_KEY}`,
           "Content-Type": "application/json"
         }
       });
diff --git a/src/components/Manager/ViewAsUser.jsx b/src/components/Manager/ViewAsUser.jsx
index d18207e..6b51774 100644
--- a/src/components/Manager/ViewAsUser.jsx
+++ b/src/components/Manager/ViewAsUser.jsx
@@ -19,9 +19,8 @@ export default function ViewAsUser() {
   const [dataError, setDataError] = useState(null);
   const [dialogOpen, setDialogOpen] = useState(false);
   const [selectedInvoice, setSelectedInvoice] = useState(null);
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
   
-  const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
-
   useEffect(() => {
     const urlParams = new URLSearchParams(window.location.search);
     const id = urlParams.get('siliconId');
@@ -36,7 +35,7 @@ export default function ViewAsUser() {
     
     try {
       const response = await fetch(
-        `${USER_API_URL}?query=login-from-admin&siliconId=${id}`, 
+        `${PUBLIC_USER_API_URL}?query=login-from-admin&siliconId=${id}`, 
         {
           method: 'GET',
           credentials: 'include',
diff --git a/src/components/MyTopic.jsx b/src/components/MyTopic.jsx
index ce20582..7e9a824 100644
--- a/src/components/MyTopic.jsx
+++ b/src/components/MyTopic.jsx
@@ -5,6 +5,7 @@ import Loader from "./ui/loader";
 const topicPageDesc = 'Cutting-edge discussions on tech, digital services, news, and digital freedom. Stay informed on AI, cybersecurity, privacy, and the future of innovation.';
 
 export default function TopicCreation(props) {
+    const PUBLIC_TOPIC_API_URL = import.meta.env.PUBLIC_TOPIC_API_URL;
     const { isLoggedIn, loading: authLoading, error: authError } = useIsLoggedIn();
     const [topics, setTopics] = useState([]);
     const [loading, setLoading] = useState(true);
@@ -13,7 +14,7 @@ export default function TopicCreation(props) {
     useEffect(() => {
         const fetchTopics = async () => {
             try {
-                const res = await fetch('https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/?query=my-topics', {
+                const res = await fetch(`${PUBLIC_TOPIC_API_URL}?query=my-topics`, {
                     method: 'GET',
                     credentials: 'include',
                     headers: {
diff --git a/src/components/NewTopic copy.jsx b/src/components/NewTopic copy.jsx
index feb62ae..8171544 100644
--- a/src/components/NewTopic copy.jsx	
+++ b/src/components/NewTopic copy.jsx	
@@ -8,8 +8,8 @@ import { Separator } from './ui/separator';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from './ui/dialog';
 import { CustomTabs } from './ui/tabs';
 
-const TOPIC_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/';
-const MINIO_UPLOAD_URL = 'https://hostapi2.cs1.hz.siliconpin.com/api/storage/upload';
+const PUBLIC_MINIO_UPLOAD_URL = import.meta.env.PUBLIC_MINIO_UPLOAD_URL;
+const PUBLIC_TOPIC_API_URL = import.meta.env.PUBLIC_TOPIC_API_URL;
 
 const NewTopic = () => {
 
@@ -34,7 +34,7 @@ const NewTopic = () => {
     formData.append('api_key', 'wweifwehfwfhwhtuyegbvijvbfvegfreyf');
 
     try {
-      const response = await fetch(MINIO_UPLOAD_URL, {
+      const response = await fetch(PUBLIC_MINIO_UPLOAD_URL, {
         method: 'POST',
         body: formData,
         credentials: 'include',
@@ -185,7 +185,7 @@ const NewTopic = () => {
       };
 
       // Submit to API
-      const response = await fetch(`${TOPIC_API_URL}?query=create-new-topic`, {
+      const response = await fetch(`${PUBLIC_TOPIC_API_URL}?query=create-new-topic`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
diff --git a/src/components/NewTopic.jsx b/src/components/NewTopic.jsx
index a214490..aeb4c2f 100644
--- a/src/components/NewTopic.jsx
+++ b/src/components/NewTopic.jsx
@@ -7,8 +7,9 @@ import { Button } from './ui/button';
 import { Separator } from './ui/separator';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from './ui/dialog';
 import { CustomTabs } from './ui/tabs';
-const TOPIC_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/';
-const MINIO_UPLOAD_URL = 'https://hostapi2.cs1.hz.siliconpin.com/api/storage/upload';
+
+const PUBLIC_MINIO_UPLOAD_URL = import.meta.env.PUBLIC_MINIO_UPLOAD_URL;
+const PUBLIC_TOPIC_API_URL = import.meta.env.PUBLIC_TOPIC_API_URL;
 
 const NewTopic = () => {
 
@@ -33,7 +34,7 @@ const NewTopic = () => {
     formData.append('api_key', 'wweifwehfwfhwhtuyegbvijvbfvegfreyf');
 
     try {
-      const response = await fetch(MINIO_UPLOAD_URL, {
+      const response = await fetch(PUBLIC_MINIO_UPLOAD_URL, {
         method: 'POST',
         body: formData,
         credentials: 'include'
@@ -185,7 +186,7 @@ const NewTopic = () => {
       };
 
       // Submit to API
-      const response = await fetch(`${TOPIC_API_URL}?query=create-new-topic`, {
+      const response = await fetch(`${PUBLIC_TOPIC_API_URL}?query=create-new-topic`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
diff --git a/src/components/PasswordUpdateCard.tsx b/src/components/PasswordUpdateCard.tsx
index 52fcd9f..afe9ca7 100644
--- a/src/components/PasswordUpdateCard.tsx
+++ b/src/components/PasswordUpdateCard.tsx
@@ -6,7 +6,8 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "./ui/
 import { Eye, EyeOff, Loader2 } from "lucide-react";
 import { Label } from "./ui/label";
 // import type { RecordModel } from 'pocketbase';
-const pb = new PocketBase('https://tst-pb.s38.siliconpin.com');
+const PUBLIC_POCKETBASE_URL = import.meta.env.PUBLIC_POCKETBASE_URL;
+const pb = new PocketBase(PUBLIC_POCKETBASE_URL);
 
 interface RecordModel {
   id: string;
diff --git a/src/components/PaymentSuccessfully.jsx b/src/components/PaymentSuccessfully.jsx
index 6c9000c..b34464e 100644
--- a/src/components/PaymentSuccessfully.jsx
+++ b/src/components/PaymentSuccessfully.jsx
@@ -12,9 +12,8 @@ export default function HestiaCredentialsFetcher() {
   const [serviceName, setServiceName] = useState(null);
   const [serviceOrderId, setServiceOrderId] = useState(null);
   const [userSiliconId, setUserSiliconId] = useState();
-
-  const SERVICES_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/services/';
-  
+  const PUBLIC_SERVICE_API_URL = import.meta.env.PUBLIC_SERVICE_API_URL;
+  const PUBLIC_HOST_API2_USERS = import.meta.env.PUBLIC_HOST_API2_USERS;
   useEffect(() => {
     const fetchData = async () => {
       const urlParams = new URLSearchParams(window.location.search);
@@ -48,7 +47,7 @@ export default function HestiaCredentialsFetcher() {
             status: "active"
         }
         // console.log('serviceDataPayload', serviceDataPayload)
-        const response = await fetch(`https://hostapi2.cs1.hz.siliconpin.com/api/users/${siliconId}/${query}`, {
+        const response = await fetch(`${PUBLIC_HOST_API2_USERS}/${siliconId}/${query}`, {
             method: 'POST',
             headers: {
                 'Content-Type': 'application/json'
@@ -74,7 +73,7 @@ export default function HestiaCredentialsFetcher() {
       // Use the passed orderIdParam or fall back to state
       const effectiveOrderId = orderIdParam || serviceOrderId;
       const query = serviceToCall === 'vpn' ? 'get-vpn-cred' : 'get-hestia-cred';
-      const response = await fetch(`${SERVICES_API_URL}?query=${query}&orderId=${effectiveOrderId}`, {
+      const response = await fetch(`${PUBLIC_SERVICE_API_URL}?query=${query}&orderId=${effectiveOrderId}`, {
         method: 'GET',
         credentials: 'include',
       });
diff --git a/src/components/SignupPage.tsx b/src/components/SignupPage.tsx
index b535cb7..e7002a6 100644
--- a/src/components/SignupPage.tsx
+++ b/src/components/SignupPage.tsx
@@ -38,8 +38,10 @@ const SignupPage = () => {
   const [confirmPasswordVisible, setConfirmPasswordVisible] = useState(false);
   const [status, setStatus] = useState<AuthStatus>({ message: '', isError: false });
   const [isLoading, setIsLoading] = useState(false);
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+  const PUBLIC_POCKETBASE_URL = import.meta.env.PUBLIC_POCKETBASE_URL;
 
-  const pb = new PocketBase("https://tst-pb.s38.siliconpin.com");
+  const pb = new PocketBase(PUBLIC_POCKETBASE_URL);
 
   const handleSubmit = async (e: FormEvent) => {
     e.preventDefault();
@@ -135,7 +137,7 @@ const SignupPage = () => {
 
   const syncSessionWithBackend = async (authData: AuthResponse, avatarUrl: string) => {
     try {
-      const response = await fetch('https://host-api-sxashuasysagibx.siliconpin.com/v1/users/?query=login', {
+      const response = await fetch(`${PUBLIC_USER_API_URL}?query=login`, {
         method: 'POST',
         credentials: 'include',
         headers: { 'Content-Type': 'application/json' },
diff --git a/src/components/Ticket.tsx b/src/components/Ticket.tsx
index bb094ea..abf3e13 100644
--- a/src/components/Ticket.tsx
+++ b/src/components/Ticket.tsx
@@ -27,7 +27,7 @@ interface Message {
   user_type: string;
 }
 
-const API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/ticket/index.php';
+const PUBLIC_TICKET_API_URL = import.meta.env.PUBLIC_TICKET_API_URL;
 
 function Ticketing() {
   const [tickets, setTickets] = useState<Ticket[]>([]);
@@ -47,7 +47,7 @@ function Ticketing() {
 
   const fetchTickets = async () => {
     try {
-      const response = await fetch(`${API_URL}?action=get_tickets&status=${activeTab}`);
+      const response = await fetch(`${PUBLIC_TICKET_API_URL}?action=get_tickets&status=${activeTab}`);
       const data = await response.json();
       if (data.success) {
         setTickets(data.tickets);
@@ -59,7 +59,7 @@ function Ticketing() {
 
   const fetchMessages = async (ticketId: number) => {
     try {
-      const response = await fetch(`${API_URL}?action=get_messages&ticket_id=${ticketId}`);
+      const response = await fetch(`${PUBLIC_TICKET_API_URL}?action=get_messages&ticket_id=${ticketId}`);
       const data = await response.json();
       console.log('Messages response:', data); // Debug log
       if (data.success) {
@@ -78,7 +78,7 @@ function Ticketing() {
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
     try {
-      const response = await fetch(API_URL, {
+      const response = await fetch(PUBLIC_TICKET_API_URL, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
@@ -99,7 +99,7 @@ function Ticketing() {
 
   const handleStatusChange = async (ticketId: number, newStatus: 'open' | 'in-progress' | 'resolved' | 'closed') => {
     try {
-      const response = await fetch(API_URL, {
+      const response = await fetch(PUBLIC_TICKET_API_URL, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
@@ -124,7 +124,7 @@ function Ticketing() {
     if (!selectedTicket || !newMessage.trim()) return;
     
     try {
-      const response = await fetch(API_URL, {
+      const response = await fetch(PUBLIC_TICKET_API_URL, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
@@ -146,7 +146,7 @@ function Ticketing() {
 
   const handleDeleteTicket = async (ticketId: number) => {
     try {
-      const response = await fetch(API_URL, {
+      const response = await fetch(PUBLIC_TICKET_API_URL, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
diff --git a/src/components/Tools/AudioToText.jsx b/src/components/Tools/AudioToText.jsx
index 6699772..2ad1ebf 100644
--- a/src/components/Tools/AudioToText.jsx
+++ b/src/components/Tools/AudioToText.jsx
@@ -1,25 +1,26 @@
-import { useState, useRef } from 'react';
+import { useState, useRef, useEffect, useCallback, useMemo } from 'react';
 import { Button } from '../ui/button';
 
 const API_OPTIONS = [
   {
     id: 'whisper',
-    name: 'Whisper CPP',
+    name: 'Whisper (GPU)',
     endpoint: 'https://stt-41.siliconpin.com/stt',
-    description: 'Fast lightweight speech recognition'
+    description: '2 Req / Min, 10 / Day is free'
   },
   {
     id: 'vosk',
-    name: 'Vosk CPP',
+    name: 'Vosk (CPU)',
     endpoint: 'https://api.vosk.ai/stt',
-    description: 'Offline speech recognition'
+    description: '10 Req / Min, 100 / Day is free'
   },
 ];
 
-const MAX_FILE_SIZE_MB = 5; // 1MB limit
+const MAX_FILE_SIZE_MB = 5;
 const MAX_FILE_SIZE_BYTES = MAX_FILE_SIZE_MB * 1024 * 1024;
 
 export default function AudioUploader() {
+  // State management
   const [file, setFile] = useState(null);
   const [status, setStatus] = useState('No file uploaded yet');
   const [response, setResponse] = useState(null);
@@ -27,23 +28,87 @@ export default function AudioUploader() {
   const [error, setError] = useState(null);
   const [selectedApi, setSelectedApi] = useState('whisper');
   const [copied, setCopied] = useState(false);
-  const fileInputRef = useRef(null);
+  const [debugLogs, setDebugLogs] = useState([]);
+  const [recordingTime, setRecordingTime] = useState(0);
+  const [isRecording, setIsRecording] = useState(false);
+  const [audioBlob, setAudioBlob] = useState(null);
+  const [audioUrl, setAudioUrl] = useState(null);
+  const [showDebug, setShowDebug] = useState(false);
 
-  const handleFileChange = (e) => {
+  // Refs
+  const fileInputRef = useRef(null);
+  const mediaRecorderRef = useRef(null);
+  const audioChunksRef = useRef([]);
+  const timerRef = useRef(null);
+  const audioContextRef = useRef(null);
+  const analyserRef = useRef(null);
+  const canvasRef = useRef(null);
+  const animationRef = useRef(null);
+  const streamRef = useRef(null);
+
+  // Debug logging with useCallback to prevent infinite loops
+  const addDebugLog = useCallback((message) => {
+    const timestamp = new Date().toISOString().split('T')[1].split('.')[0];
+    const logMessage = `${timestamp}: ${message}`;
+    setDebugLogs(prev => [...prev.slice(-100), logMessage]);
+    console.debug(logMessage);
+  }, []);
+
+  // Timer effect
+  useEffect(() => {
+    if (isRecording) {
+      timerRef.current = setInterval(() => {
+        setRecordingTime(prev => prev + 1);
+      }, 1000);
+      return () => clearInterval(timerRef.current);
+    }
+  }, [isRecording]);
+
+  // Clean up on unmount
+  useEffect(() => {
+    return () => {
+      addDebugLog('Component unmounting - cleaning up resources');
+      stopRecording();
+      if (animationRef.current) {
+        cancelAnimationFrame(animationRef.current);
+      }
+      if (audioContextRef.current?.state !== 'closed') {
+        audioContextRef.current?.close().catch(err => {
+          addDebugLog(`Error closing AudioContext: ${err.message}`);
+        });
+      }
+      clearInterval(timerRef.current);
+    };
+  }, [addDebugLog]);
+
+  // Handle file change - completely stable implementation
+  const handleFileChange = useCallback((e) => {
     const selectedFile = e.target.files[0];
     if (!selectedFile) {
       setFile(null);
       setStatus('No file selected');
+      addDebugLog('No file selected');
+      return;
+    }
+
+    if (!['audio/wav', 'audio/mpeg', 'audio/ogg', 'audio/webm'].includes(selectedFile.type) && 
+        !selectedFile.name.match(/\.(wav|mp3|ogg|webm)$/i)) {
+      const errorMsg = 'Unsupported file format. Please use WAV, MP3, or OGG';
+      setError(errorMsg);
+      setStatus('Invalid file type');
+      setFile(null);
+      e.target.value = '';
+      addDebugLog(errorMsg);
       return;
     }
 
-    // Check file size
     if (selectedFile.size > MAX_FILE_SIZE_BYTES) {
-      setError(`File size exceeds ${MAX_FILE_SIZE_MB}MB limit`);
+      const errorMsg = `File size exceeds ${MAX_FILE_SIZE_MB}MB limit`;
+      setError(errorMsg);
       setStatus('File too large');
       setFile(null);
-      // Clear the file input
       e.target.value = '';
+      addDebugLog(errorMsg);
       return;
     }
 
@@ -51,29 +116,98 @@ export default function AudioUploader() {
     setStatus(`File selected: ${selectedFile.name}`);
     setResponse(null);
     setError(null);
-  };
-
-  const handleSubmit = async () => {
-    if (!file) return;
-
-    // Double check file size before submitting
-    if (file.size > MAX_FILE_SIZE_BYTES) {
-      setError(`File size exceeds ${MAX_FILE_SIZE_MB}MB limit`);
-      setStatus('File too large');
-      return;
-    }
-
-    setIsLoading(true);
-    setStatus(`Processing with ${API_OPTIONS.find(api => api.id === selectedApi)?.name}...`);
-    setError(null);
+    setAudioBlob(null);
+    setAudioUrl(null);
+    addDebugLog(`File selected: ${selectedFile.name} (${(selectedFile.size / (1024 * 1024)).toFixed(2)} MB)`);
+  }, [addDebugLog]);
 
+  // Create WAV blob - stable implementation
+  const createWavBlob = useCallback(async (audioBlob) => {
     try {
+      addDebugLog('Starting WAV blob creation');
+      const arrayBuffer = await audioBlob.arrayBuffer();
+      const audioContext = new (window.AudioContext || window.webkitAudioContext)({
+        sampleRate: 16000
+      });
+      
+      const decodedData = await audioContext.decodeAudioData(arrayBuffer);
+      addDebugLog(`Decoded audio data: ${decodedData.length} samples, ${decodedData.numberOfChannels} channels`);
+      
+      let audioData;
+      if (decodedData.numberOfChannels > 1) {
+        audioData = new Float32Array(decodedData.length);
+        for (let i = 0; i < decodedData.length; i++) {
+          audioData[i] = (decodedData.getChannelData(0)[i] + decodedData.getChannelData(1)[i]) / 2;
+        }
+        addDebugLog('Converted stereo to mono');
+      } else {
+        audioData = decodedData.getChannelData(0);
+      }
+      
+      const pcmData = new Int16Array(audioData.length);
+      for (let i = 0; i < audioData.length; i++) {
+        const s = Math.max(-1, Math.min(1, audioData[i]));
+        pcmData[i] = s < 0 ? s * 0x8000 : s * 0x7FFF;
+      }
+      addDebugLog(`Converted to 16-bit PCM: ${pcmData.length} samples`);
+      
+      const wavHeader = createWaveHeader(pcmData.length * 2, {
+        sampleRate: 16000,
+        numChannels: 1,
+        bitDepth: 16
+      });
+      
+      const wavBlob = new Blob([wavHeader, pcmData], { type: 'audio/wav' });
+      addDebugLog(`Created WAV blob: ${(wavBlob.size / 1024).toFixed(2)} KB`);
+      return wavBlob;
+    } catch (err) {
+      const errorMsg = `Error creating WAV blob: ${err.message}`;
+      addDebugLog(errorMsg);
+      throw new Error('Failed to process audio recording');
+    }
+  }, [addDebugLog]);
+
+  // Handle submit - stable implementation
+  const handleSubmit = useCallback(async () => {
+    let fileToSubmit;
+    
+    try {
+      setIsLoading(true);
+      const apiName = API_OPTIONS.find(api => api.id === selectedApi)?.name;
+      setStatus(`Processing with ${apiName}...`);
+      setError(null);
+      addDebugLog(`Starting submission with ${apiName}`);
+
+      if (audioBlob) {
+        addDebugLog('Processing recorded audio blob');
+        fileToSubmit = await createWavBlob(audioBlob);
+      } else if (file) {
+        addDebugLog('Processing uploaded file');
+        fileToSubmit = file;
+      } else {
+        const errorMsg = 'No audio file selected';
+        addDebugLog(errorMsg);
+        throw new Error(errorMsg);
+      }
+
+      if (fileToSubmit.size > MAX_FILE_SIZE_BYTES) {
+        const errorMsg = `File size exceeds ${MAX_FILE_SIZE_MB}MB limit`;
+        addDebugLog(errorMsg);
+        throw new Error(errorMsg);
+      }
+
       const formData = new FormData();
-      formData.append('audio', file);
+      formData.append('audio', fileToSubmit, 'audio.wav');
+      addDebugLog(`Created FormData with ${(fileToSubmit.size / 1024).toFixed(2)} KB file`);
 
       const apiConfig = API_OPTIONS.find(api => api.id === selectedApi);
-      if (!apiConfig) throw new Error('Selected API not found');
+      if (!apiConfig) {
+        const errorMsg = 'Selected API not found';
+        addDebugLog(errorMsg);
+        throw new Error(errorMsg);
+      }
 
+      addDebugLog(`Sending request to ${apiConfig.endpoint}`);
       const apiResponse = await fetch(apiConfig.endpoint, {
         method: 'POST',
         body: formData,
@@ -84,41 +218,84 @@ export default function AudioUploader() {
         try {
           const errorData = await apiResponse.json();
           errorMessage = errorData.message || errorData.error || errorMessage;
-        } catch (e) {}
+        } catch (e) {
+          addDebugLog('Failed to parse error response');
+        }
+        addDebugLog(`API error: ${errorMessage}`);
         throw new Error(errorMessage);
       }
 
       const result = await apiResponse.json();
+      addDebugLog('Received successful response from API');
       setResponse({
         api: selectedApi,
         data: result
       });
       setStatus('Processing complete');
     } catch (err) {
-      setError(err.message.includes('Failed to fetch') 
+      const errorMsg = err.message.includes('Failed to fetch') 
         ? 'Network error: Could not connect to the API server' 
-        : err.message);
+        : err.message;
+      addDebugLog(`Error during submission: ${errorMsg}`);
+      setError(errorMsg);
       setStatus('Processing failed');
       setResponse(null);
     } finally {
       setIsLoading(false);
+      addDebugLog('Submission process completed');
     }
-  };
+  }, [selectedApi, audioBlob, file, createWavBlob, addDebugLog]);
 
-  const copyToClipboard = (text) => {
+  // Helper functions
+  const createWaveHeader = useCallback((dataLength, config) => {
+    const byteRate = config.sampleRate * config.numChannels * (config.bitDepth / 8);
+    const blockAlign = config.numChannels * (config.bitDepth / 8);
+
+    const buffer = new ArrayBuffer(44);
+    const view = new DataView(buffer);
+
+    writeString(view, 0, 'RIFF');
+    view.setUint32(4, 36 + dataLength, true);
+    writeString(view, 8, 'WAVE');
+    writeString(view, 12, 'fmt ');
+    view.setUint32(16, 16, true);
+    view.setUint16(20, 1, true);
+    view.setUint16(22, config.numChannels, true);
+    view.setUint32(24, config.sampleRate, true);
+    view.setUint32(28, byteRate, true);
+    view.setUint16(32, blockAlign, true);
+    view.setUint16(34, config.bitDepth, true);
+    writeString(view, 36, 'data');
+    view.setUint32(40, dataLength, true);
+
+    return new Uint8Array(buffer);
+  }, []);
+
+  const writeString = useCallback((view, offset, string) => {
+    for (let i = 0; i < string.length; i++) {
+      view.setUint8(offset + i, string.charCodeAt(i));
+    }
+  }, []);
+
+  const copyToClipboard = useCallback((text) => {
     navigator.clipboard.writeText(text).then(() => {
       setCopied(true);
       setTimeout(() => setCopied(false), 2000);
+      addDebugLog('Text copied to clipboard');
     }).catch(err => {
-      console.error('Copy failed:', err);
-      setError('Failed to copy text to clipboard');
+      const errorMsg = 'Failed to copy text to clipboard';
+      addDebugLog(`${errorMsg}: ${err.message}`);
+      setError(errorMsg);
     });
-  };
+  }, [addDebugLog]);
 
-  const getDisplayText = () => {
-    if (!response?.data) return null;
+  // Fixed getDisplayText to prevent infinite loops
+  const displayText = useMemo(() => {
+    if (!response?.data) {
+      addDebugLog('No response data to display');
+      return null;
+    }
     
-    // Handle various API response formats
     if (typeof response.data === 'string') {
       return response.data;
     }
@@ -133,21 +310,260 @@ export default function AudioUploader() {
     }
     
     return "Received response but couldn't extract text. View full response for details.";
-  };
+  }, [response, addDebugLog]);
 
-  const displayText = getDisplayText();
+  // Recording functions
+  const startRecording = useCallback(async () => {
+    try {
+      addDebugLog('Attempting to start recording');
+      setStatus("Requesting microphone access...");
+      
+      if (audioBlob) {
+        addDebugLog('Clearing previous recording');
+        setAudioBlob(null);
+        setAudioUrl(null);
+      }
+      
+      // Initialize audio context
+      audioContextRef.current = new (window.AudioContext || window.webkitAudioContext)({
+        sampleRate: 16000
+      });
+      addDebugLog(`AudioContext created with sample rate: ${audioContextRef.current.sampleRate}`);
+      
+      // Get user media
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      streamRef.current = stream;
+      addDebugLog('Microphone access granted, stream created');
+      
+      // Setup visualization
+      setupVisualizer(stream);
+      
+      // Initialize MediaRecorder
+      mediaRecorderRef.current = new MediaRecorder(stream);
+      audioChunksRef.current = [];
+      
+      mediaRecorderRef.current.ondataavailable = (e) => {
+        audioChunksRef.current.push(e.data);
+      };
+      
+      mediaRecorderRef.current.onstop = () => {
+        const audioBlob = new Blob(audioChunksRef.current, { type: 'audio/webm' });
+        setAudioBlob(audioBlob);
+        setAudioUrl(URL.createObjectURL(audioBlob));
+        setStatus("Recording stopped. Ready to process.");
+      };
+      
+      mediaRecorderRef.current.start(100); // Collect data every 100ms
+      setIsRecording(true);
+      setStatus("Recording (16kHz, 16-bit mono)...");
+      addDebugLog('Recording started');
+      
+    } catch (err) {
+      const errorMsg = `Error starting recording: ${err.message}`;
+      addDebugLog(errorMsg);
+      setError(errorMsg);
+      setStatus("Recording failed");
+      setIsRecording(false);
+    }
+  }, [audioBlob, addDebugLog]);
+
+  const stopRecording = useCallback(() => {
+    addDebugLog('Stop recording initiated');
+    if (!isRecording) {
+      addDebugLog('Not currently recording, ignoring stop request');
+      return;
+    }
+    
+    try {
+      setIsRecording(false);
+      addDebugLog('Recording state updated to false');
+      
+      if (mediaRecorderRef.current?.state === 'recording') {
+        mediaRecorderRef.current.stop();
+      }
+      
+      if (streamRef.current) {
+        streamRef.current.getTracks().forEach(track => {
+          track.stop();
+          addDebugLog(`Stopped track: ${track.kind}`);
+        });
+      }
+      
+      if (animationRef.current) {
+        cancelAnimationFrame(animationRef.current);
+        animationRef.current = null;
+        addDebugLog('Visualization animation stopped');
+      }
+      
+      addDebugLog('Recording successfully stopped');
+    } catch (err) {
+      const errorMsg = `Error stopping recording: ${err.message}`;
+      addDebugLog(errorMsg);
+      setError(errorMsg);
+      setStatus("Recording stop failed");
+    }
+  }, [isRecording, addDebugLog]);
+
+  const playRecording = useCallback(() => {
+    if (audioUrl) {
+      addDebugLog('Playing recording');
+      const audio = new Audio(audioUrl);
+      audio.play();
+      setStatus("Playing recording...");
+      
+      audio.onended = () => {
+        addDebugLog('Playback finished');
+        setStatus("Playback finished");
+      };
+    } else {
+      addDebugLog('No audio URL available for playback');
+    }
+  }, [audioUrl, addDebugLog]);
+
+  const setupVisualizer = useCallback((stream) => {
+    if (!audioContextRef.current) {
+      addDebugLog('AudioContext not available for visualization');
+      return;
+    }
+    
+    try {
+      const source = audioContextRef.current.createMediaStreamSource(stream);
+      analyserRef.current = audioContextRef.current.createAnalyser();
+      analyserRef.current.fftSize = 64;
+      source.connect(analyserRef.current);
+      addDebugLog('Visualizer audio nodes connected');
+      
+      const bufferLength = analyserRef.current.frequencyBinCount;
+      const dataArray = new Uint8Array(bufferLength);
+      
+      const draw = () => {
+        animationRef.current = requestAnimationFrame(draw);
+        
+        analyserRef.current.getByteFrequencyData(dataArray);
+        
+        const canvas = canvasRef.current;
+        if (!canvas) return;
+        
+        const ctx = canvas.getContext('2d');
+        if (!ctx) return;
+        
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+        
+        const barWidth = (canvas.width / bufferLength) * 2.5;
+        let x = 0;
+        
+        for (let i = 0; i < bufferLength; i++) {
+          const barHeight = dataArray[i] / 2;
+          
+          ctx.fillStyle = `rgb(${barHeight + 100}, 50, 50)`;
+          ctx.fillRect(x, canvas.height - barHeight, barWidth, barHeight);
+          
+          x += barWidth + 1;
+        }
+      };
+      
+      draw();
+      addDebugLog('Visualizer animation started');
+    } catch (err) {
+      addDebugLog(`Error setting up visualizer: ${err.message}`);
+    }
+  }, [addDebugLog]);
+
+  // Helper functions
+  const formatTime = useCallback((seconds) => {
+    const mins = Math.floor(seconds / 60).toString().padStart(2, '0');
+    const secs = (seconds % 60).toString().padStart(2, '0');
+    return `${mins}:${secs}`;
+  }, []);
+
+  const clearDebugLogs = useCallback(() => {
+    setDebugLogs([]);
+    addDebugLog('Debug logs cleared');
+  }, [addDebugLog]);
+
+  const toggleDebug = useCallback(() => {
+    setShowDebug(!showDebug);
+    addDebugLog(`Debug panel ${showDebug ? 'hidden' : 'shown'}`);
+  }, [showDebug, addDebugLog]);
 
   return (
     <div className="container mx-auto px-4 max-w-4xl my-6">
       <div className="bg-white rounded-lg shadow-md p-6">
-        <h1 className="text-2xl font-bold mb-6 text-gray-800">Audio File to Text Converter</h1>
+        <div className="flex justify-between items-center mb-6">
+          <h1 className="text-2xl font-bold text-gray-800">Speech to Text Converter</h1>
+          <Button 
+            onClick={toggleDebug}
+            variant="outline"
+            size="sm"
+          >
+            {showDebug ? 'Hide Debug' : 'Show Debug'}
+          </Button>
+        </div>
+        
+        {/* Recording Section */}
+        <div className="mb-8 p-4 border border-dashed border-[#6d9e37] rounded-lg bg-gray-50">
+          <h2 className="text-lg font-semibold mb-3 text-gray-700">Record Audio (16kHz, 16-bit mono)</h2>
+          
+          <canvas 
+            ref={canvasRef} 
+            className="w-full h-20 bg-gray-200 rounded mb-3"
+            style={{ display: isRecording ? 'block' : 'none' }}
+          />
+          
+          <div className="flex flex-wrap gap-2 mb-3">
+            <Button
+              onClick={startRecording}
+              disabled={isRecording || isLoading}
+              variant="outline"
+              className="px-4 py-2"
+            >
+              Start Recording
+            </Button>
+            <Button
+              onClick={stopRecording}
+              disabled={!isRecording || isLoading}
+              variant="outline"
+              className="px-4 py-2"
+            >
+              Stop Recording
+            </Button>
+            <Button
+              onClick={playRecording}
+              disabled={!audioUrl || isRecording || isLoading}
+              variant="outline"
+              className="px-4 py-2"
+            >
+              Play Recording
+            </Button>
+          </div>
+          
+          {isRecording && (
+            <div className="text-center text-[#6d9e37] font-medium">
+              Recording: {formatTime(recordingTime)}
+            </div>
+          )}
+          
+          {audioUrl && !isRecording && (
+            <div className="flex items-center justify-between bg-white p-3 rounded border mt-2">
+              <div className="flex items-center">
+                <svg className="w-5 h-5 text-[#6d9e37] mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                </svg>
+                <span className="text-sm font-medium text-[#6d9e37]">recording.wav</span>
+              </div>
+              <span className="text-xs text-[#6d9e37]">
+                {(audioBlob?.size / (1024 * 1024)).toFixed(2)} MB
+              </span>
+            </div>
+          )}
+        </div>
         
         {/* File Upload Section */}
         <div className="mb-8 p-4 border border-dashed border-[#6d9e37] rounded-lg bg-gray-50">
           <div className="flex items-center justify-between mb-4">
             <div>
               <label className="block text-sm font-medium text-gray-700 mb-1">
-                Upload Audio File
+                Or Upload Audio File
               </label>
               <p className="text-xs text-gray-500">Supports WAV, MP3, OGG formats (max {MAX_FILE_SIZE_MB}MB)</p>
             </div>
@@ -155,7 +571,7 @@ export default function AudioUploader() {
               onClick={() => fileInputRef.current?.click()}
               variant="outline"
               className="px-4 py-2"
-              disabled={isLoading}
+              disabled={isLoading || isRecording}
             >
               Select File
             </Button>
@@ -165,7 +581,7 @@ export default function AudioUploader() {
               accept="audio/*,.wav,.mp3,.ogg"
               onChange={handleFileChange}
               className="hidden"
-              disabled={isLoading}
+              disabled={isLoading || isRecording}
             />
           </div>
           
@@ -191,12 +607,12 @@ export default function AudioUploader() {
             {API_OPTIONS.map(api => (
               <div 
                 key={api.id}
-                onClick={() => !isLoading && setSelectedApi(api.id)}
+                onClick={() => !isLoading && !isRecording && setSelectedApi(api.id)}
                 className={`p-4 border-[1.5px] rounded-lg cursor-pointer transition-all ${
                   selectedApi === api.id
                     ? 'border-[1.5px] border-[#6d9e37] bg-[#6d9e3720]'
                     : 'border-gray-200 hover:border-gray-300'
-                } ${isLoading ? 'opacity-50 cursor-not-allowed' : ''}`}
+                } ${isLoading || isRecording ? 'opacity-50 cursor-not-allowed' : ''}`}
               >
                 <div className="flex items-center">
                   <input
@@ -204,7 +620,7 @@ export default function AudioUploader() {
                     checked={selectedApi === api.id}
                     onChange={() => {}}
                     className="mr-2 h-4 w-4 accent-[#6d9e37]"
-                    disabled={isLoading}
+                    disabled={isLoading || isRecording}
                   />
                   <div>
                     <h3 className="font-bold text-[#6d9e37]">{api.name}</h3>
@@ -220,7 +636,8 @@ export default function AudioUploader() {
         <div className="flex justify-center mb-8">
           <Button
             onClick={handleSubmit}
-            disabled={!file || isLoading || (file && file.size > MAX_FILE_SIZE_BYTES)}
+            disabled={(!file && !audioBlob) || isLoading || isRecording || 
+                     (file && file.size > MAX_FILE_SIZE_BYTES)}
             className="px-6 py-3 text-lg w-full md:w-auto"
           >
             {isLoading ? (
@@ -242,6 +659,7 @@ export default function AudioUploader() {
           <p className={`text-sm ${
             error ? 'text-red-600' : 
             isLoading ? 'text-[#6d9e37]' : 
+            isRecording ? 'text-[#6d9e37]' :
             'text-gray-600'
           }`}>
             {status}
@@ -260,7 +678,7 @@ export default function AudioUploader() {
             <p className="mt-2 text-sm text-red-600">{error}</p>
             {error.includes(`${MAX_FILE_SIZE_MB}MB`) && (
               <p className="mt-1 text-xs text-red-500">
-                Please select a smaller audio file
+                Please select a smaller audio file or record a shorter audio
               </p>
             )}
           </div>
@@ -298,6 +716,52 @@ export default function AudioUploader() {
             </div>
           </div>
         )}
+
+        {/* Debug Section */}
+        {showDebug && (
+          <div className="mt-8 border rounded-lg overflow-hidden">
+            <div className="bg-gray-50 px-4 py-3 border-b flex justify-between items-center">
+              <h3 className="font-medium text-gray-700">Debug Logs</h3>
+              <div className="flex gap-2">
+                <Button 
+                  size="sm"
+                  variant="outline"
+                  onClick={clearDebugLogs}
+                  className="text-sm">
+                  Clear Logs
+                </Button>
+                <Button 
+                  size="sm"
+                  variant="outline"
+                  onClick={() => {
+                    const blob = new Blob([debugLogs.join('\n')], { type: 'text/plain' });
+                    const url = URL.createObjectURL(blob);
+                    const a = document.createElement('a');
+                    a.href = url;
+                    a.download = `audio-recorder-debug-${new Date().toISOString()}.log`;
+                    a.click();
+                    URL.revokeObjectURL(url);
+                  }}
+                  className="text-sm">
+                  Export Logs
+                </Button>
+              </div>
+            </div>
+            <div className="p-4 bg-white max-h-60 overflow-y-auto">
+              {debugLogs.length > 0 ? (
+                <div className="space-y-1">
+                  {debugLogs.map((log, index) => (
+                    <div key={index} className="text-xs font-mono text-gray-600 border-b border-gray-100 pb-1">
+                      {log}
+                    </div>
+                  ))}
+                </div>
+              ) : (
+                <p className="text-sm text-gray-500">No debug logs yet. Interactions will appear here.</p>
+              )}
+            </div>
+          </div>
+        )}
       </div>
     </div>
   );
diff --git a/src/components/TopicEdit.jsx b/src/components/TopicEdit.jsx
index c2ac5cd..f6d2e43 100644
--- a/src/components/TopicEdit.jsx
+++ b/src/components/TopicEdit.jsx
@@ -8,9 +8,8 @@ import { Separator } from './ui/separator';
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from './ui/dialog';
 import { CustomTabs } from './ui/tabs';
 import Loader from "./ui/loader";
-
-const TOPIC_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/';
-const MINIO_UPLOAD_URL = 'https://your-minio-api-endpoint/upload';
+const PUBLIC_TOPIC_API_URL = import.meta.env.PUBLIC_TOPIC_API_URL;
+const PUBLIC_MINIO_UPLOAD_URL = import.meta.env.PUBLIC_MINIO_UPLOAD_URL;
 const urlParams = new URLSearchParams(window.location.search);
 const slug = urlParams.get('slug');
 // console.log('find slug from url', slug);
@@ -36,7 +35,7 @@ export default function EditTopic (){
   useEffect(() => {
     const fetchTopic = async () => {
       try {
-        const response = await fetch(`${TOPIC_API_URL}?query=get-single-topic&slug=${slug}`, {
+        const response = await fetch(`${PUBLIC_TOPIC_API_URL}?query=get-single-topic&slug=${slug}`, {
           credentials: 'include'
         });
         
@@ -73,7 +72,7 @@ export default function EditTopic (){
     formData.append('folder', 'topic-images');
 
     try {
-      const response = await fetch(MINIO_UPLOAD_URL, {
+      const response = await fetch(PUBLIC_MINIO_UPLOAD_URL, {
         method: 'POST',
         body: formData,
         credentials: 'include',
@@ -221,7 +220,7 @@ export default function EditTopic (){
       };
 
       // Submit to API (PUT request for update)
-      const response = await fetch(`${TOPIC_API_URL}?query=update-topic&slug=${formData.slug}`, {
+      const response = await fetch(`${PUBLIC_TOPIC_API_URL}?query=update-topic&slug=${formData.slug}`, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
diff --git a/src/components/Topics.jsx b/src/components/Topics.jsx
index a0412ab..16d5af2 100644
--- a/src/components/Topics.jsx
+++ b/src/components/Topics.jsx
@@ -6,6 +6,7 @@ import Loader from "./ui/loader";
 const topicPageDesc = 'Cutting-edge discussions on tech, digital services, news, and digital freedom. Stay informed on AI, cybersecurity, privacy, and the future of innovation.';
 
 export default function TopicCreation() {
+    const PUBLIC_TOPIC_API_URL = import.meta.env.PUBLIC_TOPIC_API_URL;
     const { isLoggedIn, loading: authLoading, error: authError } = useIsLoggedIn();
     const [topics, setTopics] = useState([]);
     const [loading, setLoading] = useState(true);
@@ -16,7 +17,7 @@ export default function TopicCreation() {
         last_page: 1,
         per_page: 10,
         total: 0
-    });
+    }); 
 
     // Get current page from URL or default to 1
     const getCurrentPage = () => {
@@ -28,8 +29,8 @@ export default function TopicCreation() {
     // Fetch topics data
     const fetchTopics = async (page, search = '') => {
         setLoading(true);
-        try {
-            let url = `https://host-api-sxashuasysagibx.siliconpin.com/v1/topics/?query=get-all-topics&page=${page}`;
+        try { 
+            let url = `${PUBLIC_TOPIC_API_URL}?query=get-all-topics&page=${page}`;
             
             if (search) {
                 url += `&search=${encodeURIComponent(search)}`;
diff --git a/src/components/UserProfile.tsx b/src/components/UserProfile.tsx
index 6d1891b..b775fbe 100644
--- a/src/components/UserProfile.tsx
+++ b/src/components/UserProfile.tsx
@@ -52,13 +52,14 @@ export default function ProfilePage() {
   const [toast, setToast] = useState<ToastState>({ visible: false, message: '' });
   const [txnId, setTxnId] = useState<string>('');
   const [userEmail, setUserEmail] = useState<string>(''); 
-  const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/';
-  const INVOICE_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/invoice/';
+
+  const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
+  const PUBLIC_INVOICE_API_URL = import.meta.env.PUBLIC_INVOICE_API_URL;
 
   useEffect(() => {
     const fetchSessionData = async () => {
       try {
-        const response = await fetch(`${USER_API_URL}?query=get-user`, {
+        const response = await fetch(`${PUBLIC_USER_API_URL}?query=get-user`, {
             credentials: 'include', // Crucial for cookies
             headers: { 'Accept': 'application/json' }
           }
@@ -77,7 +78,7 @@ export default function ProfilePage() {
     };
     const getInvoiceListData = async () => {
       try {
-        const response = await fetch(`${USER_API_URL}?query=invoice-info`, {
+        const response = await fetch(`${PUBLIC_USER_API_URL}?query=invoice-info`, {
           method: 'GET',
           credentials: 'include', // Crucial for cookies
           headers: { 'Accept': 'application/json' }
@@ -127,7 +128,7 @@ export default function ProfilePage() {
   };
 
   const sessionLogOut = () => {
-    fetch(`${USER_API_URL}?query=logout`, {
+    fetch(`${PUBLIC_USER_API_URL}?query=logout`, {
       method: 'GET',
       credentials: 'include'
     })
@@ -187,7 +188,7 @@ export default function ProfilePage() {
               <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
                 <div className="space-y-2">
                   <Label htmlFor="firstName">Full Name</Label>
-                  <Input id="firstName" defaultValue={userData.session_data?.user_name || 'Jhon'} />
+                  <Input id="firstName" defaultValue={userData.session_data?.user_name || ''} />
                 </div>
                 <div className="space-y-2">
                   <Label htmlFor="phone">Phone</Label>
diff --git a/src/lib/isLoggedIn.jsx b/src/lib/isLoggedIn.jsx
index b2628ed..a3153aa 100644
--- a/src/lib/isLoggedIn.jsx
+++ b/src/lib/isLoggedIn.jsx
@@ -1,7 +1,6 @@
 import { useState, useEffect } from 'react';
 
-const USER_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/users/index.php';
-
+const PUBLIC_USER_API_URL = import.meta.env.PUBLIC_USER_API_URL;
 export const useIsLoggedIn = () => {
     const [isLoggedIn, setIsLoggedIn] = useState(null); // null means "unknown"
     const [sessionData, setSessionData] = useState(null);
@@ -11,7 +10,7 @@ export const useIsLoggedIn = () => {
     useEffect(() => {
         const checkLoginStatus = async () => {
             try {
-                const response = await fetch(`${USER_API_URL}?query=isLoggedIn`, {
+                const response = await fetch(`${PUBLIC_USER_API_URL}?query=isLoggedIn`, {
                     credentials: 'include'
                 });
                 const data = await response.json();
diff --git a/src/pages/login_old.astro b/src/pages/login_old.astro
index 468f7ee..5a58226 100644
--- a/src/pages/login_old.astro
+++ b/src/pages/login_old.astro
@@ -171,7 +171,7 @@
     </div>
     <script is:inline type="module">
         import PocketBase from 'https://cdn.jsdelivr.net/npm/pocketbase@0.19.0/+esm';
-
+        
         const pb = new PocketBase("https://tst-pb.s38.siliconpin.com");
         let isAuthenticated = false;
 
diff --git a/src/pages/services/index.astro b/src/pages/services/index.astro
index 301b44c..ecf2544 100644
--- a/src/pages/services/index.astro
+++ b/src/pages/services/index.astro
@@ -2,6 +2,8 @@
 // Astro script block
 import Layout from '../../layouts/Layout.astro';
 import { ServiceCard } from '../../components/ServiceCard';
+const PUBLIC_SERVICE_API_URL = import.meta.env.PUBLIC_SERVICE_API_URL;
+// console.log(PUBLIC_SERVICE_API_URL)
 const services = [
   {
     imageUrl: '/assets/images/services/wiregurd-thumb.jpg',
@@ -69,10 +71,9 @@ const services = [
     buyButtonUrl: ''
   }
 ];
-const SERVICE_API_URL = 'https://host-api-sxashuasysagibx.siliconpin.com/v1/services/?query=all-services-list';
 let data = [];
 try {
-  const response = await fetch(SERVICE_API_URL);
+  const response = await fetch(`${PUBLIC_SERVICE_API_URL}?query=all-services-list`);
   const json = await response.json();
   if (json.success) {
     // data = [...json.data, ...services];
diff --git a/src/pages/test.astro b/src/pages/test.astro
new file mode 100644
index 0000000..d52f551
--- /dev/null
+++ b/src/pages/test.astro
@@ -0,0 +1,9 @@
+---
+import Layout from "../layouts/Layout.astro";
+---
+
+<Layout title="">
+    <div class="text-center text-2xl font-bold my-4">Test to Include PHP under Astro file</div>
+    <div set:html="<?php echo 'Hello! I am from PHP'; ?>"></div>
+</Layout>
+
diff --git a/src/pages/web-tools/audio-to-text.astro b/src/pages/web-tools/speech-to-text.astro
similarity index 99%
rename from src/pages/web-tools/audio-to-text.astro
rename to src/pages/web-tools/speech-to-text.astro
index 508f776..155f6d0 100644
--- a/src/pages/web-tools/audio-to-text.astro
+++ b/src/pages/web-tools/speech-to-text.astro
@@ -3,8 +3,7 @@ import Layout from "../../layouts/Layout.astro";
 import AudioToText from "../../components/Tools/AudioToText"
 ---
 
-<Layout title="">
-    
+<Layout title="Whisper CPP Light">
     <AudioToText client:load />
 </Layout>
 <!-- <div class="container mx-auto px-4" id="stt-container">
diff --git a/yarn.lock b/yarn.lock
index 4ffec0f..76c9913 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1340,6 +1340,11 @@
     "@types/babel__core" "^7.20.5"
     react-refresh "^0.14.2"
 
+"@zeit/schemas@2.36.0":
+  version "2.36.0"
+  resolved "https://registry.npmjs.org/@zeit/schemas/-/schemas-2.36.0.tgz"
+  integrity sha512-7kjMwcChYEzMKjeex9ZFXkt1AyNov9R5HZtjBKVsmVpw7pa7ZtlCGvCBC2vnnXctaYN+aRI61HjIqeetZW5ROg==
+
 "@zxing/text-encoding@0.9.0":
   version "0.9.0"
   resolved "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz"
@@ -1350,6 +1355,14 @@ abs-svg-path@^0.1.1:
   resolved "https://registry.npmjs.org/abs-svg-path/-/abs-svg-path-0.1.1.tgz"
   integrity sha512-d8XPSGjfyzlXC3Xx891DJRyZfqk5JU0BJrDQcsWomFIV1/BIzPW5HDH5iDdWpqWaav0YVIEzT1RHTwWr0FFshA==
 
+accepts@~1.3.5:
+  version "1.3.8"
+  resolved "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz"
+  integrity sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==
+  dependencies:
+    mime-types "~2.1.34"
+    negotiator "0.6.3"
+
 acorn@^8.14.1:
   version "8.14.1"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz"
@@ -1370,6 +1383,16 @@ agent-base@^7.0.2:
   resolved "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz"
   integrity sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==
 
+ajv@8.12.0:
+  version "8.12.0"
+  resolved "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz"
+  integrity sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==
+  dependencies:
+    fast-deep-equal "^3.1.1"
+    json-schema-traverse "^1.0.0"
+    require-from-string "^2.0.2"
+    uri-js "^4.2.2"
+
 ansi-align@^3.0.1:
   version "3.0.1"
   resolved "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz"
@@ -1401,6 +1424,13 @@ ansi-styles@^4.0.0:
   dependencies:
     color-convert "^2.0.1"
 
+ansi-styles@^4.1.0:
+  version "4.3.0"
+  resolved "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz"
+  integrity sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==
+  dependencies:
+    color-convert "^2.0.1"
+
 ansi-styles@^6.1.0, ansi-styles@^6.2.1:
   version "6.2.1"
   resolved "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz"
@@ -1419,7 +1449,12 @@ anymatch@^3.1.3, anymatch@~3.1.2:
     normalize-path "^3.0.0"
     picomatch "^2.0.4"
 
-arg@^5.0.2:
+arch@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.npmjs.org/arch/-/arch-2.2.0.tgz"
+  integrity sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==
+
+arg@^5.0.2, arg@5.0.2:
   version "5.0.2"
   resolved "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz"
   integrity sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==
@@ -1616,6 +1651,20 @@ boolean@^3.0.1:
   resolved "https://registry.npmjs.org/boolean/-/boolean-3.2.0.tgz"
   integrity sha512-d0II/GO9uf9lfUHH2BQsjxzRJZBdsjgsBiW4BvhWk/3qoKwQFjIDVN19PfX8F2D/r9PCMTtLWjYVCFrpeYUzsw==
 
+boxen@7.0.0:
+  version "7.0.0"
+  resolved "https://registry.npmjs.org/boxen/-/boxen-7.0.0.tgz"
+  integrity sha512-j//dBVuyacJbvW+tvZ9HuH03fZ46QcaKvvhZickZqtB271DxJ7SNRSNxrV/dZX0085m7hISRZWbzWlJvx/rHSg==
+  dependencies:
+    ansi-align "^3.0.1"
+    camelcase "^7.0.0"
+    chalk "^5.0.1"
+    cli-boxes "^3.0.0"
+    string-width "^5.1.2"
+    type-fest "^2.13.0"
+    widest-line "^4.0.1"
+    wrap-ansi "^8.0.1"
+
 boxen@8.0.1:
   version "8.0.1"
   resolved "https://registry.npmjs.org/boxen/-/boxen-8.0.1.tgz"
@@ -1630,6 +1679,14 @@ boxen@8.0.1:
     widest-line "^5.0.0"
     wrap-ansi "^9.0.0"
 
+brace-expansion@^1.1.7:
+  version "1.1.12"
+  resolved "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz"
+  integrity sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==
+  dependencies:
+    balanced-match "^1.0.0"
+    concat-map "0.0.1"
+
 brace-expansion@^2.0.1:
   version "2.0.1"
   resolved "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz"
@@ -1691,6 +1748,11 @@ buffer@^6.0.3:
     base64-js "^1.3.1"
     ieee754 "^1.2.1"
 
+bytes@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz"
+  integrity sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==
+
 cacheable-lookup@^5.0.3:
   version "5.0.4"
   resolved "https://registry.npmjs.org/cacheable-lookup/-/cacheable-lookup-5.0.4.tgz"
@@ -1745,6 +1807,11 @@ camelcase-css@^2.0.1:
   resolved "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz"
   integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
 
+camelcase@^7.0.0:
+  version "7.0.1"
+  resolved "https://registry.npmjs.org/camelcase/-/camelcase-7.0.1.tgz"
+  integrity sha512-xlx1yCK2Oc1APsPXDL2LdlNP6+uu8OCDdhOBSVT279M/S+y75O30C2VuD8T2ogdePBBl7PfPF4504tnLgX3zfw==
+
 camelcase@^8.0.0:
   version "8.0.0"
   resolved "https://registry.npmjs.org/camelcase/-/camelcase-8.0.0.tgz"
@@ -1768,11 +1835,31 @@ cfb@~1.2.1:
     adler-32 "~1.3.0"
     crc-32 "~1.2.0"
 
+chalk-template@0.4.0:
+  version "0.4.0"
+  resolved "https://registry.npmjs.org/chalk-template/-/chalk-template-0.4.0.tgz"
+  integrity sha512-/ghrgmhfY8RaSdeo43hNXxpoHAtxdbskUHjPpfqUWGttFgycUhYPGx3YZBCnUCvOa7Doivn1IZec3DEGFoMgLg==
+  dependencies:
+    chalk "^4.1.2"
+
+chalk@^4.1.2:
+  version "4.1.2"
+  resolved "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz"
+  integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
+  dependencies:
+    ansi-styles "^4.1.0"
+    supports-color "^7.1.0"
+
 chalk@^5.0.0, chalk@5.2.0:
   version "5.2.0"
   resolved "https://registry.npmjs.org/chalk/-/chalk-5.2.0.tgz"
   integrity sha512-ree3Gqw/nazQAPuJJEy+avdl7QfZMcUvmHIKgEZkGL+xOBzRvup5Hxo6LHuMceSxOabuJLJm5Yp/92R9eMmMvA==
 
+chalk@^5.0.1, chalk@5.0.1:
+  version "5.0.1"
+  resolved "https://registry.npmjs.org/chalk/-/chalk-5.0.1.tgz"
+  integrity sha512-Fo07WOYGqMfCWHOzSXOt2CxDbC6skS/jO9ynEcmpANMoPrD+W1r1K6Vx7iNm+AQmETU1Xr2t+n8nzkV9t6xh3w==
+
 chalk@^5.3.0:
   version "5.4.1"
   resolved "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz"
@@ -1854,6 +1941,15 @@ cli-width@^4.1.0:
   resolved "https://registry.npmjs.org/cli-width/-/cli-width-4.1.0.tgz"
   integrity sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==
 
+clipboardy@3.0.0:
+  version "3.0.0"
+  resolved "https://registry.npmjs.org/clipboardy/-/clipboardy-3.0.0.tgz"
+  integrity sha512-Su+uU5sr1jkUy1sGRpLKjKrvEOVXgSgiSInwa/qeID6aJ07yh+5NWc3h2QfjHjBnfX4LhtFcuAWKUsJ3r+fjbg==
+  dependencies:
+    arch "^2.2.0"
+    execa "^5.1.1"
+    is-wsl "^2.2.0"
+
 cliui@^8.0.1:
   version "8.0.1"
   resolved "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz"
@@ -1955,6 +2051,36 @@ common-ancestor-path@^1.0.1:
   resolved "https://registry.npmjs.org/common-ancestor-path/-/common-ancestor-path-1.0.1.tgz"
   integrity sha512-L3sHRo1pXXEqX8VU28kfgUY+YGsk09hPqZiZmLacNib6XNTCM8ubYeT7ryXQw8asB1sKgcU5lkB7ONug08aB8w==
 
+compressible@~2.0.16:
+  version "2.0.18"
+  resolved "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz"
+  integrity sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==
+  dependencies:
+    mime-db ">= 1.43.0 < 2"
+
+compression@1.7.4:
+  version "1.7.4"
+  resolved "https://registry.npmjs.org/compression/-/compression-1.7.4.tgz"
+  integrity sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==
+  dependencies:
+    accepts "~1.3.5"
+    bytes "3.0.0"
+    compressible "~2.0.16"
+    debug "2.6.9"
+    on-headers "~1.0.2"
+    safe-buffer "5.1.2"
+    vary "~1.1.2"
+
+concat-map@0.0.1:
+  version "0.0.1"
+  resolved "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
+  integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
+
+content-disposition@0.5.2:
+  version "0.5.2"
+  resolved "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.2.tgz"
+  integrity sha512-kRGRZw3bLlFISDBgwTSA1TMBFN6J6GWDeubmDE3AF+3+yXL8hTWv8r5rkLbqYXY4RjPk/EzHnClI3zQf1cFmHA==
+
 convert-source-map@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz"
@@ -2048,6 +2174,13 @@ debug@^4.0.0, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.7, debug@^4.4
   dependencies:
     ms "^2.1.3"
 
+debug@2.6.9:
+  version "2.6.9"
+  resolved "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
+  integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==
+  dependencies:
+    ms "2.0.0"
+
 decode-named-character-reference@^1.0.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.1.0.tgz"
@@ -2067,6 +2200,11 @@ decompress-response@^6.0.0:
   dependencies:
     mimic-response "^3.1.0"
 
+deep-extend@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz"
+  integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==
+
 deepmerge@^4.3.1:
   version "4.3.1"
   resolved "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz"
@@ -2374,6 +2512,21 @@ events@^3.3.0:
   resolved "https://registry.npmjs.org/events/-/events-3.3.0.tgz"
   integrity sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==
 
+execa@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz"
+  integrity sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==
+  dependencies:
+    cross-spawn "^7.0.3"
+    get-stream "^6.0.0"
+    human-signals "^2.1.0"
+    is-stream "^2.0.0"
+    merge-stream "^2.0.0"
+    npm-run-path "^4.0.1"
+    onetime "^5.1.2"
+    signal-exit "^3.0.3"
+    strip-final-newline "^2.0.0"
+
 execa@^7.0.0:
   version "7.2.0"
   resolved "https://registry.npmjs.org/execa/-/execa-7.2.0.tgz"
@@ -2405,7 +2558,7 @@ extract-zip@^2.0.1:
   optionalDependencies:
     "@types/yauzl" "^2.9.1"
 
-fast-deep-equal@^3.1.3:
+fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
@@ -2607,7 +2760,7 @@ get-stream@^5.1.0:
   dependencies:
     pump "^3.0.0"
 
-get-stream@^6.0.1:
+get-stream@^6.0.0, get-stream@^6.0.1:
   version "6.0.1"
   resolved "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz"
   integrity sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==
@@ -2722,6 +2875,11 @@ h3@^1.15.0:
     ufo "^1.5.4"
     uncrypto "^0.1.3"
 
+has-flag@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz"
+  integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
+
 has-property-descriptors@^1.0.0, has-property-descriptors@^1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz"
@@ -3130,6 +3288,11 @@ https-proxy-agent@^6.2.0:
     agent-base "^7.0.2"
     debug "4"
 
+human-signals@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz"
+  integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==
+
 human-signals@^4.3.0:
   version "4.3.1"
   resolved "https://registry.npmjs.org/human-signals/-/human-signals-4.3.1.tgz"
@@ -3168,6 +3331,11 @@ inherits@^2.0.3, inherits@^2.0.4, inherits@~2.0.3:
   resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz"
   integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
 
+ini@~1.3.0:
+  version "1.3.8"
+  resolved "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz"
+  integrity sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==
+
 inline-style-parser@0.1.1:
   version "0.1.1"
   resolved "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.1.1.tgz"
@@ -3248,6 +3416,11 @@ is-decimal@^2.0.0:
   resolved "https://registry.npmjs.org/is-decimal/-/is-decimal-2.0.1.tgz"
   integrity sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==
 
+is-docker@^2.0.0:
+  version "2.2.1"
+  resolved "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz"
+  integrity sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==
+
 is-docker@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/is-docker/-/is-docker-3.0.0.tgz"
@@ -3317,6 +3490,11 @@ is-plain-obj@^4.0.0:
   resolved "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-4.1.0.tgz"
   integrity sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==
 
+is-port-reachable@4.0.0:
+  version "4.0.0"
+  resolved "https://registry.npmjs.org/is-port-reachable/-/is-port-reachable-4.0.0.tgz"
+  integrity sha512-9UoipoxYmSk6Xy7QFgRv2HDyaysmgSG75TFQs6S+3pDM7ZhKTF/bskZV+0UlABHzKjNVhPjYCLfeZUEg1wXxig==
+
 is-regex@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz"
@@ -3332,6 +3510,11 @@ is-regexp@^3.1.0:
   resolved "https://registry.npmjs.org/is-regexp/-/is-regexp-3.1.0.tgz"
   integrity sha512-rbku49cWloU5bSMI+zaRaXdQHXnthP6DZ/vLnfdSKyL4zUzuWnomtOEiZZOd+ioQ+avFo/qau3KPTc7Fjy1uPA==
 
+is-stream@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz"
+  integrity sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==
+
 is-stream@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/is-stream/-/is-stream-3.0.0.tgz"
@@ -3354,6 +3537,13 @@ is-url@^1.2.4:
   resolved "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz"
   integrity sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww==
 
+is-wsl@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz"
+  integrity sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==
+  dependencies:
+    is-docker "^2.0.0"
+
 is-wsl@^3.1.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.0.tgz"
@@ -3419,6 +3609,11 @@ json-parse-even-better-errors@^2.3.0:
   resolved "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz"
   integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==
 
+json-schema-traverse@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz"
+  integrity sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==
+
 json-stringify-safe@^5.0.1:
   version "5.0.1"
   resolved "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz"
@@ -4487,18 +4682,30 @@ micromatch@^4.0.8:
     braces "^3.0.3"
     picomatch "^2.3.1"
 
-mime-db@1.52.0:
+"mime-db@>= 1.43.0 < 2", mime-db@1.52.0:
   version "1.52.0"
   resolved "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz"
   integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==
 
-mime-types@^2.1.35:
+mime-db@~1.33.0:
+  version "1.33.0"
+  resolved "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz"
+  integrity sha512-BHJ/EKruNIqJf/QahvxwQZXKygOQ256myeN/Ew+THcAa5q+PjyTTMMeNQC4DZw5AwfvelsUrA6B67NKMqXDbzQ==
+
+mime-types@^2.1.35, mime-types@~2.1.34:
   version "2.1.35"
   resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz"
   integrity sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==
   dependencies:
     mime-db "1.52.0"
 
+mime-types@2.1.18:
+  version "2.1.18"
+  resolved "https://registry.npmjs.org/mime-types/-/mime-types-2.1.18.tgz"
+  integrity sha512-lc/aahn+t4/SWV/qcmumYjymLsWfN3ELhpmVuUFjgsORruuZPVSwAQryq+HHGvO/SI2KVX26bx+En+zhM8g8hQ==
+  dependencies:
+    mime-db "~1.33.0"
+
 mimic-fn@^2.1.0:
   version "2.1.0"
   resolved "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz"
@@ -4533,7 +4740,14 @@ minimatch@^9.0.4:
   dependencies:
     brace-expansion "^2.0.1"
 
-minimist@^1.2.6:
+minimatch@3.1.2:
+  version "3.1.2"
+  resolved "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz"
+  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
+  dependencies:
+    brace-expansion "^1.1.7"
+
+minimist@^1.2.0, minimist@^1.2.6:
   version "1.2.8"
   resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz"
   integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
@@ -4595,6 +4809,11 @@ ms@^2.1.3:
   resolved "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz"
   integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
 
+ms@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz"
+  integrity sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==
+
 msw@^2.7.1:
   version "2.7.6"
   resolved "https://registry.npmjs.org/msw/-/msw-2.7.6.tgz"
@@ -4638,6 +4857,11 @@ nanoid@^3.3.8:
   resolved "https://registry.npmjs.org/nanoid/-/nanoid-3.3.10.tgz"
   integrity sha512-vSJJTG+t/dIKAUhUDw/dLdZ9s//5OxcHqLaDWWrW4Cdq7o6tdLIczUkMXt2MBNmk6sJRZBZRXVixs7URY1CmIg==
 
+negotiator@0.6.3:
+  version "0.6.3"
+  resolved "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz"
+  integrity sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==
+
 neotraverse@^0.6.18:
   version "0.6.18"
   resolved "https://registry.npmjs.org/neotraverse/-/neotraverse-0.6.18.tgz"
@@ -4706,6 +4930,13 @@ not@^0.1.0:
   resolved "https://registry.npmjs.org/not/-/not-0.1.0.tgz"
   integrity sha512-5PDmaAsVfnWUgTUbJ3ERwn7u79Z0dYxN9ErxCpVJJqe2RK0PJ3z+iFUxuqjwtlDDegXvtWoxD/3Fzxox7tFGWA==
 
+npm-run-path@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz"
+  integrity sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==
+  dependencies:
+    path-key "^3.0.0"
+
 npm-run-path@^5.1.0:
   version "5.3.0"
   resolved "https://registry.npmjs.org/npm-run-path/-/npm-run-path-5.3.0.tgz"
@@ -4744,6 +4975,11 @@ ofetch@^1.4.1:
     node-fetch-native "^1.6.4"
     ufo "^1.5.4"
 
+on-headers@~1.0.2:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/on-headers/-/on-headers-1.0.2.tgz"
+  integrity sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==
+
 once@^1.3.1, once@^1.4.0:
   version "1.4.0"
   resolved "https://registry.npmjs.org/once/-/once-1.4.0.tgz"
@@ -4758,6 +4994,13 @@ onetime@^5.1.0:
   dependencies:
     mimic-fn "^2.1.0"
 
+onetime@^5.1.2:
+  version "5.1.2"
+  resolved "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz"
+  integrity sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==
+  dependencies:
+    mimic-fn "^2.1.0"
+
 onetime@^6.0.0:
   version "6.0.0"
   resolved "https://registry.npmjs.org/onetime/-/onetime-6.0.0.tgz"
@@ -4908,7 +5151,12 @@ path-browserify@^1.0.1:
   resolved "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz"
   integrity sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==
 
-path-key@^3.1.0:
+path-is-inside@1.0.2:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/path-is-inside/-/path-is-inside-1.0.2.tgz"
+  integrity sha512-DUWJr3+ULp4zXmol/SZkFf3JGsS9/SIv+Y3Rt93/UjPpDpklB5f1er4O3POIbUuUJ3FXgqte2Q7SrU6zAqwk8w==
+
+path-key@^3.0.0, path-key@^3.1.0:
   version "3.1.1"
   resolved "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz"
   integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==
@@ -4936,6 +5184,11 @@ path-to-regexp@^6.3.0:
   resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz"
   integrity sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==
 
+path-to-regexp@3.3.0:
+  version "3.3.0"
+  resolved "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-3.3.0.tgz"
+  integrity sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==
+
 path-type@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz"
@@ -5096,7 +5349,7 @@ pump@^3.0.0:
     end-of-stream "^1.1.0"
     once "^1.3.1"
 
-punycode@^2.1.1, punycode@^2.3.1:
+punycode@^2.1.0, punycode@^2.1.1, punycode@^2.3.1:
   version "2.3.1"
   resolved "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz"
   integrity sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==
@@ -5143,6 +5396,21 @@ radix3@^1.1.2:
   resolved "https://registry.npmjs.org/radix3/-/radix3-1.1.2.tgz"
   integrity sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==
 
+range-parser@1.2.0:
+  version "1.2.0"
+  resolved "https://registry.npmjs.org/range-parser/-/range-parser-1.2.0.tgz"
+  integrity sha512-kA5WQoNVo4t9lNx2kQNFCxKeBl5IbbSNBl1M/tLkw9WCn+hxNBAW5Qh8gdhs63CJnhjJ2zQWFoqPJP2sK1AV5A==
+
+rc@^1.0.1, rc@^1.1.6:
+  version "1.2.8"
+  resolved "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz"
+  integrity sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==
+  dependencies:
+    deep-extend "^0.6.0"
+    ini "~1.3.0"
+    minimist "^1.2.0"
+    strip-json-comments "~2.0.1"
+
 "react-dom@^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", "react-dom@^17.0.2 || ^18.0.0 || ^19.0.0", "react-dom@^18.0.0 || ^19.0.0", react-dom@>=16.8.0, react-dom@>=16.8.2, react-dom@>=18:
   version "19.0.0"
   resolved "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz"
@@ -5350,6 +5618,21 @@ regex@^5.1.1:
   dependencies:
     regex-utilities "^2.3.0"
 
+registry-auth-token@3.3.2:
+  version "3.3.2"
+  resolved "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.3.2.tgz"
+  integrity sha512-JL39c60XlzCVgNrO+qq68FoNb56w/m7JYvGR2jT5iR1xBrUA3Mfx5Twk5rqTThPmQKMWydGmq8oFtDlxfrmxnQ==
+  dependencies:
+    rc "^1.1.6"
+    safe-buffer "^5.0.1"
+
+registry-url@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz"
+  integrity sha512-ZbgR5aZEdf4UKZVBPYIgaglBmSF2Hi94s2PcIHhRGFjKYu+chjJdYfHn4rt3hB6eCKLJ8giVIIfgMa1ehDfZKA==
+  dependencies:
+    rc "^1.0.1"
+
 rehype-attr@~2.1.0:
   version "2.1.4"
   resolved "https://registry.npmjs.org/rehype-attr/-/rehype-attr-2.1.4.tgz"
@@ -5729,11 +6012,16 @@ sade@^1.7.3:
   dependencies:
     mri "^1.1.0"
 
-safe-buffer@~5.2.0:
+safe-buffer@^5.0.1, safe-buffer@~5.2.0:
   version "5.2.1"
   resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz"
   integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
 
+safe-buffer@5.1.2:
+  version "5.1.2"
+  resolved "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz"
+  integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==
+
 safe-regex-test@^1.1.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz"
@@ -5790,6 +6078,36 @@ serialize-error@^7.0.1:
   dependencies:
     type-fest "^0.13.1"
 
+serve-handler@6.1.6:
+  version "6.1.6"
+  resolved "https://registry.npmjs.org/serve-handler/-/serve-handler-6.1.6.tgz"
+  integrity sha512-x5RL9Y2p5+Sh3D38Fh9i/iQ5ZK+e4xuXRd/pGbM4D13tgo/MGwbttUk8emytcr1YYzBYs+apnUngBDFYfpjPuQ==
+  dependencies:
+    bytes "3.0.0"
+    content-disposition "0.5.2"
+    mime-types "2.1.18"
+    minimatch "3.1.2"
+    path-is-inside "1.0.2"
+    path-to-regexp "3.3.0"
+    range-parser "1.2.0"
+
+serve@^14.2.4:
+  version "14.2.4"
+  resolved "https://registry.npmjs.org/serve/-/serve-14.2.4.tgz"
+  integrity sha512-qy1S34PJ/fcY8gjVGszDB3EXiPSk5FKhUa7tQe0UPRddxRidc2V6cNHPNewbE1D7MAkgLuWEt3Vw56vYy73tzQ==
+  dependencies:
+    "@zeit/schemas" "2.36.0"
+    ajv "8.12.0"
+    arg "5.0.2"
+    boxen "7.0.0"
+    chalk "5.0.1"
+    chalk-template "0.4.0"
+    clipboardy "3.0.0"
+    compression "1.7.4"
+    is-port-reachable "4.0.0"
+    serve-handler "6.1.6"
+    update-check "1.5.4"
+
 set-cookie-parser@^2.6.0:
   version "2.7.1"
   resolved "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz"
@@ -5891,7 +6209,7 @@ shiki@^1.29.2:
     "@shikijs/vscode-textmate" "^10.0.1"
     "@types/hast" "^3.0.4"
 
-signal-exit@^3.0.2, signal-exit@^3.0.7:
+signal-exit@^3.0.2, signal-exit@^3.0.3, signal-exit@^3.0.7:
   version "3.0.7"
   resolved "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz"
   integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==
@@ -6093,11 +6411,21 @@ strip-bom@^3.0.0:
   resolved "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz"
   integrity sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==
 
+strip-final-newline@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz"
+  integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==
+
 strip-final-newline@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-3.0.0.tgz"
   integrity sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==
 
+strip-json-comments@~2.0.1:
+  version "2.0.1"
+  resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz"
+  integrity sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==
+
 strnum@^1.1.1:
   version "1.1.2"
   resolved "https://registry.npmjs.org/strnum/-/strnum-1.1.2.tgz"
@@ -6144,6 +6472,13 @@ sumchecker@^3.0.1:
   dependencies:
     debug "^4.1.0"
 
+supports-color@^7.1.0:
+  version "7.2.0"
+  resolved "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz"
+  integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==
+  dependencies:
+    has-flag "^4.0.0"
+
 supports-preserve-symlinks-flag@^1.0.0:
   version "1.0.0"
   resolved "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz"
@@ -6310,6 +6645,11 @@ type-fest@^0.21.3:
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz"
   integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
 
+type-fest@^2.13.0:
+  version "2.19.0"
+  resolved "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz"
+  integrity sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==
+
 type-fest@^4.21.0, type-fest@^4.26.1:
   version "4.37.0"
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-4.37.0.tgz"
@@ -6566,6 +6906,21 @@ update-browserslist-db@^1.1.1:
     escalade "^3.2.0"
     picocolors "^1.1.1"
 
+update-check@1.5.4:
+  version "1.5.4"
+  resolved "https://registry.npmjs.org/update-check/-/update-check-1.5.4.tgz"
+  integrity sha512-5YHsflzHP4t1G+8WGPlvKbJEbAJGCgw+Em+dGR1KmBUbr1J36SJBqlHLjR7oob7sco5hWHGQVcr9B2poIVDDTQ==
+  dependencies:
+    registry-auth-token "3.3.2"
+    registry-url "3.1.0"
+
+uri-js@^4.2.2:
+  version "4.4.1"
+  resolved "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz"
+  integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==
+  dependencies:
+    punycode "^2.1.0"
+
 url-parse@^1.5.3:
   version "1.5.10"
   resolved "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz"
@@ -6615,6 +6970,11 @@ uvu@^0.5.0:
     kleur "^4.0.3"
     sade "^1.7.3"
 
+vary@~1.1.2:
+  version "1.1.2"
+  resolved "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz"
+  integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==
+
 vfile-location@^4.0.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/vfile-location/-/vfile-location-4.1.0.tgz"
@@ -6741,6 +7101,13 @@ which@^2.0.1:
   dependencies:
     isexe "^2.0.0"
 
+widest-line@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.npmjs.org/widest-line/-/widest-line-4.0.1.tgz"
+  integrity sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==
+  dependencies:
+    string-width "^5.0.1"
+
 widest-line@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmjs.org/widest-line/-/widest-line-5.0.0.tgz"
@@ -6785,6 +7152,15 @@ wrap-ansi@^7.0.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
+wrap-ansi@^8.0.1:
+  version "8.1.0"
+  resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz"
+  integrity sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==
+  dependencies:
+    ansi-styles "^6.1.0"
+    string-width "^5.0.1"
+    strip-ansi "^7.0.1"
+
 wrap-ansi@^8.1.0:
   version "8.1.0"
   resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz"
-- 
2.34.1


From 340a1c3e61b345e167eec6aecbc6d7ceaab9a595 Mon Sep 17 00:00:00 2001
From: suvodip ghosh <suvodip@cs1.hz>
Date: Thu, 26 Jun 2025 14:54:13 +0000
Subject: [PATCH 2/2] add live record function in speech to text

---
 src/components/Tools/AudioToText.jsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/Tools/AudioToText.jsx b/src/components/Tools/AudioToText.jsx
index 2ad1ebf..5efa998 100644
--- a/src/components/Tools/AudioToText.jsx
+++ b/src/components/Tools/AudioToText.jsx
@@ -557,13 +557,18 @@ export default function AudioUploader() {
             </div>
           )}
         </div>
-        
+        <div className="flex items-center justify-center w-full mb-3 -mt-2">
+          <span className="flex-grow border-b-2 border-[#6d9e37]"></span>
+          <h2 className="mx-2 text-[#6d9e37] font-bold">OR</h2>
+          <span className="flex-grow border-b-2 border-[#6d9e37]"></span>
+        </div>
+
         {/* File Upload Section */}
         <div className="mb-8 p-4 border border-dashed border-[#6d9e37] rounded-lg bg-gray-50">
           <div className="flex items-center justify-between mb-4">
             <div>
               <label className="block text-sm font-medium text-gray-700 mb-1">
-                Or Upload Audio File
+                Upload Audio File
               </label>
               <p className="text-xs text-gray-500">Supports WAV, MP3, OGG formats (max {MAX_FILE_SIZE_MB}MB)</p>
             </div>
-- 
2.34.1