refactor: adopt to bufbuild v2

src/app/v2/policy-management/[groupId]/actions.ts

@@ -1,6 +1,7 @@
 "use server";
 import { createPolicyService } from "@/lib/rpc/client";
 import { getTenantAndToken } from "@/lib/session/session";
+import { timestampDate } from "@bufbuild/protobuf/wkt";
 
 export async function getPolicyGroup(groupId: string) {
   const { accessToken, tenant } = await getTenantAndToken();
@@ -13,8 +14,8 @@ export async function getPolicyGroup(groupId: string) {
       id: group?.policyGroupId,
       name: group?.name,
       description: group?.description,
-      createdAt: group?.createdAt?.toDate(),
-      updatedAt: group?.updatedAt?.toDate(),
+      createdAt: group?.createdAt ? timestampDate(group.createdAt) : undefined,
+      updatedAt: group?.updatedAt ? timestampDate(group.updatedAt) : undefined,
     },
     policies: policies.map(
       ({ labels, name, policyId, rules, target, type }) => ({

src/app/v2/policy-management/manage/actions.ts

@@ -2,6 +2,7 @@
 
 import { createPolicyService } from "@/lib/rpc/client";
 import { getTenantAndToken } from "@/lib/session/session";
+import { timestampDate } from "@bufbuild/protobuf/wkt";
 
 export async function getPolicyGroups() {
   const { accessToken, tenant } = await getTenantAndToken();
@@ -12,8 +13,8 @@ export async function getPolicyGroups() {
       id: policyGroupId,
       name,
       description,
-      createdAt: createdAt?.toDate(),
-      updatedAt: updatedAt?.toDate(),
+      createdAt: createdAt ? timestampDate(createdAt) : undefined,
+      updatedAt: updatedAt ? timestampDate(updatedAt) : undefined,
     }),
   );
 }

src/app/v2/policy/new-policy/page.tsx

@@ -1,27 +1,36 @@
+"use client";
 import PolicyForm, { PolicyFormValues } from "@/components/policy/policy-form";
+import { CreatePolicyRequestSchema } from "@buf/safedep_api.bufbuild_es/safedep/services/controltower/v1/policy_pb";
+import { create } from "@bufbuild/protobuf";
+import { toast } from "sonner";
+import { useMutation } from "@tanstack/react-query";
+import { useRouter } from "next/navigation";
 import { createPolicy } from "./actions";
-import { CreatePolicyRequest } from "@buf/safedep_api.bufbuild_es/safedep/services/controltower/v1/policy_pb";
-import { redirect } from "next/navigation";
 
-export default async function Page() {
-  async function submitHandler(form: PolicyFormValues) {
-    "use server";
-    const policyRequest = new CreatePolicyRequest({ ...form });
-    try {
+export default function Page() {
+  const router = useRouter();
+
+  const { mutateAsync: createPolicyHandler } = useMutation({
+    mutationFn: async (form: PolicyFormValues) => {
+      const policyRequest = create(CreatePolicyRequestSchema, { ...form });
       await createPolicy(policyRequest);
-      console.log(policyRequest);
-    } catch {
-      // TODO(arunanshub): render sonner
-    }
-    redirect("/v2/policy/list");
-  }
+    },
+    onSuccess: () => {
+      toast.success("Policy created successfully");
+      router.back();
+    },
+    onError: () => {
+      toast.error("Failed to create policy");
+    },
+  });
+
   return (
     <div className="flex flex-col gap-6">
       <div className="flex items-center justify-between">
         <h1 className="text-3xl font-bold tracking-tight">Create New Policy</h1>
       </div>
 
-      <PolicyForm onSubmit={submitHandler} />
+      <PolicyForm onSubmit={createPolicyHandler} />
     </div>
   );
 }