From 0e2aaff571f34e3d8b91b4fe309b6188c2e6ae4b Mon Sep 17 00:00:00 2001
From: Michael Chihlas <michael@chihlas.com>
Date: Sat, 14 Mar 2026 23:39:54 -0400
Subject: [PATCH] feat(psa): add Post History tab placeholder to Integrations
 page

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../src/pages/account/IntegrationsPage.tsx    | 47 ++++++++++++++++++-
 1 file changed, 46 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/account/IntegrationsPage.tsx b/frontend/src/pages/account/IntegrationsPage.tsx
index ebb7c5b8..fd5595d3 100644
--- a/frontend/src/pages/account/IntegrationsPage.tsx
+++ b/frontend/src/pages/account/IntegrationsPage.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react'
-import { Plug, CheckCircle2, AlertCircle, Loader2, Pencil, Trash2, Shield } from 'lucide-react'
+import { Plug, CheckCircle2, AlertCircle, Loader2, Pencil, Trash2, Shield, History, Ticket } from 'lucide-react'
 import { PageMeta } from '@/components/common/PageMeta'
 import { integrationsApi } from '@/api/integrations'
 import type { PsaConnectionResponse, PsaConnectionCreate, PsaConnectionUpdate, PsaConnectionTestResponse } from '@/types'
@@ -38,7 +38,10 @@ const emptyForm: ConnectionForm = {
   client_id: '',
 }
 
+type Tab = 'connection' | 'post-history'
+
 export function IntegrationsPage() {
+  const [activeTab, setActiveTab] = useState<Tab>('connection')
   const [connection, setConnection] = useState<PsaConnectionResponse | null>(null)
   const [isLoading, setIsLoading] = useState(true)
   const [error, setError] = useState<string | null>(null)
@@ -224,6 +227,30 @@ export function IntegrationsPage() {
           </p>
         </div>
 
+        {/* Tabs */}
+        <div className="mb-6 flex gap-1 border-b border-border">
+          {([
+            { id: 'connection' as Tab, label: 'Connection', icon: Plug },
+            { id: 'post-history' as Tab, label: 'Post History', icon: History },
+          ]).map(({ id, label, icon: Icon }) => (
+            <button
+              key={id}
+              onClick={() => setActiveTab(id)}
+              className={cn(
+                'inline-flex items-center gap-2 border-b-2 px-4 py-2.5 text-sm font-medium transition-colors -mb-px',
+                activeTab === id
+                  ? 'border-primary text-foreground'
+                  : 'border-transparent text-muted-foreground hover:text-foreground hover:border-border'
+              )}
+            >
+              <Icon className="h-4 w-4" />
+              {label}
+            </button>
+          ))}
+        </div>
+
+        {/* Connection Tab */}
+        {activeTab === 'connection' && (
         <div className="max-w-3xl">
           {/* Setup / Edit Form */}
           {(mode === 'setup' || mode === 'edit') && (
@@ -497,6 +524,24 @@ export function IntegrationsPage() {
             </div>
           )}
         </div>
+        )}
+
+        {/* Post History Tab */}
+        {activeTab === 'post-history' && (
+          <div className="max-w-3xl">
+            <div className="glass-card-static p-6">
+              <div className="flex items-center gap-3 mb-4">
+                <Ticket className="h-5 w-5 text-muted-foreground" />
+                <h2 className="text-lg font-semibold text-foreground">Post History</h2>
+              </div>
+              <p className="text-sm text-muted-foreground">
+                View post history from individual sessions by clicking on linked tickets.
+                When a session has a ConnectWise ticket linked, use the Update button to post
+                session documentation and view previous posts.
+              </p>
+            </div>
+          </div>
+        )}
       </div>
     </>
   )