s13

src/components/BuyServices/NewKubernetisUtho.jsx

@@ -9,12 +9,13 @@ import { useToast } from "../ui/toast";
 import { useIsLoggedIn } from '../../lib/isLoggedIn';
 
 export default function Kubernetes() {
-  const { isLoggedIn, loading } = useIsLoggedIn();
+  const { isLoggedIn, loading, balance } = useIsLoggedIn();
   const { showToast } = useToast();
   const [isLoading, setIsLoading] = useState(false);
   const [deployError, setDeployError] = useState(null);
   const [deployStatus, setDeployStatus] = useState({});
   const [clusterStatus, setClusterStatus] = useState('');
+  const [productAmount, setProductAmount] = useState(100);
   const [nodePools, setNodePools] = useState([{ 
     label: `${getRandomString()}`, 
     size: '10215', 
@@ -88,6 +89,9 @@ export default function Kubernetes() {
   }, [deployStatus.clusterId, deployStatus.isReady]);
 
   const handleSubmit = async (e) => {
+    if(balance < productAmount){
+      return;
+    }
     e.preventDefault();
     setIsLoading(true);
     setDeployError(null);
@@ -229,6 +233,13 @@ export default function Kubernetes() {
     );
   }
 
+  if (balance < productAmount) {
+    return (
+      <p>
+        You have insufficient balance to deploy this service. Please  <a href="/profile" className="text-[#6d9e37]"> click here </a> to go to your profile and add balance, then try again.</p>
+    );
+  }
+
   if (deployStatus.status === 'success') {
     return (
       <Card className="w-full max-w-2xl mx-auto my-4">

src/components/BuyServices/NewUthoCloudInstance.jsx

@@ -13,13 +13,14 @@ import { useIsLoggedIn } from '../../lib/isLoggedIn';
 
 export default function NewCloudInstance() {
   const PUBLIC_UTHO_API_KEY = import.meta.env.PUBLIC_UTHO_API_KEY;
-  const { isLoggedIn, loading, error, sessionData } = useIsLoggedIn();
+  const { isLoggedIn, loading, error, sessionData, balance } = useIsLoggedIn();
   const { showToast } = useToast();
   const [isLoading, setIsLoading] = useState(false);
   const [isFetchingData, setIsFetchingData] = useState(true);
   const [deployError, setDeployError] = useState()
   const [deployStatus, setDeployStatus] = useState({});
   const [copied, setCopied] = useState(false);
+  const [productAmount, setProductAmount] = useState(100);
   const [plans, setPlans] = useState([
     {
       "id": "10027",
@@ -313,6 +314,9 @@ export default function NewCloudInstance() {
   
 
   const handleSubmit = async (e) => {
+    if(balance < productAmount){
+      return;
+    }
     e.preventDefault();
     setIsLoading(true);
     
@@ -441,6 +445,13 @@ export default function NewCloudInstance() {
     return <Loader />;
   }
 
+  if (balance < productAmount) {
+    return (
+      <p>
+        You have insufficient balance to deploy this service. Please  <a href="/profile" className="text-[#6d9e37]"> click here </a> to go to your profile and add balance, then try again.</p>
+    );
+  }
+
   if (deployError) return <p>Error: {deployError?.message}</p>;
 
   if (!isLoggedIn) {
@@ -529,7 +540,7 @@ export default function NewCloudInstance() {
                 <SelectContent>
                   {plans.map(plan => (
                     <SelectItem key={plan.id} value={plan.id}>
-                      {`${plan.cpu} vCPU, ${plan.ram}MB RAM - ${plan.price_cur}/mo`}
+                      {`${plan.cpu} vCPU, ${plan.ram}MB RAM`} {/* {`${plan.cpu} vCPU, ${plan.ram}MB RAM - ${plan.price_cur}/mo`} */}
                     </SelectItem>
                   ))}
                     {/* <SelectItem key={plans[0].id} value={plans[0].id}>

src/components/TopicItem.jsx

@@ -14,9 +14,9 @@ export default function TopicItems(props) {
       return <div className="loading-indicator">Loading...</div>;
   }
 
-  if (error) {
-      return <div className="error-message">Error loading authentication status</div>;
-  }
+  // if (error) {
+  //     return <div className="error-message">Error loading authentication status</div>;
+  // }
   
   const handleSearchChange = (e) => {
     setLocalSearchTerm(e.target.value);