@varshylinc/team-management 0.1.0 → 0.2.0

package/src/client/pages/MembersPage.tsx

@@ -1,290 +0,0 @@
-import React, { useState } from 'react';
-import { useMembers } from '../hooks/useMembers.js';
-import { usePendingInvitations } from '../hooks/usePendingInvitations.js';
-import { usePendingTransfer } from '../hooks/usePendingTransfer.js';
-import { useCurrentMembership } from '../hooks/useCurrentMembership.js';
-import { MemberRow } from '../components/MemberRow.js';
-import { InviteForm } from '../components/InviteForm.js';
-import { PendingTransferBanner } from '../components/PendingTransferBanner.js';
-import { RoleBadge } from '../components/RoleBadge.js';
-import { removeMember, changeMemberRole, revokeInvitation, resendInvitation } from '../api.js';
-import type { OrgRole } from '../types.js';
-
-interface MembersPageProps {
-  orgId: number;
-}
-
-type ActiveTab = 'active' | 'former' | 'invitations';
-
-export function MembersPage({ orgId }: MembersPageProps) {
-  const [tab, setTab] = useState<ActiveTab>('active');
-  const { membership } = useCurrentMembership();
-  const { members, loading: membersLoading, error: membersError, refresh: refreshMembers } = useMembers(orgId);
-  const { members: formerMembers, loading: formerLoading, error: formerError } = useMembers(orgId, { includeFormer: true });
-  const { invitations, loading: invLoading, error: invError, refresh: refreshInvitations } = usePendingInvitations(orgId);
-  const { transfer, refresh: refreshTransfer } = usePendingTransfer(orgId);
-
-  const currentRole: OrgRole = membership?.role ?? 'viewer';
-  const canManage = currentRole === 'owner' || currentRole === 'admin';
-
-  async function handleRemove(userId: number) {
-    if (!confirm('Remove this member from the organization?')) return;
-    try {
-      await removeMember(orgId, userId);
-      refreshMembers();
-    } catch (e) {
-      alert(e instanceof Error ? e.message : 'Failed to remove member');
-    }
-  }
-
-  async function handleRoleChange(userId: number, newRole: OrgRole) {
-    try {
-      await changeMemberRole(orgId, userId, newRole);
-      refreshMembers();
-    } catch (e) {
-      alert(e instanceof Error ? e.message : 'Failed to change role');
-    }
-  }
-
-  async function handleRevoke(invitationId: number) {
-    if (!confirm('Revoke this invitation?')) return;
-    try {
-      await revokeInvitation(orgId, invitationId);
-      refreshInvitations();
-    } catch (e) {
-      alert(e instanceof Error ? e.message : 'Failed to revoke invitation');
-    }
-  }
-
-  async function handleResend(invitationId: number) {
-    try {
-      await resendInvitation(orgId, invitationId);
-      alert('Invitation resent!');
-    } catch (e) {
-      alert(e instanceof Error ? e.message : 'Failed to resend invitation');
-    }
-  }
-
-  const activeMembers = members.filter((m) => !m.removed_at);
-  const formerOnly = formerMembers.filter((m) => m.removed_at);
-
-  return (
-    <div className="max-w-4xl mx-auto px-4 py-8">
-      <h1 className="text-2xl font-bold text-slate-900 mb-6">Team Members</h1>
-
-      {transfer && membership && (
-        <div className="mb-6">
-          <PendingTransferBanner
-            transfer={transfer}
-            currentUserId={membership.user_id}
-            orgId={orgId}
-            onAction={refreshTransfer}
-          />
-        </div>
-      )}
-
-      {canManage && (
-        <div className="mb-6">
-          <InviteForm orgId={orgId} onSuccess={refreshInvitations} />
-        </div>
-      )}
-
-      {/* Tabs */}
-      <div className="flex gap-1 border-b border-slate-200 mb-4">
-        {(['active', 'invitations', 'former'] as ActiveTab[]).map((t) => (
-          (t === 'former' || t === 'invitations') && !canManage ? null : (
-            <button
-              key={t}
-              onClick={() => setTab(t)}
-              className={`px-4 py-2 text-sm font-medium border-b-2 transition-colors -mb-px ${
-                tab === t
-                  ? 'border-blue-500 text-blue-600'
-                  : 'border-transparent text-slate-500 hover:text-slate-700'
-              }`}
-            >
-              {t === 'active' ? 'Active' : t === 'invitations' ? 'Pending Invitations' : 'Former Members'}
-              {t === 'active' && (
-                <span className="ml-1.5 inline-flex items-center px-1.5 py-0.5 rounded-full text-xs bg-slate-100 text-slate-600">
-                  {activeMembers.length}
-                </span>
-              )}
-              {t === 'invitations' && (
-                <span className="ml-1.5 inline-flex items-center px-1.5 py-0.5 rounded-full text-xs bg-blue-100 text-blue-600">
-                  {invitations.length}
-                </span>
-              )}
-            </button>
-          )
-        ))}
-      </div>
-
-      {/* Active Members Tab */}
-      {tab === 'active' && (
-        <div>
-          {membersLoading && (
-            <div className="flex items-center justify-center py-12">
-              <div className="h-6 w-6 animate-spin rounded-full border-2 border-blue-500 border-t-transparent" />
-            </div>
-          )}
-          {membersError && (
-            <div className="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700">
-              {membersError}
-            </div>
-          )}
-          {!membersLoading && !membersError && (
-            <div className="overflow-hidden rounded-lg border border-slate-200 shadow-sm">
-              <table className="w-full text-left">
-                <thead className="bg-slate-50 border-b border-slate-200">
-                  <tr>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Member</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Role</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Joined</th>
-                    <th className="py-3 px-4" />
-                  </tr>
-                </thead>
-                <tbody className="bg-white divide-y divide-slate-100">
-                  {activeMembers.map((member) => (
-                    <MemberRow
-                      key={member.id}
-                      member={member}
-                      currentUserRole={currentRole}
-                      onRemove={handleRemove}
-                      onRoleChange={handleRoleChange}
-                    />
-                  ))}
-                  {activeMembers.length === 0 && (
-                    <tr>
-                      <td colSpan={4} className="py-8 text-center text-sm text-slate-500">
-                        No active members found.
-                      </td>
-                    </tr>
-                  )}
-                </tbody>
-              </table>
-            </div>
-          )}
-        </div>
-      )}
-
-      {/* Pending Invitations Tab */}
-      {tab === 'invitations' && canManage && (
-        <div>
-          {invLoading && (
-            <div className="flex items-center justify-center py-12">
-              <div className="h-6 w-6 animate-spin rounded-full border-2 border-blue-500 border-t-transparent" />
-            </div>
-          )}
-          {invError && (
-            <div className="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700">
-              {invError}
-            </div>
-          )}
-          {!invLoading && !invError && (
-            <div className="overflow-hidden rounded-lg border border-slate-200 shadow-sm">
-              <table className="w-full text-left">
-                <thead className="bg-slate-50 border-b border-slate-200">
-                  <tr>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Email</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Role</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Expires</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Actions</th>
-                  </tr>
-                </thead>
-                <tbody className="bg-white divide-y divide-slate-100">
-                  {invitations.map((inv) => (
-                    <tr key={inv.id} className="hover:bg-slate-50 transition-colors">
-                      <td className="py-3 px-4 text-sm text-slate-900">{inv.email}</td>
-                      <td className="py-3 px-4"><RoleBadge role={inv.role} /></td>
-                      <td className="py-3 px-4 text-xs text-slate-500">
-                        {new Date(inv.expires_at).toLocaleDateString()}
-                      </td>
-                      <td className="py-3 px-4">
-                        <div className="flex gap-3">
-                          <button
-                            onClick={() => handleResend(inv.id)}
-                            className="text-xs text-blue-600 hover:text-blue-800 font-medium"
-                          >
-                            Resend
-                          </button>
-                          <button
-                            onClick={() => handleRevoke(inv.id)}
-                            className="text-xs text-red-600 hover:text-red-800 font-medium"
-                          >
-                            Revoke
-                          </button>
-                        </div>
-                      </td>
-                    </tr>
-                  ))}
-                  {invitations.length === 0 && (
-                    <tr>
-                      <td colSpan={4} className="py-8 text-center text-sm text-slate-500">
-                        No pending invitations.
-                      </td>
-                    </tr>
-                  )}
-                </tbody>
-              </table>
-            </div>
-          )}
-        </div>
-      )}
-
-      {/* Former Members Tab */}
-      {tab === 'former' && canManage && (
-        <div>
-          {formerLoading && (
-            <div className="flex items-center justify-center py-12">
-              <div className="h-6 w-6 animate-spin rounded-full border-2 border-blue-500 border-t-transparent" />
-            </div>
-          )}
-          {formerError && (
-            <div className="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700">
-              {formerError}
-            </div>
-          )}
-          {!formerLoading && !formerError && (
-            <div className="overflow-hidden rounded-lg border border-slate-200 shadow-sm">
-              <table className="w-full text-left">
-                <thead className="bg-slate-50 border-b border-slate-200">
-                  <tr>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Member</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Former Role</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Removed</th>
-                    <th className="py-3 px-4 text-xs font-semibold uppercase tracking-wide text-slate-500">Reason</th>
-                  </tr>
-                </thead>
-                <tbody className="bg-white divide-y divide-slate-100">
-                  {formerOnly.map((member) => (
-                    <tr key={member.id} className="hover:bg-slate-50 transition-colors">
-                      <td className="py-3 px-4">
-                        <div className="flex flex-col">
-                          <span className="text-sm font-medium text-slate-700">{member.name ?? member.email}</span>
-                          {member.name && <span className="text-xs text-slate-400">{member.email}</span>}
-                        </div>
-                      </td>
-                      <td className="py-3 px-4"><RoleBadge role={member.role} /></td>
-                      <td className="py-3 px-4 text-xs text-slate-500">
-                        {member.removed_at ? new Date(member.removed_at).toLocaleDateString() : '—'}
-                      </td>
-                      <td className="py-3 px-4 text-xs text-slate-500">
-                        {member.removal_reason ?? '—'}
-                      </td>
-                    </tr>
-                  ))}
-                  {formerOnly.length === 0 && (
-                    <tr>
-                      <td colSpan={4} className="py-8 text-center text-sm text-slate-500">
-                        No former members.
-                      </td>
-                    </tr>
-                  )}
-                </tbody>
-              </table>
-            </div>
-          )}
-        </div>
-      )}
-    </div>
-  );
-}

