task-f

src/app/dashboard/crm/approvals/[id]/page.tsx

@@ -0,0 +1,76 @@
+import { auth } from '@/auth';
+import { HydrationBoundary, dehydrate } from '@tanstack/react-query';
+import PageContainer from '@/components/layout/page-container';
+import { ApprovalDetail } from '@/features/foundation/approval/components/approval-detail';
+import { approvalByIdOptions } from '@/features/foundation/approval/queries';
+import { PERMISSIONS } from '@/lib/auth/rbac';
+import { getQueryClient } from '@/lib/query-client';
+
+type PageProps = {
+  params: Promise<{ id: string }>;
+};
+
+export default async function ApprovalDetailRoute({ params }: PageProps) {
+  const { id } = await params;
+  const session = await auth();
+  const canRead =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalRead)));
+  const canApprove =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalApprove)));
+  const canReject =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalReject)));
+  const canReturn =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalReturn)));
+  const canCancel =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalSubmit)));
+  const isOrgAdmin =
+    session?.user?.systemRole === 'super_admin' || session?.user?.activeMembershipRole === 'admin';
+  const queryClient = getQueryClient();
+
+  if (canRead) {
+    void queryClient.prefetchQuery(approvalByIdOptions(id));
+  }
+
+  return (
+    <PageContainer
+      pageTitle='Approval Detail'
+      pageDescription='Workflow steps, current approver, and timeline for a production approval request.'
+      access={canRead}
+      accessFallback={
+        <div className='text-muted-foreground rounded-lg border border-dashed p-8 text-center'>
+          You do not have access to this approval request.
+        </div>
+      }
+    >
+      {canRead && session?.user ? (
+        <HydrationBoundary state={dehydrate(queryClient)}>
+          <ApprovalDetail
+            approvalId={id}
+            canApprove={canApprove}
+            canReject={canReject}
+            canReturn={canReturn}
+            canCancel={canCancel}
+            activeBusinessRole={session.user.activeBusinessRole}
+            isOrgAdmin={isOrgAdmin}
+            currentUserId={session.user.id}
+          />
+        </HydrationBoundary>
+      ) : null}
+    </PageContainer>
+  );
+}

src/app/dashboard/crm/approvals/page.tsx

@@ -1,28 +1,41 @@
+import { auth } from '@/auth';
 import PageContainer from '@/components/layout/page-container';
-import { CrmProductionPlaceholder } from '@/features/foundation/components/crm-production-placeholder';
+import ApprovalListing from '@/features/foundation/approval/components/approval-listing';
+import { PERMISSIONS } from '@/lib/auth/rbac';
+import { searchParamsCache } from '@/lib/searchparams';
+import type { SearchParams } from 'nuqs/server';
 
 export const metadata = {
   title: 'Dashboard: CRM Approvals'
 };
 
-export default function ApprovalsRoute() {
+type PageProps = {
+  searchParams: Promise<SearchParams>;
+};
+
+export default async function ApprovalsRoute(props: PageProps) {
+  const searchParams = await props.searchParams;
+  const session = await auth();
+  const canRead =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalRead)));
+
+  searchParamsCache.parse(searchParams);
+
   return (
     <PageContainer
       pageTitle='Approvals'
-      pageDescription='Production approval workflow has not started yet. This route no longer imports demo approval state.'
+      pageDescription='Production approval queue for quotations, with real workflow routing and action history.'
+      access={canRead}
+      accessFallback={
+        <div className='text-muted-foreground rounded-lg border border-dashed p-8 text-center'>
+          You do not have access to CRM approvals.
+        </div>
+      }
     >
-      <CrmProductionPlaceholder
-        title='Approval workflow pending'
-        summary='The old pending approvals mock list now lives only under crm-demo.'
-        foundationItems={[
-          'Permission checks',
-          'Business-role-aware access helpers',
-          'Branch validation',
-          'Audit log helper'
-        ]}
-        nextStep='Implement production approval workflow only after quotation persistence and routing are in place.'
-        demoHref='/dashboard/crm-demo/approvals'
-      />
+      {canRead ? <ApprovalListing /> : null}
     </PageContainer>
   );
 }

src/app/dashboard/crm/quotations/[id]/page.tsx

@@ -12,6 +12,7 @@ import {
 } from '@/features/crm/quotations/api/queries';
 import { QuotationDetail } from '@/features/crm/quotations/components/quotation-detail';
 import { getQuotationReferenceData } from '@/features/crm/quotations/server/service';
+import { approvalsQueryOptions } from '@/features/foundation/approval/queries';
 import { PERMISSIONS } from '@/lib/auth/rbac';
 import { getQueryClient } from '@/lib/query-client';
 
@@ -62,6 +63,28 @@ export default async function QuotationDetailRoute({ params }: PageProps) {
     (!!session?.user?.activeOrganizationId &&
       (session.user.activeMembershipRole === 'admin' ||
         session.user.activePermissions.includes(PERMISSIONS.crmQuotationRevisionCreate)));
+  const canSubmitApproval =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalSubmit)));
+  const canApproveApproval =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalApprove)));
+  const canRejectApproval =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalReject)));
+  const canReturnApproval =
+    session?.user?.systemRole === 'super_admin' ||
+    (!!session?.user?.activeOrganizationId &&
+      (session.user.activeMembershipRole === 'admin' ||
+        session.user.activePermissions.includes(PERMISSIONS.crmApprovalReturn)));
+  const isOrgAdmin =
+    session?.user?.systemRole === 'super_admin' || session?.user?.activeMembershipRole === 'admin';
   const queryClient = getQueryClient();
 
   if (canRead) {
@@ -72,6 +95,13 @@ export default async function QuotationDetailRoute({ params }: PageProps) {
     void queryClient.prefetchQuery(quotationFollowupsOptions(id));
     void queryClient.prefetchQuery(quotationAttachmentsOptions(id));
     void queryClient.prefetchQuery(quotationRevisionsOptions(id));
+    void queryClient.prefetchQuery(
+      approvalsQueryOptions({
+        entityType: 'quotation',
+        entityId: id,
+        limit: 20
+      })
+    );
   }
 
   const referenceData =
@@ -102,6 +132,13 @@ export default async function QuotationDetailRoute({ params }: PageProps) {
             canManageFollowups={canManageFollowups}
             canManageAttachments={canManageAttachments}
             canCreateRevision={canCreateRevision}
+            canSubmitApproval={canSubmitApproval}
+            canApproveApproval={canApproveApproval}
+            canRejectApproval={canRejectApproval}
+            canReturnApproval={canReturnApproval}
+            activeBusinessRole={session?.user?.activeBusinessRole ?? null}
+            isOrgAdmin={isOrgAdmin}
+            currentUserId={session?.user?.id ?? ''}
           />
         </HydrationBoundary>
       ) : null}