fix(provider): changed to useQuery and fix lint

akash-network · Dec 2, 2024 · 78913de · 78913de
1 parent 45c82f0
commit 78913de
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 22 deletions.
diff --git a/apps/provider-console/src/components/become-provider/ProviderAttributes.tsx b/apps/provider-console/src/components/become-provider/ProviderAttributes.tsx
@@ -3,6 +3,9 @@
 import React from "react";
 import { Controller, SubmitHandler, useFieldArray, useForm } from "react-hook-form";
 import {
+  Alert,
+  AlertDescription,
+  AlertTitle,
   Button,
   Form,
   FormControl,
@@ -14,22 +17,18 @@ import {
   SelectContent,
   SelectItem,
   SelectTrigger,
-  Separator,
-  Alert,
-  AlertDescription,
-  AlertTitle
-} from "@akashnetwork/ui/components";
+  Separator } from "@akashnetwork/ui/components";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Plus, Trash } from "iconoir-react";
 import { useAtom } from "jotai";
 import { z } from "zod";
 
+import { useControlMachine } from "@src/context/ControlMachineProvider";
 import providerProcessStore, { ProviderAttribute } from "@src/store/providerProcessStore";
-import { providerAttributesFormValuesSchema } from "../../types/providerAttributes";
-import { ResetProviderForm } from "./ResetProviderProcess";
 import restClient from "@src/utils/restClient";
-import { useControlMachine } from "@src/context/ControlMachineProvider";
 import { sanitizeMachineAccess } from "@src/utils/sanityUtils";
+import { providerAttributesFormValuesSchema } from "../../types/providerAttributes";
+import { ResetProviderForm } from "./ResetProviderProcess";
 
 const attributeKeys = Object.keys(providerAttributesFormValuesSchema.shape);
 

diff --git a/apps/provider-console/src/components/shared/ProviderActionDetails.tsx b/apps/provider-console/src/components/shared/ProviderActionDetails.tsx
@@ -61,7 +61,10 @@ export const ProviderActionDetails: React.FC<{ actionId: string | null }> = ({ a
           <div className="rounded-md border">
             {actionDetails?.tasks.map((task, index) => (
               <div key={index}>
-                <div className="flex cursor-pointer items-center justify-between p-4" onClick={() => toggleAccordion(index)}>
+                <div
+                  className="flex cursor-pointer items-center justify-between p-4 hover:bg-gray-50 dark:hover:bg-gray-600/50"
+                  onClick={() => toggleAccordion(index)}
+                >
                   <div className="flex items-center">
                     {openAccordions[index] ? <ArrowDown className="mr-2 h-5 w-5" /> : <ArrowRight className="mr-2 h-5 w-5" />}
                     <span>{task.description}</span>

diff --git a/apps/provider-console/src/components/shared/ProviderActionList.tsx b/apps/provider-console/src/components/shared/ProviderActionList.tsx
@@ -64,7 +64,7 @@ export const ProviderActionList: React.FC<ProviderActionListProps> = ({ actions
       <ul className="divide-y divide-gray-200">
         {actions.length > 0 ? (
           actions.map(action => (
-            <li key={action.id} className="cursor-pointer py-4 hover:bg-gray-50" onClick={() => handleRowClick(action.id)}>
+            <li key={action.id} className="cursor-pointer py-4 hover:bg-gray-50 dark:hover:bg-gray-600/50" onClick={() => handleRowClick(action.id)}>
               <div className="grid grid-cols-12 items-center gap-4">
                 <div className="col-span-4">
                   <p className="text-base font-medium">{action.name}</p>

diff --git a/apps/provider-console/src/pages/actions/[id]/index.tsx b/apps/provider-console/src/pages/actions/[id]/index.tsx
@@ -29,8 +29,6 @@ const ActionDetailsPage: React.FC<Props> = ({ id }) => {
 
 export default ActionDetailsPage;
 
-// export default withAuth(ActionDetailsPage);
-
 export async function getServerSideProps({ params }) {
   return {
     props: {

diff --git a/apps/provider-console/src/pages/actions/index.tsx b/apps/provider-console/src/pages/actions/index.tsx
@@ -1,19 +1,12 @@
 "use client";
+
 import { Layout } from "@src/components/layout/Layout";
 import { ProviderActionList } from "@src/components/shared/ProviderActionList";
-import { useEffect, useState } from "react";
-import restClient from "@src/utils/restClient";
 import { Title } from "@src/components/shared/Title";
+import { useProviderActions } from "@src/queries/useProviderQuery";
 
 const ActionsList: React.FC = () => {
-  const [actions, setActions] = useState<any[]>([]);
-  useEffect(() => {
-    const fetchActions = async () => {
-      const response: any = await restClient.get(`/actions`);
-      setActions(response.actions);
-    };
-    fetchActions();
-  }, []);
+  const { data: actions } = useProviderActions();
   return (
     <Layout>
       <div className="flex items-center">