package/src/client/pages/OrgSettingsPage.tsx

@@ -1,185 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { getOrg, updateOrg, deleteOrg, initiateTransfer } from '../api.js';
-import { DangerZoneCard } from '../components/DangerZoneCard.js';
-import { useCurrentMembership } from '../hooks/useCurrentMembership.js';
-import type { PublicOrg } from '../types.js';
-
-interface OrgSettingsPageProps {
-  orgId: number;
-}
-
-export function OrgSettingsPage({ orgId }: OrgSettingsPageProps) {
-  const { membership } = useCurrentMembership();
-  const [org, setOrg] = useState<PublicOrg | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-
-  const [name, setName] = useState('');
-  const [slug, setSlug] = useState('');
-  const [saving, setSaving] = useState(false);
-  const [saveError, setSaveError] = useState<string | null>(null);
-  const [saveSuccess, setSaveSuccess] = useState(false);
-
-  const [transferUserId, setTransferUserId] = useState('');
-  const [transferError, setTransferError] = useState<string | null>(null);
-  const [transferSuccess, setTransferSuccess] = useState(false);
-
-  const isOwner = membership?.role === 'owner';
-  const isAdmin = membership?.role === 'admin' || isOwner;
-
-  useEffect(() => {
-    setLoading(true);
-    getOrg(orgId)
-      .then((o) => {
-        setOrg(o);
-        setName(o.name);
-        setSlug(o.slug);
-      })
-      .catch((e: Error) => setError(e.message))
-      .finally(() => setLoading(false));
-  }, [orgId]);
-
-  async function handleSave(e: React.FormEvent) {
-    e.preventDefault();
-    setSaving(true);
-    setSaveError(null);
-    setSaveSuccess(false);
-    try {
-      const updated = await updateOrg(orgId, { name, slug });
-      setOrg(updated);
-      setSaveSuccess(true);
-      setTimeout(() => setSaveSuccess(false), 3000);
-    } catch (err) {
-      setSaveError(err instanceof Error ? err.message : 'Failed to save');
-    } finally {
-      setSaving(false);
-    }
-  }
-
-  async function handleDelete() {
-    await deleteOrg(orgId, org!.name);
-    window.location.href = '/';
-  }
-
-  async function handleInitiateTransfer() {
-    const uid = parseInt(transferUserId, 10);
-    if (!uid) { setTransferError('Enter a valid user ID'); return; }
-    setTransferError(null);
-    try {
-      await initiateTransfer(orgId, uid);
-      setTransferSuccess(true);
-      setTransferUserId('');
-    } catch (err) {
-      setTransferError(err instanceof Error ? err.message : 'Failed to initiate transfer');
-    }
-  }
-
-  if (loading) {
-    return (
-      <div className="flex items-center justify-center min-h-64">
-        <div className="h-8 w-8 animate-spin rounded-full border-2 border-blue-500 border-t-transparent" />
-      </div>
-    );
-  }
-
-  if (error) {
-    return (
-      <div className="max-w-2xl mx-auto px-4 py-8">
-        <div className="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700">{error}</div>
-      </div>
-    );
-  }
-
-  return (
-    <div className="max-w-2xl mx-auto px-4 py-8 space-y-8">
-      <h1 className="text-2xl font-bold text-slate-900">Organization Settings</h1>
-
-      {/* General Settings */}
-      {isAdmin && (
-        <section className="bg-white rounded-lg border border-slate-200 shadow-sm p-6">
-          <h2 className="text-lg font-semibold text-slate-800 mb-4">General</h2>
-          <form onSubmit={handleSave} className="space-y-4">
-            <div>
-              <label className="block text-sm font-medium text-slate-700 mb-1">
-                Organization Name
-              </label>
-              <input
-                type="text"
-                value={name}
-                onChange={(e) => setName(e.target.value)}
-                required
-                disabled={saving}
-                className="w-full rounded-md border border-slate-300 px-3 py-2 text-sm focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:bg-slate-50"
-              />
-            </div>
-            <div>
-              <label className="block text-sm font-medium text-slate-700 mb-1">
-                Slug
-              </label>
-              <input
-                type="text"
-                value={slug}
-                onChange={(e) => setSlug(e.target.value.toLowerCase().replace(/[^a-z0-9-]/g, '-'))}
-                required
-                disabled={saving}
-                className="w-full rounded-md border border-slate-300 px-3 py-2 text-sm font-mono focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:bg-slate-50"
-              />
-              <p className="mt-1 text-xs text-slate-500">
-                Used in URLs. Lowercase letters, numbers, and hyphens only.
-              </p>
-            </div>
-            {saveError && <p className="text-sm text-red-600">{saveError}</p>}
-            {saveSuccess && <p className="text-sm text-green-600">Settings saved!</p>}
-            <button
-              type="submit"
-              disabled={saving}
-              className="rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-1 disabled:opacity-50 transition-colors"
-            >
-              {saving ? 'Saving…' : 'Save Changes'}
-            </button>
-          </form>
-        </section>
-      )}
-
-      {/* Danger Zone — Owner only */}
-      {isOwner && (
-        <section className="space-y-4">
-          <h2 className="text-lg font-semibold text-slate-800">Danger Zone</h2>
-
-          {/* Ownership Transfer */}
-          <div className="border border-amber-200 rounded-lg p-5 bg-amber-50">
-            <h3 className="text-sm font-semibold text-amber-800 mb-1">Transfer Ownership</h3>
-            <p className="text-sm text-amber-700 mb-3">
-              Transfer ownership of this organization to another member. The recipient must accept within 72 hours.
-            </p>
-            <div className="flex gap-2">
-              <input
-                type="number"
-                placeholder="Target user ID"
-                value={transferUserId}
-                onChange={(e) => setTransferUserId(e.target.value)}
-                className="flex-1 rounded-md border border-amber-300 px-3 py-2 text-sm focus:border-amber-500 focus:outline-none focus:ring-1 focus:ring-amber-500"
-              />
-              <button
-                onClick={handleInitiateTransfer}
-                className="rounded-md border border-amber-600 bg-white px-4 py-2 text-sm font-medium text-amber-700 hover:bg-amber-100 transition-colors"
-              >
-                Initiate Transfer
-              </button>
-            </div>
-            {transferError && <p className="mt-2 text-sm text-red-600">{transferError}</p>}
-            {transferSuccess && <p className="mt-2 text-sm text-green-600">Transfer initiated! Awaiting recipient acceptance.</p>}
-          </div>
-
-          <DangerZoneCard
-            title="Delete Organization"
-            description="Permanently delete this organization and all its data. This action cannot be undone."
-            buttonLabel="Delete Organization"
-            onConfirm={handleDelete}
-            confirmPrompt={org?.name}
-          />
-        </section>
-      )}
-    </div>
-  );
-}

package/src/client/pages/OwnershipTransferPage.tsx

@@ -1,163 +0,0 @@
-import React, { useState } from 'react';
-import { usePendingTransfer } from '../hooks/usePendingTransfer.js';
-import { useCurrentMembership } from '../hooks/useCurrentMembership.js';
-import { acceptTransfer, cancelTransfer } from '../api.js';
-
-interface OwnershipTransferPageProps {
-  orgId: number;
-}
-
-export function OwnershipTransferPage({ orgId }: OwnershipTransferPageProps) {
-  const { transfer, loading, error } = usePendingTransfer(orgId);
-  const { membership } = useCurrentMembership();
-  const [confirmEmail, setConfirmEmail] = useState('');
-  const [submitting, setSubmitting] = useState(false);
-  const [actionError, setActionError] = useState<string | null>(null);
-  const [done, setDone] = useState<'accepted' | 'cancelled' | null>(null);
-
-  const userEmail = membership ? (membership as { email?: string }).email ?? '' : '';
-  const isTarget = transfer?.to_user_id === membership?.user_id;
-  const emailConfirmed = confirmEmail.trim().toLowerCase() === userEmail.toLowerCase();
-
-  async function handleAccept() {
-    if (!emailConfirmed) return;
-    setSubmitting(true);
-    setActionError(null);
-    try {
-      await acceptTransfer(orgId);
-      setDone('accepted');
-    } catch (err) {
-      setActionError(err instanceof Error ? err.message : 'Failed to accept transfer');
-    } finally {
-      setSubmitting(false);
-    }
-  }
-
-  async function handleCancel() {
-    setSubmitting(true);
-    setActionError(null);
-    try {
-      await cancelTransfer(orgId);
-      setDone('cancelled');
-    } catch (err) {
-      setActionError(err instanceof Error ? err.message : 'Failed to cancel transfer');
-    } finally {
-      setSubmitting(false);
-    }
-  }
-
-  if (loading) {
-    return (
-      <div className="flex items-center justify-center min-h-64">
-        <div className="h-8 w-8 animate-spin rounded-full border-2 border-blue-500 border-t-transparent" />
-      </div>
-    );
-  }
-
-  if (error) {
-    return (
-      <div className="max-w-lg mx-auto px-4 py-8">
-        <div className="rounded-md bg-red-50 border border-red-200 px-4 py-3 text-sm text-red-700">{error}</div>
-      </div>
-    );
-  }
-
-  if (done === 'accepted') {
-    return (
-      <div className="max-w-lg mx-auto px-4 py-8 text-center">
-        <div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-full bg-green-100">
-          <svg className="h-7 w-7 text-green-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-          </svg>
-        </div>
-        <h1 className="text-xl font-bold text-slate-900 mb-2">Ownership transferred!</h1>
-        <p className="text-sm text-slate-600 mb-6">You are now the owner of this organization.</p>
-        <a href={`/orgs/${orgId}`} className="inline-block rounded-md bg-blue-600 px-6 py-2.5 text-sm font-medium text-white hover:bg-blue-700 transition-colors">
-          Go to Organization
-        </a>
-      </div>
-    );
-  }
-
-  if (done === 'cancelled') {
-    return (
-      <div className="max-w-lg mx-auto px-4 py-8 text-center">
-        <h1 className="text-xl font-bold text-slate-900 mb-2">Transfer cancelled.</h1>
-        <a href={`/orgs/${orgId}`} className="inline-block rounded-md border border-slate-300 px-6 py-2.5 text-sm font-medium text-slate-700 hover:bg-slate-50 transition-colors">
-          Back to Organization
-        </a>
-      </div>
-    );
-  }
-
-  if (!transfer || !isTarget) {
-    return (
-      <div className="max-w-lg mx-auto px-4 py-8">
-        <div className="rounded-md bg-slate-50 border border-slate-200 px-4 py-3 text-sm text-slate-600">
-          No pending ownership transfer found for you.
-        </div>
-      </div>
-    );
-  }
-
-  return (
-    <div className="max-w-lg mx-auto px-4 py-8">
-      <h1 className="text-2xl font-bold text-slate-900 mb-2">Accept Ownership</h1>
-      <p className="text-sm text-slate-600 mb-6">
-        You are being offered ownership of this organization. Accepting grants you full owner privileges.
-      </p>
-
-      <div className="bg-white rounded-lg border border-slate-200 shadow-sm p-6 mb-6">
-        <h2 className="text-sm font-semibold text-slate-800 mb-3">Owner Powers You Will Receive</h2>
-        <ul className="space-y-2 text-sm text-slate-700">
-          {[
-            'Delete the organization',
-            'Appoint and demote admins',
-            'Transfer ownership to others',
-            'Override all member permissions',
-          ].map((power) => (
-            <li key={power} className="flex items-start gap-2">
-              <svg className="mt-0.5 h-4 w-4 shrink-0 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
-              </svg>
-              {power}
-            </li>
-          ))}
-        </ul>
-      </div>
-
-      <div className="mb-4">
-        <label className="block text-sm font-medium text-slate-700 mb-1">
-          Type your email address to confirm:
-        </label>
-        <input
-          type="email"
-          value={confirmEmail}
-          onChange={(e) => setConfirmEmail(e.target.value)}
-          placeholder={userEmail || 'your@email.com'}
-          className="w-full rounded-md border border-slate-300 px-3 py-2 text-sm focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
-        />
-      </div>
-
-      {actionError && <p className="mb-3 text-sm text-red-600">{actionError}</p>}
-
-      <div className="flex gap-3">
-        <button
-          onClick={handleAccept}
-          disabled={!emailConfirmed || submitting}
-          className="flex-1 rounded-md bg-blue-600 px-4 py-2.5 text-sm font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
-        >
-          {submitting ? 'Processing…' : 'Accept Ownership'}
-        </button>
-        <button
-          onClick={handleCancel}
-          disabled={submitting}
-          className="rounded-md border border-slate-300 px-4 py-2.5 text-sm font-medium text-slate-700 hover:bg-slate-50 disabled:opacity-50 transition-colors"
-        >
-          Decline
-        </button>
-      </div>
-    </div>
-  );
-}
-